//
// Vocoder front-end Javascript
//
// https://learnxinyminutes.com/docs/javascript/
// https://developer.mozilla.org/en-US/docs/web/javascript/reference
//

// TODO: Read this from the environment so it can run propoerly
// depending on whether it is in development or production mode
var serverUrl = 'http://localhost:5000';
var archiveUrl = serverUrl + '/add-to-archive/';

var mic, recorder, soundFile;
var recordingTimeout = 30000;  // 30 seconds (in milliseconds)
var shouldGenerateNewShape = false;

function setupRecording(){
  mic = new p5.AudioIn();
  mic.start();

  recorder = new p5.SoundRecorder();
  recorder.setInput(mic);

  soundFile = new p5.SoundFile();

  function doRecording(){
    if (mic.enabled){
      setTimeout(recorder.record(soundFile), recordingTimeout);
    }
  };

  function doStopping(){
    if (recorder.recording) {
      recorder.stop();
      shouldGenerateNewShape = true;
    }
  };

  function doPlaying(){
    if (soundFile.isLoaded()){
      soundFile.play();
    }
  };

  function doArchiving(){
    var soundBlob = soundFile.getBlob();

    var httpRequestOptions = {
      method: 'POST',
      body: new FormData().append('soundBlob', soundBlob),
      headers: new Headers({enctype: 'multipart/form-data'})
    };

    // TODO: do error handling when things fail
    // TODO: this doesn't actually work right now
    httpDo(archiveUrl, httpRequestOptions);
  };

  // TODO: we'll probably want something more glam than 
  // some default buttons but that's fine for experimenting
  recordButton = createButton('record');
  recordButton.position(10, 90);
  recordButton.mousePressed(doRecording);

  stopButton = createButton('stop');
  stopButton.position(120, 90);
  stopButton.mousePressed(doStopping);

  playButton = createButton('play');
  playButton.position(210, 90);
  playButton.mousePressed(doPlaying);

  playButton = createButton('archive');
  playButton.position(300, 90);
  playButton.mousePressed(doArchiving);
}

function collectSoundParamters(){
  // TODO: collect all the sound parameters
  // [x] amplitude
  // [x] length of sound
  // [ ] pitch
  // [ ] nuance
  //     btw, there is no "nuance" function for p5js. My current guess is to
  //     perhaps measure it from the "getPeaks". For all wave peaks measured,
  //     ??? (need to think this through, not really sure ...)
  amplitude = soundFile.getPeaks();
  duration = soundFile.duration();
}

function generateShape(){ 
  // TODO: take in sound parameters and generate a shape
  ellipse(100, 100, 25, 25);
}

function setup(){
  // TODO: Replace this with the leaflet/mappa setup just 
  // using this for now to draw something to experiment on
  createCanvas(600, 600);

  setupRecording();
}

function draw(){
  if (shouldGenerateNewShape){
    collectSoundParamters();
    generateShape();
    shouldGenerateNewShape = false;
  }
}