Brandon Chen's crazyDog.js

by Ben

This is my crazyDog.js. I've been working on it all semester. The hardest thing was to learn how to animate the dogs. I'm proud of it because I have never coded anything before so I feel like I accomplished a lot from doing this. The code for my artwork is below.

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

let red=0;
let green=0;
let blue=0;
let sun=144
let dogeColor=0
var teethDepth;
var redTeethColorChange = 0
let x = 10
let speed = 0.1
function setup() {
createCanvas(1800, 780);
dogeColor = random(255)
cloudColor = random(255)
}



class Dog {
  constructor (x ,y)
  {
    this.positionx = x
    this.positiony = y
    
  }
  draw ()
  {

  fill(dogeColor)
  //front
  rect(this.positionx+65,725, 20, 55, 20);
  rect(this.positionx+70,725, 20, 55, 20);
 //back
  rect(this.positionx+165,725, 20, 55, 20);
  rect(this.positionx+160,725, 20, 55, 20);
  rect(this.positionx+65, this.positiony+460, 120, 60);
  //ears
rect(this.positionx+55, 640, 30, 30, 10);
rect(this.positionx+25,640,30,30,10)
  //Head
 circle(this.positionx+55, this.positiony+450, 60)
{let numberarray = [0, 15, 10, 5]
    let r = random(numberarray)
  //Eyes
  for(let i = 0; i<1; i++) {
    let r = random(2, 5);
    if (mouseIsPressed){
      fill(255, 0, 191)
circle(this.positionx+40+r,660+r,10+r)
circle(this.positionx+70+r,660+r,10+r)}
    else
    {
fill(0,0,0)
  circle(this.positionx+40,660,10)
circle(this.positionx+70,660,10)}
  }
   if (mouseIsPressed) {
dogeColor = color(random (255), random(255), random(255)); 
  }
 
  //mouth

{
  fill('white')
  arc(this.positionx+55, 670, 30, 30, 0, PI, PIE,10)
  }
//teeths
    if (mouseIsPressed) {
    redTeethColorChange += 2;
  } else {
    redTeethColorChange -= 2;
  }
  redTeethColorChange = constrain(redTeethColorChange, 0, 55);
 if (mouseIsPressed){
   fill('red')
    triangle(this.positionx+60,685,this.positionx+55,671,this.positionx+65,671); triangle(this.positionx+50,685,this.positionx+45,671,this.positionx+55,671);
}
}
}
}

class backgroundPattern {
  constructor (x,y)
  {
    this.xposition = x
    this.yposition = y
  }
  draw ()
  {
    
    //sun
  //outer
    x = x + speed;

  if(x > width - 10 || x < 10){
    speed = -speed;
  }


  noStroke();
  fill(255, 165, 0, 50);

    circle(120+x,100, 200);


  //inner
  noStroke();
  fill(255, 100, 0, 100);

    circle(120+x, 100, 150);

    //clouds
    fill(cloudColor)
    circle(this.xposition +50+x,250,60)
    circle(this.xposition +80+x,240,60)
    circle(this.xposition +100+x,230,60)
    circle(this.xposition +110+x,270,60)
    circle(this.xposition +120+x,270,60)
    circle(this.xposition +110+x,280,60)
    circle(this.xposition +100+x,250,60)
    circle(this.xposition +80+x,290,60)
    circle(this.xposition +30+x,450,60)
    circle(this.xposition +60+x,440,60)
    circle(this.xposition +80+x,430,60)
    circle(this.xposition +90+x,470,60)
    circle(this.xposition +100+x,470,60)
    circle(this.xposition +90+x,480,60)
    circle(this.xposition +80+x,450,60)
    circle(this.xposition +60+x,490,60)
    
    
   stroke(0,0,0)
    //hat
    if(mouseIsPressed){
    fill('black')
    rect (this.xposition + 35, 575,40,50,10)
   ellipse (this.xposition + 55, 635, 70, 40)}
//Click Me
textSize(12);
fill('pink');
text('Click on a Dog or Cloud', 220, 550);
    text('FLASH WARNING!!!', 100,550)
 if (mouseIsPressed) {
cloudColor = color(random (255), random(255), random(255)); 
  }
  
}}
function draw () {
 background(red+=5, green++, blue);
    for(let i = 0; i<100 ; i++) {
  let dog1 = new Dog (i*150, 213+(i*0))
   dogarr = [
    dog1
  ]
   for (let i = 0; i < dogarr.length; i++) { dogarr[i].draw() }   
  }
  for(let i =0;i<100;i++) {
    let background1 = new backgroundPattern (i*150,213+(i*0))
    backgroundPatternarr = [
      background1
    ]
    for(let i = 0; i< backgroundPatternarr.length; i++) {backgroundPatternarr[i].draw()}
  }
}