Check our the GOAL and the RULES of this exercise at the bottom of this file.

  After that, follow these steps before you start coding:

​

  1. rename the dancer class to reflect your name (line 32).

  2. adjust line 19 to reflect your dancer's name, too.

  3. run the code and see if a square (your dancer) appears on the canvas.

  4. start coding your dancer inside the class that has been prepared for you.

  5. have fun.

*/

let dancer;

​

function setup() {

  // no adjustments in the setup function needed...

  createCanvas(windowWidth, windowHeight);

  // ...except to adjust the dancer's name on the next line:

  dancer = new connieDancer(width / 2, height / 2);

}

​

function draw() {

  // you don't need to make any adjustments inside the draw loop

  background(0);

  drawFloor(); // for reference only

  dancer.update();

  dancer.display();

}

​

// You only code inside this class.

// Start by giving the dancer your name, e.g. LeonDancer.

class connieDancer {

  constructor(startX, startY) {

    this.x = startX;

    this.y = startY;

    // add properties for your dancer here:

    // below properties will be used to control the different

    // pieces of my dancer

    this.sclBig = 2;

    this.sclMed = 1.5;

    this.sclFace = 1;

    this.bodyColor1 = "#ffffd1";

    this.bodyColor2 = "#150413";

    this.faceColor = "#635c6d";

  }

  update() {

    this.spd = random(-0.2, 0.03);

    this.sclBig = random(1.5, 2);

    this.sclMed = random(1, 1.5);

    this.sclFace = random(0.5, 1);

  }

  display() {

    push();

    translate(this.x, this.y);

    frameRate(4);

    rotate(frameCount * this.spd);

    noStroke();

​

    // ******** //

    // ⬇️ draw your dancer here ⬇️

​

    // biggest body segment

    push();

    fill(this.bodyColor1);

    scale(this.sclBig);

    ellipse(0, 0, 100, 40);

    ellipse(0, 0, 40, 100);

    pop();

​

    // medium body segement

    push();

    fill(this.bodyColor2);

    scale(this.sclMed);

    ellipse(0, 0, 100, 40);

    ellipse(0, 0, 40, 100);

    pop();

​

    // face segement

    push();

    fill(this.faceColor);

    scale(this.sclFace);

    ellipse(0, 0, 100, 40);

    ellipse(0, 0, 40, 100);

​

    // eyes

    fill(255);

    circle(-20, 20, 35);

    circle(20, -20, 35);

    fill(0);

    circle(20, -20, 20);

    circle(-20, 20, 20);

    circle(20, 20, 15);

    pop();

    pop(); // closing the push() of the entire display method

  }

}

​

/*

GOAL:

The goal is for you to write a class that produces a dancing being/creature/object/thing. In the next class, your dancer along with your peers' dancers will all dance in the same sketch that your instructor will put together. 

​

RULES:

For this to work you need to follow one rule: 

  - Only put relevant code into your dancer class; your dancer cannot depend on code outside of itself (like global variables or functions defined outside)

  - Your dancer must perform by means of the two essential methods: update and display. Don't add more methods that require to be called from outside (e.g. in the draw loop).

  - Your dancer will always be initialized receiving two arguments: 

    - startX (currently the horizontal center of the canvas)

    - startY (currently the vertical center of the canvas)

  beside these, please don't add more parameters into the constructor function 

  - lastly, to make sure our dancers will harmomize once on the same canvas, please don't make your dancer bigger than 200x200 pixels. 

​

*/

​