var myRec = new p5.SpeechRec(); // new P5.SpeechRec object
var is_recognition_activated = false;

var words = [];

function setup() {
  noCanvas();
  myRec.onEnd = endSpeech;
  myRec.onResult = parseResult;
  myRec.continuous = false; // no continuous recognition
  myRec.interimResults = true; // allow partial recognition (faster, less accurate)
  is_recognition_activated = false;
  myRec.rec.lang = "en";
  select("#button_start_or_stop").mouseClicked(toggleSpeechRecognition);
}

function parseResult() {
  document.getElementById("label").innerHTML = "speaking...";
  document.getElementById("text").value = myRec.resultString;
}

function toggleSpeechRecognition() {
  is_recognition_activated = !is_recognition_activated;

  if (is_recognition_activated == true) {
    myRec.rec.lang = "en"; 
    myRec.start(); 
    this.html("stop");
  }
  else {
    myRec.stop();
    this.html("start");
  }
}

function endSpeech() {
  if (is_recognition_activated == true) {
    if (!myRec.resultValue) {
      myRec.start(); // start engine
      return;
    }
    if (myRec.resultString.length > 0) {
      console.log("End");
      document.getElementById("label").innerHTML = "quiet";
      document.getElementById("textarea").innerHTML +=
        myRec.resultString + "。";
      document.getElementById("text").value = "";
      console.log(myRec.resultString);
      document.getElementById("body").style.background = myRec.resultString;
      myRec.resultString = "";
    }
    myRec.start(); // start engine
    console.log("start");
  }
}