square sound

var foo= new p5.Speech();

​

var a,b,c;

​

function preload() {

  img=loadImage("bootanical-fall2.original.jpg")

}

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  background(255);

  foo.onLoad=voiceReady;

  foo.interrupt=true;

  a= new myButton(200,100,100,100, "hahaha", "here");

  b= new myButton(300,150,150, 150, "wowowo", "happy");

  c= new myButton(100,50,50,50, "yummy", "eat");

  imageMode(CENTER);

  let sw = random(img.width);

  let sh = random(img.height);

  let sx = random(0,img.width-sw);

  let sy = random(0,img.height-sh);

  let dx = random(width);

  let dy = random(height);

  let dw = sw;

  let dh = sh;

  translate(dx, dy);

}

​

function draw() {

    background(255);

  a.draw();

  b.draw();

  c.draw();

  rect(200,100,100,100);

  rect(300,150,150, 150);

  rect(100,50,50,50);

  fill("bootanical-fall2.original.jpg");

}

​

function mousePressed() {

  a.click();

  b.click();

  c.click();

  if(b.click()){

      foo.setPitch(150);

  }

}

​

function voiceReady() {

  foo.listVoices();

  foo.SetVoice("Google UK English Female");

}

​

class myButton {

  constructor(x=100,y=50,w=50,h=50,clickphrase="clicked", hoverphrase="hover") {

  foo.speak('hello');

  this.x=x;

  this.y=y;

  this.w=w;

  this.h=h;

  this.clickphrase=clickphrase;

  this.hoverphrase=hoverphrase;

  this.hover=false;

  this.color='red';

  }

​

​

  draw(){

    fill(this.color);

    rect(this.x, this.y, this.w, this.h);

  // hover test:

    if(mouseX>this.x&&mouseY>this.y&&mouseX<this.x+this.w&&mouseY<this.y+this.h)

    {

      if(this.hover==false) {

        foo.speak(this.hoverphrase);

        this.hover=true;

        this.color='"bootanical-fall2.original.jpg"';

      }

    }

    else{

      this.hover=false;

      this.color='red';

    }

  }

  click() {

    if(mouseX>this.x&&mouseY>this.y&&mouseX<this.x+this.w&&mouseY<this.y+this.h)

    {

      foo.speak(this.clickphrase);

    }

  }

​

}

​

​