xxxxxxxxxx
class Ball{
constructor(args){
this.r = args.r || 100;
this.p = args.p || {x: width/2 , y: height/2} ;
this.v = {
x: random(-2,2),
y: random(-2,2)
};
this.a = args.a || {x:0 , y:0};
this.color = random(["#780116","#f7b538","#db7c26","#d8572a","#c32f27"]);
this.mode = random(["happy","sad"]);
this.rId = random(1000);
}
draw(){
push();
fill(this.color);
ellipse(this.p.x,this.p.y,this.r);
translate(this.p.x,this.p.y);
//
if(this.mode == "happy"){
fill(255);
ellipse(0,0,this.r/2,this.r/2);
fill(0);
ellipse(0,0,this.r/3,this.r/3);
}else{
fill(255);
arc(0,0,this.r/2,this.r/2,0,PI);
fill(0);
arc(0,0,this.r/3,this.r/3,0,PI);
}
// 畫手
stroke(this.color);
strokeWeight(4);
// line(this.r/2,0,this.r,0)
noFill();
for(let o =0 ; o < 8 ; o++){
beginShape();
rotate(PI/4);
for(let i =0 ; i < 30 ; i+=3){
vertex(this.r/2+i*2,sin(i/5+-frameCount/5 +this.rId )*10);
}
endShape();
}
pop();
}
update(){
this.p.x += this.v.x;
this.p.y += this.v.y;
this.v.x += this.a.x;
this.v.y += this.a.y;
// 浮動
if(this.mode == "happy"){
this.p.y += sin(frameCount/(10+this.rId/100))*5;
}
// 摩擦力
// this.v.x *= 0.99;
this.v.y *= 0.99;
if(this.p.y > height){
this.v.y = -abs(this.v.y);
}
}
escape(){
this.v.x = random(-10,10)
}
setHappy(){
this.mode = "happy";
}
isTouched(){
let touchedRange = dist(mouseX,mouseY,this.p.x,this.p.y);
if(touchedRange < this.r){
return true;
}else{
return false;
}
}
}
let balls=[];
function setup() {
createCanvas(windowWidth, windowHeight);
background(0);
for(let i = 0 ; i < 50 ; i++){
let ball = new Ball({
r: random(100),
p:{x:random(width), y:random(height)},
});
balls.push(ball);
}
}
function draw() {
background(0);
for(let ball of balls){
noStroke();
ball.update();
ball.draw();
if(ball.isTouched()){
ball.color ="#94E8B4";
ball.escape();
}
}
}
function mousePressed(){
let ball = new Ball({
r: random(100),
p:{x:mouseX, y:mouseY},
});
balls.push(ball);
for(let ball of balls){
ball.setHappy();
ball.escape();
}
}