Differences

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

--- sharon-chou-generative [2021/06/20 17:57] – created sharon.chou
+++ sharon-chou-generative [2021/06/29 01:42] (current) – renick
@@ Line 1: / Line 1: @@
-======SHARON'S CRAZY DOG.JS
+======Sharon Chou' crazyDog.js======
+Made By: [[sharon-chou|Sharon Chou]]
 <HTML>
-<iframe src="https://editor.p5js.org/SharonChou/present/-UPt1azoi" width=99% height=799px></iframe>
+<iframe src="https://editor.p5js.org/renick/present/L8YuZZGBJ" width=99% height=799px></iframe>
 </HTML>
+===== About My CrazyDog.js =====
+Our class has this class called function class or programming class. What we do there is learn about some programming and functions. Recently we have been on this site call P5.JS. There we use functions to create different and unique dogs. We make one of them and then use this function that makes them loop. This also follows the design process from before. We made a sketch thing and then we made corrections over and over again. Currently we are trying to make animation using P5.JS!
+This is my crazyDog.js. I've been working on it all semester. The hardest thing was that a lot of the times the teacher will teach me, but then I don't get it even though he has explained it multiple times. I'm proud of it because I actually managed to complete it with a animation with no errors! The code for my artwork is below.
+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>
+//let x1 = 0;
+//let y2 = 0;
+function setup() {
+createCanvas(1800,780)
+//noLoop()
+//  let x, y;
+// x1 = width / 2;
+//  y2 = height;
+}
+function backgroundPatternRow (startx1,starty1,size,N){
+ for (let i=0;i<N;i++) {
+  fill ("pink");
+  square(startx1+(i*100), starty1, size);
+  }
+}
+function backgroundPatternRowCircle (startx1,starty1,N){
+ for (let i=0;i<N;i++) {
+  fill (255, 254, 214)
+  circle(startx1+(i*5), starty1, 105)
+ }
+ }
+ class Background {
+  constructor (xstart,ystart,size,xN,yN)
+  { this.startx = xstart;
+   this.starty= ystart;
+   this.size= size;
+   this.Loopx= xN;
+   this.LoopY= yN;
+  }
+   draw () {
+  for (let i=0;i < this.LoopY;i++) {
+    //backgroundPatternRow (this.startx,20 + (i * this.starty), this.size, this.Loopx);
+    backgroundPatternRowCircle (this.startx, 20 + (i*this.starty),this.Loopx);
+    backgroundPatternRow (this.startx, 20 + (i*this.starty), this.size, this.Loopx);
+  }
+  }
+ }
+       class Dog {
+  constructor (positionx, positiony)
+  { this.xposition = positionx;
+   this.yposition= positiony;
+  }
+  //earlope1
+  draw(){
+    fill (Math.random()*255,Math.random()*255,Math.random()*255)
+    square(this.xposition+90, this.yposition+66, 100, 20);
+    fill(Math.random()*255,Math.random()*255,Math.random()*255);
+    circle(this.xposition+132, this.yposition+96,50);
+    //ear lope2
+    fill(Math.random()*255,Math.random()*255,Math.random()*255);
+    square(this.xposition+170, this.yposition+65, 100, 20);
+    fill(Math.random()*255,Math.random()*255,Math.random()*255);
+    circle(this.xposition+226, this.yposition+92,50);
+    //body
+    ellipse(this.xposition+185, this.yposition+256,155);
+  //hands
+  fill (Math.random()*255,Math.random()*255,Math.random()*255)
+    circle(this.xposition+150, this.yposition+300,25);
+  //HAND
+  fill (Math.random()*255,Math.random()*255,Math.random()*255)
+    circle(this.xposition+210, this.yposition+300,25);
+  //hands
+   fill (Math.random()*255,Math.random()*255,Math.random()*255)
+    circle(this.xposition+210, this.yposition+250,25);
+  //hands
+  fill (Math.random()*255,Math.random()*255,Math.random()*255)
+    circle(this.xposition +150, this.yposition+250,25);
+    //head
+      fill (Math.random()*255,Math.random()*255,Math.random()*255)
+    circle(this.xposition +180, this.yposition+140,155);
+    //eyes2
+      fill (Math.random()*255,Math.random()*255,Math.random()*255)
+    circle(this.xposition+210, this.yposition+135,50);
+    //eyeballs2
+    fill (Math.random()*255,Math.random()*255,Math.random()*255)
+    circle (this.xposition+209,this.yposition+140,35)
+  //eyeballs3
+     fill (255,255,255)
+    circle (this.xposition+209,this.yposition+145,20)
+    //eyeballs 1
+    fill (1,1,1)
+    circle (this.xposition+150,this.yposition+140,30)
+    //inside eyeballs
+    fill (255,255,255)
+    circle (this.xposition+150,this.yposition+140,15)
+    //mouth
+      fill (Math.random()*255,Math.random()*255,Math.random()*255)
+    ellipse(this.xposition+180, this.yposition+180, 80, 30);
+    //mouth1
+     fill (Math.random()*255,Math.random()*255,Math.random()*255)
+    ellipse(this.xposition+180, this.yposition+180, 45, 20);
+}
+      }
+function backgroundPatternArray (n) {
+    let outputArray = [];
+    for (let i = 0; i < n ; i++) {
+        outputArray.push(new Background (8 + (i*10),100,(10 + (i*2)),900,10));
+    }
+    return outputArray
+  }
+function dogArray (n, y) {
+    let outputArray = [];
+  for(let k = 0; k <n ; k++){
+    for (let i = 0; i < n ; i++) {
+        outputArray.push(new Dog ((100+100)*i,y + (225+50)*k));
+    }
+}
+    return outputArray
+  }
+let myBackground = backgroundPatternArray (1);
+console.log(myBackground);
+function draw() {
+  background(0);
+  //let background1 = new Background (8,100,10,900,10);
+  //background1.draw();
+  //for(let i = 0; i< myBackground.length; i++){
+  //myBackground[i].draw();
+  //}
+  let trashdog = dogArray (9,-1 * (frameCount% 3000));
+    for(let i = 0; i< trashdog.length; i++){
+  trashdog[i].draw();
+    }
+  text(("this is the frameCount: ") + frameCount, 50, 50);
+}
+</Code>
+===Go to this page to see our dogs!===
+[[all-dogs|All of our dogs]]