xxxxxxxxxx
114
/*
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.
*/