Differences

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

--- brendon-chang-generative [2021/06/20 18:10] – brendon.chang
+++ brendon-chang-generative [2021/06/29 01:28] (current) – renick
@@ Line 1: / Line 1: @@
-====== Brendon's CrazyDog.js ======
+====== Brendon Chang's crazyDog.js ======
+Programmed by [[Brendon-Chang|Brendon]].
 <HTML>
-<iframe src="https://editor.p5js.org/brendon.chang/present/Jy6_lDHIr" width=99% height=799px></iframe>
+<iframe src="https://editor.p5js.org/renick/present/RfbI5SKq9" width=99% height=799px></iframe>
 </HTML>
+===== about my crazyDog.js =====
+This is my crazyDog.js. I started learning coding this year, and it is hard when you are trying to connect everything. There is one place that I took more time on. The part when you want the cloud to move but the dog to stay. When I code, either the cloud don't move, or both move. I am proud that the dog change color and clouds moves correctly.
+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>
+//Dog
+function setup() {
+  createCanvas(1800, 780);
+  x = width / 2;
+  y = height;
+}
+function patternsBack(x, y, n) {
+  for (let i = 0; i < n; i++) {
+    noStroke();
+    fill(255, 182, 193);
+    circle(x + i * 200, y + 70, 360);
+    fill(65, 200, 225);
+    circle(x + i * 200, y + 70, 230);
+    fill(10, 255, 10);
+    rect(0, 400, 1800, 780);
+  }
+}
+function row(n) {
+  for (let i = 0; i < n; i++) {
+    patternsBack(0, 0 + i * 290, 40);
+  }
+}
+class DrawDog {
+  constructor(xposition, yposition, size, hColor, eColor) {
+    this.xposition = xposition;
+    this.yposition = yposition;
+  }
+  draw(x) {
+    x = 10;
+    stroke(1);
+    fill(Math.random() * 255, Math.random() * 250, Math.random() * 250);
+    //tail
+    triangle(
+      this.xposition + 460,
+,
+      this.xposition + 390,
+,
+      this.xposition + 300,
+    );
+    //legs
+    rect(this.xposition + 380, 230, 20, 195);
+    rect(this.xposition + 255, 230, 20, 195);
+    rect(this.xposition + 265, 240, 20, 195);
+    rect(this.xposition + 390, 240, 20, 195);
+    //body
+    rect(this.xposition + 240, 220, 185, 135, 20);
+    //ears
+    square(this.xposition + 120, 100, 65, 20);
+    square(this.xposition + 240, 100, 65, 20);
+    square(this.xposition + 125, 105, 60, 20);
+    square(this.xposition + 240, 105, 60, 20);
+    //head
+    circle(this.xposition + 210, 190, 180);
+    //eye
+    fill(255, 255, 255);
+    circle(this.xposition + 165, 170, 40);
+    circle(this.xposition + 250, 170, 40);
+    fill(0, 0, 0);
+    circle(this.xposition + 165, 170, 5);
+    circle(this.xposition + 250, 170, 5);
+    //eyebrow
+    line(this.xposition + 270, 140, this.xposition + 230, 150);
+    line(this.xposition + 150, 140, this.xposition + 190, 150);
+    //nose
+    ellipse(this.xposition + 210, 200, 40, 20);
+    //mouth
+    fill(255, 255, 255);
+    stroke(1);
+    rect(this.xposition + 170, 220, 80, 40);
+    fill(0, 0, 0);
+  }
+}
+function dogArray(n) {
+  let outputArray = [];
+  for (let i = 0; i < n; i++) {
+    outputArray.push(
+      new DrawDog(10 + i * 400, 10 + i * 400, 100, "red", "blue")
+    );
+  }
+  return outputArray;
+}
+let myDog = dogArray(30);
+function draw() {
+  row(30);
+  fill(255, 255, 255);
+  circle(50 + (frameCount % 1800), 200, 60);
+  circle(80 + (frameCount % 1800), 190, 60);
+  circle(100 + (frameCount % 1800), 180, 60);
+  circle(110 + (frameCount % 1800), 220, 60);
+  circle(120 + (frameCount % 1800), 220, 60);
+  circle(110 + (frameCount % 1800), 230, 60);
+  circle(100 + (frameCount % 1800), 200, 60);
+  circle(450 + (frameCount % 1800), 200, 60);
+  circle(480 + (frameCount % 1800), 190, 60);
+  circle(500 + (frameCount % 1800), 180, 60);
+  circle(510 + (frameCount % 1800), 220, 60);
+  circle(520 + (frameCount % 1800), 220, 60);
+  circle(510 + (frameCount % 1800), 230, 60);
+  circle(500 + (frameCount % 1800), 200, 60);
+   circle(850 + (frameCount % 1800), 200, 60);
+  circle(880 + (frameCount % 1800), 190, 60);
+  circle(900 + (frameCount % 1800), 180, 60);
+  circle(910 + (frameCount % 1800), 220, 60);
+  circle(920 + (frameCount % 1800), 220, 60);
+  circle(910 + (frameCount % 1800), 230, 60);
+  circle(900 + (frameCount % 1800), 200, 60);
+  for (let i = 0; i < myDog.length; i++) {
+    myDog[i].draw();
+  }
+}
+</Code>