====== Steve Wang's crazyDog.js ====== Made by [[steve-wang|Steve]]. ===== about my crazyDog.js ===== I worked on this code for about a school term. I am also new to p5.js so it might not be that good. I think I have also improved in my programming skills. The first thing I made was the dog then the grenades, the clouds and the stars, and the sun. I think I have improved for every step of the way. However, it may not show because I went back to improve the older things I made. Overall, I think I did fine and I am very happy to have learnt programming. The animation code is released under the [[https://www.gnu.org/licenses/old-licenses/lgpl-2.1.en.html|GNU Lesser General Public License v2.1]]. ===== The code for my crazyDog.js ===== let framen =40 let flyn=0.6 let mode =0 function setup() { createCanvas(1800, 780); } let starX=0 let starY=0 let starColor=255 class Star { constructor(starX,starY,starColor){ this.starX=starX; this.starY=starY this.starColor=starColor } draw(){ fill(color(this.starColor,this.starColor,0)); noStroke() circle(28+this.starX,39+this.starY,27) triangle(18+this.starX, 29+this.starY, 28+this.starX, 14+this.starY, 38+this.starX, 29+this.starY); triangle(18+this.starX,29+this.starY,3+this.starX,39+this.starY,18+this.starX,49+this.starY) triangle(18+this.starX,49+this.starY,28+this.starX,64+this.starY,38+this.starX,49+this.starY) triangle(38+this.starX,49+this.starY,53+this.starX,39+this.starY,38+this.starX,29+this.starY) } } let Bigcloudx=0 let Bigcloudy=0 let Bigcloudcolor=0 class BigCloud { constructor(Bigcloudx,Bigcloudy,Bigcloudcolor) { this.Bigcloudx=Bigcloudx; this.Bigcloudy=Bigcloudy; this.Bigcloudcolor=Bigcloudcolor; } draw(){ noStroke(); fill(color(this.Bigcloudcolor,this.Bigcloudcolor,this.Bigcloudcolor)) circle(160+this.Bigcloudx,80+this.Bigcloudy,120); circle(235+this.Bigcloudx,65+this.Bigcloudy,120); circle(300+this.Bigcloudx,115+this.Bigcloudy,120); circle(225+this.Bigcloudx,164+this.Bigcloudy,140); circle(180+this.Bigcloudx,164+this.Bigcloudy,120); circle(110+this.Bigcloudx,120+this.Bigcloudy,120); }} let FlatBottomCloudX =0 let FlatBottomCloudY =0 let FlatBottomCloudColor =0 class FlatBottomCloud { constructor(FlatBottomCloudX,FlatBottomCloudY,FlatBottomCloudColor) { this.FlatBottomCloudX=FlatBottomCloudX; this.FlatBottomCloudY=FlatBottomCloudY; this.FlatBottomCloudColor=FlatBottomCloudColor; } draw() { noStroke(); fill(color(this.FlatBottomCloudColor,this.FlatBottomCloudColor,this.FlatBottomCloudColor)) circle(160+this.FlatBottomCloudX,80+this.FlatBottomCloudY,120); circle(235+this.FlatBottomCloudX,65+this.FlatBottomCloudY,120); circle(300+this.FlatBottomCloudX,120+this.FlatBottomCloudY,120); rect(170+this.FlatBottomCloudX,118+this.FlatBottomCloudY,170,60,20); rect(73+this.FlatBottomCloudX,118+this.FlatBottomCloudY,110,60,20); circle(110+this.FlatBottomCloudX,120+this.FlatBottomCloudY,120); }} let CloudsX=0 let CloudsY=0 let CloudsColor=0 class Clouds { constructor(CloudsX,CloudsY,CloudsColor) { this.CloudsX=CloudsX; this.CloudsY=CloudsY; this.CloudsColor=CloudsColor; } draw() { noStroke(); fill(color(this.CloudsColor,this.CloudsColor,this.CloudsColor)) circle(140+this.CloudsX,60+this.CloudsY,100); circle(205+this.CloudsX,45+this.CloudsY,100); circle(270+this.CloudsX,95+this.CloudsY,100); circle(205+this.CloudsX,144+this.CloudsY,120); circle(140+this.CloudsX,144+this.CloudsY,100); circle(90+this.CloudsX,100+this.CloudsY,100);} } let GrenadesX=0 let GrenadesY=0 let GrenadesColors=0 class Grenades { constructor(GrenadesX,GrenadesY,GrenadesColors){ this.GrenadesX=GrenadesX; this.GrenadesY=GrenadesY; this.GrenadesColors=GrenadesColors; } draw () { //grenade rotate(-100 / 3.0) strokeWeight(1); fill("Grey"); rect(72.5+this.GrenadesX,42+this.GrenadesY,42,10); rect(73+this.GrenadesX,38+this.GrenadesY,15,35); rect(105+this.GrenadesX,42+this.GrenadesY,10,45); fill(this.GrenadesColors); ellipse(80+this.GrenadesX, 80+this.GrenadesY, 45, 60); line(60+this.GrenadesX,70+this.GrenadesY,100+this.GrenadesX,70+this.GrenadesY); line(60+this.GrenadesX,90+this.GrenadesY,100+this.GrenadesX,90+this.GrenadesY); line(68+this.GrenadesX,54+this.GrenadesY,68+this.GrenadesX,105+this.GrenadesY); line(80+this.GrenadesX,50+this.GrenadesY,80+this.GrenadesX,110+this.GrenadesY); line(92+this.GrenadesX,54+this.GrenadesY,92+this.GrenadesX,105+this.GrenadesY); noFill(); strokeWeight(1.5); circle(75+this.GrenadesX,55+this.GrenadesY,20); square(75+this.GrenadesX,43+this.GrenadesY,5) } } class Dog { constructor (x,y,amount,sizes,colors,i){ this.x=x; this.y=y; this.number=amount this.sizes=sizes; this.colors=colors; this.i=i; } draw () { let amountarray=[] let number=0 let options=0 let w =0 let g =0 let h =0 let b=0 let k=0 let kk=0 translate(this.x,this.y); rotate(100 / 3.0) b=this.number+(5*this.i); options=Math.floor(random(0,2)) if (options==1) {w=50;h=25;} else{w=20;h=45} //legs fill(this.colors) rect(175,128,this.sizes[this.i],45); rect(168,128,this.sizes[this.i+1],45); rect(205,128,this.sizes[this.i+2],45); rect(200,128,this.sizes[this.i+3],45); //tail g= this.sizes[b]+150 let p1 = { x: g, y: 108 }; let p2 = { x: 255, y: 108 }; let p3 = { x: 255, y: 118}; let p4 = { x: g, y: 118}; curve(p1.x, p1.y, p1.x, p1.y, p2.x, p2.y, p3.x, p3.y); stroke(0); curve(p1.x, p1.y, p2.x, p2.y, p3.x, p3.y, p4.x, p4.y); curve(p2.x, p2.y, p3.x, p3.y, p4.x, p4.y, p4.x, p4.y); //Body ellipse(190,113,this.sizes[this.i],45); //Face circle(130,100,90); //ears ellipse(90,80,w,h); ellipse(170,80,w,h); //Eyes circle(115,95,20); circle(143,95,20); fill("black") circle(115,95,10); circle(143,95,10); //fill(0,0,0) //Nose fill("black") circle(130,108,10); //mouth fill ("red") rect(118,116,25+(random(0,20)),9+(random(0,10))); drawteeth(); function drawteeth () { let toprow=Math.floor(random(1,4)); let bottomrow=Math.floor(random(1,4)); let toprowa=[]; let bottomrowa= []; for (let i = 0; i < toprow; i++) { toprowa.push(Math.floor(random(0,2)))} for (let i = 0; i < bottomrow; i++) { bottomrowa.push(Math.floor(random(0,2)))} for (let i = 0; i < toprow; i++) { fill("White") if (toprowa[i]==0) {triangle(118+(i*4), 116, 128+(i*4), 124, 130+(i*4), 116);} if (toprowa[i]==1) {triangle(118+(i*10), 116, 128+(i*10), 134, 130+(i*10), 116)} } for (let i = 0; i < bottomrow; i++) { fill("White") if (bottomrowa[i]==0) { triangle(114+(i*4), 130, 120+(i*4), 120, 126+(i*4), 130);} if (bottomrowa[i]==1) { triangle(114+(i*10), 130, 120+(i*10), 120, 136+(i*10), 130);} } } //fill(color(255,255,255)) //triangle(118+(x)+i,116+(this.y)+(i*2),128+(x)+i,120+(this.y)+i,128+(x)+i,126+(this.y)+(i*4)); //triangle(128+(x)-i,126+(this.y)-(i*2),138+(x)-i,120+(this.y)-i,138+(x)-i,126+(this.y)-(i*4))} fill(this.colors) } } function sizeArray (length) { let newarray= [] let amountarray=[] for (let i = 0; i < length; i++) { amountarray.push(0) } amountarray.forEach(sizeArray2) return newarray function sizeArray2 (x,i) { newarray.push(1 + (Math.random() * 100)) }} function loopedArray (n, fillItem) { outputArray = []; let a=0; let amountarray=[] for (let i = 0; i < n; i++) { amountarray.push(0) } amountarray.forEach(loopedArray2) function loopedArray2 (x,i) { a=a+1; if (i==0) {a=0} if (a>=fillItem.length) {a=0} outputArray.push(fillItem[a]); } return outputArray } let originalnumbarray= ["blue","red","orange","yellow","green"] let colorarray= loopedArray(200,originalnumbarray); let sizearray=(sizeArray(200)); function dogObjectCreator (sizearray,colorarray) { let doginfo=[] for (let i = 0; i < 60; i++) { dog = { xq:600+(30*i), y:0, //30+(20*i) amount:100, sizearray:sizearray, color:colorarray[i], }; doginfo.push(dog) } return doginfo } let cloudarray= [] let drawingarray = [] let option2 = 2 let mm=1500 let option=0 let counter2=0; let counter3=0 let b=0 let DrawCloudX =0 let DrawCloudY =[] let cloudc =100 let sunOut=[] let rown=0 let DrawCloudX2 =0 let cSpeed=[] let cSpeed2=[] function drawcloud (x,i,DrawCloudY,cloudc,cSpeed) { DrawCloudX+=cSpeed[i] if (DrawCloudX>=1500) {DrawCloudX=0;option+=1;} if (option>=3) {option=0} if (option==0){ let cloud= new Clouds (DrawCloudX+DrawCloudX*i,DrawCloudY[i],cloudc) cloud.draw();} if (option==1) { let cloud= new BigCloud(DrawCloudX+DrawCloudX*i,DrawCloudY[i],cloudc) cloud.draw();} if (option==2){ let cloud= new FlatBottomCloud (DrawCloudX+DrawCloudX*i,DrawCloudY[i],cloudc); cloud.draw();} } function drawcloud2 (x,i,DrawCloudY,cloudc,cSpeed2) { DrawCloudX2+=cSpeed2[i] if (DrawCloudX2>=1500) {DrawCloudX2=0;option+=1;} if (option>=3) {option=0} if (option==0){ let cloud= new Clouds (DrawCloudX2+DrawCloudX2*i,DrawCloudY[i],cloudc) cloud.draw();} if (option==1) { let cloud= new BigCloud(DrawCloudX2+DrawCloudX2*i,DrawCloudY[i],cloudc) cloud.draw();} if (option==2){ let cloud= new FlatBottomCloud (DrawCloudX2+DrawCloudX2*i,DrawCloudY[i],cloudc); cloud.draw();} } let doginfoB=dogObjectCreator (sizearray,colorarray) let allDogObjects = doginfoB.map((x,i) => new Dog (x.xq, x.y, x.amount, x.sizearray, x.color,i)) GrenadesY =10 function drawing (doginfo,x,i){ GrenadesY+= flyn if (GrenadesY>=1500) {GrenadesY=-3000} let grenade = new Grenades (doginfoB[x].xq,GrenadesY,colorarray[Math.floor(Math.random()*colorarray.length)]); grenade.draw(); } let xlevel=0 let ylevel=780 let sunOutput=0 let greenb=50 function sun (sunOutput){ counter2+=1 if (counter2<=100){ xlevel+=9 ylevel-=7 greenb+=2 cloudc+=5} else{xlevel+=9;ylevel+=7;greenb-=1;cloudc-=2.5; starArray.forEach((x,i)=> drawStar(x,i,cloudc))} if (counter2>=300){xlevel=0;ylevel=780;counter2=0;} if (sunOutput==1) {fill("Yellow") circle(xlevel,ylevel,130);} if (sunOutput==1){return greenb} if (sunOutput==2){return cloudc} } let starCounter=0 let starXYarray=[] let newStarX = Math.random()*1800; let newStarX1 =Math.random()*1800; let newStarX2 =Math.random()*1800; let newStarX3 =Math.random()*1800; let newStarY =Math.random()*500; let newStarY1 =Math.random()*500; let newStarY2 =Math.random()*500; let newStarY3 =Math.random()*500; function drawStar (x,i,starColor){ let star= new Star(newStarX,newStarY,starColor) star.draw(); let star1= new Star(newStarX1,newStarY1,starColor) star1.draw() let star2= new Star(newStarX2,newStarY2,starColor) star2.draw() ; let star3= new Star(newStarX3,newStarY3,starColor) star3.draw(); } let lengthofCInfo=0 let makingCloudInfo=[] function makeCloudInfo(lengthofCInfo){ for (let c = 0; c < lengthofCInfo; c++) { makingCloudInfo.push(random(0,300)) } return makingCloudInfo} let makingCloudSpeed=[] function cloudSpeedCreator (lengthofCInfo){ for (let c = 0; c < lengthofCInfo; c++) { makingCloudSpeed.push(random(1,3)) } return makingCloudSpeed} let starArray=[]; for (let v = 0; v < 20; v++) { if(v==5){ starArray.push(1) } starArray.push(0) } for (let b = 0; b < 5; b++) { cloudarray.push(0) } for (let i = 0; i < 50; i++) { drawingarray.push(0) } let cloudInfo=[]; let cloudInfo2 =[]; let cloudSpeed =[] let cloudSpeed2 =[] function draw() { background(color(52, greenb, 235)); frameRate(framen); c1=Math.floor(random() * 3) greenb=sun(1) cloudc=sun(2) cloudInfo=makeCloudInfo(cloudarray.length); cloudInfo2=makeCloudInfo(cloudarray.length); cloudSpeed=cloudSpeedCreator(cloudarray.length); cloudSpeed2=cloudSpeedCreator(cloudarray.length); cloudarray.forEach((x,i)=> drawcloud(x,i,cloudInfo,cloudc,cloudSpeed)); cloudarray.forEach((x,i)=> drawcloud2(x,i,cloudInfo2,cloudc,cloudSpeed2)); if (greenb>=177) {greenb=177} fill("Green") rect(0,740,1900,100) allDogObjects.forEach(x => x.draw()) drawingarray.forEach((x,i)=> drawing(doginfoB,x,i)); }