annotate core.js @ 911:c867677af7f4

Everything tied into Specification object which needs information from specification document.
author Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
date Thu, 04 Jun 2015 15:54:56 +0100
parents f938025db0d7
children b84004661558
rev   line source
n@905 1 /**
n@905 2 * core.js
n@905 3 *
n@905 4 * Main script to run, calls all other core functions and manages loading/store to backend.
n@905 5 * Also contains all global variables.
n@905 6 */
n@905 7
n@905 8 /* create the web audio API context and store in audioContext*/
n@905 9 var audioContext; // Hold the browser web audio API
n@905 10 var projectXML; // Hold the parsed setup XML
n@911 11 var specification;
n@905 12 var popup; // Hold the interfacePopup object
n@905 13 var testState;
n@905 14 var currentTrackOrder = []; // Hold the current XML tracks in their (randomised) order
n@905 15 var audioEngineContext; // The custome AudioEngine object
n@905 16 var projectReturn; // Hold the URL for the return
n@905 17
n@905 18
n@905 19 // Add a prototype to the bufferSourceNode to reference to the audioObject holding it
n@905 20 AudioBufferSourceNode.prototype.owner = undefined;
n@905 21
n@905 22 window.onload = function() {
n@905 23 // Function called once the browser has loaded all files.
n@905 24 // This should perform any initial commands such as structure / loading documents
n@905 25
n@905 26 // Create a web audio API context
n@905 27 // Fixed for cross-browser support
n@905 28 var AudioContext = window.AudioContext || window.webkitAudioContext;
n@905 29 audioContext = new AudioContext;
n@905 30
n@905 31 // Create test state
n@905 32 testState = new stateMachine();
n@905 33
n@905 34 // Create the audio engine object
n@905 35 audioEngineContext = new AudioEngine();
n@905 36
n@905 37 // Create the popup interface object
n@905 38 popup = new interfacePopup();
n@911 39
n@911 40 // Create the specification object
n@911 41 specification = new Specification();
n@905 42 };
n@905 43
n@905 44 function interfacePopup() {
n@905 45 // Creates an object to manage the popup
n@905 46 this.popup = null;
n@905 47 this.popupContent = null;
n@905 48 this.popupButton = null;
n@905 49 this.popupOptions = null;
n@905 50 this.currentIndex = null;
n@905 51 this.responses = null;
n@911 52
n@905 53 this.createPopup = function(){
n@905 54 // Create popup window interface
n@905 55 var insertPoint = document.getElementById("topLevelBody");
n@905 56 var blank = document.createElement('div');
n@905 57 blank.className = 'testHalt';
n@905 58
n@905 59 this.popup = document.createElement('div');
n@905 60 this.popup.id = 'popupHolder';
n@905 61 this.popup.className = 'popupHolder';
n@905 62 this.popup.style.position = 'absolute';
n@905 63 this.popup.style.left = (window.innerWidth/2)-250 + 'px';
n@905 64 this.popup.style.top = (window.innerHeight/2)-125 + 'px';
n@905 65
n@905 66 this.popupContent = document.createElement('div');
n@905 67 this.popupContent.id = 'popupContent';
n@905 68 this.popupContent.style.marginTop = '25px';
n@905 69 this.popupContent.align = 'center';
n@905 70 this.popup.appendChild(this.popupContent);
n@905 71
n@905 72 this.popupButton = document.createElement('button');
n@905 73 this.popupButton.className = 'popupButton';
n@905 74 this.popupButton.innerHTML = 'Next';
n@905 75 this.popupButton.onclick = function(){popup.buttonClicked();};
n@911 76 this.popup.style.zIndex = -1;
n@911 77 this.popup.style.visibility = 'hidden';
n@911 78 blank.style.zIndex = -2;
n@911 79 blank.style.visibility = 'hidden';
n@905 80 insertPoint.appendChild(this.popup);
n@905 81 insertPoint.appendChild(blank);
n@905 82 };
n@905 83
n@905 84 this.showPopup = function(){
n@911 85 if (this.popup == null) {
n@905 86 this.createPopup();
n@905 87 }
n@905 88 this.popup.style.zIndex = 3;
n@905 89 this.popup.style.visibility = 'visible';
n@905 90 var blank = document.getElementsByClassName('testHalt')[0];
n@905 91 blank.style.zIndex = 2;
n@905 92 blank.style.visibility = 'visible';
n@905 93 };
n@905 94
n@905 95 this.hidePopup = function(){
n@905 96 this.popup.style.zIndex = -1;
n@905 97 this.popup.style.visibility = 'hidden';
n@905 98 var blank = document.getElementsByClassName('testHalt')[0];
n@905 99 blank.style.zIndex = -2;
n@905 100 blank.style.visibility = 'hidden';
n@905 101 };
n@905 102
n@905 103 this.postNode = function() {
n@905 104 // This will take the node from the popupOptions and display it
n@905 105 var node = this.popupOptions[this.currentIndex];
n@905 106 this.popupContent.innerHTML = null;
n@911 107 if (node.type == 'statement') {
n@905 108 var span = document.createElement('span');
n@911 109 span.textContent = node.statement;
n@905 110 this.popupContent.appendChild(span);
n@911 111 } else if (node.type == 'question') {
n@905 112 var span = document.createElement('span');
n@911 113 span.textContent = node.question;
n@905 114 var textArea = document.createElement('textarea');
n@905 115 var br = document.createElement('br');
n@905 116 this.popupContent.appendChild(span);
n@905 117 this.popupContent.appendChild(br);
n@905 118 this.popupContent.appendChild(textArea);
n@905 119 this.popupContent.childNodes[2].focus();
n@905 120 }
n@905 121 this.popupContent.appendChild(this.popupButton);
n@905 122 };
n@905 123
n@905 124 this.initState = function(node) {
n@905 125 //Call this with your preTest and postTest nodes when needed to
n@905 126 // initialise the popup procedure.
n@911 127 this.popupOptions = node.options;
n@905 128 if (this.popupOptions.length > 0) {
n@911 129 if (node.type == 'pretest') {
n@905 130 this.responses = document.createElement('PreTest');
n@911 131 } else if (node.type == 'posttest') {
n@905 132 this.responses = document.createElement('PostTest');
n@905 133 } else {
n@905 134 console.log ('WARNING - popup node neither pre or post!');
n@905 135 this.responses = document.createElement('responses');
n@905 136 }
n@905 137 this.currentIndex = 0;
n@905 138 this.showPopup();
n@905 139 this.postNode();
n@911 140 } else {
n@911 141 advanceState();
n@905 142 }
n@905 143 };
n@905 144
n@905 145 this.buttonClicked = function() {
n@905 146 // Each time the popup button is clicked!
n@905 147 var node = this.popupOptions[this.currentIndex];
n@911 148 if (node.type == 'question') {
n@905 149 // Must extract the question data
n@905 150 var textArea = $(popup.popupContent).find('textarea')[0];
n@911 151 if (node.mandatory == true && textArea.value.length == 0) {
n@905 152 alert('This question is mandatory');
n@905 153 return;
n@905 154 } else {
n@905 155 // Save the text content
n@905 156 var hold = document.createElement('comment');
n@911 157 hold.id = node.id;
n@905 158 hold.innerHTML = textArea.value;
n@905 159 console.log("Question: "+ node.textContent);
n@905 160 console.log("Question Response: "+ textArea.value);
n@905 161 this.responses.appendChild(hold);
n@905 162 }
n@905 163 }
n@905 164 this.currentIndex++;
n@905 165 if (this.currentIndex < this.popupOptions.length) {
n@905 166 this.postNode();
n@905 167 } else {
n@905 168 // Reached the end of the popupOptions
n@905 169 this.hidePopup();
n@905 170 if (this.responses.nodeName == testState.stateResults[testState.stateIndex].nodeName) {
n@905 171 testState.stateResults[testState.stateIndex] = this.responses;
n@905 172 } else {
n@905 173 testState.stateResults[testState.stateIndex].appendChild(this.responses);
n@905 174 }
n@905 175 advanceState();
n@905 176 }
n@905 177 };
n@905 178 }
n@905 179
n@905 180 function advanceState()
n@905 181 {
n@905 182 // Just for complete clarity
n@905 183 testState.advanceState();
n@905 184 }
n@905 185
n@905 186 function stateMachine()
n@905 187 {
n@905 188 // Object prototype for tracking and managing the test state
n@905 189 this.stateMap = [];
n@905 190 this.stateIndex = null;
n@905 191 this.currentStateMap = [];
n@905 192 this.currentIndex = null;
n@905 193 this.currentTestId = 0;
n@905 194 this.stateResults = [];
n@905 195 this.timerCallBackHolders = null;
n@905 196 this.initialise = function(){
n@905 197 if (this.stateMap.length > 0) {
n@905 198 if(this.stateIndex != null) {
n@905 199 console.log('NOTE - State already initialise');
n@905 200 }
n@905 201 this.stateIndex = -1;
n@905 202 var that = this;
n@905 203 for (var id=0; id<this.stateMap.length; id++){
n@911 204 var name = this.stateMap[id].type;
n@905 205 var obj = document.createElement(name);
n@905 206 this.stateResults.push(obj);
n@905 207 }
n@905 208 } else {
n@905 209 conolse.log('FATAL - StateMap not correctly constructed. EMPTY_STATE_MAP');
n@905 210 }
n@905 211 };
n@905 212 this.advanceState = function(){
n@905 213 if (this.stateIndex == null) {
n@905 214 this.initialise();
n@905 215 }
n@905 216 if (this.stateIndex == -1) {
n@905 217 console.log('Starting test...');
n@905 218 }
n@905 219 if (this.currentIndex == null){
n@911 220 if (this.currentStateMap.type == "audioHolder") {
n@905 221 // Save current page
n@905 222 this.testPageCompleted(this.stateResults[this.stateIndex],this.currentStateMap,this.currentTestId);
n@905 223 this.currentTestId++;
n@905 224 }
n@905 225 this.stateIndex++;
n@905 226 if (this.stateIndex >= this.stateMap.length) {
n@905 227 console.log('Test Completed');
n@905 228 createProjectSave(projectReturn);
n@905 229 } else {
n@905 230 this.currentStateMap = this.stateMap[this.stateIndex];
n@911 231 if (this.currentStateMap.type == "audioHolder") {
n@905 232 console.log('Loading test page');
n@905 233 loadTest(this.currentStateMap);
n@905 234 this.initialiseInnerState(this.currentStateMap);
n@911 235 } else if (this.currentStateMap.type == "pretest" || this.currentStateMap.type == "posttest") {
n@911 236 if (this.currentStateMap.options.length >= 1) {
n@905 237 popup.initState(this.currentStateMap);
n@905 238 } else {
n@905 239 this.advanceState();
n@905 240 }
n@905 241 } else {
n@905 242 this.advanceState();
n@905 243 }
n@905 244 }
n@905 245 } else {
n@905 246 this.advanceInnerState();
n@905 247 }
n@905 248 };
n@905 249
n@905 250 this.testPageCompleted = function(store, testXML, testId) {
n@905 251 // Function called each time a test page has been completed
n@905 252 // Can be used to over-rule default behaviour
n@905 253
n@911 254 pageXMLSave(store, testXML);
n@906 255 };
n@905 256
n@911 257 this.initialiseInnerState = function(node) {
n@905 258 // Parses the received testXML for pre and post test options
n@905 259 this.currentStateMap = [];
n@911 260 var preTest = node.preTest;
n@911 261 var postTest = node.postTest;
n@905 262 if (preTest == undefined) {preTest = document.createElement("preTest");}
n@905 263 if (postTest == undefined){postTest= document.createElement("postTest");}
n@905 264 this.currentStateMap.push(preTest);
n@911 265 this.currentStateMap.push(node);
n@905 266 this.currentStateMap.push(postTest);
n@905 267 this.currentIndex = -1;
n@905 268 this.advanceInnerState();
n@906 269 };
n@905 270
n@905 271 this.advanceInnerState = function() {
n@905 272 this.currentIndex++;
n@905 273 if (this.currentIndex >= this.currentStateMap.length) {
n@905 274 this.currentIndex = null;
n@905 275 this.currentStateMap = this.stateMap[this.stateIndex];
n@905 276 this.advanceState();
n@905 277 } else {
n@911 278 if (this.currentStateMap[this.currentIndex].type == "audioHolder") {
n@905 279 console.log("Loading test page"+this.currentTestId);
n@911 280 } else if (this.currentStateMap[this.currentIndex].type == "pretest") {
n@905 281 popup.initState(this.currentStateMap[this.currentIndex]);
n@911 282 } else if (this.currentStateMap[this.currentIndex].type == "posttest") {
n@905 283 popup.initState(this.currentStateMap[this.currentIndex]);
n@905 284 } else {
n@905 285 this.advanceInnerState();
n@905 286 }
n@905 287 }
n@906 288 };
n@905 289
n@905 290 this.previousState = function(){};
n@905 291 }
n@905 292
n@905 293 function testEnded(testId)
n@905 294 {
n@905 295 pageXMLSave(testId);
n@905 296 if (testXMLSetups.length-1 > testId)
n@905 297 {
n@905 298 // Yes we have another test to perform
n@905 299 testId = (Number(testId)+1);
n@905 300 currentState = 'testRun-'+testId;
n@905 301 loadTest(testId);
n@905 302 } else {
n@905 303 console.log('Testing Completed!');
n@905 304 currentState = 'postTest';
n@905 305 // Check for any post tests
n@905 306 var xmlSetup = projectXML.find('setup');
n@905 307 var postTest = xmlSetup.find('PostTest')[0];
n@905 308 popup.initState(postTest);
n@905 309 }
n@905 310 }
n@905 311
n@905 312 function loadProjectSpec(url) {
n@905 313 // Load the project document from the given URL, decode the XML and instruct audioEngine to get audio data
n@905 314 // If url is null, request client to upload project XML document
n@905 315 var r = new XMLHttpRequest();
n@905 316 r.open('GET',url,true);
n@905 317 r.onload = function() {
n@905 318 loadProjectSpecCallback(r.response);
n@905 319 };
n@905 320 r.send();
n@905 321 };
n@905 322
n@905 323 function loadProjectSpecCallback(response) {
n@905 324 // Function called after asynchronous download of XML project specification
n@910 325 //var decode = $.parseXML(response);
n@910 326 //projectXML = $(decode);
n@910 327
n@910 328 var parse = new DOMParser();
n@910 329 projectXML = parse.parseFromString(response,'text/xml');
n@905 330
n@911 331 // Build the specification
n@911 332 specification.decode();
n@906 333
n@911 334 testState.stateMap.push(specification.preTest);
n@906 335
n@906 336 // New check if we need to randomise the test order
n@911 337 if (specification.randomiseOrder)
n@911 338 {
n@911 339 specification.audioHolders = randomiseOrder(specification.audioHolders);
n@906 340 }
n@906 341
n@911 342 $(specification.audioHolders).each(function(index,elem){
n@906 343 testState.stateMap.push(elem);
n@906 344 });
n@906 345
n@911 346 testState.stateMap.push(specification.postTest);
n@906 347
n@906 348 // Obtain the metrics enabled
n@911 349 $(specification.metrics).each(function(index,node){
n@906 350 var enabled = node.textContent;
n@911 351 switch(node.enabled)
n@906 352 {
n@906 353 case 'testTimer':
n@906 354 sessionMetrics.prototype.enableTestTimer = true;
n@906 355 break;
n@906 356 case 'elementTimer':
n@906 357 sessionMetrics.prototype.enableElementTimer = true;
n@906 358 break;
n@906 359 case 'elementTracker':
n@906 360 sessionMetrics.prototype.enableElementTracker = true;
n@906 361 break;
n@906 362 case 'elementListenTracker':
n@906 363 sessionMetrics.prototype.enableElementListenTracker = true;
n@906 364 break;
n@906 365 case 'elementInitialPosition':
n@906 366 sessionMetrics.prototype.enableElementInitialPosition = true;
n@906 367 break;
n@906 368 case 'elementFlagListenedTo':
n@906 369 sessionMetrics.prototype.enableFlagListenedTo = true;
n@906 370 break;
n@906 371 case 'elementFlagMoved':
n@906 372 sessionMetrics.prototype.enableFlagMoved = true;
n@906 373 break;
n@906 374 case 'elementFlagComments':
n@906 375 sessionMetrics.prototype.enableFlagComments = true;
n@906 376 break;
n@906 377 }
n@906 378 });
n@906 379
n@906 380
n@906 381
n@905 382 // Detect the interface to use and load the relevant javascripts.
n@905 383 var interfaceJS = document.createElement('script');
n@905 384 interfaceJS.setAttribute("type","text/javascript");
n@911 385 if (specification.interfaceType == 'APE') {
n@905 386 interfaceJS.setAttribute("src","ape.js");
n@905 387
n@905 388 // APE comes with a css file
n@905 389 var css = document.createElement('link');
n@905 390 css.rel = 'stylesheet';
n@905 391 css.type = 'text/css';
n@905 392 css.href = 'ape.css';
n@905 393
n@905 394 document.getElementsByTagName("head")[0].appendChild(css);
n@905 395 }
n@905 396 document.getElementsByTagName("head")[0].appendChild(interfaceJS);
n@905 397
n@905 398 // Define window callbacks for interface
n@905 399 window.onresize = function(event){resizeWindow(event);};
n@905 400 }
n@905 401
n@905 402 function createProjectSave(destURL) {
n@905 403 // Save the data from interface into XML and send to destURL
n@905 404 // If destURL is null then download XML in client
n@905 405 // Now time to render file locally
n@905 406 var xmlDoc = interfaceXMLSave();
n@905 407 var parent = document.createElement("div");
n@905 408 parent.appendChild(xmlDoc);
n@905 409 var file = [parent.innerHTML];
n@905 410 if (destURL == "null" || destURL == undefined) {
n@905 411 var bb = new Blob(file,{type : 'application/xml'});
n@905 412 var dnlk = window.URL.createObjectURL(bb);
n@905 413 var a = document.createElement("a");
n@905 414 a.hidden = '';
n@905 415 a.href = dnlk;
n@905 416 a.download = "save.xml";
n@905 417 a.textContent = "Save File";
n@905 418
n@905 419 popup.showPopup();
n@905 420 popup.popupContent.innerHTML = null;
n@911 421 popup.popupContent.appendChild(a)
n@905 422 } else {
n@905 423 var xmlhttp = new XMLHttpRequest;
n@905 424 xmlhttp.open("POST",destURL,true);
n@905 425 xmlhttp.setRequestHeader('Content-Type', 'text/xml');
n@905 426 xmlhttp.onerror = function(){
n@905 427 console.log('Error saving file to server! Presenting download locally');
n@905 428 createProjectSave(null);
n@905 429 };
n@905 430 xmlhttp.onreadystatechange = function() {
n@905 431 console.log(xmlhttp.status);
n@905 432 if (xmlhttp.status != 200 && xmlhttp.readyState == 4) {
n@905 433 createProjectSave(null);
n@905 434 }
n@905 435 };
n@905 436 xmlhttp.send(file);
n@905 437 }
n@905 438 return submitDiv;
n@905 439 }
n@905 440
n@905 441 // Only other global function which must be defined in the interface class. Determines how to create the XML document.
n@905 442 function interfaceXMLSave(){
n@905 443 // Create the XML string to be exported with results
n@905 444 var xmlDoc = document.createElement("BrowserEvaluationResult");
n@905 445 xmlDoc.appendChild(returnDateNode());
n@905 446 for (var i=0; i<testState.stateResults.length; i++)
n@905 447 {
n@905 448 xmlDoc.appendChild(testState.stateResults[i]);
n@905 449 }
n@905 450
n@905 451 return xmlDoc;
n@905 452 }
n@905 453
n@905 454 function AudioEngine() {
n@905 455
n@905 456 // Create two output paths, the main outputGain and fooGain.
n@905 457 // Output gain is default to 1 and any items for playback route here
n@905 458 // Foo gain is used for analysis to ensure paths get processed, but are not heard
n@905 459 // because web audio will optimise and any route which does not go to the destination gets ignored.
n@905 460 this.outputGain = audioContext.createGain();
n@905 461 this.fooGain = audioContext.createGain();
n@905 462 this.fooGain.gain = 0;
n@905 463
n@905 464 // Use this to detect playback state: 0 - stopped, 1 - playing
n@905 465 this.status = 0;
n@905 466 this.audioObjectsReady = false;
n@905 467
n@905 468 // Connect both gains to output
n@905 469 this.outputGain.connect(audioContext.destination);
n@905 470 this.fooGain.connect(audioContext.destination);
n@905 471
n@905 472 // Create the timer Object
n@905 473 this.timer = new timer();
n@905 474 // Create session metrics
n@905 475 this.metric = new sessionMetrics(this);
n@905 476
n@905 477 this.loopPlayback = false;
n@905 478
n@905 479 // Create store for new audioObjects
n@905 480 this.audioObjects = [];
n@905 481
n@905 482 this.play = function() {
n@905 483 // Start the timer and set the audioEngine state to playing (1)
n@905 484 if (this.status == 0) {
n@905 485 // Check if all audioObjects are ready
n@905 486 if (this.audioObjectsReady == false) {
n@905 487 this.audioObjectsReady = this.checkAllReady();
n@905 488 }
n@905 489 if (this.audioObjectsReady == true) {
n@905 490 this.timer.startTest();
n@905 491 if (this.loopPlayback) {
n@905 492 for(var i=0; i<this.audioObjects.length; i++) {
n@905 493 this.audioObjects[i].play(this.timer.getTestTime()+1);
n@905 494 }
n@905 495 }
n@905 496 this.status = 1;
n@905 497 }
n@905 498 }
n@905 499 };
n@905 500
n@905 501 this.stop = function() {
n@905 502 // Send stop and reset command to all playback buffers and set audioEngine state to stopped (1)
n@905 503 if (this.status == 1) {
n@905 504 for (var i=0; i<this.audioObjects.length; i++)
n@905 505 {
n@905 506 this.audioObjects[i].stop();
n@905 507 }
n@905 508 this.status = 0;
n@905 509 }
n@905 510 };
n@905 511
n@905 512
n@905 513 this.newTrack = function(url) {
n@905 514 // Pull data from given URL into new audio buffer
n@905 515 // URLs must either be from the same source OR be setup to 'Access-Control-Allow-Origin'
n@905 516
n@905 517 // Create the audioObject with ID of the new track length;
n@905 518 audioObjectId = this.audioObjects.length;
n@905 519 this.audioObjects[audioObjectId] = new audioObject(audioObjectId);
n@905 520
n@905 521 // AudioObject will get track itself.
n@905 522 this.audioObjects[audioObjectId].constructTrack(url);
n@909 523 return this.audioObjects[audioObjectId];
n@905 524 };
n@905 525
n@905 526 this.newTestPage = function() {
n@905 527 this.state = 0;
n@905 528 this.audioObjectsReady = false;
n@905 529 this.metric.reset();
n@905 530 this.audioObjects = [];
n@905 531 };
n@905 532
n@905 533 this.checkAllPlayed = function() {
n@905 534 arr = [];
n@905 535 for (var id=0; id<this.audioObjects.length; id++) {
n@905 536 if (this.audioObjects[id].metric.wasListenedTo == false) {
n@905 537 arr.push(this.audioObjects[id].id);
n@905 538 }
n@905 539 }
n@905 540 return arr;
n@905 541 };
n@905 542
n@905 543 this.checkAllReady = function() {
n@905 544 var ready = true;
n@905 545 for (var i=0; i<this.audioObjects.length; i++) {
n@905 546 if (this.audioObjects[i].state == 0) {
n@905 547 // Track not ready
n@905 548 console.log('WAIT -- audioObject '+i+' not ready yet!');
n@905 549 ready = false;
n@905 550 };
n@905 551 }
n@905 552 return ready;
n@905 553 };
n@905 554
n@905 555 }
n@905 556
n@905 557 function audioObject(id) {
n@905 558 // The main buffer object with common control nodes to the AudioEngine
n@905 559
n@905 560 this.id = id;
n@905 561 this.state = 0; // 0 - no data, 1 - ready
n@905 562 this.url = null; // Hold the URL given for the output back to the results.
n@905 563 this.metric = new metricTracker(this);
n@905 564
n@907 565 // Bindings for GUI
n@907 566 this.sliderDOM = null;
n@907 567 this.commentDOM = null;
n@907 568
n@905 569 // Create a buffer and external gain control to allow internal patching of effects and volume leveling.
n@905 570 this.bufferNode = undefined;
n@905 571 this.outputGain = audioContext.createGain();
n@905 572
n@905 573 // Default output gain to be zero
n@905 574 this.outputGain.gain.value = 0.0;
n@905 575
n@905 576 // Connect buffer to the audio graph
n@905 577 this.outputGain.connect(audioEngineContext.outputGain);
n@905 578
n@905 579 // the audiobuffer is not designed for multi-start playback
n@905 580 // When stopeed, the buffer node is deleted and recreated with the stored buffer.
n@905 581 this.buffer;
n@905 582
n@905 583 this.loopStart = function() {
n@905 584 this.outputGain.gain.value = 1.0;
n@905 585 this.metric.startListening(audioEngineContext.timer.getTestTime());
n@907 586 };
n@905 587
n@905 588 this.loopStop = function() {
n@905 589 if (this.outputGain.gain.value != 0.0) {
n@905 590 this.outputGain.gain.value = 0.0;
n@905 591 this.metric.stopListening(audioEngineContext.timer.getTestTime());
n@905 592 }
n@907 593 };
n@905 594
n@905 595 this.play = function(startTime) {
n@905 596 this.bufferNode = audioContext.createBufferSource();
n@905 597 this.bufferNode.owner = this;
n@905 598 this.bufferNode.connect(this.outputGain);
n@905 599 this.bufferNode.buffer = this.buffer;
n@905 600 this.bufferNode.loop = audioEngineContext.loopPlayback;
n@905 601 this.bufferNode.onended = function() {
n@905 602 // Safari does not like using 'this' to reference the calling object!
n@905 603 event.srcElement.owner.metric.stopListening(audioEngineContext.timer.getTestTime());
n@905 604 };
n@905 605 if (this.bufferNode.loop == false) {
n@905 606 this.metric.startListening(audioEngineContext.timer.getTestTime());
n@905 607 }
n@905 608 this.bufferNode.start(startTime);
n@905 609 };
n@905 610
n@905 611 this.stop = function() {
n@905 612 if (this.bufferNode != undefined)
n@905 613 {
n@905 614 this.bufferNode.stop(0);
n@905 615 this.bufferNode = undefined;
n@905 616 this.metric.stopListening(audioEngineContext.timer.getTestTime());
n@905 617 }
n@905 618 };
n@905 619
n@905 620 this.getCurrentPosition = function() {
n@905 621 var time = audioEngineContext.timer.getTestTime();
n@905 622 if (this.bufferNode != undefined) {
n@905 623 if (this.bufferNode.loop == true) {
n@905 624 if (audioEngineContext.status == 1) {
n@905 625 return time%this.buffer.duration;
n@905 626 } else {
n@905 627 return 0;
n@905 628 }
n@905 629 } else {
n@905 630 if (this.metric.listenHold) {
n@905 631 return time - this.metric.listenStart;
n@905 632 } else {
n@905 633 return 0;
n@905 634 }
n@905 635 }
n@905 636 } else {
n@905 637 return 0;
n@905 638 }
n@905 639 };
n@905 640
n@905 641 this.constructTrack = function(url) {
n@905 642 var request = new XMLHttpRequest();
n@905 643 this.url = url;
n@905 644 request.open('GET',url,true);
n@905 645 request.responseType = 'arraybuffer';
n@905 646
n@905 647 var audioObj = this;
n@905 648
n@905 649 // Create callback to decode the data asynchronously
n@905 650 request.onloadend = function() {
n@905 651 audioContext.decodeAudioData(request.response, function(decodedData) {
n@905 652 audioObj.buffer = decodedData;
n@905 653 audioObj.state = 1;
n@905 654 }, function(){
n@905 655 // Should only be called if there was an error, but sometimes gets called continuously
n@905 656 // Check here if the error is genuine
n@905 657 if (audioObj.state == 0 || audioObj.buffer == undefined) {
n@905 658 // Genuine error
n@905 659 console.log('FATAL - Error loading buffer on '+audioObj.id);
n@905 660 }
n@905 661 });
n@905 662 };
n@905 663 request.send();
n@905 664 };
n@905 665 }
n@905 666
n@905 667 function timer()
n@905 668 {
n@905 669 /* Timer object used in audioEngine to keep track of session timings
n@905 670 * Uses the timer of the web audio API, so sample resolution
n@905 671 */
n@905 672 this.testStarted = false;
n@905 673 this.testStartTime = 0;
n@905 674 this.testDuration = 0;
n@905 675 this.minimumTestTime = 0; // No minimum test time
n@905 676 this.startTest = function()
n@905 677 {
n@905 678 if (this.testStarted == false)
n@905 679 {
n@905 680 this.testStartTime = audioContext.currentTime;
n@905 681 this.testStarted = true;
n@905 682 this.updateTestTime();
n@905 683 audioEngineContext.metric.initialiseTest();
n@905 684 }
n@905 685 };
n@905 686 this.stopTest = function()
n@905 687 {
n@905 688 if (this.testStarted)
n@905 689 {
n@905 690 this.testDuration = this.getTestTime();
n@905 691 this.testStarted = false;
n@905 692 } else {
n@905 693 console.log('ERR: Test tried to end before beginning');
n@905 694 }
n@905 695 };
n@905 696 this.updateTestTime = function()
n@905 697 {
n@905 698 if (this.testStarted)
n@905 699 {
n@905 700 this.testDuration = audioContext.currentTime - this.testStartTime;
n@905 701 }
n@905 702 };
n@905 703 this.getTestTime = function()
n@905 704 {
n@905 705 this.updateTestTime();
n@905 706 return this.testDuration;
n@905 707 };
n@905 708 }
n@905 709
n@905 710 function sessionMetrics(engine)
n@905 711 {
n@905 712 /* Used by audioEngine to link to audioObjects to minimise the timer call timers;
n@905 713 */
n@905 714 this.engine = engine;
n@905 715 this.lastClicked = -1;
n@905 716 this.data = -1;
n@905 717 this.reset = function() {
n@905 718 this.lastClicked = -1;
n@905 719 this.data = -1;
n@905 720 };
n@905 721 this.initialiseTest = function(){};
n@905 722 }
n@905 723
n@905 724 function metricTracker(caller)
n@905 725 {
n@905 726 /* Custom object to track and collect metric data
n@905 727 * Used only inside the audioObjects object.
n@905 728 */
n@905 729
n@905 730 this.listenedTimer = 0;
n@905 731 this.listenStart = 0;
n@905 732 this.listenHold = false;
n@905 733 this.initialPosition = -1;
n@905 734 this.movementTracker = [];
n@905 735 this.listenTracker =[];
n@905 736 this.wasListenedTo = false;
n@905 737 this.wasMoved = false;
n@905 738 this.hasComments = false;
n@905 739 this.parent = caller;
n@905 740
n@905 741 this.initialised = function(position)
n@905 742 {
n@905 743 if (this.initialPosition == -1) {
n@905 744 this.initialPosition = position;
n@905 745 }
n@905 746 };
n@905 747
n@905 748 this.moved = function(time,position)
n@905 749 {
n@905 750 this.wasMoved = true;
n@905 751 this.movementTracker[this.movementTracker.length] = [time, position];
n@905 752 };
n@905 753
n@905 754 this.startListening = function(time)
n@905 755 {
n@905 756 if (this.listenHold == false)
n@905 757 {
n@905 758 this.wasListenedTo = true;
n@905 759 this.listenStart = time;
n@905 760 this.listenHold = true;
n@905 761
n@905 762 var evnt = document.createElement('event');
n@905 763 var testTime = document.createElement('testTime');
n@905 764 testTime.setAttribute('start',time);
n@905 765 var bufferTime = document.createElement('bufferTime');
n@905 766 bufferTime.setAttribute('start',this.parent.getCurrentPosition());
n@905 767 evnt.appendChild(testTime);
n@905 768 evnt.appendChild(bufferTime);
n@905 769 this.listenTracker.push(evnt);
n@905 770
n@905 771 console.log('slider ' + this.parent.id + ' played (' + time + ')'); // DEBUG/SAFETY: show played slider id
n@905 772 }
n@905 773 };
n@905 774
n@905 775 this.stopListening = function(time)
n@905 776 {
n@905 777 if (this.listenHold == true)
n@905 778 {
n@905 779 var diff = time - this.listenStart;
n@905 780 this.listenedTimer += (diff);
n@905 781 this.listenStart = 0;
n@905 782 this.listenHold = false;
n@905 783
n@905 784 var evnt = this.listenTracker[this.listenTracker.length-1];
n@905 785 var testTime = evnt.getElementsByTagName('testTime')[0];
n@905 786 var bufferTime = evnt.getElementsByTagName('bufferTime')[0];
n@905 787 testTime.setAttribute('stop',time);
n@905 788 bufferTime.setAttribute('stop',this.parent.getCurrentPosition());
n@905 789 console.log('slider ' + this.parent.id + ' played for (' + diff + ')'); // DEBUG/SAFETY: show played slider id
n@905 790 }
n@905 791 };
n@907 792
n@907 793 this.exportXMLDOM = function() {
n@907 794 var root = document.createElement('metric');
n@907 795 if (audioEngineContext.metric.enableElementTimer) {
n@907 796 var mElementTimer = document.createElement('metricresult');
n@907 797 mElementTimer.setAttribute('name','enableElementTimer');
n@907 798 mElementTimer.textContent = this.listenedTimer;
n@907 799 root.appendChild(mElementTimer);
n@907 800 }
n@907 801 if (audioEngineContext.metric.enableElementTracker) {
n@907 802 var elementTrackerFull = document.createElement('metricResult');
n@907 803 elementTrackerFull.setAttribute('name','elementTrackerFull');
n@907 804 for (var k=0; k<this.movementTracker.length; k++)
n@907 805 {
n@907 806 var timePos = document.createElement('timePos');
n@907 807 timePos.id = k;
n@907 808 var time = document.createElement('time');
n@907 809 time.textContent = this.movementTracker[k][0];
n@907 810 var position = document.createElement('position');
n@907 811 position.textContent = this.movementTracker[k][1];
n@907 812 timePos.appendChild(time);
n@907 813 timePos.appendChild(position);
n@907 814 elementTrackerFull.appendChild(timePos);
n@907 815 }
n@907 816 root.appendChild(elementTrackerFull);
n@907 817 }
n@907 818 if (audioEngineContext.metric.enableElementListenTracker) {
n@907 819 var elementListenTracker = document.createElement('metricResult');
n@907 820 elementListenTracker.setAttribute('name','elementListenTracker');
n@907 821 for (var k=0; k<this.listenTracker.length; k++) {
n@907 822 elementListenTracker.appendChild(this.listenTracker[k]);
n@907 823 }
n@907 824 root.appendChild(elementListenTracker);
n@907 825 }
n@907 826 if (audioEngineContext.metric.enableElementInitialPosition) {
n@907 827 var elementInitial = document.createElement('metricResult');
n@907 828 elementInitial.setAttribute('name','elementInitialPosition');
n@907 829 elementInitial.textContent = this.initialPosition;
n@907 830 root.appendChild(elementInitial);
n@907 831 }
n@907 832 if (audioEngineContext.metric.enableFlagListenedTo) {
n@907 833 var flagListenedTo = document.createElement('metricResult');
n@907 834 flagListenedTo.setAttribute('name','elementFlagListenedTo');
n@907 835 flagListenedTo.textContent = this.wasListenedTo;
n@907 836 root.appendChild(flagListenedTo);
n@907 837 }
n@907 838 if (audioEngineContext.metric.enableFlagMoved) {
n@907 839 var flagMoved = document.createElement('metricResult');
n@907 840 flagMoved.setAttribute('name','elementFlagMoved');
n@907 841 flagMoved.textContent = this.wasMoved;
n@907 842 root.appendChild(flagMoved);
n@907 843 }
n@907 844 if (audioEngineContext.metric.enableFlagComments) {
n@907 845 var flagComments = document.createElement('metricResult');
n@907 846 flagComments.setAttribute('name','elementFlagComments');
n@907 847 if (this.parent.commentDOM == null)
n@907 848 {flag.textContent = 'false';}
n@907 849 else if (this.parent.commentDOM.textContent.length == 0)
n@907 850 {flag.textContent = 'false';}
n@907 851 else
n@907 852 {flag.textContet = 'true';}
n@907 853 root.appendChild(flagComments);
n@907 854 }
n@907 855
n@907 856 return root;
n@907 857 };
n@905 858 }
n@905 859
n@905 860 function randomiseOrder(input)
n@905 861 {
n@905 862 // This takes an array of information and randomises the order
n@905 863 var N = input.length;
n@905 864 var K = N;
n@905 865 var holdArr = [];
n@905 866 for (var n=0; n<N; n++)
n@905 867 {
n@905 868 // First pick a random number
n@905 869 var r = Math.random();
n@905 870 // Multiply and floor by the number of elements left
n@905 871 r = Math.floor(r*input.length);
n@905 872 // Pick out that element and delete from the array
n@905 873 holdArr.push(input.splice(r,1)[0]);
n@905 874 }
n@905 875 return holdArr;
n@905 876 }
n@905 877
n@905 878 function returnDateNode()
n@905 879 {
n@905 880 // Create an XML Node for the Date and Time a test was conducted
n@905 881 // Structure is
n@905 882 // <datetime>
n@905 883 // <date year="##" month="##" day="##">DD/MM/YY</date>
n@905 884 // <time hour="##" minute="##" sec="##">HH:MM:SS</time>
n@905 885 // </datetime>
n@905 886 var dateTime = new Date();
n@905 887 var year = document.createAttribute('year');
n@905 888 var month = document.createAttribute('month');
n@905 889 var day = document.createAttribute('day');
n@905 890 var hour = document.createAttribute('hour');
n@905 891 var minute = document.createAttribute('minute');
n@905 892 var secs = document.createAttribute('secs');
n@905 893
n@905 894 year.nodeValue = dateTime.getFullYear();
n@905 895 month.nodeValue = dateTime.getMonth()+1;
n@905 896 day.nodeValue = dateTime.getDate();
n@905 897 hour.nodeValue = dateTime.getHours();
n@905 898 minute.nodeValue = dateTime.getMinutes();
n@905 899 secs.nodeValue = dateTime.getSeconds();
n@905 900
n@905 901 var hold = document.createElement("datetime");
n@905 902 var date = document.createElement("date");
n@905 903 date.textContent = year.nodeValue+'/'+month.nodeValue+'/'+day.nodeValue;
n@905 904 var time = document.createElement("time");
n@905 905 time.textContent = hour.nodeValue+':'+minute.nodeValue+':'+secs.nodeValue;
n@905 906
n@905 907 date.setAttributeNode(year);
n@905 908 date.setAttributeNode(month);
n@905 909 date.setAttributeNode(day);
n@905 910 time.setAttributeNode(hour);
n@905 911 time.setAttributeNode(minute);
n@905 912 time.setAttributeNode(secs);
n@905 913
n@905 914 hold.appendChild(date);
n@905 915 hold.appendChild(time);
n@905 916 return hold
n@905 917
n@905 918 }
n@905 919
n@905 920 function testWaitIndicator() {
n@905 921 if (audioEngineContext.checkAllReady() == false) {
n@905 922 var hold = document.createElement("div");
n@905 923 hold.id = "testWaitIndicator";
n@905 924 hold.className = "indicator-box";
n@905 925 var span = document.createElement("span");
n@905 926 span.textContent = "Please wait! Elements still loading";
n@905 927 hold.appendChild(span);
n@905 928 var body = document.getElementsByTagName('body')[0];
n@905 929 body.appendChild(hold);
n@905 930 testWaitTimerIntervalHolder = setInterval(function(){
n@905 931 var ready = audioEngineContext.checkAllReady();
n@905 932 if (ready) {
n@905 933 var elem = document.getElementById('testWaitIndicator');
n@905 934 var body = document.getElementsByTagName('body')[0];
n@905 935 body.removeChild(elem);
n@905 936 clearInterval(testWaitTimerIntervalHolder);
n@905 937 }
n@905 938 },500,false);
n@905 939 }
n@905 940 }
n@905 941
n@905 942 var testWaitTimerIntervalHolder = null;
n@910 943
n@910 944 function Specification() {
n@910 945 // Handles the decoding of the project specification XML into a simple JavaScript Object.
n@910 946
n@910 947 this.interfaceType;
n@910 948 this.projectReturn;
n@910 949 this.randomiseOrder;
n@910 950 this.collectMetrics;
n@910 951 this.preTest;
n@910 952 this.postTest;
n@910 953 this.metrics =[];
n@910 954
n@910 955 this.audioHolders = [];
n@910 956
n@910 957 this.decode = function() {
n@910 958 // projectXML - DOM Parsed document
n@910 959 var setupNode = projectXML.getElementsByTagName('setup')[0];
n@910 960 this.interfaceType = setupNode.getAttribute('interface');
n@910 961 this.projectReturn = setupNode.getAttribute('projectReturn');
n@910 962 if (setupNode.getAttribute('randomiseOrder') == "true") {
n@910 963 this.randomiseOrder = true;
n@910 964 } else {this.setup.randomiseOrder = false;}
n@910 965 if (setupNode.getAttribute('collectMetrics') == "true") {
n@910 966 this.collectMetrics = true;
n@910 967 } else {this.setup.collectMetrics = false;}
n@910 968 var metricCollection = setupNode.getElementsByTagName('Metric');
n@910 969
n@911 970 this.preTest = new this.prepostNode('pretest',setupNode.getElementsByTagName('PreTest'));
n@911 971 this.postTest = new this.prepostNode('posttest',setupNode.getElementsByTagName('PostTest'));
n@910 972
n@910 973 if (metricCollection.length > 0) {
n@910 974 metricCollection = metricCollection[0].getElementsByTagName('metricEnable');
n@910 975 for (var i=0; i<metricCollection.length; i++) {
n@911 976 this.metrics.push(new this.metricNode(metricCollection[i].textContent));
n@910 977 }
n@910 978 }
n@910 979
n@910 980 var audioHolders = projectXML.getElementsByTagName('audioHolder');
n@910 981 for (var i=0; i<audioHolders.length; i++) {
n@910 982 this.audioHolders.push(new this.audioHolderNode(this,audioHolders[i]));
n@910 983 }
n@910 984
n@910 985 };
n@910 986
n@910 987 this.prepostNode = function(type,Collection) {
n@910 988 this.type = type;
n@910 989 this.options = [];
n@910 990
n@910 991 this.OptionNode = function(child) {
n@910 992 this.type = child.nodeName;
n@910 993 if (child.nodeName == "question") {
n@910 994 this.id = child.id;
n@910 995 this.mandatory;
n@910 996 if (child.getAttribute('mandatory') == "true") {this.mandatory = true;}
n@910 997 else {this.mandatory = false;}
n@910 998 this.question = child.textContent;
n@910 999 } else if (child.nodeName == "statement") {
n@911 1000 this.statement = child.textContent;
n@910 1001 }
n@910 1002 };
n@910 1003
n@910 1004 // On construction:
n@910 1005 if (Collection.length != 0) {
n@910 1006 Collection = Collection[0];
n@910 1007 for (var i=0; i<Collection.childElementCount; i++) {
n@910 1008 var child = Collection.children[i];
n@910 1009 this.options.push(new this.OptionNode(child));
n@910 1010 }
n@910 1011 }
n@910 1012 };
n@910 1013
n@910 1014 this.metricNode = function(name) {
n@910 1015 this.enabled = name;
n@910 1016 };
n@910 1017
n@910 1018 this.audioHolderNode = function(parent,xml) {
n@911 1019 this.type = 'audioHolder';
n@910 1020 this.interfaceNode = function(DOM) {
n@910 1021 var title = DOM.getElementsByTagName('title');
n@910 1022 if (title.length == 0) {this.title = null;}
n@910 1023 else {this.title = title[0].textContent;}
n@910 1024
n@910 1025 var scale = DOM.getElementsByTagName('scale');
n@910 1026 this.scale = [];
n@910 1027 for (var i=0; i<scale.length; i++) {
n@910 1028 var arr = [null, null];
n@910 1029 arr[0] = scale[i].getAttribute('position');
n@910 1030 arr[1] = scale[i].textContent;
n@910 1031 this.scale.push(arr);
n@910 1032 }
n@910 1033 };
n@910 1034
n@910 1035 this.audioElementNode = function(xml) {
n@910 1036 this.url = xml.getAttribute('url');
n@910 1037 this.id = xml.id;
n@910 1038 };
n@910 1039
n@910 1040 this.commentQuestionNode = function(xml) {
n@910 1041 this.id = xml.id;
n@910 1042 if (xml.getAttribute('mandatory') == 'true') {this.mandatory = true;}
n@910 1043 else {this.mandatory = false;}
n@910 1044 this.question = xml.textContent;
n@910 1045 };
n@910 1046
n@910 1047 this.id = xml.id;
n@910 1048 this.hostURL = xml.getAttribute('hostURL');
n@910 1049 this.sampleRate = xml.getAttribute('sampleRate');
n@910 1050 if (xml.getAttribute('randomiseOrder') == "true") {this.randomiseOrder = true;}
n@910 1051 else {this.randomiseOrder = false;}
n@910 1052 this.repeatCount = xml.getAttribute('repeatCount');
n@910 1053 if (xml.getAttribute('loop') == 'true') {this.loop = true;}
n@910 1054 else {this.loop == false;}
n@910 1055 if (xml.getAttribute('elementComments') == "true") {this.elementComments = true;}
n@910 1056 else {this.elementComments = false;}
n@910 1057
n@911 1058 this.preTest = new parent.prepostNode('pretest',xml.getElementsByTagName('PreTest'));
n@911 1059 this.postTest = new parent.prepostNode('posttest',xml.getElementsByTagName('PostTest'));
n@910 1060
n@910 1061 this.interfaces = [];
n@910 1062 var interfaceDOM = xml.getElementsByTagName('interface');
n@910 1063 for (var i=0; i<interfaceDOM.length; i++) {
n@910 1064 this.interfaces.push(new this.interfaceNode(interfaceDOM[i]));
n@910 1065 }
n@910 1066
n@910 1067 this.commentBoxPrefix = xml.getElementsByTagName('commentBoxPrefix');
n@910 1068 if (this.commentBoxPrefix.length != 0) {
n@910 1069 this.commentBoxPrefix = this.commentBoxPrefix[0].textContent;
n@910 1070 } else {
n@910 1071 this.commentBoxPrefix = "Comment on track";
n@910 1072 }
n@910 1073
n@910 1074 this.audioElements =[];
n@910 1075 var audioElementsDOM = xml.getElementsByTagName('audioElements');
n@910 1076 for (var i=0; i<audioElementsDOM.length; i++) {
n@910 1077 this.audioElements.push(new this.audioElementNode(audioElementsDOM[i]));
n@910 1078 }
n@910 1079
n@910 1080 this.commentQuestions = [];
n@910 1081 var commentQuestionsDOM = xml.getElementsByTagName('CommentQuestion');
n@910 1082 for (var i=0; i<commentQuestionsDOM.length; i++) {
n@910 1083 this.commentQuestions.push(new this.commentQuestionNode(commentQuestionsDOM[i]));
n@910 1084 }
n@910 1085 };
n@910 1086 }
n@910 1087
n@910 1088 function Interface() {
n@910 1089 // This handles the bindings between the interface and the audioEngineContext;
n@910 1090
n@910 1091 }
n@910 1092