let fishcandy = [];

let bigfish = []; //bigfish eat goldfish

let gravity = 2; //gravity bove water

let resist = 1.4; //water resistance

let fishpattern =[]; 

let head; //human head

let bowlH; 

let bowlW;

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  head = new Head();

  fishpattern = [pattern(PTN.triangle(15,15)),pattern(PTN.dot(15,6)),pattern(PTN.wave(40,35)),pattern(PTN.wave(60,30))];

  bowlH = 0.95*windowHeight;

  bowlW = 1.3*windowHeight;

}

​

function mouseClicked(){

  var num = [0,1,2];

  if(mouseX>0.5*width-0.35*height && mouseX<0.5*width+0.35*height && mouseY<0.3*windowHeight){

   goldfish.push(new Fish(mouseX,mouseY,random(0.7,1.2),random(num),fishcandy));

  }

}

​

function keyPressed(){

  if(key == 'c'){

    fishcandy.push(new Candy(0, 0, 11, 15, 11));

  }

  if(key == 'v'){

    bigfish.push(new Fish(width*0.5,height*0.1,random(1.5,2),3,goldfish));

    setTimeout(disappear,8000);

  }

} 

​

function disappear(){

  bigfish.splice(0,1);

}

​

function draw() {

  noStroke();

  //draw grid background

  background(150);

  push();

  rectMode(CENTER);

  patternAngle(0);

  patternColors([color(255,200), color(0,200)]);

  pattern(PTN.cross(height/12, 4));

  rectPattern(width*0.5,height*0.6,width,1.2*height);

  pop();

  //draw human head

  head.show();

  head.eyemove();

  //draw table

  fill(80);

  patternAngle(PI/5);

  patternColors([color(0), color(255)]);

  pattern(PTN.stripe(height/10));

  rectPattern(0,height*0.6,width,height*0.4);

  //make the background darker to highlight fishes

  fill(0,130);

  rect(0,0,width,height);

  //draw fish bowl

  push();

  translate(width/2,height*0.97-bowlH*0.5);

  fill(0,80,255,55);

  arc(0, 0, bowlW, bowlH, -PI*0.25, PI*1.25, CHORD);//bowl

  fill(0,220);

  arc(0, 0, bowlW, bowlH, - PI*0.1, PI*1.1, CHORD);//water

  pop();

  //draw bigfish

  for (var r=0;r<bigfish.length;r++){

    bigfish[r].move();

    bigfish[r].show();

  }

  //draw goldfish

  for (var i=0;i<goldfish.length;i++){

    goldfish[i].show();

    goldfish[i].move();

  }

  //draw fishcandy

   for (var j=0;j<fishcandy.length;j++){

    fishcandy[j].show();

    fishcandy[j].move();

  }

  //draw the bowl again

  push();

  translate(width/2,0.97*height-bowlH*0.5);

  fill(0,80,250,30);

  arc(0, 0, bowlW, bowlH, -PI*0.25, PI*1.25, CHORD);//bowl

  pop();

}

​

////fish class///

function Fish(x,y,size,pnum,target){

  this.pos = createVector(x,y);

  this.behavior1 = true;

  this.behavior2 = false;

  this.behavior3 = false;

  this.vel = createVector(0,0);

  this.dir = createVector(1,0).normalize();

  let flip = [-1,1];

  this.flip = random(flip);

  this.size = size;

  this.pattern = fishpattern[pnum];

  this.targetSpeed = random(3,8)

  this.targetIndex = 0;

  if(this.pattern == fishpattern[0]){

    this.col1 = color(255, 90, 0); 

    this.col2 = color(255, 191, 0); 

  }

  if(this.pattern == fishpattern[1]){

    this.col1 = color(255, 102, 204); 

    this.col2 = color(0,220,200); 

  }

  if(this.pattern == fishpattern[2]){

    this.col1 = color(4, 60, 214); 

    this.col2 = color(240, 210, 0); 

  }

  if(this.pattern == fishpattern[3]){

    this.col1 = color(220); 

    this.col2 = color(20); 

  }

  this.move = function(){

    if(this.behavior1 == true){

       if(this.pos.y < height*0.3){

       this.vel.y += gravity;

     }else {

       this.vel.y -= resist;

     }

     if(this.vel.y <= 0){

       this.behavior1 = false;

       this.behavior2 = true;

     }

      this.dir = createVector(1,0).normalize();

    }

    if(this.behavior2 == true){

      if(abs(this.vel.x)<1 || abs(this.vel.x)>3){

        this.vel.x = -this.flip*random(1,3);

      }else{

        this.vel.x = this.vel.x;

      }

      if(abs(this.vel.y)<0.5 || abs(this.vel.y)>2){

        this.vel.y = random(0.5,2);

      }else{

        this.vel.y = this.vel.y;

      }

      if(this.pos.x <= width*0.5 - bowlW*0.5 + height*0.3){

       if(this.vel.x<0){

         this.vel.x = -this.vel.x;

       }else{

         this.vel.x = this.vel.x;

       }

      }

      if(this.pos.x >= width*0.5 + bowlW*0.5 - height*0.3){

       if(this.vel.x>0){

          this.vel.x = -this.vel.x;

        }else{

          this.vel.x = this.vel.x;

        }

      }

      if(this.pos.y >= 0.8*height){

       if(this.vel.y>0){

          this.vel.y = -this.vel.y;

        }else{

          this.vel.y = this.vel.y;

        }

      }

      if(this.pos.y <= 0.35*height){

       if(this.vel.y<0){

          this.vel.y = -this.vel.y;

        }else{

          this.vel.y = this.vel.y;

        }

      }

    }

   if(target.length>=1 && this.behavior1==false){

      this.behavior2 = false;

      this.behavior3 = true;

    }

   if(target.length==0 && this.behavior1==false){

      this.behavior2 = true;

      this.behavior3 = false;

    }

    if(this.behavior3 == true){

     var targetDist = [];

     for(var j=0;j<target.length;j++){

      targetDist.push(p5.Vector.dist(this.pos,target[j].pos));

    }

      for(var k=0; k<target.length;k++){

       if(p5.Vector.dist(this.pos,target[k].pos)==min(targetDist)){

         this.targetIndex = k;

       }

     }

      this.dir = p5.Vector.sub(target[this.targetIndex].pos, this.pos).normalize();

      this.vel = this.dir.mult(this.targetSpeed);

      if(min(targetDist)<10){

         target.splice(this.targetIndex,1);

         targetDist.splice(this.targetIndex,1);

         }

    }

    //flip fish depending on velX

    if(this.vel.x>0){

      this.flip = -1;

    }else if(this.vel.x<0){

      this.flip = 1;

    }

    this.pos.add(this.vel);

  }

  this.show = function(){

    push();

    translate(this.pos);

    scale(this.size);

    scale(this.flip,1);

    //draw fin and tail

    this.col1.setAlpha(180);

    fill(this.col1);

    triangle(-height*0.014,-height*0.027,height*0.032+random(-2,2),-height*0.043+random(-2,2),height*0.05,0);

    triangle(0,0,height*0.01+random(-3,3),height*0.04+random(-3,3),height*0.05+random(-3,3),height*0.035+random(-3,3))

    quad(height*0.02,-height*0.01,height*0.12+random(-5,5),-height*0.038+random(-5,5),height*0.1+random(-5,5),height*0.01+random(-5,5),height*0.1+random(-5,5),height*0.045+random(-5,5));

    //draw fish body

    this.col1.setAlpha(255);

    ellipse(0,0,height*0.11,height*0.055) 

    patternAngle(PI/2);

    patternColors([this.col1, this.col2]);

    pattern(this.pattern);

    ellipsePattern(0,0,height*0.11,height*0.055)

    //draw fish eye

    fill(255);

    ellipse(-height*0.033,0,height*0.015);//eye white

    fill(0);

    ellipse(-height*0.033,0,height*0.009);//eye black

    pop();

  }

}

​

////candy class////

//Star-reference from: https://p5js.org/examples/form-star.html

function Candy(x, y, radius1, radius2, npoints) {

  this.pos = createVector(random(0.5*width-0.35*height,0.5*width+0.35*height),random(0,0.3*windowHeight));

  this.vel = createVector(0,0);

  this.move = function(){

       if(this.pos.y < height*0.3){

       this.vel.y += gravity;

     }else {

       this.vel.y -= resist;

     }

     if(this.vel.y <= 0){

       this.vel.y = 0;

     }

      this.pos.add(this.vel);

  }

  this.show = function(){

    let angle = TWO_PI / npoints;

    let halfAngle = angle / 2.0;

  fill(255);

  push();

  translate(this.pos);

  rotate(frameCount / 10.0);

  beginShape();

  for (let a = 0; a < TWO_PI; a += angle) {

    let sx = x + cos(a) * radius2;

    let sy = y + sin(a) * radius2;

    vertex(sx, sy);

    sx = x + cos(a + halfAngle) * radius1;

    sy = y + sin(a + halfAngle) * radius1;

    vertex(sx, sy);

  }

  endShape(CLOSE);

  pop();  

  }

}

​

////head class////

function Head(){

  this.eyeX=0;

  this.eyeVX=1;

  this.eyemove=function(){

  if(this.eyeX > windowHeight*0.05 || this.eyeX < -windowHeight*0.05){

    this.eyeVX = - this.eyeVX

  }

    this.eyeX += this.eyeVX;

  }

  this.show=function(){

  //draw hair

  push();

  rectMode(CENTER);

  fill(0);

  rect(width*0.5,height*0.5,height*0.9,height*1.3,height*0.38);

  pop();

  //draw face

  push();

  rectMode(CENTER);

  translate(width*0.5,height*0.45);

  fill(255);

  rect(0, 0, height*0.65, height*0.5, 0, 0, height*0.3, height*0.3);

  pop();

  //draw eyes white

  push();

  stroke(0);

  strokeWeight(2.5);

  fill(255);

  translate(-height*0.15,height*0.27);

  ellipse(width*0.5,0,height*0.2,height*0.025);

  translate(height*0.3,0);

  ellipse(width*0.5,0,height*0.2,height*0.025);

  pop();

  //draw eyes black

  push();

  fill(0);

  translate(this.eyeX,0);

  translate(-height*0.15,height*0.275);

  ellipse(width*0.5,0,height*0.02);

  translate(height*0.3,0);

  ellipse(width*0.5,0,height*0.02);

  pop();  

  }

}

​