project_03
var angle = 0;
var rectX = 0;
var r = 255;
var g = 0;
var b = 0;
var col = 0;
function setup() {
createCanvas(640, 480);
background(255,225,53);
fill(255);
noStroke();
rect(0,0,320,4800);
angleMode(DEGREES);
rectMode(CENTER);
}
function draw() {
//rotating rectangle1
push();
translate (130,100);
rotate (angle);
fill (r,g,b);
stroke(255);
strokeWeight(2)
; rect(rectX, 0,100,30);
rect(rectX+50, 20,100,30);
rect(rectX+100, 40,100,30);
rect(rectX+150, 60,100,30);
angle = mouseY + 2;
pop();
//rotating rectangle 2
push();
translate (300,300);
rotate (angle);
fill (r,g,b);
stroke(255);
strokeWeight(2);
rect(rectX, 0,100,30);
rect(rectX+50, 20,100,30);
rect(rectX+100, 40,100,30);
rect(rectX+150, 60,100,30);
angle = mouseY + 2;
pop();
//rotating rectangle 3
push();
translate (50,400);
rotate (angle);
fill (r,g,b);
stroke(255);
strokeWeight(2);
rect(rectX, 0,100,30);
rect(rectX+50, 20,100,30);
rect(rectX+100, 40,100,30);
rect(rectX+150, 60,100,30);
angle = mouseY + 2;
pop();
//yellow half of the composition
fill(255,225,53);
noStroke();
rect(160+320,240,320,480);
//white rectangle
if (mouseX > 480){
fill(col);
noStroke();
rect(480,240,200,380);
col = col +2;
}
var height1 = map(mouseY,0, 480, 0, 240);
//semicricles
fill(244, 148, 4);
noStroke();
arc(480, 0, 320, height1, 0,0, OPEN);
arc(480, 480, 320, -height1 , 0,0, OPEN);
//pink lines
stroke(255, 63, 232);
strokeWeight(20);
line(20,0,20,mouseY);
line(106,0,106,mouseY);
line(212,0,212,mouseY);
line(310,0,310,mouseY);
}