♥️24
Ich mag das.
let ball_array = [];
let slowmo = false;
let target_pos;
function setup() {
createCanvas(window.innerWidth,window.innerHeight);
target_pos = createVector(width/2,height/2); // only for init
for(let i=0;i<1;i++){
let nb = new aBall();
ball_array.push(nb); // add new created ball object to my array list
}
console.log("created array with balls: " + ball_array.length);
colorMode(HSB,100,100,100,100);
background(0);
}
function draw() {
if(mouseIsPressed){ slowmo = true;}else{ slowmo = false;}
for(let i=0;i<ball_array.length;i++){
let cb = ball_array[i];
cb.updateMe();
cb.drawMe();
}
}
function mousePressed(){
// if mousebutton left > add new ball
if (mouseButton === LEFT) {
let nb = new aBall();
ball_array.push(nb); // add new created ball object to my array list
}
if (mouseButton === RIGHT) {
ball_array.pop();
}
}
// --------------------------------------
// ---------------------------------------
class aBall {
// equivalent for setup
constructor() {
this.colorhue = random()*20+40;
this.ball_pos;
this.target_pos;
this.wiggle_amp = 100 + random()*400;
this.wiggle_freq = ( .001 + random()*.005 ) *.1;
this.move_speed = 0.1+random()*.2;
this.ball_pos = createVector(random()*width,random()*height);
this.drawMe();
}
drawMe(){
stroke(1,0,100,33);
fill(this.colorhue,100,90);
let _r = this.move_speed * 40 + 10;
ellipse(this.ball_pos.x,this.ball_pos.y,_r,_r);
}
updateMe(){
// what is the current target to move to?
this.target_pos = createVector(mouseX,mouseY);
// make some random offset movement
this.target_pos.x += noise( -millis()*this.wiggle_freq*.4, millis()*this.wiggle_freq ) * this.wiggle_amp - this.wiggle_amp/2;
this.target_pos.y += noise( millis()*this.wiggle_freq ,-millis()*this.wiggle_freq*.6) * this.wiggle_amp - this.wiggle_amp/2;
// delay movement of ball somehow?
// apply delayed movement to ball
let cms = this.move_speed;
if(slowmo){
cms = this.move_speed*.1;
}
this.ball_pos.x = lerp(this.ball_pos.x, this.target_pos.x, cms);
this.ball_pos.y = lerp(this.ball_pos.y, this.target_pos.y, cms);
}
}