Differences

This shows you the differences between two versions of the page.

--- anna-yang-generative [2021/06/22 20:36] – howard.lee
+++ anna-yang-generative [2021/06/29 01:27] (current) – renick
@@ Line 1: / Line 1: @@
-====== Rex lee's crazyDog.js ======
+====== Anna Yang's crazyDog.js ======
+by [[yang-anna|Anna]]
+<HTML>
+<iframe src="https://editor.p5js.org/renick/present/1JC3OY8Fq" width=99% height=799px></iframe>
+</HTML>
+===== about my crazyDog.js =====
+My dog has a pair of big round eyes and a strong body.
+He hopes to be adopted.
+Some people say he looks like a mouse but he is actually a Chihuahua.
+The animation code is released under the [[https://www.gnu.org/licenses/old-licenses/lgpl-2.1.en.html|GNU Lesser General Public License v2.1]]
+===== the code for my crazyDog.js =====
+<Code:js>
+// Where is the circle
+let x, y;
+function setup() {
+  createCanvas(1800, 780);
+    // Starts in the middle
+  x = width / 2;
+  y = height;
+}
+class Dog {
+  constructor (size,dColor,x,y)
+  { this.dogSize = size;
+    this.dogColor = dColor;
+    this.positionx=x-150;
+    this.positiony=y-0;
+}
+  draw () {
+fill(random(0,225),random(0,225),random(0,225));
+rect(240+this.positionx, 300+this.positiony, 25, 50);
+     // leg
+fill(random(0,225),random(0,225),random(0,225));
+ellipse(300+this.positionx, 250+this.positiony, 35, 10);
+     // tail
+fill(random(0,225),random(0,225),random(0,225));
+rect(155+this.positionx, 300+this.positiony, 25, 50);
+     // leg
+fill(random(0,225),random(0,225),random(0,225));
+rect(144+this.positionx, 190+this.positiony, 150, 125);
+     // body
+fill(random(0,225),random(0,225),random(0,225));
+rect(165+this.positionx, 300+this.positiony, 25, 50);
+     // leg
+fill(random(0,225),random(0,225),random(0,225));
+rect(250+this.positionx, 300+this.positiony, 25, 50);
+     // leg
+ellipseMode(RADIUS);
+fill(random(0,225),random(0,225),random(0,225));
+ellipse(100+this.positionx, 100+this.positiony, 20, 20);
+ellipseMode(CENTER);
+fill(random(0,225),random(0,225),random(0,225));
+ellipse(100+this.positionx, 100+this.positiony, 20, 20);
+ellipseMode(RADIUS);
+fill(random(0,225),random(0,225),random(0,225));
+ellipse(200+this.positionx, 100+this.positiony, 20, 20);
+ellipseMode(CENTER);
+fill(random(0,225),random(0,225),random(0,225));
+ellipse(200+this.positionx, 100+this.positiony, 20, 20);
+     // ears
+fill(random(0,225),random(0,225),random(0,225));
+square(100+this.positionx, 100+this.positiony, 100, 20);
+     // face
+ellipseMode(RADIUS);
+fill(random(0,225),random(0,225),random(0,225));
+ellipse(175+this.positionx, 135+this.positiony, 15, 15);
+ellipseMode(CENTER);
+fill(random(0,225),random(0,225),random(0,225));
+ellipse(175+this.positionx, 135+this.positiony, 15, 15);
+ellipseMode(RADIUS);
+fill(random(0,225),random(0,225),random(0,225));
+ellipse(125+this.positionx, 135+this.positiony, 15, 15);
+ellipseMode(CENTER);
+fill(random(0,225),random(0,225),random(0,225));
+ellipse(125+this.positionx, 135+this.positiony, 15, 15);
+     // eyes
+fill(random(0,225),random(0,225),random(0,225));
+circle(152.5+this.positionx, 175+this.positiony, 25);
+     // month
+}}
+class BackgroundPattern {
+  constructor (size, Color,x,y)
+  { this.backgroundSize = size;
+    this.backgroundColor = Color;
+    this.positiony=y-0;
+    this.positionx=x-150;
+}
+  draw () {
+ellipseMode(RADIUS);
+fill(random(0,225),random(0,225),random(0,225));
+ellipse(200+this.positionx, 250+this.positiony, 200, 200);
+ellipseMode(CENTER);
+fill(random(0,225),random(0,225),random(0,225));
+ellipse(200+this.positionx, 250+this.positiony, 370, 370);
+textSize(32);
+fill(random(0,225),random(0,225),random(0,225));
+text('Adopt me', this.positionx+200, this.positiony+190);
+fill(random(0,225),random(0,225),random(0,225));
+text('Adopt me', this.positionx+200, this.positiony+220);
+fill(random(0,225),random(0,225),random(0,225));
+text('Adopt me', this.positionx+200, this.positiony+250);
+}}
+function dogArray (n, x, y) {
+    let outputArray = [];
+    for (let i = 0; i < n ; i++) {
+        outputArray.push(new Dog (100,"blue",x + (i*350) - 50,y+100))
+    }
+    return outputArray
+}
+function backgroundPatternArray (number,x,y) {
+    let outputArray = [];
+    for (let i = 0; i < number ; i++) {
+        outputArray.push(new BackgroundPattern (500,"blue",x + (i * 350),y))
+    }
+    return outputArray
+}
+function Dogs2 (startingX, startingY, numberOfArrays, arrayLength) {
+  for(let i = 0; i < numberOfArrays ; i++){
+    let myDogs = dogArray (arrayLength, startingX, startingY+(i*350));
+    for(let i = 0; i < myDogs.length ; i++){
+      myDogs[i].draw()
+}}}
+function Background2 (startingX, startingY, numberOfArrays, arrayLength) {
+  for(let i = 0; i < numberOfArrays ; i++){
+    let myBackground = backgroundPatternArray (arrayLength, startingX, startingY+(i*350));
+    for(let i = 0; i < myBackground.length ; i++){
+      myBackground[i].draw()
+}}}
+function draw() {
+  background(220);
+  //let back2 = new BackgroundPattern (100,"beige",215,60);
+  //back2.draw();
+  //let back1 = new BackgroundPattern (100, "beige",615, 505)
+  //back1.draw();
+  //let dog2 = new Dog (100, "beige", "beige",190,125);
+  //dog2.draw();
+  //let dog1 = new Dog (100, "beige", "beige",590, 525)
+  //dog1.draw();
+    //let dog2 = new Dog (200,100, "red", "blue");
+  //dog2.draw();
+    Background2 (100, 0, 5, 5)
+    Dogs2 (100, 0, 5, 5);
+  // Draw a circle
+  stroke(50);
+  fill(100);
+  ellipse(x, y, 24, 24);
+  // Jiggling randomly on the horizontal axis
+  x = x + random(-1, 1);
+  // Moving up at a constant speed
+  y = y - 1;
+  // Reset to the bottom
+  if (y < 0) {
+    y = height;
+  }
+}
+</Code>