Shannia Lin's crazyDog.js

Made by: Shannia Lin

This is my crazydog.js. I've been working on this the whole semester learning javascript and p5.js. I think the hardest part of this was to make it work how I wanted to. Some parts would just go everywhere or it will just not show up. I'm proud that I now have something that works how I want it to. This the code for my art below.

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

let x = 10;
let speed = 0.1;
function setup() {
  createCanvas(1800, 780);
  rectMode(CENTER)
  frameRate(10)

}
function cartPolarX (kall){
xcp=kall*10*cos(kall*PI/10)
}
function cartPolarY (kall){
ycp=kall*10*sin(kall*PI/10)
}

class Dog {
  constructor (x, y, earxl, earyl, earxr, earyr, color, tounge, numberarray, collar)
  {
    this.x = x
    this.y = y
    this.earxl = earxl
     this.earyl = earyl
      this.earxr = earxr
     this.earyr = earyr
    this.color = color
    this.tocol = tounge
    this.numberarr = numberarray
    this.collar = collar
  }
  draw () {
   push()
     translate(this.x, this.y);


  rotate(frameCount * 0.25)
fill(this.collar)
  ellipse (100 + this.x,140 + this.y ,70,50);
          fill(this.color);
       let r = random(0,40)
  ellipse(100+ this.x, 100+ this.y, 100+r);
  noFill();

         for(let i = 0; i<1; i++) {

   let r = random(this.numberarr)
  fill(50);
  ellipse(75+ this.x, 90+ this.y, 10+r, 10+r);
             ellipse(120 + this.x , 90+ this.y, 10+r, 10+r);
         }

      fill(50);
  triangle(110+this.x, 105+this.y, 90+this.x, 105+this.y, 100+this.x, 115+this.y);
  noFill();
    line(100+this.x, 115+this.y, 100+this.x, 120+this.y);
  line(100+this.x, 120+this.y, 90+this.x, 125+this.y);
  line(100+this.x, 120+this.y, 112+this.x, 125+this.y);
      for(let i = 0; i<1; i++) {
  fill(this.tocol);
       let r = random(this.numberarr)
  arc(100 + this.x, 125+this.y, 10+r, 30, 75, 60, OPEN);
  noFill();

    translate(xcp,ycp)
    push()
        //ear
  fill(this.color);
  rotate(-1*PI/ 10);
  ellipse(25+ this.earxl, 80+ this.earyl, 55, 40);
  noFill();
//ear
  fill(this.color);
  rotate(PI/5);
  ellipse(160+ this.earxr, 25+ this.earyr, 55, 40);
  noFill();
  rotate(-1 *PI/ 10);
    pop()

}
    pop()
  }
}

class Diamond {
 constructor(x,y,size)
  {
    this.x = x
    this.y = y
    this.size = size
}
  draw(){

    for(let i = 0; i < 10;i++){
    fill(255,255, 10*i ,30*i)
        rotate(2.7/PI)
rect(this.x, this.y, this.size+10+Math.sin(frameCount % 359)*200/(i+1))
    rotate(-1*2.7/PI)
    noFill()
      var k= i
    }
    fill(255)
    rotate(2.7/PI)
rect(this.x, this.y, this.size*10/k)
    rotate(-1*2.7/PI)
}
}

function backgroundPattern (xy,yx) {
  push()
  noFill()

for(let i = 0; i < 100; i++){
  fill (36, 41, 138, 25)
beginShape(TRIANGLE_FAN);
vertex((57.5*i)-100, (50*i)-100);
vertex((57.5*i)-100, (15*i)-100);
vertex((92*i)-100, (50*i)-100);
vertex((57.5*i)-100, (85*i)-100);
vertex((22*i)-100, (50*i)-100);
vertex((57.5*i)-100, (15*i)-100);
endShape()
  noFill()
  fill(1000/i,0,10*i)
circle((x*i)-100,(x)*i-100,48)
  circle((x*i)-100,(x)*i-150,48)
  circle((x*i)-100,(x)*i-200,48)
  noFill()
    x = x + speed;

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


}
  pop()
}



function draw() {
  background(220);

    backgroundPattern()
    noStroke()

      for(let i=0; i <25; i++){
   r =  random(-2500,2500)
        b= random(-2500,2500)
   diamond = new Diamond (500-r,100+b,50)
  diamond.draw()
      }

  stroke(1)
    for(let i=0; i <100; i++){
cartPolarX(i)
  cartPolarY(i)

    dog1 = new Dog (xcp, ycp, 0, 0, 0, 0,'#8D6E63', '#FFCDD2', [0, 15, 20, 10, 5], 'orange' )

   dog2 = new Dog (xcp+100, ycp+100, 70, 130, 130, 70,'#3E7D5F', '#FFCDD2', [0, 15, 20, 10, 5], '#514E9D ')
     dog3 = new Dog (xcp+200, ycp+200, 130, 250, 250, 130,'#F59F81', '#FFCDD2', [0, 15, 20, 10, 5], '#B53636')
           dogarr = [
    dog1,
dog2,
    dog3,
  ]



      dogarr.forEach(x => x.draw())
    }
}