For this project, the hardest part was coding efficiently. Given the amount of little coding experience I drew objects individually as I knew how which ended up taking up many lines of code.
kdlee-project-03-a
var redX = 0;
var redY = 0;
var redW = 32;
var redH = 480;
var redModifier = 64;
var blueX = 0;
var blueY = 16;
var blueW = 64;
var blueH = 32;
var blueModifier = 64;
var whiteX = 0;
var whiteY = 0;
var whiteW = 64;
var whiteH = 32;
var whiteModifier = 64;
var dotX = 8;
var dotY = 16;
var dotD = 32;
var dotModifier = 32;
var rectTurn = 180;
var coloryYellow ="#FAFCFC"var colorRed = "#6393B6"var colorBlue = "#DDDADC"
function setup() {
createCanvas(640, 480);
}
function draw() {
noStroke();
background(coloryYellow)
var redW = map(mouseX, 0, width, 0, redModifier);
rectMode(CORNER);
fill(colorRed) rect(redX, redY, redW, redH) rect(redX + 1 * redModifier, redY, redW, redH);
rect(redX + 2 * redModifier, redY, redW, redH);
rect(redX + 3 * redModifier, redY, redW, redH);
rect(redX + 4 * redModifier, redY, redW, redH);
rect(redX + 5 * redModifier, redY, redW, redH);
rect(redX + 6 * redModifier, redY, redW, redH);
rect(redX + 7 * redModifier, redY, redW, redH);
rect(redX + 8 * redModifier, redY, redW, redH);
rect(redX + 9 * redModifier, redY, redW, redH); push() rectMode(CENTER);
var blueW = map(mouseY, 0, height, 0, blueModifier) * 2;
var redW = map(mouseX, 0, width, 0, redModifier);
fill(colorBlue)
push() translate(blueX + redW / 2 - blueModifier, blueY + 1 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + redW / 2 - blueModifier, blueY + 3 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + redW / 2 - blueModifier, blueY + 5 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + redW / 2 - blueModifier, blueY + 7 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push() translate(blueX + redW / 2, blueY);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + redW / 2, blueY + 2 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + redW / 2, blueY + 4 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + redW / 2, blueY + 6 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push() translate(blueX + blueModifier + redW / 2, blueY + 1 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + blueModifier + redW / 2, blueY + 3 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + blueModifier + redW / 2, blueY + 5 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + blueModifier + redW / 2, blueY + 7 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push() translate(blueX + 2 * blueModifier + redW / 2, blueY);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 2 * blueModifier + redW / 2, blueY + 2 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 2 * blueModifier + redW / 2, blueY + 4 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 2 * blueModifier + redW / 2, blueY + 6 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push() translate(blueX + 3 * blueModifier + redW / 2, blueY + 1 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 3 * blueModifier + redW / 2, blueY + 3 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 3 * blueModifier + redW / 2, blueY + 5 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 3 * blueModifier + redW / 2, blueY + 7 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push() translate(blueX + 4 * blueModifier + redW / 2, blueY);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 4 * blueModifier + redW / 2, blueY + 2 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 4 * blueModifier + redW / 2, blueY + 4 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 4 * blueModifier + redW / 2, blueY + 6 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push() translate(blueX + 5 * blueModifier + redW / 2, blueY + 1 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 5 * blueModifier + redW / 2, blueY + 3 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 5 * blueModifier + redW / 2, blueY + 5 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 5 * blueModifier + redW / 2, blueY + 7 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push() translate(blueX + 6 * blueModifier + redW / 2, blueY);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 6 * blueModifier + redW / 2, blueY + 2 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 6 * blueModifier + redW / 2, blueY + 4 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 6 * blueModifier + redW / 2, blueY + 6 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push() translate(blueX + 7 * blueModifier + redW / 2, blueY + 1 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 7 * blueModifier + redW / 2, blueY + 3 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 7 * blueModifier + redW / 2, blueY + 5 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 7 * blueModifier + redW / 2, blueY + 7 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push() translate(blueX + 8 * blueModifier + redW / 2, blueY);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 8 * blueModifier + redW / 2, blueY + 2 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 8 * blueModifier + redW / 2, blueY + 4 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 8 * blueModifier + redW / 2, blueY + 6 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push() translate(blueX + 9 * blueModifier + redW / 2, blueY + 1 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 9 * blueModifier + redW / 2, blueY + 3 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 9 * blueModifier + redW / 2, blueY + 5 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 9 * blueModifier + redW / 2, blueY + 7 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push() translate(blueX + 10 * blueModifier + redW / 2, blueY);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 10 * blueModifier + redW / 2, blueY + 2 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 10 * blueModifier + redW / 2, blueY + 4 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
push();
translate(blueX + 10 * blueModifier + redW / 2, blueY + 6 * blueModifier);
rotate(radians(map(mouseY, 0, height, 0, rectTurn)));
rect(0, 0, blueW, blueH);
pop();
pop();
}