annotate core.js @ 1735:50297ebb1c41

Fixed Bug 1204: Multiple clicks creates multiple instances.
author Nicholas Jillings <nickjillings@users.noreply.github.com>
date Fri, 01 May 2015 16:07:15 +0100
parents 7c7daa0eaebc
children ffeef0ac7a5f
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@1643 9 var audioContext; // Hold the browser web audio API
nickjillings@1643 10 var projectXML; // Hold the parsed setup XML
nickjillings@1648 11
nickjillings@1654 12 var testXMLSetups = []; // Hold the parsed test instances
nickjillings@1654 13 var testResultsHolders =[]; // Hold the results from each test for publishing to XML
nickjillings@1655 14 var currentTrackOrder = []; // Hold the current XML tracks in their (randomised) order
nickjillings@1656 15 var currentTestHolder; // Hold any intermediate results during test - metrics
nickjillings@1643 16 var audioEngineContext; // The custome AudioEngine object
nickjillings@1643 17 var projectReturn; // Hold the URL for the return
nickjillings@1643 18 var preTestQuestions = document.createElement('PreTest'); // Store any pre-test question response
nickjillings@1643 19 var postTestQuestions = document.createElement('PostTest'); // Store any post-test question response
nickjillings@1642 20
nickjillings@1667 21 // Add a prototype to the bufferSourceNode to reference to the audioObject holding it
nickjillings@1667 22 AudioBufferSourceNode.prototype.owner = undefined;
nickjillings@1682 23
nickjillings@1682 24 window.onload = function() {
nickjillings@1682 25 // Function called once the browser has loaded all files.
nickjillings@1682 26 // This should perform any initial commands such as structure / loading documents
nickjillings@1682 27
nickjillings@1682 28 // Create a web audio API context
nickjillings@1701 29 // Fixed for cross-browser support
nickjillings@1701 30 var AudioContext = window.AudioContext || window.webkitAudioContext;
nickjillings@1688 31 audioContext = new AudioContext;
nickjillings@1682 32
nickjillings@1682 33 // Create the audio engine object
nickjillings@1682 34 audioEngineContext = new AudioEngine();
nickjillings@1697 35 };
nickjillings@1682 36
nickjillings@1682 37 function loadProjectSpec(url) {
nickjillings@1682 38 // Load the project document from the given URL, decode the XML and instruct audioEngine to get audio data
nickjillings@1682 39 // If url is null, request client to upload project XML document
nickjillings@1683 40 var r = new XMLHttpRequest();
nickjillings@1683 41 r.open('GET',url,true);
nickjillings@1683 42 r.onload = function() {
nickjillings@1683 43 loadProjectSpecCallback(r.response);
nickjillings@1697 44 };
nickjillings@1683 45 r.send();
nickjillings@1697 46 };
nickjillings@1683 47
nickjillings@1683 48 function loadProjectSpecCallback(response) {
nickjillings@1683 49 // Function called after asynchronous download of XML project specification
nickjillings@1683 50 var decode = $.parseXML(response);
nickjillings@1683 51 projectXML = $(decode);
nickjillings@1683 52
nickjillings@1683 53 // Now extract the setup tag
nickjillings@1683 54 var xmlSetup = projectXML.find('setup');
nickjillings@1697 55 // Detect the interface to use and load the relevant javascripts.
nickjillings@1683 56 var interfaceType = xmlSetup[0].attributes['interface'];
nickjillings@1683 57 var interfaceJS = document.createElement('script');
nickjillings@1683 58 interfaceJS.setAttribute("type","text/javascript");
nickjillings@1683 59 if (interfaceType.value == 'APE') {
nickjillings@1683 60 interfaceJS.setAttribute("src","ape.js");
nickjillings@1643 61
nickjillings@1643 62 // APE comes with a css file
nickjillings@1643 63 var css = document.createElement('link');
nickjillings@1643 64 css.rel = 'stylesheet';
nickjillings@1643 65 css.type = 'text/css';
nickjillings@1643 66 css.href = 'ape.css';
nickjillings@1643 67
nickjillings@1643 68 document.getElementsByTagName("head")[0].appendChild(css);
nickjillings@1683 69 }
nickjillings@1683 70 document.getElementsByTagName("head")[0].appendChild(interfaceJS);
nickjillings@1682 71 }
nickjillings@1682 72
nickjillings@1682 73 function createProjectSave(destURL) {
nickjillings@1682 74 // Save the data from interface into XML and send to destURL
nickjillings@1682 75 // If destURL is null then download XML in client
nickjillings@1688 76 // Now time to render file locally
nickjillings@1688 77 var xmlDoc = interfaceXMLSave();
nickjillings@1688 78 if (destURL == "null" || destURL == undefined) {
nickjillings@1688 79 var parent = document.createElement("div");
nickjillings@1688 80 parent.appendChild(xmlDoc);
nickjillings@1688 81 var file = [parent.innerHTML];
nickjillings@1688 82 var bb = new Blob(file,{type : 'application/xml'});
nickjillings@1688 83 var dnlk = window.URL.createObjectURL(bb);
nickjillings@1688 84 var a = document.createElement("a");
nickjillings@1688 85 a.hidden = '';
nickjillings@1688 86 a.href = dnlk;
nickjillings@1688 87 a.download = "save.xml";
nickjillings@1688 88 a.textContent = "Save File";
nickjillings@1688 89
nickjillings@1688 90 var submitDiv = document.getElementById('download-point');
nickjillings@1688 91 submitDiv.appendChild(a);
nickjillings@1688 92 }
nickjillings@1653 93 return submitDiv;
nickjillings@1682 94 }
nickjillings@1682 95
nickjillings@1682 96 function AudioEngine() {
nickjillings@1682 97
nickjillings@1682 98 // Create two output paths, the main outputGain and fooGain.
nickjillings@1682 99 // Output gain is default to 1 and any items for playback route here
nickjillings@1682 100 // Foo gain is used for analysis to ensure paths get processed, but are not heard
nickjillings@1682 101 // because web audio will optimise and any route which does not go to the destination gets ignored.
nickjillings@1682 102 this.outputGain = audioContext.createGain();
nickjillings@1682 103 this.fooGain = audioContext.createGain();
nickjillings@1682 104 this.fooGain.gain = 0;
nickjillings@1682 105
nickjillings@1688 106 // Use this to detect playback state: 0 - stopped, 1 - playing
nickjillings@1688 107 this.status = 0;
nickjillings@1688 108
nickjillings@1682 109 // Connect both gains to output
nickjillings@1682 110 this.outputGain.connect(audioContext.destination);
nickjillings@1682 111 this.fooGain.connect(audioContext.destination);
nickjillings@1682 112
nickjillings@1659 113 // Create the timer Object
nickjillings@1659 114 this.timer = new timer();
nickjillings@1659 115 // Create session metrics
nickjillings@1659 116 this.metric = new sessionMetrics(this);
nickjillings@1659 117
nickjillings@1667 118 this.loopPlayback = false;
nickjillings@1667 119
nickjillings@1682 120 // Create store for new audioObjects
nickjillings@1682 121 this.audioObjects = [];
nickjillings@1682 122
nickjillings@1667 123 this.play = function(){};
nickjillings@1682 124
nickjillings@1667 125 this.stop = function(){};
nickjillings@1689 126
nickjillings@1689 127
nickjillings@1682 128 this.newTrack = function(url) {
nickjillings@1682 129 // Pull data from given URL into new audio buffer
nickjillings@1682 130 // URLs must either be from the same source OR be setup to 'Access-Control-Allow-Origin'
nickjillings@1688 131
nickjillings@1682 132 // Create the audioObject with ID of the new track length;
nickjillings@1659 133 audioObjectId = this.audioObjects.length;
nickjillings@1682 134 this.audioObjects[audioObjectId] = new audioObject(audioObjectId);
nickjillings@1688 135
nickjillings@1688 136 // AudioObject will get track itself.
nickjillings@1688 137 this.audioObjects[audioObjectId].constructTrack(url);
nickjillings@1697 138 };
nickjillings@1682 139
nickjillings@1682 140 }
nickjillings@1682 141
nickjillings@1682 142 function audioObject(id) {
nickjillings@1682 143 // The main buffer object with common control nodes to the AudioEngine
nickjillings@1682 144
nickjillings@1682 145 this.id = id;
nickjillings@1682 146 this.state = 0; // 0 - no data, 1 - ready
nickjillings@1704 147 this.url = null; // Hold the URL given for the output back to the results.
nickjillings@1659 148 this.metric = new metricTracker();
nickjillings@1682 149
nickjillings@1682 150 // Create a buffer and external gain control to allow internal patching of effects and volume leveling.
nickjillings@1667 151 this.bufferNode = undefined;
nickjillings@1682 152 this.outputGain = audioContext.createGain();
nickjillings@1682 153
nickjillings@1689 154 // Default output gain to be zero
nickjillings@1689 155 this.outputGain.gain.value = 0.0;
nickjillings@1689 156
nickjillings@1682 157 // Connect buffer to the audio graph
nickjillings@1682 158 this.outputGain.connect(audioEngineContext.outputGain);
nickjillings@1682 159
nickjillings@1682 160 // the audiobuffer is not designed for multi-start playback
nickjillings@1682 161 // When stopeed, the buffer node is deleted and recreated with the stored buffer.
nickjillings@1682 162 this.buffer;
nickjillings@1682 163
nickjillings@1682 164 this.play = function(startTime) {
nickjillings@1667 165 this.bufferNode = audioContext.createBufferSource();
nickjillings@1667 166 this.bufferNode.connect(this.outputGain);
nickjillings@1667 167 this.bufferNode.buffer = this.buffer;
nickjillings@1667 168 this.bufferNode.loop = audioEngineContext.loopPlayback;
nickjillings@1682 169 this.bufferNode.start(startTime);
nickjillings@1697 170 };
nickjillings@1682 171
nickjillings@1682 172 this.stop = function() {
nickjillings@1735 173 if (this.bufferNode != undefined)
nickjillings@1735 174 {
nickjillings@1735 175 this.bufferNode.stop(0);
nickjillings@1735 176 this.bufferNode = undefined;
nickjillings@1735 177 }
nickjillings@1697 178 };
nickjillings@1689 179
nickjillings@1688 180 this.constructTrack = function(url) {
nickjillings@1688 181 var request = new XMLHttpRequest();
nickjillings@1704 182 this.url = url;
nickjillings@1688 183 request.open('GET',url,true);
nickjillings@1688 184 request.responseType = 'arraybuffer';
nickjillings@1688 185
nickjillings@1688 186 var audioObj = this;
nickjillings@1688 187
nickjillings@1688 188 // Create callback to decode the data asynchronously
nickjillings@1688 189 request.onloadend = function() {
nickjillings@1688 190 audioContext.decodeAudioData(request.response, function(decodedData) {
nickjillings@1688 191 audioObj.buffer = decodedData;
nickjillings@1688 192 audioObj.state = 1;
nickjillings@1688 193 }, function(){
nickjillings@1688 194 // Should only be called if there was an error, but sometimes gets called continuously
nickjillings@1688 195 // Check here if the error is genuine
nickjillings@1688 196 if (audioObj.state == 0 || audioObj.buffer == undefined) {
nickjillings@1688 197 // Genuine error
nickjillings@1688 198 console.log('FATAL - Error loading buffer on '+audioObj.id);
nickjillings@1688 199 }
nickjillings@1688 200 });
nickjillings@1697 201 };
nickjillings@1688 202 request.send();
nickjillings@1697 203 };
nickjillings@1688 204
nickjillings@1659 205 }
nickjillings@1659 206
nickjillings@1659 207 function timer()
nickjillings@1659 208 {
nickjillings@1659 209 /* Timer object used in audioEngine to keep track of session timings
nickjillings@1659 210 * Uses the timer of the web audio API, so sample resolution
nickjillings@1659 211 */
nickjillings@1659 212 this.testStarted = false;
nickjillings@1659 213 this.testStartTime = 0;
nickjillings@1659 214 this.testDuration = 0;
nickjillings@1659 215 this.minimumTestTime = 0; // No minimum test time
nickjillings@1659 216 this.startTest = function()
nickjillings@1659 217 {
nickjillings@1659 218 if (this.testStarted == false)
nickjillings@1659 219 {
nickjillings@1659 220 this.testStartTime = audioContext.currentTime;
nickjillings@1659 221 this.testStarted = true;
nickjillings@1659 222 this.updateTestTime();
nickjillings@1662 223 audioEngineContext.metric.initialiseTest();
nickjillings@1659 224 }
nickjillings@1659 225 };
nickjillings@1659 226 this.stopTest = function()
nickjillings@1659 227 {
nickjillings@1659 228 if (this.testStarted)
nickjillings@1659 229 {
nickjillings@1659 230 this.testDuration = this.getTestTime();
nickjillings@1659 231 this.testStarted = false;
nickjillings@1659 232 } else {
nickjillings@1659 233 console.log('ERR: Test tried to end before beginning');
nickjillings@1659 234 }
nickjillings@1659 235 };
nickjillings@1659 236 this.updateTestTime = function()
nickjillings@1659 237 {
nickjillings@1659 238 if (this.testStarted)
nickjillings@1659 239 {
nickjillings@1659 240 this.testDuration = audioContext.currentTime - this.testStartTime;
nickjillings@1659 241 }
nickjillings@1659 242 };
nickjillings@1659 243 this.getTestTime = function()
nickjillings@1659 244 {
nickjillings@1659 245 this.updateTestTime();
nickjillings@1659 246 return this.testDuration;
nickjillings@1659 247 };
nickjillings@1659 248 }
nickjillings@1659 249
nickjillings@1659 250 function sessionMetrics(engine)
nickjillings@1659 251 {
nickjillings@1659 252 /* Used by audioEngine to link to audioObjects to minimise the timer call timers;
nickjillings@1659 253 */
nickjillings@1659 254 this.engine = engine;
nickjillings@1659 255 this.lastClicked = -1;
nickjillings@1659 256 this.data = -1;
nickjillings@1662 257 this.initialiseTest = function(){};
nickjillings@1659 258 }
nickjillings@1659 259
nickjillings@1659 260 function metricTracker()
nickjillings@1659 261 {
nickjillings@1659 262 /* Custom object to track and collect metric data
nickjillings@1659 263 * Used only inside the audioObjects object.
nickjillings@1659 264 */
nickjillings@1659 265
nickjillings@1659 266 this.listenedTimer = 0;
nickjillings@1659 267 this.listenStart = 0;
nickjillings@1661 268 this.initialPosition = -1;
nickjillings@1659 269 this.movementTracker = [];
nickjillings@1659 270 this.wasListenedTo = false;
nickjillings@1659 271 this.wasMoved = false;
nickjillings@1659 272 this.hasComments = false;
nickjillings@1659 273
nickjillings@1659 274 this.initialised = function(position)
nickjillings@1659 275 {
nickjillings@1661 276 if (this.initialPosition == -1) {
nickjillings@1661 277 this.initialPosition = position;
nickjillings@1661 278 }
nickjillings@1659 279 };
nickjillings@1659 280
nickjillings@1659 281 this.moved = function(time,position)
nickjillings@1659 282 {
nickjillings@1659 283 this.wasMoved = true;
nickjillings@1659 284 this.movementTracker[this.movementTracker.length] = [time, position];
nickjillings@1659 285 };
nickjillings@1659 286
nickjillings@1659 287 this.listening = function(time)
nickjillings@1659 288 {
nickjillings@1659 289 if (this.listenStart == 0)
nickjillings@1659 290 {
nickjillings@1659 291 this.wasListenedTo = true;
nickjillings@1659 292 this.listenStart = time;
nickjillings@1659 293 } else {
nickjillings@1659 294 this.listenedTimer += (time - this.listenStart);
nickjillings@1659 295 this.listenStart = 0;
nickjillings@1659 296 }
nickjillings@1659 297 };
nickjillings@1664 298 }
nickjillings@1664 299
nickjillings@1664 300 function randomiseOrder(input)
nickjillings@1664 301 {
nickjillings@1664 302 // This takes an array of information and randomises the order
nickjillings@1664 303 var N = input.length;
nickjillings@1664 304 var K = N;
nickjillings@1664 305 var holdArr = [];
nickjillings@1664 306 for (var n=0; n<N; n++)
nickjillings@1664 307 {
nickjillings@1664 308 // First pick a random number
nickjillings@1664 309 var r = Math.random();
nickjillings@1664 310 // Multiply and floor by the number of elements left
nickjillings@1664 311 r = Math.floor(r*input.length);
nickjillings@1664 312 // Pick out that element and delete from the array
nickjillings@1664 313 holdArr.push(input.splice(r,1)[0]);
nickjillings@1664 314 }
nickjillings@1664 315 return holdArr;
nickjillings@1688 316 }