Category: SectionC

var peakvalue = [];
var noiseParam = 0;
var noiseStep = 0.005;
var x = [];
var y = [];
var dx = [];
var dx1 = 0;
var c = [];
var seacoralshape = 0.002;
var seacoralspeed = 0.005


function preload(){
  cloud = loadImage("https://i.imgur.com/ZtLcxL9.png");
}



function setup() {
  createCanvas(400, 400);
  for (var i = 0; i <=width/5; i++) {
    var n = noise(noiseParam);
    var value = map(n, 0, 1, 300, height);
    peakvalue.push(value);
    noiseParam += noiseStep;
  }

   for (var i=0; i<50; i++){
      x[i]= random(10, width-10);
      y[i] = random(250, 400);
      dx[i] = random(-5,-1);
      c[i] = color(random(255),255,240);
    }
}

function draw() {

  background(251, 164, 153);
  fill(246, 189, 192);
  ellipse(200,200,320,320);
  fill(241, 149, 155);
  ellipse(200,200,290,290);
  fill(240, 116, 112);
  ellipse(200,200, 260);
  fill(234, 76, 70);
  ellipse(200,200,230,230);
  fill(220, 28, 19);
  ellipse(200,200, 200,200);
  seacoral();
  cloud.resize(70,0);
  tint(255,127);
  image(cloud, -250 + dx1, 40);
  image(cloud, -100 +dx1, 100);
  image(cloud, 180 + dx1, 40);
  image(cloud, 20 + dx1, 30);
  image(cloud, 100 + dx1, 100);
  image(cloud, 300 + dx1, 100);
  dx1 += 0.5;
  peakvalue.shift();
  var n2 = noise(noiseParam);
    var value = map(n2, 0, 1, 0, height*1.5);
    peakvalue.push(value);
    noiseParam += noiseStep;

  beginShape();
  vertex(0, height);
  for (var i = 0; i <= width/5; i++) {
    fill(102, 179, 255);
  noStroke();
    vertex(i*5, peakvalue[i]);
    
  }
  vertex(width, height);
   endShape(); 

    for (i = 0; i<50; i++){
      if(x[i] < -30){
        x[i] = 450
      }
      fish(x[i], y[i], dx[i],c[i]);
      x[i] += dx[i]
  }
  frameRate(10);

}


function fish(x,y, dx,c){
  fill(c);
  ellipse(x,y,20,10);
  if(dx >= 0){
    triangle(x - 10, y, x -15, y - 5, x - 15, y + 5);
  }else if(dx < 0){
    triangle(x+10,y, x + 15, y - 5, x + 15, y + 5);
  }
}

function seacoral(){
  noStroke();
  fill(119, 158, 203);
  beginShape();

  for(var i = 0; i < width; i ++){
    var x = (i * seacoralshape) + (millis() * seacoralspeed);
    var y = map(noise(x), 0, 1.2, 200, 250);
    vertex(i, y);
  }

  vertex(width, height);
  vertex(0, height);
  endShape();
  }

//jiaqiwa2; Jiaqi Wang; Section C
var marketValue=[];
var noiseParam=0;

var noiseStep=0.03;
var cactus = [];

function setup() {
    frameRate(30);
    createCanvas(600, 240);
    stroke(89,158,90);
    noStroke();
    fill(89,158,90);
    //strokeWeight(5);
    //set up the y value for every 5 pixels across the canvas horizontally
    for(var i=0;i<=120;i++){
        var n=noise(noiseParam);
        var value=map(n,0,1,height/3,height);
    	marketValue.push(value);
    	noiseParam+=noiseStep;
    }
    frameRate(20);

    for (var i = 0; i < 10; i++){
        var rx = random(width);
        cactus[i] = makeCactus(rx);
    }

}

function draw() {
	background(234,197,119);
  fill(249,242,215);
  noStroke();
  ellipse(width/2,height/2,100,100);
  //remove the first point
    marketValue.shift();
    var n=noise(noiseParam);
    var value=map(n,0,1,height/3,height);
    //and add it to the last point
    marketValue.push(value);
    noiseParam+=noiseStep;
    //start shape from (0,height)
    noStroke();
    fill(186,109,78);

  beginShape();
  curveVertex(0,height);
  curveVertex(0,height);
	for(var i=0;i<width/10;i++){
       
       vertex(i*10, marketValue[i]);
       //check if the hill is close to the right end
        if(i==59){
         i+=1;
         vertex(i*10, marketValue[i]);
         vertex(width, height);
         vertex(0,height);
         vertex(0,height);
         endShape();
       }
  }

  beginShape();
  curveVertex(0,height);
  curveVertex(0,height);



  

 

  updateAndDisplayCactus();
  removeCactusThatHaveSlippedOutOfView();
  addNewCactusWithSomeRandomProbability(); 
     
	   
	//noLoop();
}



function updateAndDisplayCactus(){
    // Update the building's positions, and display them.
    for (var i = 0; i < cactus.length; i++){
        cactus[i].move();
       cactus[i].display();
    }
}


function removeCactusThatHaveSlippedOutOfView(){
    // If a building has dropped off the left edge,
    // remove it from the array.  This is quite tricky, but
    // we've seen something like this before with particles.
    // The easy part is scanning the array to find buildings
    // to remove. The tricky part is if we remove them
    // immediately, we'll alter the array, and our plan to
    // step through each item in the array might not work.
    //     Our solution is to just copy all the buildings
    // we want to keep into a new array.
    var cactusToKeep = [];
    for (var i = 0; i < cactus.length; i++){
        if (cactus[i].x + cactus[i].breadth > 0) {
            cactusToKeep.push(cactus[i]);
        }
    }
    cactus = cactusToKeep; // remember the surviving buildings
}


function addNewCactusWithSomeRandomProbability() {
    // With a very tiny probability, add a new building to the end.
    var newCactusLikelihood = 0.007; 
    if (random(0,1) < newCactusLikelihood) {
         cactus.push(makeCactus(width));
    }
}


// method to update position of building every frame
function  cactusMove() {
    this.x += this.speed;
}
    

// draw the building and some windows
function  cactusDisplay() {
  
    push();
    fill(55,104,50);
    stroke(16,66,7);
    strokeWeight(5);
    translate(this.x, height+90);
    ellipse(0,-100,this.breadth,this.Tall);
    
    push();
    
    translate(this.breadth/2,-this.Tall/2);
    rotate(radians(-20));
    ellipse(0,-100,this.breadth/3*2,this.Tall/3*2);
    pop();

    translate(this.breadth/2,-this.Tall/2);

    push();
    rotate(radians(20));
    translate(-this.branch,0);
    ellipse(0,-100,this.breadth/3*2,this.Tall/3*2);
    pop();


   
    translate(-this.branch/5,-this.Tall/3);
    ellipse(0,-100,this.breadth/6*2,this.Tall/6*2);
    pop();

}


function makeCactus(birthLocationX) {
    var bldg = {x: birthLocationX,
                breadth: round(random(20,40)),
                speed: -2,
                Tall:random(40,120),
                branch:random(30,40),
                theta: round(random(10,40)),
                move:  cactusMove,
                display:  cactusDisplay}
    return bldg;
}


function displayHorizon(){
    stroke(0);
    line (0,height-50, width, height-50); 
}