xxxxxxxxxx134
//!!move mouse up and down to switch!!function setup() { createCanvas(600, 800); //base layer grid setup count = 20; col = width / count; row = height / count;}let bgc = 0;function draw() { background(bgc); //move mouseY to change from day to night theme if (mouseY > height / 2) { bgc = [0, 0, 30]; sunColor = [0, 0, 30]; } else { bgc = [105, 140, 165]; sunColor = [255, 204, 0]; } //draw base grid for (let j = 0; j < row; j++) { for (let i = 0; i < col; i++) { if (i % 2 == 0 && j % 2 == 0) { //only draw the sun/moon pattern in certain area noStroke(); drawSun( (i * width) / count, (j * height) / count + (mouseY - height / 2) / count, row / 4, sunColor ); //default draw sun if (mouseY > height / 2) { //move mouseX to change from day to night theme drawMoon( (i * width) / count, (j * height) / count - (mouseY - height / 2) / count, row / 2 ); } } else { //skip other grids stroke(100, 100, mouseY / 5); noFill(); rect((i * width) / count, (j * height) / count, col, row); } } }}//the sun patternfunction drawSun(sunX, sunY, sunR, sunColor) { fill(sunColor); noStroke(); triangle( sunX - 0.25 * sunR, sunY - sunR, sunX, sunY - 3 * sunR, sunX + 0.25 * sunR, sunY - sunR ); triangle( sunX - 0.25 * sunR, sunY + sunR, sunX, sunY + 3 * sunR, sunX + 0.25 * sunR, sunY + sunR ); triangle( sunX - 2.5 * sunR, sunY, sunX - sunR, sunY - 0.25 * sunR, sunX - sunR, sunY + 0.25 * sunR ); triangle( sunX + 2.5 * sunR, sunY, sunX + sunR, sunY - 0.25 * sunR, sunX + sunR, sunY + 0.25 * sunR ); triangle( sunX - 1.25 * sunR, sunY - 1.25 * sunR, sunX - 0.5 * sunR, sunY - sunR, sunX - sunR, sunY - 0.5 * sunR ); triangle( sunX + 1.25 * sunR, sunY - 1.25 * sunR, sunX + 0.5 * sunR, sunY - sunR, sunX + sunR, sunY - 0.5 * sunR ); triangle( sunX - 1.25 * sunR, sunY + 1.25 * sunR, sunX - 0.5 * sunR, sunY + sunR, sunX - sunR, sunY + 0.5 * sunR ); triangle( sunX + 1.25 * sunR, sunY + 1.25 * sunR, sunX + 0.5 * sunR, sunY + sunR, sunX + sunR, sunY + 0.5 * sunR ); noStroke(); circle(sunX, sunY, sunR);}//the moon patternfunction drawMoon(moonX, moonY, moonR) { fill(255, 204, 0); noStroke(); circle(moonX, moonY, moonR); fill(0); circle(moonX - moonR / 10, moonY - moonR / 10, moonR - moonR / 4);}