// // 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/'; function setupRecording(){ var mic, recorder, soundFile; var state = 0; mic = new p5.AudioIn(); mic.start(); recorder = new p5.SoundRecorder(); recorder.setInput(mic); soundFile = new p5.SoundFile(); function doRecording(){ // TODO: handle timing out if no stopping happens if (mic.enabled){ recorder.record(soundFile); } }; function doStopping(){ // TODO: only stop if playing/recording otherwise: // "NotSupportedError: Operation is not supported" recorder.stop(); // TODO: handle the generation of shapes from here }; function doPlaying(){ 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 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(){}