xxxxxxxxxx
//squares rotatting on X axis, enabled orthoographic view to make the illusion of te boxes diving down and floating up.
class squareP {
constructor(x, y, z, col,bSize) {
this.x = x;
this.y = y;
this.z = z;
this.col = col;
this.done = 0;
this.bSize = bSize;
}
display() {
push();
ortho();
lights();
noStroke();
translate(this.x, this.y, this.z);
fill(this.col);
rotateZ(millis() / 1000)
rotateX(millis() / 1000)
box(this.bSize)
pop();
}
rotate(){
rotateX(millis() / 20000);
}
}
let sBox = []
function setup() {
createCanvas(400, 400, WEBGL);
let c = 0;
for(let i =0 ; i< 20 ; i ++ ){
let x = 50* i;
for (let j = 0; j < 5; j++){
let y = 100* j;
sBox[c] = new squareP(x,y,-200,color(255),20);
c += 1;
}
}
}
function draw() {
background(1);
push();
translate(-300,0,0);
for(let i =0 ; i< sBox.length ; i ++) {
sBox[i].rotate();
sBox[i].display();
}
pop();
}
function mousePressed() {
if (mouseX > 0 && mouseX < 400 && mouseY > 0 && mouseY < 400) {
let fs = fullscreen();
fullscreen(!fs);
}
}