annotate core.js @ 1688:a449b8cdfb31

Standalone version. Movable sliders with rating Comment boxes Submission to XML file TODO: Click track to listen
author Nicholas Jillings <nickjillings@users.noreply.github.com>
date Wed, 25 Mar 2015 12:48:29 +0000
parents c97a35dc45e5
children a6364db4c2ea
rev   line source
nickjillings@1682 1 /**
nickjillings@1682 2 * core.js
nickjillings@1682 3 *
nickjillings@1682 4 * Main script to run, calls all other core functions and manages loading/store to backend.
nickjillings@1682 5 * Also contains all global variables.
nickjillings@1682 6 */
nickjillings@1682 7
nickjillings@1682 8 /* create the web audio API context and store in audioContext*/
nickjillings@1682 9 var audioContext;
nickjillings@1683 10 var projectXML;
nickjillings@1682 11 var audioEngineContext;
nickjillings@1688 12 var projectReturn;
nickjillings@1682 13
nickjillings@1682 14 window.onload = function() {
nickjillings@1682 15 // Function called once the browser has loaded all files.
nickjillings@1682 16 // This should perform any initial commands such as structure / loading documents
nickjillings@1682 17
nickjillings@1682 18 // Create a web audio API context
nickjillings@1682 19 // NORE: Currently this will only work with webkit browsers (Chrome/Safari)!
nickjillings@1688 20 audioContext = new AudioContext;
nickjillings@1682 21
nickjillings@1682 22 // Create the audio engine object
nickjillings@1682 23 audioEngineContext = new AudioEngine();
nickjillings@1682 24 }
nickjillings@1682 25
nickjillings@1682 26 function loadProjectSpec(url) {
nickjillings@1682 27 // Load the project document from the given URL, decode the XML and instruct audioEngine to get audio data
nickjillings@1682 28 // If url is null, request client to upload project XML document
nickjillings@1683 29 var r = new XMLHttpRequest();
nickjillings@1683 30 r.open('GET',url,true);
nickjillings@1683 31 r.onload = function() {
nickjillings@1683 32 loadProjectSpecCallback(r.response);
nickjillings@1683 33 }
nickjillings@1683 34 r.send();
nickjillings@1683 35 }
nickjillings@1683 36
nickjillings@1683 37 function loadProjectSpecCallback(response) {
nickjillings@1683 38 // Function called after asynchronous download of XML project specification
nickjillings@1683 39 var decode = $.parseXML(response);
nickjillings@1683 40 projectXML = $(decode);
nickjillings@1683 41
nickjillings@1683 42 // Now extract the setup tag
nickjillings@1683 43 var xmlSetup = projectXML.find('setup');
nickjillings@1683 44 var interfaceType = xmlSetup[0].attributes['interface'];
nickjillings@1683 45 var interfaceJS = document.createElement('script');
nickjillings@1683 46 interfaceJS.setAttribute("type","text/javascript");
nickjillings@1683 47 if (interfaceType.value == 'APE') {
nickjillings@1683 48 interfaceJS.setAttribute("src","ape.js");
nickjillings@1683 49 }
nickjillings@1683 50 document.getElementsByTagName("head")[0].appendChild(interfaceJS);
nickjillings@1682 51 }
nickjillings@1682 52
nickjillings@1682 53 function createProjectSave(destURL) {
nickjillings@1682 54 // Save the data from interface into XML and send to destURL
nickjillings@1682 55 // If destURL is null then download XML in client
nickjillings@1688 56 // Now time to render file locally
nickjillings@1688 57 var xmlDoc = interfaceXMLSave();
nickjillings@1688 58 if (destURL == "null" || destURL == undefined) {
nickjillings@1688 59 var parent = document.createElement("div");
nickjillings@1688 60 parent.appendChild(xmlDoc);
nickjillings@1688 61 var file = [parent.innerHTML];
nickjillings@1688 62 var bb = new Blob(file,{type : 'application/xml'});
nickjillings@1688 63 var dnlk = window.URL.createObjectURL(bb);
nickjillings@1688 64 var a = document.createElement("a");
nickjillings@1688 65 a.hidden = '';
nickjillings@1688 66 a.href = dnlk;
nickjillings@1688 67 a.download = "save.xml";
nickjillings@1688 68 a.textContent = "Save File";
nickjillings@1688 69
nickjillings@1688 70 var submitDiv = document.getElementById('download-point');
nickjillings@1688 71 submitDiv.appendChild(a);
nickjillings@1688 72 }
nickjillings@1682 73 }
nickjillings@1682 74
nickjillings@1682 75 function AudioEngine() {
nickjillings@1682 76
nickjillings@1682 77 // Create two output paths, the main outputGain and fooGain.
nickjillings@1682 78 // Output gain is default to 1 and any items for playback route here
nickjillings@1682 79 // Foo gain is used for analysis to ensure paths get processed, but are not heard
nickjillings@1682 80 // because web audio will optimise and any route which does not go to the destination gets ignored.
nickjillings@1682 81 this.outputGain = audioContext.createGain();
nickjillings@1682 82 this.fooGain = audioContext.createGain();
nickjillings@1682 83 this.fooGain.gain = 0;
nickjillings@1682 84
nickjillings@1688 85 // Use this to detect playback state: 0 - stopped, 1 - playing
nickjillings@1688 86 this.status = 0;
nickjillings@1688 87
nickjillings@1682 88 // Connect both gains to output
nickjillings@1682 89 this.outputGain.connect(audioContext.destination);
nickjillings@1682 90 this.fooGain.connect(audioContext.destination);
nickjillings@1682 91
nickjillings@1682 92 // Create store for new audioObjects
nickjillings@1682 93 this.audioObjects = [];
nickjillings@1682 94
nickjillings@1682 95 this.play = function() {
nickjillings@1682 96 // Send play command to all playback buffers for synchronised start
nickjillings@1682 97 // Also start timer callbacks to detect if playback has finished
nickjillings@1688 98 if (this.status == 0) {
nickjillings@1688 99 // First get current clock
nickjillings@1688 100 var timer = audioContext.currentTime;
nickjillings@1688 101 // Add 3 seconds
nickjillings@1688 102 timer += 3.0;
nickjillings@1688 103
nickjillings@1688 104 // Send play to all tracks
nickjillings@1688 105 for (var i=0; i<this.audioObjects.length; i++)
nickjillings@1688 106 {
nickjillings@1688 107 this.audioObjects[i].play(timer);
nickjillings@1688 108 }
nickjillings@1688 109 this.status = 1;
nickjillings@1688 110 }
nickjillings@1682 111 }
nickjillings@1682 112
nickjillings@1682 113 this.stop = function() {
nickjillings@1682 114 // Send stop and reset command to all playback buffers
nickjillings@1688 115 if (this.status == 1) {
nickjillings@1688 116 for (var i=0; i<this.audioObjects.length; i++)
nickjillings@1688 117 {
nickjillings@1688 118 this.audioObjects[i].stop();
nickjillings@1688 119 }
nickjillings@1688 120 this.status = 0;
nickjillings@1688 121 }
nickjillings@1682 122 }
nickjillings@1682 123
nickjillings@1682 124 this.newTrack = function(url) {
nickjillings@1682 125 // Pull data from given URL into new audio buffer
nickjillings@1682 126 // URLs must either be from the same source OR be setup to 'Access-Control-Allow-Origin'
nickjillings@1688 127
nickjillings@1682 128 // Create the audioObject with ID of the new track length;
nickjillings@1682 129 audioObjectId = this.audioObjects.length
nickjillings@1682 130 this.audioObjects[audioObjectId] = new audioObject(audioObjectId);
nickjillings@1688 131
nickjillings@1688 132 // AudioObject will get track itself.
nickjillings@1688 133 this.audioObjects[audioObjectId].constructTrack(url);
nickjillings@1682 134 }
nickjillings@1682 135
nickjillings@1682 136 }
nickjillings@1682 137
nickjillings@1682 138 function audioObject(id) {
nickjillings@1682 139 // The main buffer object with common control nodes to the AudioEngine
nickjillings@1682 140
nickjillings@1682 141 this.id = id;
nickjillings@1682 142 this.state = 0; // 0 - no data, 1 - ready
nickjillings@1682 143
nickjillings@1682 144 // Create a buffer and external gain control to allow internal patching of effects and volume leveling.
nickjillings@1682 145 this.bufferNode = audioContext.createBufferSource();
nickjillings@1682 146 this.outputGain = audioContext.createGain();
nickjillings@1682 147
nickjillings@1682 148 // Connect buffer to the audio graph
nickjillings@1682 149 this.bufferNode.connect(this.outputGain);
nickjillings@1682 150 this.outputGain.connect(audioEngineContext.outputGain);
nickjillings@1682 151
nickjillings@1682 152 // the audiobuffer is not designed for multi-start playback
nickjillings@1682 153 // When stopeed, the buffer node is deleted and recreated with the stored buffer.
nickjillings@1682 154 this.buffer;
nickjillings@1682 155
nickjillings@1682 156 this.play = function(startTime) {
nickjillings@1682 157 this.bufferNode.start(startTime);
nickjillings@1682 158 }
nickjillings@1682 159
nickjillings@1682 160 this.stop = function() {
nickjillings@1682 161 this.bufferNode.stop(0);
nickjillings@1682 162 this.bufferNode = audioContext.createBufferSource();
nickjillings@1682 163 this.bufferNode.connect(this.outputGain);
nickjillings@1682 164 this.bufferNode.buffer = this.buffer;
nickjillings@1688 165 this.bufferNode.loop = true;
nickjillings@1682 166 }
nickjillings@1682 167
nickjillings@1688 168 this.constructTrack = function(url) {
nickjillings@1688 169 var request = new XMLHttpRequest();
nickjillings@1688 170 request.open('GET',url,true);
nickjillings@1688 171 request.responseType = 'arraybuffer';
nickjillings@1688 172
nickjillings@1688 173 var audioObj = this;
nickjillings@1688 174
nickjillings@1688 175 // Create callback to decode the data asynchronously
nickjillings@1688 176 request.onloadend = function() {
nickjillings@1688 177 audioContext.decodeAudioData(request.response, function(decodedData) {
nickjillings@1688 178 audioObj.buffer = decodedData;
nickjillings@1688 179 audioObj.bufferNode.buffer = audioObj.buffer;
nickjillings@1688 180 audioObj.bufferNode.loop = true;
nickjillings@1688 181 audioObj.state = 1;
nickjillings@1688 182 }, function(){
nickjillings@1688 183 // Should only be called if there was an error, but sometimes gets called continuously
nickjillings@1688 184 // Check here if the error is genuine
nickjillings@1688 185 if (audioObj.state == 0 || audioObj.buffer == undefined) {
nickjillings@1688 186 // Genuine error
nickjillings@1688 187 console.log('FATAL - Error loading buffer on '+audioObj.id);
nickjillings@1688 188 }
nickjillings@1688 189 });
nickjillings@1688 190 }
nickjillings@1688 191 request.send();
nickjillings@1688 192 }
nickjillings@1688 193
nickjillings@1688 194 }