let state = "gathering"

let expanding = true;

let speed = 1;

let max = 150;

let min = 120

​

let mugwortClicks = 0;

let treeofheavenClicks = 0;

let purslandClicks = 0;

​

let mugwort;

let treeofheaven;

let purslane;

​

function preload(){

  mugwort = loadImage('mugwort.png');

  purslane = loadImage('purslane.png');

  treeofheaven = loadImage('treeofheaven.png');

}

function setup() {

  createCanvas(windowWidth, windowHeight);

  imageMode(CENTER);

  textAlign(CENTER);

  textSize(width/30);

}

​

function draw() {

  background(220);

  if(state == "gathering"){

    /* animation code here*/

    if(expanding == true){

      imageSize = imageSize + speed;

      if(imageSize > max){

        expanding = false;

      }

    } else if(expanding == false){

      imageSize = imageSize - speed;

      if(imageSize < min){

        expanding = true;

      }

    }

    /* end animation code here*/

    image(purslane, width/8,height/8, imageSize, imageSize)

    image(mugwort, width - width/8, height - height/8, imageSize, imageSize)

    image(treeofheaven, width - width/8, height/8, imageSize, imageSize) 

    text("forage plants until \ntincture is complete", width/2, height/2);

  text("purslane: "+ purslaneClicks, width/8, height - height/8);

  text("treeofheaven: "+ treeofheavenClicks, width/8, height - height/8 +20);

    text("mugwort: "+ mugwortClicks, width/8, height - height/8 +40);

  }

}

​

function mousePressed(){

  /*when someone clicks anywhere of the canvas*/

  if(state == "gathering"){

    if(dist(mouseX, mouseY,width/8, height/8) < 50){

      purslaneClicks = purslaneClicks + 1;

    } else 

    if(dist(mouseX, mouseY,width/8, height/8) < 50){

      mugwortClicks = mugwortClicks + 1;

  }

  }

}