/* Shoutout to Olivier Brückner for the troubleshooting help! */ 

​

let sceneNum = 0;

let capture;

let t1 = 'Plant Ping';

let b1 = 'Plant Ping is an experimental camera designed by Wesley Chau. The camera is designed for the voiceless house plant. The human is not prioritized.';

let b2 = 'Instructions: Point the camera towards the plant and double click to reveal a secret message.';

let cont = 'Continue';

let allow = 'Allow';

let deny = 'Deny';

let home = 'Home';

let change = 'Turn off camera';

let d1 = 'Disclaimer! Plant Ping would like to access the camera.';

let allow2 = 'Turn camera ON to see what your plant is trying to tell you.';

let deny2 = 'Turn camera OFF and see example instead.'

let msgArr = ["Vibing", "Do I have your attention?", "Feeling thirsty", "Talk to me", "Found my light", "Due for a soil change soon", "Feeling lonely", "Is it me or does the air feel dry?", "I miss when you sing to me", "Need a trim", "I know your darkest secrets", "Photosynthesizing"];

let txt;

let points = [];

let img;

​

function preload() {

  img = loadImage('assets/plants_blur.jpg');

  img2 = loadImage('assets/plants.jpg');

}

​

function setup() {

  createCanvas(640, 480);

  capture = createCapture(VIDEO);

  capture.size(640, 480);

  capture.hide();

  pixelDensity(2);

  noStroke();

  txt = "";

}

​

function draw() {

​

  switch (sceneNum) {

    case 0:

      scene0(); // TITLE+DESCRIPTION

      break;

    case 1:

      scene1(); // DISCLAIMER

      break;

    case 2:

      scene2(); // NO CAMERA

      break;

    case 3:

      scene3(); // CAMERA ON

      break;

  }

​

}

​

function scene0() { //TITLE + DESCRIPTION

  image(img, 0, 0);

  // console.log('scene 0');

​

  noFill();

  stroke(0);

  strokeWeight(2);

  rect(10, 10, width - 20, height - 20);

  push();

  textAlign(CENTER);

  noStroke();

  textSize(22);

  textFont('Helvetica');

  fill(0);

  text(t1, width / 4, height / 2);

  pop();

  rect(width / 2, 10, (width - 20) / 2, 410);

  rect(width / 2, 220, (width - 20) / 2, 200);

  push();

  noStroke();

  textSize(16);

  textAlign(LEFT);

  textFont('Helvetica');

  fill(0);

  text(b1, 350, 70, 260);

  text(b2, 350, 290, 260);

  pop();

  rect(width / 2, 420, (width - 20) / 2, 50);

  push();

  textAlign(CENTER);

  noStroke();

  textSize(22);

  textFont('Helvetica');

  fill(0);

  text(cont, 350, 435, 260);

  pop();

​

  if (mouseX < width - 10 && mouseX > width / 2 && mouseY < height - 10 && mouseY > 420) { //HOVER

    push();

    fill(115, 230, 0, 90);

    rect(width / 2, 420, (width - 20) / 2, 50);

    textAlign(CENTER);

    noStroke();

    textSize(22);

    textFont('Helvetica');

    fill(0);

    text(cont, 350, 435, 260);

    pop();

  }

​

​

}

​

function scene1() { //DISCLAIMER

  image(img, 0, 0);

  // console.log('scene 0');

​

  noFill();

  stroke(0);

  strokeWeight(2);

  rect(10, 10, width - 20, height - 20);

  push();

  noStroke();

  textSize(22);

  textAlign(CENTER);

  textFont('Helvetica');

  fill(0);

  text(d1, 100, 180, 440);

  pop();

  rect(10, 420, (width - 20) / 2, 50);

  push();

  textAlign(CENTER);

  noStroke();

  textSize(22);

  textFont('Helvetica');

  fill(0);

  text(deny, 40, 435, 260);

  pop();

  rect(width / 2, 420, (width - 20) / 2, 50);

  push();

  textAlign(CENTER);

  noStroke();

  textSize(22);

  textFont('Helvetica');

  fill(0);

  text(allow, 350, 435, 260);

  pop();

​

  if (mouseX > 10 && mouseX < width / 2 && mouseY < height - 10 && mouseY > 420) { //HOVER

    push();

    fill(255, 0, 0, 60);

    rect(10, 420, (width - 20) / 2, 50);

    textAlign(CENTER);

    noStroke();

    textSize(22);

    textFont('Helvetica');

    fill(0);

    text(deny, 40, 435, 260);

    textSize(16);

    text(deny2, 70, 350, 200);

    pop();

    push();

    strokeWeight(2);

    line(165, 390, 165, 420);

    pop();

  }

​

  if (mouseX < width - 10 && mouseX > width / 2 && mouseY < height - 10 && mouseY > 420) { //HOVER

    push();

    fill(115, 230, 0, 90);

    rect(width / 2, 420, (width - 20) / 2, 50);

    textAlign(CENTER);

    noStroke();

    textSize(22);

    textFont('Helvetica');

    fill(0);

    text(allow, 350, 435, 260);

    textSize(16);

    text(allow2, 355, 350, 240);

    pop();

    push();

    strokeWeight(2);

    line(475, 390, 475, 420);

    pop();

  }

​

}

​

function scene2() { //DEFAULT IMAGE

  image(img2, 0, 0);

  // console.log('scene 2');

  noFill();

  stroke(0);

  strokeWeight(2);

  // rect(10, 10, width - 20, height - 20);

  drawPoints(); //draws point and text statement  

  rect(560, 435, 70, 35);

  push();

  textAlign(LEFT);

  noStroke();

  textSize(16);

  textFont('Helvetica');

  fill(0);

  text(home, 575, 445, 260);

  pop();

​

  if (mouseX < width - 10 && mouseX > 560 && mouseY < height - 10 && mouseY > 435) { //HOVER

    push();

    fill(255, 90);

    rect(560, 435, 70, 35);

    textAlign(LEFT);

    noStroke();

    textSize(16);

    textFont('Helvetica');

    fill(0);

    text(home, 575, 445, 260);

    pop();

  }

​

​

}

​

function scene3() { //EXPERIMENTAL CAMERA

  push();

  translate(width, 0);

  scale(-1, 1);

  image(capture, 0, 0, width, height); //draws video on canvas

  capture.loadPixels();

  pop();

  drawPoints(); //draws point and text statement

​

  rect(10, 435, 135, 35);

  push();

  textAlign(LEFT);

  noStroke();

  textSize(16);

  textFont('Helvetica');

  fill(0);

  text(change, 20, 445, 260);

  pop();

  rect(560, 435, 70, 35);

  push();

  textAlign(LEFT);

  noStroke();

  textSize(16);

  textFont('Helvetica');

  fill(0);

  text(home, 575, 445, 260);

  pop();

​

  if (mouseX < width - 10 && mouseX > 560 && mouseY < height - 10 && mouseY > 435) { //HOVER

    push();

    fill(255, 90);

    rect(560, 435, 70, 35);

    textAlign(LEFT);

    noStroke();

    textSize(16);

    textFont('Helvetica');

    fill(0);

    text(home, 575, 445, 260);

    pop();

  }

​

  if (mouseX > 10 && mouseX < 145 && mouseY < height - 10 && mouseY > 435) { //HOVER

    push();

    fill(255, 0, 0, 60);

    rect(10, 435, 135, 35);

    textAlign(LEFT);

    noStroke();

    textSize(16);

    textFont('Helvetica');

    fill(0);

    text(change, 20, 445, 260);

    pop();

  }

}

​

function mousePressed() {

  if (mouseX < width - 10 && mouseX > width / 2 && mouseY < height - 10 && mouseY > 420 && sceneNum === 0) { 

    sceneNum++;

  } else if (mouseX < width - 10 && mouseX > width / 2 && mouseY < height - 10 && mouseY > 420 && sceneNum === 1) { // Go to Camera

    sceneNum = 3;

    points = [];

  } else if (mouseX < width - 10 && mouseX > 560 && mouseY < height - 10 && mouseY > 435 && sceneNum === 2) { // Default to Home

    sceneNum = 0;

  } else if (mouseX > 10 && mouseX < 145 && mouseY < height - 10 && mouseY > 435 && sceneNum === 3) { // Turn off camera use default

    sceneNum = 2;

    points = [];

  } else if (mouseX < width - 10 && mouseX > 560 && mouseY < height - 10 && mouseY > 435 && sceneNum === 3) { //Camera to Home

    sceneNum = 0;

  } else if (mouseX > 10 && mouseX < width / 2 && mouseY < height - 10 && mouseY > 420 && sceneNum === 1) { // Go to Default

    sceneNum = 2;

    points = [];

  }

}

​

function doubleClicked() {

  addPoint(mouseX, mouseY);

}

​

function addPoint(xPos, yPos) { // draws new point at any given x,y on the canvas with new random message

​

  let newPoint = {

    x: xPos,

    y: yPos,

    txt: msgArr[int(random(msgArr.length))]

  }

​

  points.push(newPoint);

}

​

function drawPoints() {

​

  textSize(16);

  textAlign(LEFT);

​

  push();

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

    stroke(0);

    strokeWeight(1);

    fill(255, 255, 0);

    circle(points[i].x, points[i].y, 6);

  }

  pop();

​

  push();

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

    fill(255, 255, 0);

    stroke(0);

    strokeWeight(2.5);

    textStyle(ITALIC);

    text(points[i].txt, points[i].x + 8, points[i].y - 8)

  }

  pop();

​

}