Table of Contents

Marcus Hsieh's crazy dog.js

by Marcus

about my crazyDog.js

I know more about coding and useing p5.js

The animation code is released under the GNU Lesser General Public License v2.1.

the code for my crazyDog.js

function setup() {
  createCanvas(1800, 780);
}
 
class Face {
  constructor (positionX,positionY)
  { this.positionX= positionX
   this.positionY= positionY
  }
  draw () {
     fill(10, 255, 68)
ellipse(this.positionX+98,this.positionY+100,100)
ellipse(this.positionX+55,this.positionY+60,45)
ellipse(this.positionX+135,this.positionY+60,45)
        fill(0,255,150)
ellipse(this.positionX+135,this.positionY+100,35) 
    fill(0,255,150)
ellipse(this.positionX+100,this.positionY+100,35)
    fill(0, 189, 35)
ellipse(this.positionX+120,this.positionY+125,15) 
 
    
    
  }
}
 
function faceArray (n) {
    let outputArray = [];
    for (let x = 0; x < n ; x++) {
    for (let y = 0; y < n ; y++) {
              outputArray.push(new Face ( (x*150),(y*150)))
    }
    }
    return outputArray
}
 
let myFaces = faceArray(10);
 
class Face2 {
  constructor (positionX,positionY)
  { this.positionX= positionX
   this.positionY= positionY
  }
  draw (animateX,animateY) {
    stroke(50);
 fill(10, 255, 68)
 ellipse(animateX+this.positionX+98,animateY+this.positionY+100,100)
ellipse(animateX+this.positionX+55,animateY+this.positionY+60,45)
ellipse(animateX+this.positionX+135,animateY+this.positionY+60,45)
        fill(0,255,150)
ellipse(animateX+this.positionX+135,animateY+this.positionY+100,35) 
    fill(0,255,150)
ellipse(animateX+this.positionX+100,animateY+this.positionY+100,35)
    fill(0, 189, 35)
ellipse(animateX+this.positionX+120,animateY+this.positionY+125,15) 
  }
}
 
function faceArray2 (n) {
    let outputArray = [];
    for (let x = 0; x < n ; x++) {
    for (let y = 0; y < n ; y++) {
              outputArray.push(new Face2 ( (x*180),(y*150)))
    }
    }
    return outputArray
}
 
let myFaces2 = faceArray2(10);
 
function draw() {
  background(220);
    for (let x = 0; x < 12; x += 1) {
    for (let y = 0; y < 12; y += 1) {
      DrawCloud(x * 150, y * 120);
    
    }
  }
  //for(let i = 0; i < myFaces.length ; i++){
  //  myFaces[i].draw()
  //}
  for(let i = 0; i < myFaces.length ; i++){
    myFaces2[i].draw(Math.random() * 2,(-1) * frameCount % height)
  }
 
  
}
function DrawCloud(xPosition, yPosition) {
  noStroke();
  fill(252, 252, 252);
  ellipse(50 + xPosition, 50 + yPosition, 60, 50);
  ellipse(80 + xPosition, 40 + yPosition, 60, 50);
  ellipse(130 + xPosition, 50 + yPosition, 60, 50);
  ellipse(70 + xPosition, 70 + yPosition, 60, 50);
  ellipse(110 + xPosition, 65 + yPosition, 60, 50);
}