p5js:yapışkan

sinn.js

//  ▄▄▄▄    █    ██     ███▄    █ ▓█████     ██▓    ▄▄▄       ███▄    █    
// ▓█████▄  ██  ▓██▒    ██ ▀█   █ ▓█   ▀    ▓██▒   ▒████▄     ██ ▀█   █    
// ▒██▒ ▄██▓██  ▒██░   ▓██  ▀█ ██▒▒███      ▒██░   ▒██  ▀█▄  ▓██  ▀█ ██▒   
// ▒██░█▀  ▓▓█  ░██░   ▓██▒  ▐▌██▒▒▓█  ▄    ▒██░   ░██▄▄▄▄██ ▓██▒  ▐▌██▒   
// ░▓█  ▀█▓▒▒█████▓    ▒██░   ▓██░░▒████▒   ░██████▒▓█   ▓██▒▒██░   ▓██░   
// ░▒▓███▀▒░▒▓▒ ▒ ▒    ░ ▒░   ▒ ▒ ░░ ▒░ ░   ░ ▒░▓  ░▒▒   ▓▒█░░ ▒░   ▒ ▒    
// ▒░▒   ░ ░░▒░ ░ ░    ░ ░░   ░ ▒░ ░ ░  ░   ░ ░ ▒  ░ ▒   ▒▒ ░░ ░░   ░ ▒░   
//  ░    ░  ░░░ ░ ░       ░   ░ ░    ░        ░ ░    ░   ▒      ░   ░ ░    
//  ░         ░                 ░    ░  ░       ░  ░     ░  ░         ░    
//       ░                                                                 


var arr = [];
var mycanvas;

function setup() {

    x = $("#myContainer").width(); /* myContainerı istediğinle değiştir */
    y = $("#myContainer").height(); /* bunuda */
    mycanvas = createCanvas(x, y);
    mycanvas.parent("myContainer"); /* id ile seçiyor classla değil */
    fill("white");
    imageMode(CENTER);
    rectMode(CENTER);
    /*istersen gölge ekle */
    // drawingContext.shadowOffsetX = 1;
    // drawingContext.shadowOffsetY = -1;
    // drawingContext.shadowBlur = 5;
    // drawingContext.shadowColor = "black";
    for (var i = 0; i < 50; i++) {
        arr.push(new DD());
        //pix.push(new SS(random(width), height / 2));
    }

    arr_length = arr.length;
    strokeWeight(0.5)
    stroke("fff");

}

function draw() {

    background("#268BD2");

    for (var i = 0; i < arr.length; i++) {

        //pix[i].move();
        for (var z = 0; z < arr.length; z++) {
            if (i != z && arr[i].intersect(arr[z])) {

                line(arr[i].pos.x, arr[i].pos.y, arr[z].pos.x, arr[z].pos.y);


            }
        }
        arr[i].draw();
        arr[i].there();

    }
    $("#fps").text(~~getFrameRate());
    $("#adet").text(arr.length);

}


// function getRandomColor() {
//     var letters = '0123456789ABCDEF'.split('');
//     var color = '#';
//     for (var i = 0; i < 6; i++) {
//         color += letters[Math.floor(Math.random() * 16)];
//     }
//     return color;
// }

function windowResized() {
    resizeCanvas(windowWidth, windowHeight);

}

function DD(x, y) {
    this.x = (x !== undefined) ? x : ~~random(width);
    this.y = (y !== undefined) ? y : ~~random(height);
    this.target = createVector(~~random(width), ~~random(height));
    this.pos = createVector(this.x, this.y);
    this.amount = random() / 99;
    this.r = random(10, 20);
    this.color = "#fff";

}
DD.prototype.draw = function() {
    fill(this.color);
    push();
    noStroke();
    ellipse(this.pos.x, this.pos.y, this.r, this.r);
    pop();
    this.pos.lerp(this.target, this.amount);

};
DD.prototype.there = function() {
    this.distance = this.pos.dist(this.target);
    (this.distance < 5) ? this.target = createVector(~~random(width), ~~random(height)): this.target = this.target;
};
DD.prototype.intersect = function(other) {

    this.collision = this.pos.dist(other.pos);
    if (this.collision < (this.r + other.r) + 30) {
        return true
    } else {
        return false
    }
};

function SS(x, y) {
    this.pos = createVector(random(width), random(height));
    this.target = createVector(x, y);
    this.target_2 = createVector(random(width), random(height));
    this.amount = random() / 55;
    this.xoff = random(width);
    this.yoff = random(height);
}
SS.prototype.move = function() {
    // this.pos.lerp(this.target, this.amount);

    this.pos.x = noise(this.xoff) * width;
    this.pos.y = noise(this.yoff) * height;
    this.xoff += 0.005;
    this.yoff += 0.005;
    // ellipse(this.pos.x, this.pos.y, 23, 23);
    push();
    translate(this.pos.x, this.pos.y);
    rotate(this.xoff * 10);
    rect(0, 0, 23, 23);
    pop();

};

function mousePressed() {
    arr.push(new DD(mouseX, mouseY));
    console.log(mouseX + ":" + mouseY)
}

function getRandomColor() {
    var letters = '0123456789ABCDEF'.split('');
    var color = '#';
    for (var i = 0; i < 6; i++) {
        color += letters[Math.floor(Math.random() * 16)];
    }
    return color;
}
Array.prototype.RM = function(index, oindex, radius) {
    this.splice(index, 1);
    console.log(this)
    this[oindex] += radius / 10;
};