This is my code. I have been working on it a long time. I think programing is very hard to me, but in this code the hardest one is the animation. I'm proud of my code, because I have been working on my code the whole semester and I have try so hard to do it. I hope everyone will like my code!!!
The animation code is released under the GNU Lesser General Public License v2.1.
let x, y; function setup() { createCanvas(1800,780) // Starts in the middle x = width / 2; y = height / 2; //noLoop(); } class Sun { constructor (sSize, sColor, cColor, startingX, startingY) { this.sunSize = sSize; this.sunColor = sColor; this.center = cColor; this.positionX = startingX; this.positionY = startingY; } draw () { push(); noStroke(); fill(255, 244, 25); translate(this.positionX+103, this.positionY+100); rotate(radians(40)); ellipse(this.positionX+75, this.positionY+0, 45, 15); // start from 75 (tip of ellipse, 150/2), since ellipse is 150 wide rotate(radians(40)); ellipse(this.positionX+75, this.positionY+0, 45, 15); rotate(radians(40)); ellipse(this.positionX+75, this.positionY+0, 45, 15); rotate(radians(40)); ellipse(this.positionX+75, this.positionY+0, 45, 15); rotate(radians(40)); ellipse(this.positionX+75, this.positionY+0, 45, 15); rotate(radians(40)); ellipse(this.positionX+75, this.positionY+0, 45, 15); rotate(radians(40)); ellipse(this.positionX+75, this.positionY+0, 45, 15); rotate(radians(40)); ellipse(this.positionX+75, this.positionY+0, 45, 15); rotate(radians(40)); ellipse(this.positionX+75, this.positionY+0, 45, 15); pop(); //center of Sun noStroke(); fill(255, 174, 13); ellipse(this.positionX+100, 107, 80, 80); } } class CrazyDog { constructor (cSize, cColor, colorarr, numberarr, startingX, startingY) { this.crazyDogSize = cSize; this.crazyDogColor = cColor; this.colorarr = colorarr; this.numberarr = numberarr; this.positionX = startingX; this.positionY = startingY; } draw (bodyColor,earColor,eyeSize1,eyeSize2) { //dog for (let i = 0; i < 1; i++){ this.colorarr= [255, 500, 200] let r = random(this.colorarr); strokeWeight(2); stroke(0); //let myRandoms = [Math.random()*r, Math.random()*r, Math.random()*r] //fill(myRandoms[0], myRandoms[1], myRandoms[2]); fill(bodyColor); //front left side feet rect(this.positionX + 60, this.positionY+298, 10, 35, 20); //front right side feet rect(this.positionX + 65, this.positionY+298, 10, 35, 20); //back left side feet rect(this.positionX + 110, this.positionY+298, 10, 35, 20); //back right side feet rect(this.positionX + 115, this.positionY+298, 10, 35, 20); //tail for (let i = 0; i < 1; i++){ this.numberarr = [0, 15, 10, 5] let r = random(this.numberarr) rect(this.positionX + 130, this.positionY+283,40+r,8); } //body rect(this.positionX + 50, this.positionY+253, 85, 55); //head circle(this.positionX + 50, this.positionY+253, 40); //Left side ear fill(earColor); circle(this.positionX + 25, this.positionY+236, 20); fill(earColor.map(x => x*3)); //fill((frameCount*10) % 255, frameCount % 255, frameCount % 255) circle(this.positionX + 25, this.positionY + 236, 10); //Right side ear fill(earColor); //fill(myRandoms[0], myRandoms[1], myRandoms[2]); circle(this.positionX + 65,this.positionY + 228, 20); fill(earColor.map(x => x*3)); //fill((frameCount*10) % 255, frameCount % 255, frameCount % 255) circle(this.positionX + 65, this.positionY+229, 10); } for (let i = 0; i < 1; i++){ this.numberarr = [0, 15, 10, 5] let r = random(this.numberarr) fill(0) //Left eyes(black) circle(this.positionX + 40, this.positionY+253, 7+eyeSize1); //Right eyes(black) circle(this.positionX + 60, this.positionY+253, 7+eyeSize2); fill(255) //Left eyes(white) circle(this.positionX + 40, this.positionY+253, 3+eyeSize1); //Right eyes(white) circle(this.positionX + 60, this.positionY+253, 3+eyeSize2); } } } function dogArray (n, y) { let outputArray = []; for (let i = 0; i < n ; i++) { outputArray.push(new CrazyDog (10, Math.random(), 10, 10, 10+(i*150), 10 + y)) } return outputArray } class Ground { constructor (gSize, gColor, startingX, startingY) { this.groundSize = gSize; this.groundColor = gColor; this.positionX = startingX; this.positionY = startingY; } draw () { //ground strokeWeight(2); stroke(0); fill(162, 232, 181); rect(1, 344, 15400, 55); rect(1, 644, 15400, 55); } } class Cloud { constructor (cSize, cColor, startingX, startingY) { this.cloudSize = cSize; this.cloudColor = cColor; this.positionX = startingX; this.positionY = startingY; } draw () { noStroke(); fill(color(this.cloudColor)); ellipse(this.positionX+250,50,60,50); ellipse(this.positionX+280,40,60,50); ellipse(this.position+230,50,60,50); ellipse(this.positionX+270,70,60,50); ellipse(this.positionX+300,65,60,50); } } function cloudArray (n) { let outputArray = []; for (let i = 0; i < n ; i++) { outputArray.push(new Cloud (100, "white", 20+(i*130), 20)) } return outputArray } let myClouds = cloudArray(114); function randomColorArray(n) { let output = []; for (let i = 0; i < n; i++){ output.push([Math.floor(255* Math.random()),Math.floor(255* Math.random()),Math.floor(255* Math.random())]) } return output } function randomNumberArray(n, max) { let output = []; for (let i = 0; i < n; i++){ output.push(max * Math.random()) } return output } let dogColors = randomColorArray(12); let dogEyeSizes1 = randomNumberArray(12,10); let dogEyeSizes2 = randomNumberArray(12,10); function draw() { background(187, 226, 242); let sun1 = new Sun (10, "yellow", "orange", 10, 10) sun1.draw(); let ground1 = new Ground (10, "green", 10, 20); ground1.draw(); //let cloud1 = new Cloud (100, "white", 20, 20); //cloud1.draw(); //let crazyDog1 = new CrazyDog (10, Math.random(), 10, 10, 10, 10); // crazyDog1.draw(); x = 150; // THE IMPORTANT LINE CONTROLLING THE ANIMATION UP AND DOWN! // the center point the speed the range y = -240 + (height * (1/2)) + (Math.sin(frameCount/10) * (height/5)); let myDogs = dogArray(12, y); for(let i = 0; i < myDogs.length ; i++){ myDogs[i].draw((dogColors[i]),(dogColors[i].map(x => x/2)),dogEyeSizes1[i],dogEyeSizes2[i]) } for(let i = 0; i < myClouds.length ; i++){ myClouds[i].draw() } }