comparison core.js @ 814:22ad83e232f7

Fixing Win/OSX differences for APE slider, unstable.
author Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
date Mon, 23 Nov 2015 17:44:25 +0000
parents
children 1db3dd91fb26
comparison
equal deleted inserted replaced
-1:000000000000 814:22ad83e232f7
1 /**
2 * core.js
3 *
4 * Main script to run, calls all other core functions and manages loading/store to backend.
5 * Also contains all global variables.
6 */
7
8 /* create the web audio API context and store in audioContext*/
9 var audioContext; // Hold the browser web audio API
10 var projectXML; // Hold the parsed setup XML
11 var specification;
12 var interfaceContext;
13 var popup; // Hold the interfacePopup object
14 var testState;
15 var currentTrackOrder = []; // Hold the current XML tracks in their (randomised) order
16 var audioEngineContext; // The custome AudioEngine object
17 var projectReturn; // Hold the URL for the return
18
19
20 // Add a prototype to the bufferSourceNode to reference to the audioObject holding it
21 AudioBufferSourceNode.prototype.owner = undefined;
22
23 window.onload = function() {
24 // Function called once the browser has loaded all files.
25 // This should perform any initial commands such as structure / loading documents
26
27 // Create a web audio API context
28 // Fixed for cross-browser support
29 var AudioContext = window.AudioContext || window.webkitAudioContext;
30 audioContext = new AudioContext;
31
32 // Create test state
33 testState = new stateMachine();
34
35 // Create the audio engine object
36 audioEngineContext = new AudioEngine();
37
38 // Create the popup interface object
39 popup = new interfacePopup();
40
41 // Create the specification object
42 specification = new Specification();
43
44 // Create the interface object
45 interfaceContext = new Interface(specification);
46 };
47
48 function interfacePopup() {
49 // Creates an object to manage the popup
50 this.popup = null;
51 this.popupContent = null;
52 this.popupTitle = null;
53 this.popupResponse = null;
54 this.buttonProceed = null;
55 this.buttonPrevious = null;
56 this.popupOptions = null;
57 this.currentIndex = null;
58 this.responses = null;
59
60 this.createPopup = function(){
61 // Create popup window interface
62 var insertPoint = document.getElementById("topLevelBody");
63 var blank = document.createElement('div');
64 blank.className = 'testHalt';
65
66 this.popup = document.createElement('div');
67 this.popup.id = 'popupHolder';
68 this.popup.className = 'popupHolder';
69 this.popup.style.position = 'absolute';
70 this.popup.style.left = (window.innerWidth/2)-250 + 'px';
71 this.popup.style.top = (window.innerHeight/2)-125 + 'px';
72
73 this.popupContent = document.createElement('div');
74 this.popupContent.id = 'popupContent';
75 this.popupContent.style.marginTop = '20px';
76 this.popupContent.align = 'center';
77 this.popup.appendChild(this.popupContent);
78
79 var titleHolder = document.createElement('div');
80 titleHolder.id = 'popupTitleHolder';
81 titleHolder.style.width = 'inherit';
82 titleHolder.style.height = '25px';
83 titleHolder.style.marginBottom = '5px';
84
85 this.popupTitle = document.createElement('span');
86 this.popupTitle.id = 'popupTitle';
87 titleHolder.appendChild(this.popupTitle);
88 this.popupContent.appendChild(titleHolder);
89
90 this.popupResponse = document.createElement('div');
91 this.popupResponse.id = 'popupResponse';
92 this.popupResponse.style.width = 'inherit';
93 this.popupResponse.style.minHeight = '170px';
94 this.popupResponse.style.maxHeight = '320px';
95 this.popupResponse.style.overflow = 'auto';
96 this.popupContent.appendChild(this.popupResponse);
97
98 var buttonHolder = document.createElement('div');
99 buttonHolder.id='buttonHolder';
100 buttonHolder.width = 'inherit';
101 buttonHolder.style.height= '30px';
102 buttonHolder.align = 'left';
103 this.popupContent.appendChild(buttonHolder);
104
105 this.buttonProceed = document.createElement('button');
106 this.buttonProceed.className = 'popupButton';
107 this.buttonProceed.style.left = '390px';
108 this.buttonProceed.style.top = '2px';
109 this.buttonProceed.innerHTML = 'Next';
110 this.buttonProceed.onclick = function(){popup.proceedClicked();};
111
112 this.buttonPrevious = document.createElement('button');
113 this.buttonPrevious.className = 'popupButton';
114 this.buttonPrevious.style.left = '10px';
115 this.buttonPrevious.style.top = '2px';
116 this.buttonPrevious.innerHTML = 'Back';
117 this.buttonPrevious.onclick = function(){popup.previousClick();};
118
119 buttonHolder.appendChild(this.buttonPrevious);
120 buttonHolder.appendChild(this.buttonProceed);
121
122 this.popup.style.zIndex = -1;
123 this.popup.style.visibility = 'hidden';
124 blank.style.zIndex = -2;
125 blank.style.visibility = 'hidden';
126 insertPoint.appendChild(this.popup);
127 insertPoint.appendChild(blank);
128 };
129
130 this.showPopup = function(){
131 if (this.popup == null) {
132 this.createPopup();
133 }
134 this.popup.style.zIndex = 3;
135 this.popup.style.visibility = 'visible';
136 var blank = document.getElementsByClassName('testHalt')[0];
137 blank.style.zIndex = 2;
138 blank.style.visibility = 'visible';
139 $(window).keypress(function(e){
140 if (e.keyCode == 13 && popup.popup.style.visibility == 'visible')
141 {
142 // Enter key pressed
143 var textarea = $(popup.popupContent).find('textarea');
144 if (textarea.length != 0)
145 {
146 if (textarea[0] == document.activeElement)
147 {return;}
148 }
149 popup.buttonProceed.onclick();
150 }
151 });
152 };
153
154 this.hidePopup = function(){
155 this.popup.style.zIndex = -1;
156 this.popup.style.visibility = 'hidden';
157 var blank = document.getElementsByClassName('testHalt')[0];
158 blank.style.zIndex = -2;
159 blank.style.visibility = 'hidden';
160 this.buttonPrevious.style.visibility = 'inherit';
161 };
162
163 this.postNode = function() {
164 // This will take the node from the popupOptions and display it
165 var node = this.popupOptions[this.currentIndex];
166 this.popupResponse.innerHTML = null;
167 if (node.type == 'statement') {
168 this.popupTitle.textContent = null;
169 var statement = document.createElement('span');
170 statement.textContent = node.statement;
171 this.popupResponse.appendChild(statement);
172 } else if (node.type == 'question') {
173 this.popupTitle.textContent = node.question;
174 var textArea = document.createElement('textarea');
175 switch (node.boxsize) {
176 case 'small':
177 textArea.cols = "20";
178 textArea.rows = "1";
179 break;
180 case 'normal':
181 textArea.cols = "30";
182 textArea.rows = "2";
183 break;
184 case 'large':
185 textArea.cols = "40";
186 textArea.rows = "5";
187 break;
188 case 'huge':
189 textArea.cols = "50";
190 textArea.rows = "10";
191 break;
192 }
193 document.onkeydown=function(){
194 if(window.event.keyCode=='13'){ // when you hit enter
195 window.event.preventDefault(); // don't make newline
196 popup.proceedClicked(); // go to the next window (or start the test or submit)
197 }
198 }
199 this.popupResponse.appendChild(textArea);
200 textArea.focus();
201 } else if (node.type == 'checkbox') {
202 this.popupTitle.textContent = node.statement;
203 var optHold = this.popupResponse;
204 for (var i=0; i<node.options.length; i++) {
205 var option = node.options[i];
206 var input = document.createElement('input');
207 input.id = option.id;
208 input.type = 'checkbox';
209 var span = document.createElement('span');
210 span.textContent = option.text;
211 var hold = document.createElement('div');
212 hold.setAttribute('name','option');
213 hold.style.padding = '4px';
214 hold.appendChild(input);
215 hold.appendChild(span);
216 optHold.appendChild(hold);
217 }
218 } else if (node.type == 'radio') {
219 this.popupTitle.textContent = node.statement;
220 var optHold = this.popupResponse;
221 for (var i=0; i<node.options.length; i++) {
222 var option = node.options[i];
223 var input = document.createElement('input');
224 input.id = option.name;
225 input.type = 'radio';
226 input.name = node.id;
227 var span = document.createElement('span');
228 span.textContent = option.text;
229 var hold = document.createElement('div');
230 hold.setAttribute('name','option');
231 hold.style.padding = '4px';
232 hold.appendChild(input);
233 hold.appendChild(span);
234 optHold.appendChild(hold);
235 }
236 } else if (node.type == 'number') {
237 this.popupTitle.textContent = node.statement;
238 var input = document.createElement('input');
239 input.type = 'textarea';
240 if (node.min != null) {input.min = node.min;}
241 if (node.max != null) {input.max = node.max;}
242 if (node.step != null) {input.step = node.step;}
243 this.popupResponse.appendChild(input);
244 }
245 if(this.currentIndex+1 == this.popupOptions.length) {
246 if (this.responses.nodeName == "PRETEST") {
247 this.buttonProceed.textContent = 'Start';
248 } else {
249 this.buttonProceed.textContent = 'Submit';
250 }
251 } else {
252 this.buttonProceed.textContent = 'Next';
253 }
254 if(this.currentIndex > 0)
255 this.buttonPrevious.style.visibility = 'visible';
256 else
257 this.buttonPrevious.style.visibility = 'hidden';
258 };
259
260 this.initState = function(node) {
261 //Call this with your preTest and postTest nodes when needed to
262 // initialise the popup procedure.
263 this.popupOptions = node.options;
264 if (this.popupOptions.length > 0) {
265 if (node.type == 'pretest') {
266 this.responses = document.createElement('PreTest');
267 } else if (node.type == 'posttest') {
268 this.responses = document.createElement('PostTest');
269 } else {
270 console.log ('WARNING - popup node neither pre or post!');
271 this.responses = document.createElement('responses');
272 }
273 this.currentIndex = 0;
274 this.showPopup();
275 this.postNode();
276 } else {
277 advanceState();
278 }
279 };
280
281 this.proceedClicked = function() {
282 // Each time the popup button is clicked!
283 var node = this.popupOptions[this.currentIndex];
284 if (node.type == 'question') {
285 // Must extract the question data
286 var textArea = $(popup.popupContent).find('textarea')[0];
287 if (node.mandatory == true && textArea.value.length == 0) {
288 alert('This question is mandatory');
289 return;
290 } else {
291 // Save the text content
292 var hold = document.createElement('comment');
293 hold.id = node.id;
294 hold.innerHTML = textArea.value;
295 console.log("Question: "+ node.question);
296 console.log("Question Response: "+ textArea.value);
297 this.responses.appendChild(hold);
298 }
299 } else if (node.type == 'checkbox') {
300 // Must extract checkbox data
301 var optHold = this.popupResponse;
302 var hold = document.createElement('checkbox');
303 console.log("Checkbox: "+ node.statement);
304 hold.id = node.id;
305 for (var i=0; i<optHold.childElementCount; i++) {
306 var input = optHold.childNodes[i].getElementsByTagName('input')[0];
307 var statement = optHold.childNodes[i].getElementsByTagName('span')[0];
308 var response = document.createElement('option');
309 response.setAttribute('name',input.id);
310 response.textContent = input.checked;
311 hold.appendChild(response);
312 console.log(input.id +': '+ input.checked);
313 }
314 this.responses.appendChild(hold);
315 } else if (node.type == "radio") {
316 var optHold = this.popupResponse;
317 var hold = document.createElement('radio');
318 var responseID = null;
319 var i=0;
320 while(responseID == null) {
321 var input = optHold.childNodes[i].getElementsByTagName('input')[0];
322 if (input.checked == true) {
323 responseID = i;
324 }
325 i++;
326 }
327 hold.id = node.id;
328 hold.setAttribute('name',node.options[responseID].name);
329 hold.textContent = node.options[responseID].text;
330 this.responses.appendChild(hold);
331 } else if (node.type == "number") {
332 var input = this.popupContent.getElementsByTagName('input')[0];
333 if (node.mandatory == true && input.value.length == 0) {
334 alert('This question is mandatory. Please enter a number');
335 return;
336 }
337 var enteredNumber = Number(input.value);
338 if (isNaN(enteredNumber)) {
339 alert('Please enter a valid number');
340 return;
341 }
342 if (enteredNumber < node.min && node.min != null) {
343 alert('Number is below the minimum value of '+node.min);
344 return;
345 }
346 if (enteredNumber > node.max && node.max != null) {
347 alert('Number is above the maximum value of '+node.max);
348 return;
349 }
350 var hold = document.createElement('number');
351 hold.id = node.id;
352 hold.textContent = input.value;
353 this.responses.appendChild(hold);
354 }
355 this.currentIndex++;
356 if (this.currentIndex < this.popupOptions.length) {
357 this.postNode();
358 } else {
359 // Reached the end of the popupOptions
360 this.hidePopup();
361 if (this.responses.nodeName == testState.stateResults[testState.stateIndex].nodeName) {
362 testState.stateResults[testState.stateIndex] = this.responses;
363 } else {
364 testState.stateResults[testState.stateIndex].appendChild(this.responses);
365 }
366 advanceState();
367 }
368 };
369
370 this.previousClick = function() {
371 // Triggered when the 'Back' button is clicked in the survey
372 if (this.currentIndex > 0) {
373 this.currentIndex--;
374 var node = this.popupOptions[this.currentIndex];
375 if (node.type != 'statement') {
376 var prevResp = this.responses.childNodes[this.responses.childElementCount-1];
377 this.responses.removeChild(prevResp);
378 }
379 this.postNode();
380 if (node.type == 'question') {
381 this.popupContent.getElementsByTagName('textarea')[0].value = prevResp.textContent;
382 } else if (node.type == 'checkbox') {
383 var options = this.popupContent.getElementsByTagName('input');
384 var savedOptions = prevResp.getElementsByTagName('option');
385 for (var i=0; i<options.length; i++) {
386 var id = options[i].id;
387 for (var j=0; j<savedOptions.length; j++) {
388 if (savedOptions[j].getAttribute('name') == id) {
389 if (savedOptions[j].textContent == 'true') {options[i].checked = true;}
390 else {options[i].checked = false;}
391 break;
392 }
393 }
394 }
395 } else if (node.type == 'number') {
396 this.popupContent.getElementsByTagName('input')[0].value = prevResp.textContent;
397 } else if (node.type == 'radio') {
398 var options = this.popupContent.getElementsByTagName('input');
399 var name = prevResp.getAttribute('name');
400 for (var i=0; i<options.length; i++) {
401 if (options[i].id == name) {
402 options[i].checked = true;
403 break;
404 }
405 }
406 }
407 }
408 };
409 }
410
411 function advanceState()
412 {
413 // Just for complete clarity
414 testState.advanceState();
415 }
416
417 function stateMachine()
418 {
419 // Object prototype for tracking and managing the test state
420 this.stateMap = [];
421 this.stateIndex = null;
422 this.currentStateMap = [];
423 this.currentIndex = null;
424 this.currentTestId = 0;
425 this.stateResults = [];
426 this.timerCallBackHolders = null;
427 this.initialise = function(){
428 if (this.stateMap.length > 0) {
429 if(this.stateIndex != null) {
430 console.log('NOTE - State already initialise');
431 }
432 this.stateIndex = -1;
433 var that = this;
434 var aH_pId = 0;
435 for (var id=0; id<this.stateMap.length; id++){
436 var name = this.stateMap[id].type;
437 var obj = document.createElement(name);
438 if (name == 'audioHolder') {
439 obj.id = this.stateMap[id].id;
440 obj.setAttribute('presentedid',aH_pId);
441 aH_pId+=1;
442 }
443 this.stateResults.push(obj);
444 }
445 } else {
446 console.log('FATAL - StateMap not correctly constructed. EMPTY_STATE_MAP');
447 }
448 };
449 this.advanceState = function(){
450 if (this.stateIndex == null) {
451 this.initialise();
452 }
453 if (this.stateIndex == -1) {
454 console.log('Starting test...');
455 }
456 if (this.currentIndex == null){
457 if (this.currentStateMap.type == "audioHolder") {
458 // Save current page
459 this.testPageCompleted(this.stateResults[this.stateIndex],this.currentStateMap,this.currentTestId);
460 this.currentTestId++;
461 }
462 this.stateIndex++;
463 if (this.stateIndex >= this.stateMap.length) {
464 console.log('Test Completed');
465 createProjectSave(specification.projectReturn);
466 } else {
467 this.currentStateMap = this.stateMap[this.stateIndex];
468 if (this.currentStateMap.type == "audioHolder") {
469 console.log('Loading test page');
470 loadTest(this.currentStateMap);
471 this.initialiseInnerState(this.currentStateMap);
472 } else if (this.currentStateMap.type == "pretest" || this.currentStateMap.type == "posttest") {
473 if (this.currentStateMap.options.length >= 1) {
474 popup.initState(this.currentStateMap);
475 } else {
476 this.advanceState();
477 }
478 } else {
479 this.advanceState();
480 }
481 }
482 } else {
483 this.advanceInnerState();
484 }
485 };
486
487 this.testPageCompleted = function(store, testXML, testId) {
488 // Function called each time a test page has been completed
489 // Can be used to over-rule default behaviour
490
491 pageXMLSave(store, testXML);
492 };
493
494 this.initialiseInnerState = function(node) {
495 // Parses the received testXML for pre and post test options
496 this.currentStateMap = [];
497 var preTest = node.preTest;
498 var postTest = node.postTest;
499 if (preTest == undefined) {preTest = document.createElement("preTest");}
500 if (postTest == undefined){postTest= document.createElement("postTest");}
501 this.currentStateMap.push(preTest);
502 this.currentStateMap.push(node);
503 this.currentStateMap.push(postTest);
504 this.currentIndex = -1;
505 this.advanceInnerState();
506 };
507
508 this.advanceInnerState = function() {
509 this.currentIndex++;
510 if (this.currentIndex >= this.currentStateMap.length) {
511 this.currentIndex = null;
512 this.currentStateMap = this.stateMap[this.stateIndex];
513 this.advanceState();
514 } else {
515 if (this.currentStateMap[this.currentIndex].type == "audioHolder") {
516 console.log("Loading test page"+this.currentTestId);
517 } else if (this.currentStateMap[this.currentIndex].type == "pretest") {
518 popup.initState(this.currentStateMap[this.currentIndex]);
519 } else if (this.currentStateMap[this.currentIndex].type == "posttest") {
520 popup.initState(this.currentStateMap[this.currentIndex]);
521 } else {
522 this.advanceInnerState();
523 }
524 }
525 };
526
527 this.previousState = function(){};
528 }
529
530 function testEnded(testId)
531 {
532 pageXMLSave(testId);
533 if (testXMLSetups.length-1 > testId)
534 {
535 // Yes we have another test to perform
536 testId = (Number(testId)+1);
537 currentState = 'testRun-'+testId;
538 loadTest(testId);
539 } else {
540 console.log('Testing Completed!');
541 currentState = 'postTest';
542 // Check for any post tests
543 var xmlSetup = projectXML.find('setup');
544 var postTest = xmlSetup.find('PostTest')[0];
545 popup.initState(postTest);
546 }
547 }
548
549 function loadProjectSpec(url) {
550 // Load the project document from the given URL, decode the XML and instruct audioEngine to get audio data
551 // If url is null, request client to upload project XML document
552 var r = new XMLHttpRequest();
553 r.open('GET',url,true);
554 r.onload = function() {
555 loadProjectSpecCallback(r.response);
556 };
557 r.send();
558 };
559
560 function loadProjectSpecCallback(response) {
561 // Function called after asynchronous download of XML project specification
562 //var decode = $.parseXML(response);
563 //projectXML = $(decode);
564
565 var parse = new DOMParser();
566 projectXML = parse.parseFromString(response,'text/xml');
567
568 // Build the specification
569 specification.decode();
570
571 testState.stateMap.push(specification.preTest);
572
573 $(specification.audioHolders).each(function(index,elem){
574 testState.stateMap.push(elem);
575 });
576
577 testState.stateMap.push(specification.postTest);
578
579 // Obtain the metrics enabled
580 $(specification.metrics).each(function(index,node){
581 var enabled = node.textContent;
582 switch(node.enabled)
583 {
584 case 'testTimer':
585 sessionMetrics.prototype.enableTestTimer = true;
586 break;
587 case 'elementTimer':
588 sessionMetrics.prototype.enableElementTimer = true;
589 break;
590 case 'elementTracker':
591 sessionMetrics.prototype.enableElementTracker = true;
592 break;
593 case 'elementListenTracker':
594 sessionMetrics.prototype.enableElementListenTracker = true;
595 break;
596 case 'elementInitialPosition':
597 sessionMetrics.prototype.enableElementInitialPosition = true;
598 break;
599 case 'elementFlagListenedTo':
600 sessionMetrics.prototype.enableFlagListenedTo = true;
601 break;
602 case 'elementFlagMoved':
603 sessionMetrics.prototype.enableFlagMoved = true;
604 break;
605 case 'elementFlagComments':
606 sessionMetrics.prototype.enableFlagComments = true;
607 break;
608 }
609 });
610
611
612
613 // Detect the interface to use and load the relevant javascripts.
614 var interfaceJS = document.createElement('script');
615 interfaceJS.setAttribute("type","text/javascript");
616 if (specification.interfaceType == 'APE') {
617 interfaceJS.setAttribute("src","ape.js");
618
619 // APE comes with a css file
620 var css = document.createElement('link');
621 css.rel = 'stylesheet';
622 css.type = 'text/css';
623 css.href = 'ape.css';
624
625 document.getElementsByTagName("head")[0].appendChild(css);
626 } else if (specification.interfaceType == "MUSHRA")
627 {
628 interfaceJS.setAttribute("src","mushra.js");
629
630 // MUSHRA comes with a css file
631 var css = document.createElement('link');
632 css.rel = 'stylesheet';
633 css.type = 'text/css';
634 css.href = 'mushra.css';
635
636 document.getElementsByTagName("head")[0].appendChild(css);
637 }
638 document.getElementsByTagName("head")[0].appendChild(interfaceJS);
639
640 // Define window callbacks for interface
641 window.onresize = function(event){interfaceContext.resizeWindow(event);};
642 }
643
644 function createProjectSave(destURL) {
645 // Save the data from interface into XML and send to destURL
646 // If destURL is null then download XML in client
647 // Now time to render file locally
648 var xmlDoc = interfaceXMLSave();
649 var parent = document.createElement("div");
650 parent.appendChild(xmlDoc);
651 var file = [parent.innerHTML];
652 if (destURL == "null" || destURL == undefined) {
653 var bb = new Blob(file,{type : 'application/xml'});
654 var dnlk = window.URL.createObjectURL(bb);
655 var a = document.createElement("a");
656 a.hidden = '';
657 a.href = dnlk;
658 a.download = "save.xml";
659 a.textContent = "Save File";
660
661 popup.showPopup();
662 popup.popupContent.innerHTML = null;
663 popup.popupContent.appendChild(a);
664 } else {
665 var xmlhttp = new XMLHttpRequest;
666 xmlhttp.open("POST",destURL,true);
667 xmlhttp.setRequestHeader('Content-Type', 'text/xml');
668 xmlhttp.onerror = function(){
669 console.log('Error saving file to server! Presenting download locally');
670 createProjectSave(null);
671 };
672 xmlhttp.onreadystatechange = function() {
673 console.log(xmlhttp.status);
674 if (xmlhttp.status != 200 && xmlhttp.readyState == 4) {
675 createProjectSave(null);
676 } else {
677 if (xmlhttp.responseXML == null)
678 {
679 return createProjectSave(null);
680 }
681 var response = xmlhttp.responseXML.childNodes[0];
682 if (response.getAttribute('state') == "OK")
683 {
684 var file = response.getElementsByTagName('file')[0];
685 console.log('Save OK: Filename '+file.textContent+','+file.getAttribute('bytes')+'B');
686 popup.showPopup();
687 popup.popupContent.innerHTML = null;
688 popup.popupContent.textContent = "Thank you!";
689 } else {
690 var message = response.getElementsByTagName('message')[0];
691 errorSessionDump(message.textContent);
692 }
693 }
694 };
695 xmlhttp.send(file);
696 }
697 }
698
699 function errorSessionDump(msg){
700 // Create the partial interface XML save
701 // Include error node with message on why the dump occured
702 var xmlDoc = interfaceXMLSave();
703 var err = document.createElement('error');
704 err.textContent = msg;
705 xmlDoc.appendChild(err);
706 var parent = document.createElement("div");
707 parent.appendChild(xmlDoc);
708 var file = [parent.innerHTML];
709 var bb = new Blob(file,{type : 'application/xml'});
710 var dnlk = window.URL.createObjectURL(bb);
711 var a = document.createElement("a");
712 a.hidden = '';
713 a.href = dnlk;
714 a.download = "save.xml";
715 a.textContent = "Save File";
716
717 popup.showPopup();
718 popup.popupContent.innerHTML = "ERROR : "+msg;
719 popup.popupContent.appendChild(a);
720 }
721
722 // Only other global function which must be defined in the interface class. Determines how to create the XML document.
723 function interfaceXMLSave(){
724 // Create the XML string to be exported with results
725 var xmlDoc = document.createElement("BrowserEvaluationResult");
726 var projectDocument = specification.projectXML;
727 projectDocument.setAttribute('file-name',url);
728 xmlDoc.appendChild(projectDocument);
729 xmlDoc.appendChild(returnDateNode());
730 for (var i=0; i<testState.stateResults.length; i++)
731 {
732 xmlDoc.appendChild(testState.stateResults[i]);
733 }
734
735 return xmlDoc;
736 }
737
738 function AudioEngine() {
739
740 // Create two output paths, the main outputGain and fooGain.
741 // Output gain is default to 1 and any items for playback route here
742 // Foo gain is used for analysis to ensure paths get processed, but are not heard
743 // because web audio will optimise and any route which does not go to the destination gets ignored.
744 this.outputGain = audioContext.createGain();
745 this.fooGain = audioContext.createGain();
746 this.fooGain.gain = 0;
747
748 // Use this to detect playback state: 0 - stopped, 1 - playing
749 this.status = 0;
750
751 // Connect both gains to output
752 this.outputGain.connect(audioContext.destination);
753 this.fooGain.connect(audioContext.destination);
754
755 // Create the timer Object
756 this.timer = new timer();
757 // Create session metrics
758 this.metric = new sessionMetrics(this);
759
760 this.loopPlayback = false;
761
762 // Create store for new audioObjects
763 this.audioObjects = [];
764
765 this.play = function(id) {
766 // Start the timer and set the audioEngine state to playing (1)
767 if (this.status == 0 && this.loopPlayback) {
768 // Check if all audioObjects are ready
769 if(this.checkAllReady())
770 {
771 this.status = 1;
772 this.setSynchronousLoop();
773 }
774 }
775 else
776 {
777 this.status = 1;
778 }
779 if (this.status== 1) {
780 this.timer.startTest();
781 if (id == undefined) {
782 id = -1;
783 console.log('FATAL - Passed id was undefined - AudioEngineContext.play(id)');
784 return;
785 } else {
786 interfaceContext.playhead.setTimePerPixel(this.audioObjects[id]);
787 }
788 if (this.loopPlayback) {
789 for (var i=0; i<this.audioObjects.length; i++)
790 {
791 this.audioObjects[i].play(this.timer.getTestTime()+1);
792 if (id == i) {
793 this.audioObjects[i].loopStart();
794 } else {
795 this.audioObjects[i].loopStop();
796 }
797 }
798 } else {
799 for (var i=0; i<this.audioObjects.length; i++)
800 {
801 if (i != id) {
802 this.audioObjects[i].outputGain.gain.value = 0.0;
803 this.audioObjects[i].stop();
804 } else if (i == id) {
805 this.audioObjects[id].outputGain.gain.value = 1.0;
806 this.audioObjects[id].play(audioContext.currentTime+0.01);
807 }
808 }
809 }
810 interfaceContext.playhead.start();
811 }
812 };
813
814 this.stop = function() {
815 // Send stop and reset command to all playback buffers and set audioEngine state to stopped (1)
816 if (this.status == 1) {
817 for (var i=0; i<this.audioObjects.length; i++)
818 {
819 this.audioObjects[i].stop();
820 }
821 interfaceContext.playhead.stop();
822 this.status = 0;
823 }
824 };
825
826 this.newTrack = function(element) {
827 // Pull data from given URL into new audio buffer
828 // URLs must either be from the same source OR be setup to 'Access-Control-Allow-Origin'
829
830 // Create the audioObject with ID of the new track length;
831 audioObjectId = this.audioObjects.length;
832 this.audioObjects[audioObjectId] = new audioObject(audioObjectId);
833
834 // AudioObject will get track itself.
835 this.audioObjects[audioObjectId].specification = element;
836 this.audioObjects[audioObjectId].constructTrack(element.parent.hostURL + element.url);
837 return this.audioObjects[audioObjectId];
838 };
839
840 this.newTestPage = function() {
841 this.state = 0;
842 this.audioObjectsReady = false;
843 this.metric.reset();
844 this.audioObjects = [];
845 };
846
847 this.checkAllPlayed = function() {
848 arr = [];
849 for (var id=0; id<this.audioObjects.length; id++) {
850 if (this.audioObjects[id].metric.wasListenedTo == false) {
851 arr.push(this.audioObjects[id].id);
852 }
853 }
854 return arr;
855 };
856
857 this.checkAllReady = function() {
858 var ready = true;
859 for (var i=0; i<this.audioObjects.length; i++) {
860 if (this.audioObjects[i].state == 0) {
861 // Track not ready
862 console.log('WAIT -- audioObject '+i+' not ready yet!');
863 ready = false;
864 };
865 }
866 return ready;
867 };
868
869 this.setSynchronousLoop = function() {
870 // Pads the signals so they are all exactly the same length
871 var length = 0;
872 var lens = [];
873 var maxId;
874 for (var i=0; i<this.audioObjects.length; i++)
875 {
876 lens.push(this.audioObjects[i].buffer.length);
877 if (length < this.audioObjects[i].buffer.length)
878 {
879 length = this.audioObjects[i].buffer.length;
880 maxId = i;
881 }
882 }
883 // Perform difference
884 for (var i=0; i<lens.length; i++)
885 {
886 lens[i] = length - lens[i];
887 }
888 // Extract the audio and zero-pad
889 for (var i=0; i<lens.length; i++)
890 {
891 var orig = this.audioObjects[i].buffer;
892 var hold = audioContext.createBuffer(orig.numberOfChannels,length,orig.sampleRate);
893 for (var c=0; c<orig.numberOfChannels; c++)
894 {
895 var inData = hold.getChannelData(c);
896 var outData = orig.getChannelData(c);
897 for (var n=0; n<orig.length; n++)
898 {inData[n] = outData[n];}
899 }
900 this.audioObjects[i].buffer = hold;
901 delete orig;
902 }
903 };
904
905 }
906
907 function audioObject(id) {
908 // The main buffer object with common control nodes to the AudioEngine
909
910 this.specification;
911 this.id = id;
912 this.state = 0; // 0 - no data, 1 - ready
913 this.url = null; // Hold the URL given for the output back to the results.
914 this.metric = new metricTracker(this);
915
916 // Bindings for GUI
917 this.interfaceDOM = null;
918 this.commentDOM = null;
919
920 // Create a buffer and external gain control to allow internal patching of effects and volume leveling.
921 this.bufferNode = undefined;
922 this.outputGain = audioContext.createGain();
923
924 // Default output gain to be zero
925 this.outputGain.gain.value = 0.0;
926
927 // Connect buffer to the audio graph
928 this.outputGain.connect(audioEngineContext.outputGain);
929
930 // the audiobuffer is not designed for multi-start playback
931 // When stopeed, the buffer node is deleted and recreated with the stored buffer.
932 this.buffer;
933
934 this.loopStart = function() {
935 this.outputGain.gain.value = 1.0;
936 this.metric.startListening(audioEngineContext.timer.getTestTime());
937 };
938
939 this.loopStop = function() {
940 if (this.outputGain.gain.value != 0.0) {
941 this.outputGain.gain.value = 0.0;
942 this.metric.stopListening(audioEngineContext.timer.getTestTime());
943 }
944 };
945
946 this.play = function(startTime) {
947 if (this.bufferNode == undefined) {
948 this.bufferNode = audioContext.createBufferSource();
949 this.bufferNode.owner = this;
950 this.bufferNode.connect(this.outputGain);
951 this.bufferNode.buffer = this.buffer;
952 this.bufferNode.loop = audioEngineContext.loopPlayback;
953 this.bufferNode.onended = function(event) {
954 // Safari does not like using 'this' to reference the calling object!
955 //event.currentTarget.owner.metric.stopListening(audioEngineContext.timer.getTestTime(),event.currentTarget.owner.getCurrentPosition());
956 event.currentTarget.owner.stop();
957 };
958 if (this.bufferNode.loop == false) {
959 this.metric.startListening(audioEngineContext.timer.getTestTime());
960 }
961 this.bufferNode.start(startTime);
962 }
963 };
964
965 this.stop = function() {
966 if (this.bufferNode != undefined)
967 {
968 this.metric.stopListening(audioEngineContext.timer.getTestTime(),this.getCurrentPosition());
969 this.bufferNode.stop(0);
970 this.bufferNode = undefined;
971 }
972 };
973
974 this.getCurrentPosition = function() {
975 var time = audioEngineContext.timer.getTestTime();
976 if (this.bufferNode != undefined) {
977 if (this.bufferNode.loop == true) {
978 if (audioEngineContext.status == 1) {
979 return time%this.buffer.duration;
980 } else {
981 return 0;
982 }
983 } else {
984 if (this.metric.listenHold) {
985 return time - this.metric.listenStart;
986 } else {
987 return 0;
988 }
989 }
990 } else {
991 return 0;
992 }
993 };
994
995 this.constructTrack = function(url) {
996 var request = new XMLHttpRequest();
997 this.url = url;
998 request.open('GET',url,true);
999 request.responseType = 'arraybuffer';
1000
1001 var audioObj = this;
1002
1003 // Create callback to decode the data asynchronously
1004 request.onloadend = function() {
1005 audioContext.decodeAudioData(request.response, function(decodedData) {
1006 audioObj.buffer = decodedData;
1007 audioObj.state = 1;
1008 if (audioObj.specification.type != 'outsidereference')
1009 {audioObj.interfaceDOM.enable();}
1010 }, function(){
1011 // Should only be called if there was an error, but sometimes gets called continuously
1012 // Check here if the error is genuine
1013 if (audioObj.state == 0 || audioObj.buffer == undefined) {
1014 // Genuine error
1015 console.log('FATAL - Error loading buffer on '+audioObj.id);
1016 if (request.status == 404)
1017 {
1018 console.log('FATAL - Fragment '+audioObj.id+' 404 error');
1019 console.log('URL: '+audioObj.url);
1020 errorSessionDump('Fragment '+audioObj.id+' 404 error');
1021 }
1022 }
1023 });
1024 };
1025 request.send();
1026 };
1027
1028 this.exportXMLDOM = function() {
1029 var root = document.createElement('audioElement');
1030 root.id = this.specification.id;
1031 root.setAttribute('url',this.url);
1032 var file = document.createElement('file');
1033 file.setAttribute('sampleRate',this.buffer.sampleRate);
1034 file.setAttribute('channels',this.buffer.numberOfChannels);
1035 file.setAttribute('sampleCount',this.buffer.length);
1036 file.setAttribute('duration',this.buffer.duration);
1037 root.appendChild(file);
1038 if (this.specification.type != 'outsidereference') {
1039 root.appendChild(this.interfaceDOM.exportXMLDOM(this));
1040 root.appendChild(this.commentDOM.exportXMLDOM(this));
1041 if(this.specification.type == 'anchor') {
1042 root.setAttribute('anchor',true);
1043 } else if(this.specification.type == 'reference') {
1044 root.setAttribute('reference',true);
1045 }
1046 }
1047 root.appendChild(this.metric.exportXMLDOM());
1048 return root;
1049 };
1050 }
1051
1052 function timer()
1053 {
1054 /* Timer object used in audioEngine to keep track of session timings
1055 * Uses the timer of the web audio API, so sample resolution
1056 */
1057 this.testStarted = false;
1058 this.testStartTime = 0;
1059 this.testDuration = 0;
1060 this.minimumTestTime = 0; // No minimum test time
1061 this.startTest = function()
1062 {
1063 if (this.testStarted == false)
1064 {
1065 this.testStartTime = audioContext.currentTime;
1066 this.testStarted = true;
1067 this.updateTestTime();
1068 audioEngineContext.metric.initialiseTest();
1069 }
1070 };
1071 this.stopTest = function()
1072 {
1073 if (this.testStarted)
1074 {
1075 this.testDuration = this.getTestTime();
1076 this.testStarted = false;
1077 } else {
1078 console.log('ERR: Test tried to end before beginning');
1079 }
1080 };
1081 this.updateTestTime = function()
1082 {
1083 if (this.testStarted)
1084 {
1085 this.testDuration = audioContext.currentTime - this.testStartTime;
1086 }
1087 };
1088 this.getTestTime = function()
1089 {
1090 this.updateTestTime();
1091 return this.testDuration;
1092 };
1093 }
1094
1095 function sessionMetrics(engine)
1096 {
1097 /* Used by audioEngine to link to audioObjects to minimise the timer call timers;
1098 */
1099 this.engine = engine;
1100 this.lastClicked = -1;
1101 this.data = -1;
1102 this.reset = function() {
1103 this.lastClicked = -1;
1104 this.data = -1;
1105 };
1106 this.initialiseTest = function(){};
1107 }
1108
1109 function metricTracker(caller)
1110 {
1111 /* Custom object to track and collect metric data
1112 * Used only inside the audioObjects object.
1113 */
1114
1115 this.listenedTimer = 0;
1116 this.listenStart = 0;
1117 this.listenHold = false;
1118 this.initialPosition = -1;
1119 this.movementTracker = [];
1120 this.listenTracker =[];
1121 this.wasListenedTo = false;
1122 this.wasMoved = false;
1123 this.hasComments = false;
1124 this.parent = caller;
1125
1126 this.initialised = function(position)
1127 {
1128 if (this.initialPosition == -1) {
1129 this.initialPosition = position;
1130 }
1131 };
1132
1133 this.moved = function(time,position)
1134 {
1135 this.wasMoved = true;
1136 this.movementTracker[this.movementTracker.length] = [time, position];
1137 };
1138
1139 this.startListening = function(time)
1140 {
1141 if (this.listenHold == false)
1142 {
1143 this.wasListenedTo = true;
1144 this.listenStart = time;
1145 this.listenHold = true;
1146
1147 var evnt = document.createElement('event');
1148 var testTime = document.createElement('testTime');
1149 testTime.setAttribute('start',time);
1150 var bufferTime = document.createElement('bufferTime');
1151 bufferTime.setAttribute('start',this.parent.getCurrentPosition());
1152 evnt.appendChild(testTime);
1153 evnt.appendChild(bufferTime);
1154 this.listenTracker.push(evnt);
1155
1156 console.log('slider ' + this.parent.id + ' played (' + time + ')'); // DEBUG/SAFETY: show played slider id
1157 }
1158 };
1159
1160 this.stopListening = function(time,bufferStopTime)
1161 {
1162 if (this.listenHold == true)
1163 {
1164 var diff = time - this.listenStart;
1165 this.listenedTimer += (diff);
1166 this.listenStart = 0;
1167 this.listenHold = false;
1168
1169 var evnt = this.listenTracker[this.listenTracker.length-1];
1170 var testTime = evnt.getElementsByTagName('testTime')[0];
1171 var bufferTime = evnt.getElementsByTagName('bufferTime')[0];
1172 testTime.setAttribute('stop',time);
1173 if (bufferStopTime == undefined) {
1174 bufferTime.setAttribute('stop',this.parent.getCurrentPosition());
1175 } else {
1176 bufferTime.setAttribute('stop',bufferStopTime);
1177 }
1178 console.log('slider ' + this.parent.id + ' played for (' + diff + ')'); // DEBUG/SAFETY: show played slider id
1179 }
1180 };
1181
1182 this.exportXMLDOM = function() {
1183 var root = document.createElement('metric');
1184 if (audioEngineContext.metric.enableElementTimer) {
1185 var mElementTimer = document.createElement('metricresult');
1186 mElementTimer.setAttribute('name','enableElementTimer');
1187 mElementTimer.textContent = this.listenedTimer;
1188 root.appendChild(mElementTimer);
1189 }
1190 if (audioEngineContext.metric.enableElementTracker) {
1191 var elementTrackerFull = document.createElement('metricResult');
1192 elementTrackerFull.setAttribute('name','elementTrackerFull');
1193 for (var k=0; k<this.movementTracker.length; k++)
1194 {
1195 var timePos = document.createElement('timePos');
1196 timePos.id = k;
1197 var time = document.createElement('time');
1198 time.textContent = this.movementTracker[k][0];
1199 var position = document.createElement('position');
1200 position.textContent = this.movementTracker[k][1];
1201 timePos.appendChild(time);
1202 timePos.appendChild(position);
1203 elementTrackerFull.appendChild(timePos);
1204 }
1205 root.appendChild(elementTrackerFull);
1206 }
1207 if (audioEngineContext.metric.enableElementListenTracker) {
1208 var elementListenTracker = document.createElement('metricResult');
1209 elementListenTracker.setAttribute('name','elementListenTracker');
1210 for (var k=0; k<this.listenTracker.length; k++) {
1211 elementListenTracker.appendChild(this.listenTracker[k]);
1212 }
1213 root.appendChild(elementListenTracker);
1214 }
1215 if (audioEngineContext.metric.enableElementInitialPosition) {
1216 var elementInitial = document.createElement('metricResult');
1217 elementInitial.setAttribute('name','elementInitialPosition');
1218 elementInitial.textContent = this.initialPosition;
1219 root.appendChild(elementInitial);
1220 }
1221 if (audioEngineContext.metric.enableFlagListenedTo) {
1222 var flagListenedTo = document.createElement('metricResult');
1223 flagListenedTo.setAttribute('name','elementFlagListenedTo');
1224 flagListenedTo.textContent = this.wasListenedTo;
1225 root.appendChild(flagListenedTo);
1226 }
1227 if (audioEngineContext.metric.enableFlagMoved) {
1228 var flagMoved = document.createElement('metricResult');
1229 flagMoved.setAttribute('name','elementFlagMoved');
1230 flagMoved.textContent = this.wasMoved;
1231 root.appendChild(flagMoved);
1232 }
1233 if (audioEngineContext.metric.enableFlagComments) {
1234 var flagComments = document.createElement('metricResult');
1235 flagComments.setAttribute('name','elementFlagComments');
1236 if (this.parent.commentDOM == null)
1237 {flag.textContent = 'false';}
1238 else if (this.parent.commentDOM.textContent.length == 0)
1239 {flag.textContent = 'false';}
1240 else
1241 {flag.textContet = 'true';}
1242 root.appendChild(flagComments);
1243 }
1244
1245 return root;
1246 };
1247 }
1248
1249 function randomiseOrder(input)
1250 {
1251 // This takes an array of information and randomises the order
1252 var N = input.length;
1253
1254 var inputSequence = []; // For safety purposes: keep track of randomisation
1255 for (var counter = 0; counter < N; ++counter)
1256 inputSequence.push(counter) // Fill array
1257 var inputSequenceClone = inputSequence.slice(0);
1258
1259 var holdArr = [];
1260 var outputSequence = [];
1261 for (var n=0; n<N; n++)
1262 {
1263 // First pick a random number
1264 var r = Math.random();
1265 // Multiply and floor by the number of elements left
1266 r = Math.floor(r*input.length);
1267 // Pick out that element and delete from the array
1268 holdArr.push(input.splice(r,1)[0]);
1269 // Do the same with sequence
1270 outputSequence.push(inputSequence.splice(r,1)[0]);
1271 }
1272 console.log(inputSequenceClone.toString()); // print original array to console
1273 console.log(outputSequence.toString()); // print randomised array to console
1274 return holdArr;
1275 }
1276
1277 function returnDateNode()
1278 {
1279 // Create an XML Node for the Date and Time a test was conducted
1280 // Structure is
1281 // <datetime>
1282 // <date year="##" month="##" day="##">DD/MM/YY</date>
1283 // <time hour="##" minute="##" sec="##">HH:MM:SS</time>
1284 // </datetime>
1285 var dateTime = new Date();
1286 var year = document.createAttribute('year');
1287 var month = document.createAttribute('month');
1288 var day = document.createAttribute('day');
1289 var hour = document.createAttribute('hour');
1290 var minute = document.createAttribute('minute');
1291 var secs = document.createAttribute('secs');
1292
1293 year.nodeValue = dateTime.getFullYear();
1294 month.nodeValue = dateTime.getMonth()+1;
1295 day.nodeValue = dateTime.getDate();
1296 hour.nodeValue = dateTime.getHours();
1297 minute.nodeValue = dateTime.getMinutes();
1298 secs.nodeValue = dateTime.getSeconds();
1299
1300 var hold = document.createElement("datetime");
1301 var date = document.createElement("date");
1302 date.textContent = year.nodeValue+'/'+month.nodeValue+'/'+day.nodeValue;
1303 var time = document.createElement("time");
1304 time.textContent = hour.nodeValue+':'+minute.nodeValue+':'+secs.nodeValue;
1305
1306 date.setAttributeNode(year);
1307 date.setAttributeNode(month);
1308 date.setAttributeNode(day);
1309 time.setAttributeNode(hour);
1310 time.setAttributeNode(minute);
1311 time.setAttributeNode(secs);
1312
1313 hold.appendChild(date);
1314 hold.appendChild(time);
1315 return hold
1316
1317 }
1318
1319 function Specification() {
1320 // Handles the decoding of the project specification XML into a simple JavaScript Object.
1321
1322 this.interfaceType = null;
1323 this.commonInterface = null;
1324 this.projectReturn = null;
1325 this.randomiseOrder = null;
1326 this.collectMetrics = null;
1327 this.testPages = null;
1328 this.preTest = null;
1329 this.postTest = null;
1330 this.metrics =[];
1331
1332 this.audioHolders = [];
1333
1334 this.decode = function() {
1335 // projectXML - DOM Parsed document
1336 this.projectXML = projectXML.childNodes[0];
1337 var setupNode = projectXML.getElementsByTagName('setup')[0];
1338 this.interfaceType = setupNode.getAttribute('interface');
1339 this.projectReturn = setupNode.getAttribute('projectReturn');
1340 this.testPages = setupNode.getAttribute('testPages');
1341 if (setupNode.getAttribute('randomiseOrder') == "true") {
1342 this.randomiseOrder = true;
1343 } else {this.randomiseOrder = false;}
1344 if (setupNode.getAttribute('collectMetrics') == "true") {
1345 this.collectMetrics = true;
1346 } else {this.collectMetrics = false;}
1347 if (isNaN(Number(this.testPages)) || this.testPages == undefined)
1348 {
1349 this.testPages = null;
1350 } else {
1351 this.testPages = Number(this.testPages);
1352 if (this.testPages == 0) {this.testPages = null;}
1353 }
1354 var metricCollection = setupNode.getElementsByTagName('Metric');
1355
1356 this.preTest = new this.prepostNode('pretest',setupNode.getElementsByTagName('PreTest'));
1357 this.postTest = new this.prepostNode('posttest',setupNode.getElementsByTagName('PostTest'));
1358
1359 if (metricCollection.length > 0) {
1360 metricCollection = metricCollection[0].getElementsByTagName('metricEnable');
1361 for (var i=0; i<metricCollection.length; i++) {
1362 this.metrics.push(new this.metricNode(metricCollection[i].textContent));
1363 }
1364 }
1365
1366 var commonInterfaceNode = setupNode.getElementsByTagName('interface');
1367 if (commonInterfaceNode.length > 0) {
1368 commonInterfaceNode = commonInterfaceNode[0];
1369 } else {
1370 commonInterfaceNode = undefined;
1371 }
1372
1373 this.commonInterface = new function() {
1374 this.OptionNode = function(child) {
1375 this.type = child.nodeName;
1376 if (this.type == 'option')
1377 {
1378 this.name = child.getAttribute('name');
1379 }
1380 else if (this.type == 'check') {
1381 this.check = child.getAttribute('name');
1382 if (this.check == 'scalerange') {
1383 this.min = child.getAttribute('min');
1384 this.max = child.getAttribute('max');
1385 if (this.min == null) {this.min = 1;}
1386 else if (Number(this.min) > 1 && this.min != null) {
1387 this.min = Number(this.min)/100;
1388 } else {
1389 this.min = Number(this.min);
1390 }
1391 if (this.max == null) {this.max = 0;}
1392 else if (Number(this.max) > 1 && this.max != null) {
1393 this.max = Number(this.max)/100;
1394 } else {
1395 this.max = Number(this.max);
1396 }
1397 }
1398 } else if (this.type == 'anchor' || this.type == 'reference') {
1399 Console.log("WARNING: Anchor and Reference tags in the <interface> node are depricated");
1400 }
1401 };
1402 this.options = [];
1403 if (commonInterfaceNode != undefined) {
1404 var child = commonInterfaceNode.firstElementChild;
1405 while (child != undefined) {
1406 this.options.push(new this.OptionNode(child));
1407 child = child.nextElementSibling;
1408 }
1409 }
1410 };
1411
1412 var audioHolders = projectXML.getElementsByTagName('audioHolder');
1413 for (var i=0; i<audioHolders.length; i++) {
1414 this.audioHolders.push(new this.audioHolderNode(this,audioHolders[i]));
1415 }
1416
1417 // New check if we need to randomise the test order
1418 if (this.randomiseOrder)
1419 {
1420 this.audioHolders = randomiseOrder(this.audioHolders);
1421 for (var i=0; i<this.audioHolders.length; i++)
1422 {
1423 this.audioHolders[i].presentedId = i;
1424 }
1425 }
1426
1427 if (this.testPages != null || this.testPages != undefined)
1428 {
1429 if (this.testPages > audioHolders.length)
1430 {
1431 console.log('Warning: You have specified '+audioHolders.length+' tests but requested '+this.testPages+' be completed!');
1432 this.testPages = audioHolders.length;
1433 }
1434 var aH = this.audioHolders;
1435 this.audioHolders = [];
1436 for (var i=0; i<this.testPages; i++)
1437 {
1438 this.audioHolders.push(aH[i]);
1439 }
1440 }
1441 };
1442
1443 this.prepostNode = function(type,Collection) {
1444 this.type = type;
1445 this.options = [];
1446
1447 this.OptionNode = function(child) {
1448
1449 this.childOption = function(element) {
1450 this.type = 'option';
1451 this.id = element.id;
1452 this.name = element.getAttribute('name');
1453 this.text = element.textContent;
1454 };
1455
1456 this.type = child.nodeName;
1457 if (child.nodeName == "question") {
1458 this.id = child.id;
1459 this.mandatory;
1460 if (child.getAttribute('mandatory') == "true") {this.mandatory = true;}
1461 else {this.mandatory = false;}
1462 this.question = child.textContent;
1463 if (child.getAttribute('boxsize') == null) {
1464 this.boxsize = 'normal';
1465 } else {
1466 this.boxsize = child.getAttribute('boxsize');
1467 }
1468 } else if (child.nodeName == "statement") {
1469 this.statement = child.textContent;
1470 } else if (child.nodeName == "checkbox" || child.nodeName == "radio") {
1471 var element = child.firstElementChild;
1472 this.id = child.id;
1473 if (element == null) {
1474 console.log('Malformed' +child.nodeName+ 'entry');
1475 this.statement = 'Malformed' +child.nodeName+ 'entry';
1476 this.type = 'statement';
1477 } else {
1478 this.options = [];
1479 while (element != null) {
1480 if (element.nodeName == 'statement' && this.statement == undefined){
1481 this.statement = element.textContent;
1482 } else if (element.nodeName == 'option') {
1483 this.options.push(new this.childOption(element));
1484 }
1485 element = element.nextElementSibling;
1486 }
1487 }
1488 } else if (child.nodeName == "number") {
1489 this.statement = child.textContent;
1490 this.id = child.id;
1491 this.min = child.getAttribute('min');
1492 this.max = child.getAttribute('max');
1493 this.step = child.getAttribute('step');
1494 }
1495 };
1496
1497 // On construction:
1498 if (Collection.length != 0) {
1499 Collection = Collection[0];
1500 if (Collection.childElementCount != 0) {
1501 var child = Collection.firstElementChild;
1502 this.options.push(new this.OptionNode(child));
1503 while (child.nextElementSibling != null) {
1504 child = child.nextElementSibling;
1505 this.options.push(new this.OptionNode(child));
1506 }
1507 }
1508 }
1509 };
1510
1511 this.metricNode = function(name) {
1512 this.enabled = name;
1513 };
1514
1515 this.audioHolderNode = function(parent,xml) {
1516 this.type = 'audioHolder';
1517 this.presentedId = parent.audioHolders.length;
1518 this.interfaceNode = function(DOM) {
1519 var title = DOM.getElementsByTagName('title');
1520 if (title.length == 0) {this.title = null;}
1521 else {this.title = title[0].textContent;}
1522 this.options = parent.commonInterface.options;
1523 var scale = DOM.getElementsByTagName('scale');
1524 this.scale = [];
1525 for (var i=0; i<scale.length; i++) {
1526 var arr = [null, null];
1527 arr[0] = scale[i].getAttribute('position');
1528 arr[1] = scale[i].textContent;
1529 this.scale.push(arr);
1530 }
1531 };
1532
1533 this.audioElementNode = function(parent,xml) {
1534 this.url = xml.getAttribute('url');
1535 this.id = xml.id;
1536 this.parent = parent;
1537 this.type = xml.getAttribute('type');
1538 if (this.type == null) {this.type = "normal";}
1539 if (this.type == 'anchor') {this.anchor = true;}
1540 else {this.anchor = false;}
1541 if (this.type == 'reference') {this.reference = true;}
1542 else {this.reference = false;}
1543
1544 if (this.anchor == true || this.reference == true)
1545 {
1546 this.marker = xml.getAttribute('marker');
1547 if (this.marker != undefined)
1548 {
1549 this.marker = Number(this.marker);
1550 if (isNaN(this.marker) == false)
1551 {
1552 if (this.marker > 1)
1553 { this.marker /= 100.0;}
1554 if (this.marker >= 0 && this.marker <= 1)
1555 {
1556 this.enforce = true;
1557 return;
1558 } else {
1559 console.log("ERROR - Marker of audioElement "+this.id+" is not between 0 and 1 (float) or 0 and 100 (integer)!");
1560 console.log("ERROR - Marker not enforced!");
1561 }
1562 } else {
1563 console.log("ERROR - Marker of audioElement "+this.id+" is not a number!");
1564 console.log("ERROR - Marker not enforced!");
1565 }
1566 }
1567 }
1568 this.marker = false;
1569 this.enforce = false;
1570 };
1571
1572 this.commentQuestionNode = function(xml) {
1573 this.childOption = function(element) {
1574 this.type = 'option';
1575 this.name = element.getAttribute('name');
1576 this.text = element.textContent;
1577 };
1578 this.id = xml.id;
1579 if (xml.getAttribute('mandatory') == 'true') {this.mandatory = true;}
1580 else {this.mandatory = false;}
1581 this.type = xml.getAttribute('type');
1582 if (this.type == undefined) {this.type = 'text';}
1583 switch (this.type) {
1584 case 'text':
1585 this.question = xml.textContent;
1586 break;
1587 case 'radio':
1588 var child = xml.firstElementChild;
1589 this.options = [];
1590 while (child != undefined) {
1591 if (child.nodeName == 'statement' && this.statement == undefined) {
1592 this.statement = child.textContent;
1593 } else if (child.nodeName == 'option') {
1594 this.options.push(new this.childOption(child));
1595 }
1596 child = child.nextElementSibling;
1597 }
1598 break;
1599 case 'checkbox':
1600 var child = xml.firstElementChild;
1601 this.options = [];
1602 while (child != undefined) {
1603 if (child.nodeName == 'statement' && this.statement == undefined) {
1604 this.statement = child.textContent;
1605 } else if (child.nodeName == 'option') {
1606 this.options.push(new this.childOption(child));
1607 }
1608 child = child.nextElementSibling;
1609 }
1610 break;
1611 }
1612 };
1613
1614 this.id = xml.id;
1615 this.hostURL = xml.getAttribute('hostURL');
1616 this.sampleRate = xml.getAttribute('sampleRate');
1617 if (xml.getAttribute('randomiseOrder') == "true") {this.randomiseOrder = true;}
1618 else {this.randomiseOrder = false;}
1619 this.repeatCount = xml.getAttribute('repeatCount');
1620 if (xml.getAttribute('loop') == 'true') {this.loop = true;}
1621 else {this.loop == false;}
1622 if (xml.getAttribute('elementComments') == "true") {this.elementComments = true;}
1623 else {this.elementComments = false;}
1624
1625 this.preTest = new parent.prepostNode('pretest',xml.getElementsByTagName('PreTest'));
1626 this.postTest = new parent.prepostNode('posttest',xml.getElementsByTagName('PostTest'));
1627
1628 this.interfaces = [];
1629 var interfaceDOM = xml.getElementsByTagName('interface');
1630 for (var i=0; i<interfaceDOM.length; i++) {
1631 this.interfaces.push(new this.interfaceNode(interfaceDOM[i]));
1632 }
1633
1634 this.commentBoxPrefix = xml.getElementsByTagName('commentBoxPrefix');
1635 if (this.commentBoxPrefix.length != 0) {
1636 this.commentBoxPrefix = this.commentBoxPrefix[0].textContent;
1637 } else {
1638 this.commentBoxPrefix = "Comment on track";
1639 }
1640
1641 this.audioElements =[];
1642 var audioElementsDOM = xml.getElementsByTagName('audioElements');
1643 this.outsideReference = null;
1644 for (var i=0; i<audioElementsDOM.length; i++) {
1645 if (audioElementsDOM[i].getAttribute('type') == 'outsidereference') {
1646 if (this.outsideReference == null) {
1647 this.outsideReference = new this.audioElementNode(this,audioElementsDOM[i]);
1648 } else {
1649 console.log('Error only one audioelement can be of type outsidereference per audioholder');
1650 this.audioElements.push(new this.audioElementNode(this,audioElementsDOM[i]));
1651 console.log('Element id '+audioElementsDOM[i].id+' made into normal node');
1652 }
1653 } else {
1654 this.audioElements.push(new this.audioElementNode(this,audioElementsDOM[i]));
1655 }
1656 }
1657
1658 if (this.randomiseOrder) {
1659 this.audioElements = randomiseOrder(this.audioElements);
1660 }
1661
1662 this.commentQuestions = [];
1663 var commentQuestionsDOM = xml.getElementsByTagName('CommentQuestion');
1664 for (var i=0; i<commentQuestionsDOM.length; i++) {
1665 this.commentQuestions.push(new this.commentQuestionNode(commentQuestionsDOM[i]));
1666 }
1667 };
1668 }
1669
1670 function Interface(specificationObject) {
1671 // This handles the bindings between the interface and the audioEngineContext;
1672 this.specification = specificationObject;
1673 this.insertPoint = document.getElementById("topLevelBody");
1674
1675 // Bounded by interface!!
1676 // Interface object MUST have an exportXMLDOM method which returns the various DOM levels
1677 // For example, APE returns the slider position normalised in a <value> tag.
1678 this.interfaceObjects = [];
1679 this.interfaceObject = function(){};
1680
1681 this.resizeWindow = function(event)
1682 {
1683 for(var i=0; i<this.commentBoxes.length; i++)
1684 {this.commentBoxes[i].resize();}
1685 for(var i=0; i<this.commentQuestions.length; i++)
1686 {this.commentQuestions[i].resize();}
1687 try
1688 {
1689 resizeWindow(event);
1690 }
1691 catch(err)
1692 {
1693 console.log("Warning - Interface does not have Resize option");
1694 console.log(err);
1695 }
1696 };
1697
1698 this.commentBoxes = [];
1699 this.elementCommentBox = function(audioObject) {
1700 var element = audioObject.specification;
1701 this.audioObject = audioObject;
1702 this.id = audioObject.id;
1703 var audioHolderObject = audioObject.specification.parent;
1704 // Create document objects to hold the comment boxes
1705 this.trackComment = document.createElement('div');
1706 this.trackComment.className = 'comment-div';
1707 this.trackComment.id = 'comment-div-'+audioObject.id;
1708 // Create a string next to each comment asking for a comment
1709 this.trackString = document.createElement('span');
1710 this.trackString.innerHTML = audioHolderObject.commentBoxPrefix+' '+audioObject.id;
1711 // Create the HTML5 comment box 'textarea'
1712 this.trackCommentBox = document.createElement('textarea');
1713 this.trackCommentBox.rows = '4';
1714 this.trackCommentBox.cols = '100';
1715 this.trackCommentBox.name = 'trackComment'+audioObject.id;
1716 this.trackCommentBox.className = 'trackComment';
1717 var br = document.createElement('br');
1718 // Add to the holder.
1719 this.trackComment.appendChild(this.trackString);
1720 this.trackComment.appendChild(br);
1721 this.trackComment.appendChild(this.trackCommentBox);
1722
1723 this.exportXMLDOM = function() {
1724 var root = document.createElement('comment');
1725 if (this.audioObject.specification.parent.elementComments) {
1726 var question = document.createElement('question');
1727 question.textContent = this.trackString.textContent;
1728 var response = document.createElement('response');
1729 response.textContent = this.trackCommentBox.value;
1730 console.log("Comment frag-"+this.id+": "+response.textContent);
1731 root.appendChild(question);
1732 root.appendChild(response);
1733 }
1734 return root;
1735 };
1736 this.resize = function()
1737 {
1738 var boxwidth = (window.innerWidth-100)/2;
1739 if (boxwidth >= 600)
1740 {
1741 boxwidth = 600;
1742 }
1743 else if (boxwidth < 400)
1744 {
1745 boxwidth = 400;
1746 }
1747 this.trackComment.style.width = boxwidth+"px";
1748 this.trackCommentBox.style.width = boxwidth-6+"px";
1749 };
1750 this.resize();
1751 };
1752
1753 this.commentQuestions = [];
1754
1755 this.commentBox = function(commentQuestion) {
1756 this.specification = commentQuestion;
1757 // Create document objects to hold the comment boxes
1758 this.holder = document.createElement('div');
1759 this.holder.className = 'comment-div';
1760 // Create a string next to each comment asking for a comment
1761 this.string = document.createElement('span');
1762 this.string.innerHTML = commentQuestion.question;
1763 // Create the HTML5 comment box 'textarea'
1764 this.textArea = document.createElement('textarea');
1765 this.textArea.rows = '4';
1766 this.textArea.cols = '100';
1767 this.textArea.className = 'trackComment';
1768 var br = document.createElement('br');
1769 // Add to the holder.
1770 this.holder.appendChild(this.string);
1771 this.holder.appendChild(br);
1772 this.holder.appendChild(this.textArea);
1773
1774 this.exportXMLDOM = function() {
1775 var root = document.createElement('comment');
1776 root.id = this.specification.id;
1777 root.setAttribute('type',this.specification.type);
1778 root.textContent = this.textArea.value;
1779 console.log("Question: "+this.string.textContent);
1780 console.log("Response: "+root.textContent);
1781 return root;
1782 };
1783 this.resize = function()
1784 {
1785 var boxwidth = (window.innerWidth-100)/2;
1786 if (boxwidth >= 600)
1787 {
1788 boxwidth = 600;
1789 }
1790 else if (boxwidth < 400)
1791 {
1792 boxwidth = 400;
1793 }
1794 this.holder.style.width = boxwidth+"px";
1795 this.textArea.style.width = boxwidth-6+"px";
1796 };
1797 this.resize();
1798 };
1799
1800 this.radioBox = function(commentQuestion) {
1801 this.specification = commentQuestion;
1802 // Create document objects to hold the comment boxes
1803 this.holder = document.createElement('div');
1804 this.holder.className = 'comment-div';
1805 // Create a string next to each comment asking for a comment
1806 this.string = document.createElement('span');
1807 this.string.innerHTML = commentQuestion.statement;
1808 var br = document.createElement('br');
1809 // Add to the holder.
1810 this.holder.appendChild(this.string);
1811 this.holder.appendChild(br);
1812 this.options = [];
1813 this.inputs = document.createElement('div');
1814 this.span = document.createElement('div');
1815 this.inputs.align = 'center';
1816 this.inputs.style.marginLeft = '12px';
1817 this.span.style.marginLeft = '12px';
1818 this.span.align = 'center';
1819 this.span.style.marginTop = '15px';
1820
1821 var optCount = commentQuestion.options.length;
1822 for (var i=0; i<optCount; i++)
1823 {
1824 var div = document.createElement('div');
1825 div.style.width = '80px';
1826 div.style.float = 'left';
1827 var input = document.createElement('input');
1828 input.type = 'radio';
1829 input.name = commentQuestion.id;
1830 input.setAttribute('setvalue',commentQuestion.options[i].name);
1831 input.className = 'comment-radio';
1832 div.appendChild(input);
1833 this.inputs.appendChild(div);
1834
1835
1836 div = document.createElement('div');
1837 div.style.width = '80px';
1838 div.style.float = 'left';
1839 div.align = 'center';
1840 var span = document.createElement('span');
1841 span.textContent = commentQuestion.options[i].text;
1842 span.className = 'comment-radio-span';
1843 div.appendChild(span);
1844 this.span.appendChild(div);
1845 this.options.push(input);
1846 }
1847 this.holder.appendChild(this.span);
1848 this.holder.appendChild(this.inputs);
1849
1850 this.exportXMLDOM = function() {
1851 var root = document.createElement('comment');
1852 root.id = this.specification.id;
1853 root.setAttribute('type',this.specification.type);
1854 var question = document.createElement('question');
1855 question.textContent = this.string.textContent;
1856 var response = document.createElement('response');
1857 var i=0;
1858 while(this.options[i].checked == false) {
1859 i++;
1860 if (i >= this.options.length) {
1861 break;
1862 }
1863 }
1864 if (i >= this.options.length) {
1865 response.textContent = 'null';
1866 } else {
1867 response.textContent = this.options[i].getAttribute('setvalue');
1868 response.setAttribute('number',i);
1869 }
1870 console.log('Comment: '+question.textContent);
1871 console.log('Response: '+response.textContent);
1872 root.appendChild(question);
1873 root.appendChild(response);
1874 return root;
1875 };
1876 this.resize = function()
1877 {
1878 var boxwidth = (window.innerWidth-100)/2;
1879 if (boxwidth >= 600)
1880 {
1881 boxwidth = 600;
1882 }
1883 else if (boxwidth < 400)
1884 {
1885 boxwidth = 400;
1886 }
1887 this.holder.style.width = boxwidth+"px";
1888 var text = this.holder.children[2];
1889 var options = this.holder.children[3];
1890 var optCount = options.children.length;
1891 var spanMargin = Math.floor(((boxwidth-20-(optCount*80))/(optCount))/2)+'px';
1892 var options = options.firstChild;
1893 var text = text.firstChild;
1894 options.style.marginRight = spanMargin;
1895 options.style.marginLeft = spanMargin;
1896 text.style.marginRight = spanMargin;
1897 text.style.marginLeft = spanMargin;
1898 while(options.nextSibling != undefined)
1899 {
1900 options = options.nextSibling;
1901 text = text.nextSibling;
1902 options.style.marginRight = spanMargin;
1903 options.style.marginLeft = spanMargin;
1904 text.style.marginRight = spanMargin;
1905 text.style.marginLeft = spanMargin;
1906 }
1907 };
1908 this.resize();
1909 };
1910
1911 this.checkboxBox = function(commentQuestion) {
1912 this.specification = commentQuestion;
1913 // Create document objects to hold the comment boxes
1914 this.holder = document.createElement('div');
1915 this.holder.className = 'comment-div';
1916 // Create a string next to each comment asking for a comment
1917 this.string = document.createElement('span');
1918 this.string.innerHTML = commentQuestion.statement;
1919 var br = document.createElement('br');
1920 // Add to the holder.
1921 this.holder.appendChild(this.string);
1922 this.holder.appendChild(br);
1923 this.options = [];
1924 this.inputs = document.createElement('div');
1925 this.span = document.createElement('div');
1926 this.inputs.align = 'center';
1927 this.inputs.style.marginLeft = '12px';
1928 this.span.style.marginLeft = '12px';
1929 this.span.align = 'center';
1930 this.span.style.marginTop = '15px';
1931
1932 var optCount = commentQuestion.options.length;
1933 for (var i=0; i<optCount; i++)
1934 {
1935 var div = document.createElement('div');
1936 div.style.width = '80px';
1937 div.style.float = 'left';
1938 var input = document.createElement('input');
1939 input.type = 'checkbox';
1940 input.name = commentQuestion.id;
1941 input.setAttribute('setvalue',commentQuestion.options[i].name);
1942 input.className = 'comment-radio';
1943 div.appendChild(input);
1944 this.inputs.appendChild(div);
1945
1946
1947 div = document.createElement('div');
1948 div.style.width = '80px';
1949 div.style.float = 'left';
1950 div.align = 'center';
1951 var span = document.createElement('span');
1952 span.textContent = commentQuestion.options[i].text;
1953 span.className = 'comment-radio-span';
1954 div.appendChild(span);
1955 this.span.appendChild(div);
1956 this.options.push(input);
1957 }
1958 this.holder.appendChild(this.span);
1959 this.holder.appendChild(this.inputs);
1960
1961 this.exportXMLDOM = function() {
1962 var root = document.createElement('comment');
1963 root.id = this.specification.id;
1964 root.setAttribute('type',this.specification.type);
1965 var question = document.createElement('question');
1966 question.textContent = this.string.textContent;
1967 root.appendChild(question);
1968 console.log('Comment: '+question.textContent);
1969 for (var i=0; i<this.options.length; i++) {
1970 var response = document.createElement('response');
1971 response.textContent = this.options[i].checked;
1972 response.setAttribute('name',this.options[i].getAttribute('setvalue'));
1973 root.appendChild(response);
1974 console.log('Response '+response.getAttribute('name') +': '+response.textContent);
1975 }
1976 return root;
1977 };
1978 this.resize = function()
1979 {
1980 var boxwidth = (window.innerWidth-100)/2;
1981 if (boxwidth >= 600)
1982 {
1983 boxwidth = 600;
1984 }
1985 else if (boxwidth < 400)
1986 {
1987 boxwidth = 400;
1988 }
1989 this.holder.style.width = boxwidth+"px";
1990 var text = this.holder.children[2];
1991 var options = this.holder.children[3];
1992 var optCount = options.children.length;
1993 var spanMargin = Math.floor(((boxwidth-20-(optCount*80))/(optCount))/2)+'px';
1994 var options = options.firstChild;
1995 var text = text.firstChild;
1996 options.style.marginRight = spanMargin;
1997 options.style.marginLeft = spanMargin;
1998 text.style.marginRight = spanMargin;
1999 text.style.marginLeft = spanMargin;
2000 while(options.nextSibling != undefined)
2001 {
2002 options = options.nextSibling;
2003 text = text.nextSibling;
2004 options.style.marginRight = spanMargin;
2005 options.style.marginLeft = spanMargin;
2006 text.style.marginRight = spanMargin;
2007 text.style.marginLeft = spanMargin;
2008 }
2009 };
2010 this.resize();
2011 };
2012
2013 this.createCommentBox = function(audioObject) {
2014 var node = new this.elementCommentBox(audioObject);
2015 this.commentBoxes.push(node);
2016 audioObject.commentDOM = node;
2017 return node;
2018 };
2019
2020 this.sortCommentBoxes = function() {
2021 var holder = [];
2022 while (this.commentBoxes.length > 0) {
2023 var node = this.commentBoxes.pop(0);
2024 holder[node.id] = node;
2025 }
2026 this.commentBoxes = holder;
2027 };
2028
2029 this.showCommentBoxes = function(inject, sort) {
2030 if (sort) {interfaceContext.sortCommentBoxes();}
2031 for (var i=0; i<interfaceContext.commentBoxes.length; i++) {
2032 inject.appendChild(this.commentBoxes[i].trackComment);
2033 }
2034 };
2035
2036 this.deleteCommentBoxes = function() {
2037 this.commentBoxes = [];
2038 };
2039
2040 this.createCommentQuestion = function(element) {
2041 var node;
2042 if (element.type == 'text') {
2043 node = new this.commentBox(element);
2044 } else if (element.type == 'radio') {
2045 node = new this.radioBox(element);
2046 } else if (element.type == 'checkbox') {
2047 node = new this.checkboxBox(element);
2048 }
2049 this.commentQuestions.push(node);
2050 return node;
2051 };
2052
2053 this.deleteCommentQuestions = function()
2054 {
2055 this.commentQuestions = [];
2056 };
2057
2058 this.playhead = new function()
2059 {
2060 this.object = document.createElement('div');
2061 this.object.className = 'playhead';
2062 this.object.align = 'left';
2063 var curTime = document.createElement('div');
2064 curTime.style.width = '50px';
2065 this.curTimeSpan = document.createElement('span');
2066 this.curTimeSpan.textContent = '00:00';
2067 curTime.appendChild(this.curTimeSpan);
2068 this.object.appendChild(curTime);
2069 this.scrubberTrack = document.createElement('div');
2070 this.scrubberTrack.className = 'playhead-scrub-track';
2071
2072 this.scrubberHead = document.createElement('div');
2073 this.scrubberHead.id = 'playhead-scrubber';
2074 this.scrubberTrack.appendChild(this.scrubberHead);
2075 this.object.appendChild(this.scrubberTrack);
2076
2077 this.timePerPixel = 0;
2078 this.maxTime = 0;
2079
2080 this.playbackObject;
2081
2082 this.setTimePerPixel = function(audioObject) {
2083 //maxTime must be in seconds
2084 this.playbackObject = audioObject;
2085 this.maxTime = audioObject.buffer.duration;
2086 var width = 490; //500 - 10, 5 each side of the tracker head
2087 this.timePerPixel = this.maxTime/490;
2088 if (this.maxTime < 60) {
2089 this.curTimeSpan.textContent = '0.00';
2090 } else {
2091 this.curTimeSpan.textContent = '00:00';
2092 }
2093 };
2094
2095 this.update = function() {
2096 // Update the playhead position, startPlay must be called
2097 if (this.timePerPixel > 0) {
2098 var time = this.playbackObject.getCurrentPosition();
2099 if (time > 0) {
2100 var width = 490;
2101 var pix = Math.floor(time/this.timePerPixel);
2102 this.scrubberHead.style.left = pix+'px';
2103 if (this.maxTime > 60.0) {
2104 var secs = time%60;
2105 var mins = Math.floor((time-secs)/60);
2106 secs = secs.toString();
2107 secs = secs.substr(0,2);
2108 mins = mins.toString();
2109 this.curTimeSpan.textContent = mins+':'+secs;
2110 } else {
2111 time = time.toString();
2112 this.curTimeSpan.textContent = time.substr(0,4);
2113 }
2114 } else {
2115 this.scrubberHead.style.left = '0px';
2116 if (this.maxTime < 60) {
2117 this.curTimeSpan.textContent = '0.00';
2118 } else {
2119 this.curTimeSpan.textContent = '00:00';
2120 }
2121 }
2122 }
2123 };
2124
2125 this.interval = undefined;
2126
2127 this.start = function() {
2128 if (this.playbackObject != undefined && this.interval == undefined) {
2129 if (this.maxTime < 60) {
2130 this.interval = setInterval(function(){interfaceContext.playhead.update();},10);
2131 } else {
2132 this.interval = setInterval(function(){interfaceContext.playhead.update();},100);
2133 }
2134 }
2135 };
2136 this.stop = function() {
2137 clearInterval(this.interval);
2138 this.interval = undefined;
2139 if (this.maxTime < 60) {
2140 this.curTimeSpan.textContent = '0.00';
2141 } else {
2142 this.curTimeSpan.textContent = '00:00';
2143 }
2144 };
2145 };
2146
2147 // Global Checkers
2148 // These functions will help enforce the checkers
2149 this.checkHiddenAnchor = function()
2150 {
2151 var audioHolder = testState.currentStateMap[testState.currentIndex];
2152 if (audioHolder.anchorId != null)
2153 {
2154 var audioObject = audioEngineContext.audioObjects[audioHolder.anchorId];
2155 if (audioObject.interfaceDOM.getValue() > audioObject.specification.marker && audioObject.interfaceDOM.enforce == true)
2156 {
2157 // Anchor is not set below
2158 console.log('Anchor node not below marker value');
2159 alert('Please keep listening');
2160 return false;
2161 }
2162 }
2163 return true;
2164 };
2165
2166 this.checkHiddenReference = function()
2167 {
2168 var audioHolder = testState.currentStateMap[testState.currentIndex];
2169 if (audioHolder.referenceId != null)
2170 {
2171 var audioObject = audioEngineContext.audioObjects[audioHolder.referenceId];
2172 if (audioObject.interfaceDOM.getValue() < audioObject.specification.marker && audioObject.interfaceDOM.enforce == true)
2173 {
2174 // Anchor is not set below
2175 console.log('Reference node not above marker value');
2176 alert('Please keep listening');
2177 return false;
2178 }
2179 }
2180 return true;
2181 };
2182 }