comparison core.js @ 1404:3b9f0bc523d6

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