Yugyeong Lee Project – 03

sketch

//Yugyeong Lee
//section A (9:30AM)
//yugyeonl@andrew.cmu.edu
//project 3

var x = 320;
var y = 240;
var dir = 1;

function setup() {
    createCanvas(640, 480);
}

function draw() {

	//background color change based on position of mouseX
	colorR = map(mouseX, 0, width, 255, 255);
	colorB = map(mouseX, 0, width, 179, 255);
	colorG = map(mouseX, 0, width, 179, 204);
	background(colorR, colorG, colorB);
	noStroke();
	noCursor();

	//random circles with changing sizes
	noStroke();
	fill(0);
	var diam = map(mouseX, 0, width, 0, 100);
	ellipse(width/4, height/4, diam, diam);
	var diam = map(mouseX, 0, width, 0, 75);
	ellipse(width/6, 5 * height/6, diam, diam);
	var diam = map(mouseX, 0, width, 0, 25);
	ellipse(width/2, 4 * height/7, diam, diam);
	ellipse(8 * width/9, 8 * height/9, diam, diam);
	var diam = map(mouseX, 0, width, 0, 50);
	ellipse(width/4, height/4, diam, diam);
	var diam = map(mouseX, 0, width, 0, 50);
	ellipse(4 * width/5, height/2, diam, diam);

	//motionless circles
	ellipse(5 * width/7, 9 * height/12, 20, 20);
	ellipse(6 * width/8, height/9, 15, 15);
	ellipse(3 * width/7, 11 * height/12, 15, 15);
	ellipse(width/3, 3 * height/7, 15, 15);

	//mouse guide (mouseX)
	if (mouseX > x) {
		x += 0.75;
	}
	if (mouseX < x) {
		x -= 0.75;
	}
	strokeWeight(10);
	stroke(255);
	line(x, 0, x, height);
	line(x + 20, 0, x + 20, height);

	//mouse guide (mouseX)
	if (mouseY > y) {
		y += 0.75;
	}
	if (mouseY < y) {
		y -= 0.75;
	}
	strokeWeight(10);
	stroke(255);
	line(0, y, width, y);
	line(0, y + 20, width, y + 20);

	//change the direction of rotation of the cursor
	if (mouseX > width/2) {
		dir = -dir;
	}

	//rotating shape for cursor
	noStroke();
	fill(0);
	push();
	translate(mouseX, mouseY);
	rotate(dir * millis()/500);
	quad(0, 0, -6, 24, 0, 48, 6, 24);
	pop();	

	push();
	translate(mouseX, mouseY);
	rotate(dir * millis()/500);
	quad(0, 0, -24, -6, -48, 0, -24, 6);
	pop();	

	push();
	translate(mouseX, mouseY);
	rotate(dir * millis()/500);
	quad(0, 0, 6, -24, 0, -48, -6, -24);
	pop();	

	push();
	translate(mouseX, mouseY);
	rotate(dir * millis()/500);
	quad(0, 0, 24, 6, 48, 0, 24, -6);
	pop();

	//blackout when any key is pressed
	if (keyIsPressed) {
		fill(0);
		rect(0, 0, width, height);
	}

}

The most challenging part of this project was planning to create a design for the dynamic drawing rather than figuring out the codes.