Browse Source

Run prettier formatter over HTML/JS

main
Luke Murphy 4 years ago
parent
commit
a9f6853049
No known key found for this signature in database GPG Key ID: 5E2EF5A63E3718CC
  1. 108
      vocoder/static/vocoder.js
  2. 18
      vocoder/templates/index.html

108
vocoder/static/vocoder.js

@ -7,75 +7,75 @@
// 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 serverUrl = "http://localhost:5000";
var archiveUrl = serverUrl + "/add-to-archive/";
var mic, recorder, soundFile
var recordingTimeout = 30000 // 30 seconds (in milliseconds)
var shouldGenerateNewShape = false
var mic, recorder, soundFile;
var recordingTimeout = 30000; // 30 seconds (in milliseconds)
var shouldGenerateNewShape = false;
function setupRecording(){
mic = new p5.AudioIn()
mic.start()
function setupRecording() {
mic = new p5.AudioIn();
mic.start();
recorder = new p5.SoundRecorder()
recorder.setInput(mic)
recorder = new p5.SoundRecorder();
recorder.setInput(mic);
soundFile = new p5.SoundFile()
soundFile = new p5.SoundFile();
function doRecording(){
if (mic.enabled){
setTimeout(recorder.record(soundFile), recordingTimeout)
function doRecording() {
if (mic.enabled) {
setTimeout(recorder.record(soundFile), recordingTimeout);
}
}
function doStopping(){
function doStopping() {
if (recorder.recording) {
recorder.stop()
shouldGenerateNewShape = true
recorder.stop();
shouldGenerateNewShape = true;
}
}
function doPlaying(){
if (soundFile.isLoaded()){
soundFile.play()
function doPlaying() {
if (soundFile.isLoaded()) {
soundFile.play();
}
}
function doArchiving(){
var soundBlob = soundFile.getBlob()
function doArchiving() {
var soundBlob = soundFile.getBlob();
var httpRequestOptions = {
method: 'POST',
body: new FormData().append('soundBlob', soundBlob),
headers: new Headers({enctype: 'multipart/form-data'})
}
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)
httpDo(archiveUrl, httpRequestOptions);
}
// TODO: we'll probably want something more glam than
// 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)
recordButton = createButton("record");
recordButton.position(10, 90);
recordButton.mousePressed(doRecording);
stopButton = createButton('stop')
stopButton.position(120, 90)
stopButton.mousePressed(doStopping)
stopButton = createButton("stop");
stopButton.position(120, 90);
stopButton.mousePressed(doStopping);
playButton = createButton('play')
playButton.position(210, 90)
playButton.mousePressed(doPlaying)
playButton = createButton("play");
playButton.position(210, 90);
playButton.mousePressed(doPlaying);
playButton = createButton('archive')
playButton.position(300, 90)
playButton.mousePressed(doArchiving)
playButton = createButton("archive");
playButton.position(300, 90);
playButton.mousePressed(doArchiving);
}
function collectSoundParamters(){
function collectSoundParamters() {
// TODO: collect all the sound parameters
// [x] amplitude
// [x] length of sound
@ -84,27 +84,27 @@ function collectSoundParamters(){
// 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()
amplitude = soundFile.getPeaks();
duration = soundFile.duration();
}
function generateShape(){
function generateShape() {
// TODO: take in sound parameters and generate a shape
ellipse(100, 100, 25, 25)
ellipse(100, 100, 25, 25);
}
function setup(){
// TODO: Replace this with the leaflet/mappa setup just
function setup() {
// TODO: Replace this with the leaflet/mappa setup just
// using this for now to draw something to experiment on
createCanvas(600, 600)
createCanvas(600, 600);
setupRecording()
setupRecording();
}
function draw(){
if (shouldGenerateNewShape){
collectSoundParamters()
generateShape()
shouldGenerateNewShape = false
function draw() {
if (shouldGenerateNewShape) {
collectSoundParamters();
generateShape();
shouldGenerateNewShape = false;
}
}

18
vocoder/templates/index.html

@ -4,8 +4,22 @@
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>vocoder.org: home</title>
<link rel="stylesheet" href="/static/leaflet/leaflet.css" type="text/css" media="screen" title="leaflet" charset="utf-8">
<link rel="stylesheet" href="/static/styles.css" type="text/css" media="screen" title="custom css" charset="utf-8">
<link
rel="stylesheet"
href="/static/leaflet/leaflet.css"
type="text/css"
media="screen"
title="leaflet"
charset="utf-8"
/>
<link
rel="stylesheet"
href="/static/styles.css"
type="text/css"
media="screen"
title="custom css"
charset="utf-8"
/>
</head>
<body>
<ul>

Loading…
Cancel
Save