​

//add a fast moving clock to show the passage of time

​

//midterm project idea

//garden game where you choose plant and plant them and water them

//

let bgs = [];

let tiles = [];

let seeds = [];

let plants = [];

let seedsX = [];

let seedsY = [];

let clickedSeed = -1;

let currentBg = 0;

let planterX = [];

let planterY = [];

let plantObjects = [];

let seedInHand = false;

let drops = [];

let start = false;

let myFont;

let titleIMG;

let butterflyIMG;

let buttonPressed = false;

let restartbutton;

let cx, cy;

let minutesRadius;

let hoursRadius;

let clockDiameter;

let minute = 0;

let hour = 6;

let filledPlanters = [];

let planttext = false;

let planttextctr = 0;

let frame = 0;

let mybutterfly = [];

let animalframe;

let dirt;

let frameSinceStart = 0;

let rainSound;

let clickSound;

let sparkleSound;

let plantSound;

let bgMusic;

let isWatering = false;

index = 0;

​

// Define the Plant class

class Plant {

  constructor(planter, plantchoice) {

    this.planter = planter; // Set the planter ID

    this.plantchoice = plantchoice; // Set the plant choice ID

    this.progress = []; // Create an array to store the plant's growth stages

    this.currentStage = 0; // Set the current stage to 0

    this.getSprites(); // Load the sprites for the plant growth stages

  }

  // Get the planter ID

  getPlanter() {

    return this.planter;

  }

​

  // Load the sprites for the plant growth stages

  getSprites() {

    let counter = 0;

    for (let j = 0; j < 4; j++) {

      for (let i = 0; i < 2; i++) {

        this.progress[counter] = plants[this.plantchoice].get(

          i * 32,

          j * 32,

          32,

          32

        );

        counter++;

      }

    }

  }

​

  // Display the current stage of the plant

  display() {

    image(

      this.progress[this.currentStage],

      planterX[this.planter] - 16,

      planterY[this.planter] - 28

    );

  }

​

  // Increment the plant's growth stage

  incrementStage() {

    if (this.currentStage < 6) {

      this.currentStage++;

    } else {

      sparkleSound.play();

    }

  }

}

​

// Define the Water class

class Water {

  constructor(x,y,lowerlimit,upperlimit) {

    this.x = x + random(-15,15); // Set the x position with random deviation

    this.y = y; // Set the y position

    this.initialY = y; // Store the initial y position

    this.upperlimit = upperlimit; // Set the upper limit for the water droplet

    this.lowerlimit = lowerlimit; // Set the lower limit for the water droplet

    this.ySpeed = random(1, 5); // Set the y speed with random deviation

    this.fell = false; // Set the "fell" flag to false

  }

  // Display the water droplet

  display() {

    if(this.y>this.lowerlimit){

      strokeWeight(1);

      stroke(66, 173, 255);

      line(this.x, this.y, this.x, this.y + random(1, 5));

    }

  }

  // Apply gravity to the water droplet

  gravity() {

    this.y += this.ySpeed;

​

    if (this.y > this.upperlimit) {

      this.fell = true;

    }

  }

​

  // Check if the water droplet has fallen

  isDead() {

    return this.fell;

  }

 }

​

// Define a class called Butterfly

class Butterfly {

  // Constructor function with parameters for direction, x position, and y position

  constructor(direction, x, y){

    this.direction = direction; // Set the direction property to the direction parameter

    this.x = x; // Set the x property to the x parameter

    this.y = y; // Set the y property to the y parameter

    this.xSpeed; // Initialize the xSpeed property

    this.ySpeed; // Initialize the ySpeed property

    this.sprites = []; // Initialize the sprites array property

    this.getSprites(); // Call the getSprites method to populate the sprites array

  }

  // Method to populate the sprites array based on the direction property

  getSprites() {

    let row;

    if (this.direction == 0){

      row = 0;

      this.xSpeed=0;

      this.ySpeed=-1;

    }

    else if (this.direction == 1) {

      row = 32;

      this.xSpeed=1;

      this.ySpeed=0;

    }

    else if (this.direction == 2) {

      row = 64;

      this.xSpeed=0;

      this.ySpeed=1;

    }

    else {

      row = 96;

      this.xSpeed=-1;

      this.ySpeed=0;

    }

    let counter = 0;

    for (let i = 0; i < 3; i++) {

      this.sprites[counter] = butterflyIMG.get(i * 16, row, 16, 16);

      counter++;

    }

    this.sprites.push(this.sprites[1]);

  }

  // Method to display the butterfly on the canvas

  display(frame) {

    frame = int(frame);

    image(this.sprites[frame], this.x, this.y);

    this.x += this.xSpeed;

    this.y += this.ySpeed;

  }

  // Method to check if the butterfly is out of bounds

  isDead() {

    if (this.x>567) {

      return true;

    }

    else if(this.x<-16) {

      return true;

    }

    else if(this.y>324) {

      return true;

    }

    else if(this.y<-16) {

      return true;

    }

    else {

      return false;

    }

  }

}

​

// Preload function that loads all the necessary images and sounds

function preload() {

  // Background images

  bgs[0] = loadImage("8.png");

  bgs[1] = loadImage("1.png");

  bgs[2] = loadImage("2.png");

  bgs[3] = loadImage("3.png");

  bgs[4] = loadImage("4.png");

  bgs[5] = loadImage("6.png");

  bgs[6] = loadImage("7.png");

  bgs[7] = loadImage("5.png");

​

  // Seeds image

  seedsimg = loadImage("seeds.png");

​

  // Plant images

  plants[0] = loadImage("000.png");

  plants[1] = loadImage("001.png");

  plants[2] = loadImage("002.png");

  plants[3] = loadImage("003.png");

  plants[4] = loadImage("004.png");

  plants[5] = loadImage("005.png");

  plants[6] = loadImage("006.png");

  plants[7] = loadImage("007.png");

​

  // Font

  myFont = loadFont('zx-spectrum.ttf');

​

  // Title image

  titleIMG = loadImage("Zen Garden.png");

​

  // Butterfly image

  butterflyIMG = loadImage("butterfly_0.png");

​

  // Restart button image

  restartbutton = loadImage('restartbutton.png');

​

  // Dirt image

  dirt = loadImage("dirt.png");

​

  // Sound formats

  soundFormats('mp3');

​

  // Rain sound

  rainSound = loadSound('river-stream-05-99181.mp3');

​

  // Click sound

  clickSound = loadSound('lclick-13694.mp3');

​

  // Sparkle sound

  sparkleSound = loadSound('sound-effect-twinklesparkle-115095.mp3');

​

  // Plant sound

  plantSound = loadSound('water_drop-6707.mp3');

​

  // Background music

  bgMusic = loadSound('just-relax-11157 (mp3cut.net).mp3');

}

​

// Function that gets the seed images from the seeds image

function getSeeds() {

  let counter = 0;

  for (let i = 0; i < 4; i++) {

    for (let j = 0; j < 2; j++) {

      seeds[counter] = seedsimg.get(i * 16, j * 16, 16, 16);

      counter++;

    }

  }

}

​

function displaySeeds() {

  // set the space between seeds

  let spacebetween = 15;

  // set the space from the top of the canvas

  let spacefromtop = 100;

​

  // loop through the seeds array

  for (let i = 0; i < 8; i += 2) {

    // display the first seed in the pair

    image(seeds[i], 17, i * spacebetween + spacefromtop);

    // display the second seed in the pair

    image(seeds[i + 1], 44, i * spacebetween + spacefromtop);

    // store the x-coordinate of the first seed in the pair

    seedsX[i] = 17 + 4;

    // store the y-coordinate of the first seed in the pair

    seedsY[i] = i * spacebetween + spacefromtop + 4;

    // store the x-coordinate of the second seed in the pair

    seedsX[i + 1] = 44 + 4;

    // store the y-coordinate of the second seed in the pair

    seedsY[i + 1] = i * spacebetween + spacefromtop + 4;

  }

}

​

function getPlanters() {

  // calculate the total x distance for each planter

  let diff = 510 - 130;

  // set the number of planters per row

  let num = 6;

  // the quotient is the total surface divided by number of planters

  let quotient = int(diff / num);

  let counter = 0;

  // loop through the rows of planters

  for (let j = 0; j < 3; j++) {

    // loop through the planters in each row

    for (let i = 0; i < num; i++) {

      // store the x-coordinate of the planter

      planterX[counter] = 130 + quotient / 2 + i * quotient;

      // store the y-coordinate of the planter

      planterY[counter] = 70 + j * 100;

      // increment the counter

      counter++;

    }

  }

}

​

function setup() {

  createCanvas(567, 324); // create a canvas with dimensions 567 x 324

  image(bgs[0], 0, 0); // display the first image in the bgs array at coordinates (0, 0) on the canvas

​

  getPlanters(); // call the getPlanters() function to set planter coordinates

​

  let radius = 30; // set the radius of the clock to 30

  minutesRadius = radius * 0.6; // set the radius for the minutes indicator

  hoursRadius = radius * 0.5; // set the radius for the hours indicator

  clockDiameter = radius * 1.7; // set the diameter of the clock

  cx = 40; // set the x-coordinate of the clock center

  cy = 50; // set the y-coordinate of the clock center

​

  animalframe = int(random(1200,1400)); // set a random value for animalframe between 1200 and 1400

​

  dirt.resize(419,235); // resize the dirt image to fit the canvas

​

  bgMusic.setVolume(0.2); // set the volume for the background music

  bgMusic.loop(); // loop the background music

​

  plantSound.setVolume(0.7); // set the volume for the plant sound effect

​

  rainSound.setVolume(0.5); // set the volume for the rain sound effect

}

​

function displayDirt() {

  for (let x=0;x<18;x++) {

    noStroke();

    fill(255, 255, 255, 150);

    rect(planterX[x]-25,planterY[x]-50, 50, 50, 10);

  }

  image(dirt, 110,70);

  //THIS WHOLE THING TURN INTO AN IMAGE, ELIMINATE LOOPS

  // image(tiles[0], 110, 70);

  // image(tiles[0], 110, 170);

  // image(tiles[0], 110, 270);

  // let ctr = 0;

  // for (let i = 0; i < 250; i += 100) {

  //   for (let j = 35; j < 380; j += 35) {

  //     let num = int(random(1, 4));

  //     image(tiles[dirtRandom[ctr]], 110 + j, 70 + i);

  //     ctr++;

  //   }

  // }

  // image(tiles[4], 494, 70);

  // image(tiles[4], 494, 170);

  // image(tiles[4], 494, 270);

}

​

function draw() {

  if(start){

    frameSinceStart++;

    // resizeTiles();

    getSeeds();

    redrawBg();

    if (frameSinceStart % 980 == 0) {

      changeBG();

    }

​

    // displaySeeds();

    // displayDirt();

    restartbutton.resize(40,40);

    image(restartbutton, 20, 240);

    strokeWeight(5);

    stroke(237, 34, 93);

    fill(244, 122, 158);

    ellipse(cx, cy, clockDiameter, clockDiameter);

    minute+=0.5;

    if(minute%120==0) {

      // console.log(minute, int(minute), hour);

      hour++;

    }

    let m = map(minute, 0, 120, 0, TWO_PI) - HALF_PI;

    let h = map(hour, 0, 24, 0, TWO_PI * 2) - HALF_PI;

​

    // Draw the hands of the clock

    stroke(255);

    strokeWeight(1);

    line(cx, cy, cx + cos(m) * minutesRadius, cy + sin(m) * minutesRadius);

    strokeWeight(2);

    line(cx, cy, cx + cos(h) * hoursRadius, cy + sin(h) * hoursRadius);

​

    for (let i = 0; i < seeds.length; i++) {

      if (clickedSeed == i) {

        image(seeds[clickedSeed], mouseX - 10, mouseY - 10);

      }

    }

​

    for (let i = 0; i < plantObjects.length; i++) {

      plantObjects[i].display();

    }

    let distance3 = dist(mouseX, mouseY, 40, 260);

    if (distance3 < 20) {

      cursor(HAND);

    } else {

      cursor(ARROW);

    }

      // console.log("hello");

​

    if(mybutterfly.length<1){

      if (frameCount%animalframe==0){

        let butterflychoice = int(random(0,5));

        if (butterflychoice == 0){ //down up

          mybutterfly.push(new Butterfly(butterflychoice,random(100,450),324));

        }

        else if (butterflychoice == 1) { //left right

          mybutterfly.push(new Butterfly(butterflychoice,0,random(60,300)));

        }

        else if (butterflychoice == 2) { //up down

          mybutterfly.push(new Butterfly(butterflychoice,random(100,450),0));

        }

        else { //right left

          mybutterfly.push(new Butterfly(butterflychoice,567,random(60,300)));

        }

        // console.log(mybutterfly.length);

      }

    }

    else{

      if(!mybutterfly[0].isDead()){

        mybutterfly[0].display(frame%4);

        // console.log(frame%4, frame);

        frame+=0.2;

        if (frame>4) {

          frame=0;

        }

      }

      else {

        mybutterfly.splice(0,mybutterfly.length);

        animalframe = int(1200,1400);

      }

    }

    if(planttext) {

      noStroke();

      fill('red');

      textFont(myFont);

      textSize(8);

      text('THERE IS ALREADY A PLANT IN THERE!', 170, 300);

      planttextctr += 1;

      if(planttextctr>200){

        planttextctr=0;

        planttext=false;

      }

    }

​

    if(mouseIsPressed) {

      if(!seedInHand) {

          if(mouseX>110) {

            if(mouseY>14 && mouseY<70)

              {

              if(!isWatering) {rainSound.loop();}

              // console.log("0 70");

              for (let i = 0; i < 3; i++) {

                drops.push(new Water(mouseX, mouseY, 14, 70));

              }

            }

            else if(mouseY>114 && mouseY<170)

              {

                if(!isWatering) {rainSound.loop();}

                // console.log("70 170");

                for (let i = 0; i < 3; i++) {

                  drops.push(new Water(mouseX, mouseY, 114, 170));

                }

              } 

            else if(mouseY>214 && mouseY<270)

              {

                if(!isWatering) {rainSound.loop();}

                // console.log("170 270");

                for (let i = 0; i < 3; i++) {

                  drops.push(new Water(mouseX, mouseY, 214, 270));

                }

              } 

        }

        for (let i = 0; i < plantObjects.length; i++) {

          let Xcoor = planterX[plantObjects[i].getPlanter()];

          let Ycoor = planterY[plantObjects[i].getPlanter()]-28;

          // console.log(Xcoor,Ycoor)

          let distance = dist(mouseX, mouseY, Xcoor, Ycoor);

          if(distance<28){

            if(frameCount%70==0){

              plantObjects[i].incrementStage();

            }

          }

        }

        for (let i = 0; i<drops.length; i++) { 

          isWatering = true;

          drops[i].display();

          drops[i].gravity();

          if(drops[i].isDead()) { 

            drops.splice(i,1);

          }

        }

        // for (let d of drops) {

        //   d.display();

        //   d.gravity();

        // }

        // if (frameCount%150==0) {

      }

    } else {

      isWatering = false;

      rainSound.stop();

    }

  } else {

    image(bgs[0], 0, 0);

    titleIMG.resize(570, 400);

    image(titleIMG,0,-40);

    strokeWeight(5);

    stroke("#8A61DB");

    fill("#AB86F5");

    circle(280,230,65);

    noStroke();

    fill(255);

    triangle(270,215,295,230,270,245);

    let distance = dist(mouseX, mouseY, 30, 30);

    if(distance<15) {

      noStroke();

      fill(254, 210, 198, 230);

      rect(50, 50, width-100, 140, 10);

      fill('#584665');

      textFont(myFont);

      textSize(8);

      // text('HELLO MY NAME IS HANA', 60, 70);

      getSeeds();

      image(seeds[0], 70, 60);

      text('PICK A SEED AND DRAG IT FROM THE LEFT ONTO', 90, 70);

      text('THE LAND TO THE RIGHT TO PLANT IT.', 60, 90);

      let plantimg = plants[0].get(0, 96, 32, 32);

      plantimg.resize(24,24);

      image(plantimg, 65, 92);

      text('TO WATER THE PLANT, HOLD YOUR MOUSE DOWN OVER', 90, 110);

      text('THE NEAR PLANT AREA.', 60, 130);

      image(butterflyIMG.get(0, 0, 16, 16), 70, 140);

      text('CREATE THE GARDEN OF YOUR DREAMS, AND ENJOY', 90, 150);

      text('LITTLE VISITS ALONG THE WAY.', 60, 170);

    }

    if(mouseIsPressed){

      let distance2 = dist(mouseX, mouseY, 280,230);

​

      if (distance2<32) {

        strokeWeight(5);

        stroke("#5E17EB");

        fill("#5E17EB");

        circle(280,230,65);

​

        noStroke();

        fill("#AB86F5");

        triangle(270,215,295,230,270,245);

        buttonPressed=true;

        cursor(HAND);

        } else {

          cursor(ARROW);

        }

    }

  }

}

​

function changeBG() {

  index = (index + 1) % 8;

  // image(bgs[index], 0, 0);

  currentBg = index;

​

  noStroke();

  fill(255, 255, 255, 150);

  rect(10, 10, 60, 304, 10);

}

function mousePressed() {

  // check distance between mouse position and each seed position

  if(start){

    for (let i = 0; i < seeds.length; i++) {

      let distance = dist(mouseX, mouseY, seedsX[i], seedsY[i]);

      // if distance is less than seed radius, the mouse was pressed on the seed

      if (distance < 8) {

        seedInHand = true;

        clickedSeed = i;

        // console.log("Clicked on seed #" + (i + 1));

      }

    }

    let distance2 = dist(mouseX, mouseY, 40, 260);

    // console.log(distance2);

    // restartbutton.resize(40,40);

    // image(restartbutton, 20, 240);

    if (distance2 < 20) {

      filledPlanters.splice(0, filledPlanters.length);

      plantObjects.splice(0, plantObjects.length);

    }

  }

}

​

function mouseReleased() {

  if(!start && buttonPressed) {

    start=true;

  }

  if(isWatering){

    rainSound.stop();

    isWatering = false;

  }

  drops.splice(0,drops.length);

​

  if(seedInHand){

    for (let i = 0; i < planterX.length; i++) {

      let distance = dist(mouseX, mouseY, planterX[i], planterY[i]);

      // if distance is less than seed radius, the mouse was pressed on the seed

      if (distance < 28) {

        let planterfound = false;

        if(filledPlanters.length>0){

          // console.log("in loop");

          for (let j = 0; j < filledPlanters.length; j++) {

            // console.log("in loop2");

            if (i==filledPlanters[j]) {

              // console.log(i, filledPlanters[j]);

              //text "there is already a plant in there!"

              planttext = true;

              planterfound = true;

            }

          }

        }

        if (!planterfound){

            // console.log("Clicked on planter #" + (i + 1));

            // console.log(distance);

            let myplant = new Plant(i, clickedSeed);

            plantObjects.push(myplant);

            filledPlanters.push(i);

            plantSound.play();

            // console.log("planters list: ", filledPlanters.length, i);

          }

        // clickedSeed = i;

        // myplant.display();

      }

    }

  }

  clickedSeed = -1; // reset the clicked seed when the mouse is released

  seedInHand = false;

}

​

function redrawBg() {

  image(bgs[currentBg], 0, 0);

  noStroke();

  fill(255, 255, 255, 150);

  rect(10, 10, 60, 304, 10);

  displaySeeds();

  displayDirt();

}

​

function mouseClicked() {

  // check if the mouse is over the clickable area

  let distance = dist(mouseX, mouseY, 280, 230);

  if (distance < 32) {

    // play the click sound

    clickSound.play();

  }

  let distance2 = dist(mouseX, mouseY, 40, 260);

    if (distance2 < 20) {

      clickSound.play();

    }

}

​