Mercurial > hg > webaudioevaluationtool
comparison core.js @ 1318:64541cd9265d
Added schema for Test Specification Document for validation (wip)
author | Nicholas Jillings <nickjillings@users.noreply.github.com> |
---|---|
date | Wed, 23 Dec 2015 12:41:08 +0000 |
parents | |
children | 2ecf6ae18625 |
comparison
equal
deleted
inserted
replaced
-1:000000000000 | 1318:64541cd9265d |
---|---|
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 // Add a prototype to the bufferNode to hold the desired LINEAR gain | |
23 AudioBuffer.prototype.gain = undefined; | |
24 // Add a prototype to the bufferNode to hold the computed LUFS loudness | |
25 AudioBuffer.prototype.lufs = undefined; | |
26 | |
27 window.onload = function() { | |
28 // Function called once the browser has loaded all files. | |
29 // This should perform any initial commands such as structure / loading documents | |
30 | |
31 // Create a web audio API context | |
32 // Fixed for cross-browser support | |
33 var AudioContext = window.AudioContext || window.webkitAudioContext; | |
34 audioContext = new AudioContext; | |
35 | |
36 // Create test state | |
37 testState = new stateMachine(); | |
38 | |
39 // Create the popup interface object | |
40 popup = new interfacePopup(); | |
41 | |
42 // Create the specification object | |
43 specification = new Specification(); | |
44 | |
45 // Create the interface object | |
46 interfaceContext = new Interface(specification); | |
47 // Define window callbacks for interface | |
48 window.onresize = function(event){interfaceContext.resizeWindow(event);}; | |
49 }; | |
50 | |
51 function loadProjectSpec(url) { | |
52 // Load the project document from the given URL, decode the XML and instruct audioEngine to get audio data | |
53 // If url is null, request client to upload project XML document | |
54 var r = new XMLHttpRequest(); | |
55 r.open('GET',url,true); | |
56 r.onload = function() { | |
57 loadProjectSpecCallback(r.response); | |
58 }; | |
59 r.send(); | |
60 }; | |
61 | |
62 function loadProjectSpecCallback(response) { | |
63 // Function called after asynchronous download of XML project specification | |
64 //var decode = $.parseXML(response); | |
65 //projectXML = $(decode); | |
66 | |
67 var parse = new DOMParser(); | |
68 projectXML = parse.parseFromString(response,'text/xml'); | |
69 var errorNode = projectXML.getElementsByTagName('parsererror'); | |
70 if (errorNode.length >= 1) | |
71 { | |
72 var msg = document.createElement("h3"); | |
73 msg.textContent = "FATAL ERROR"; | |
74 var span = document.createElement("span"); | |
75 span.textContent = "The XML parser returned the following errors when decoding your XML file"; | |
76 document.getElementsByTagName('body')[0].innerHTML = null; | |
77 document.getElementsByTagName('body')[0].appendChild(msg); | |
78 document.getElementsByTagName('body')[0].appendChild(span); | |
79 document.getElementsByTagName('body')[0].appendChild(errorNode[0]); | |
80 return; | |
81 } | |
82 | |
83 // Build the specification | |
84 specification.decode(projectXML); | |
85 | |
86 // Detect the interface to use and load the relevant javascripts. | |
87 var interfaceJS = document.createElement('script'); | |
88 interfaceJS.setAttribute("type","text/javascript"); | |
89 if (specification.interfaceType == 'APE') { | |
90 interfaceJS.setAttribute("src","ape.js"); | |
91 | |
92 // APE comes with a css file | |
93 var css = document.createElement('link'); | |
94 css.rel = 'stylesheet'; | |
95 css.type = 'text/css'; | |
96 css.href = 'ape.css'; | |
97 | |
98 document.getElementsByTagName("head")[0].appendChild(css); | |
99 } else if (specification.interfaceType == "MUSHRA") | |
100 { | |
101 interfaceJS.setAttribute("src","mushra.js"); | |
102 | |
103 // MUSHRA comes with a css file | |
104 var css = document.createElement('link'); | |
105 css.rel = 'stylesheet'; | |
106 css.type = 'text/css'; | |
107 css.href = 'mushra.css'; | |
108 | |
109 document.getElementsByTagName("head")[0].appendChild(css); | |
110 } | |
111 document.getElementsByTagName("head")[0].appendChild(interfaceJS); | |
112 | |
113 // Create the audio engine object | |
114 audioEngineContext = new AudioEngine(specification); | |
115 | |
116 testState.stateMap.push(specification.preTest); | |
117 | |
118 $(specification.audioHolders).each(function(index,elem){ | |
119 testState.stateMap.push(elem); | |
120 $(elem.audioElements).each(function(i,audioElem){ | |
121 var URL = audioElem.parent.hostURL + audioElem.url; | |
122 var buffer = null; | |
123 for (var i=0; i<audioEngineContext.buffers.length; i++) | |
124 { | |
125 if (URL == audioEngineContext.buffers[i].url) | |
126 { | |
127 buffer = audioEngineContext.buffers[i]; | |
128 break; | |
129 } | |
130 } | |
131 if (buffer == null) | |
132 { | |
133 buffer = new audioEngineContext.bufferObj(); | |
134 buffer.getMedia(URL); | |
135 audioEngineContext.buffers.push(buffer); | |
136 } | |
137 }); | |
138 }); | |
139 | |
140 testState.stateMap.push(specification.postTest); | |
141 } | |
142 | |
143 function createProjectSave(destURL) { | |
144 // Save the data from interface into XML and send to destURL | |
145 // If destURL is null then download XML in client | |
146 // Now time to render file locally | |
147 var xmlDoc = interfaceXMLSave(); | |
148 var parent = document.createElement("div"); | |
149 parent.appendChild(xmlDoc); | |
150 var file = [parent.innerHTML]; | |
151 if (destURL == "null" || destURL == undefined) { | |
152 var bb = new Blob(file,{type : 'application/xml'}); | |
153 var dnlk = window.URL.createObjectURL(bb); | |
154 var a = document.createElement("a"); | |
155 a.hidden = ''; | |
156 a.href = dnlk; | |
157 a.download = "save.xml"; | |
158 a.textContent = "Save File"; | |
159 | |
160 popup.showPopup(); | |
161 popup.popupContent.innerHTML = null; | |
162 popup.popupContent.appendChild(a); | |
163 } else { | |
164 var xmlhttp = new XMLHttpRequest; | |
165 xmlhttp.open("POST",destURL,true); | |
166 xmlhttp.setRequestHeader('Content-Type', 'text/xml'); | |
167 xmlhttp.onerror = function(){ | |
168 console.log('Error saving file to server! Presenting download locally'); | |
169 createProjectSave(null); | |
170 }; | |
171 xmlhttp.onreadystatechange = function() { | |
172 console.log(xmlhttp.status); | |
173 if (xmlhttp.status != 200 && xmlhttp.readyState == 4) { | |
174 createProjectSave(null); | |
175 } else { | |
176 if (xmlhttp.responseXML == null) | |
177 { | |
178 return createProjectSave(null); | |
179 } | |
180 var response = xmlhttp.responseXML.childNodes[0]; | |
181 if (response.getAttribute('state') == "OK") | |
182 { | |
183 var file = response.getElementsByTagName('file')[0]; | |
184 console.log('Save OK: Filename '+file.textContent+','+file.getAttribute('bytes')+'B'); | |
185 popup.showPopup(); | |
186 popup.popupContent.innerHTML = null; | |
187 popup.popupContent.textContent = "Thank you!"; | |
188 } else { | |
189 var message = response.getElementsByTagName('message')[0]; | |
190 errorSessionDump(message.textContent); | |
191 } | |
192 } | |
193 }; | |
194 xmlhttp.send(file); | |
195 } | |
196 } | |
197 | |
198 function errorSessionDump(msg){ | |
199 // Create the partial interface XML save | |
200 // Include error node with message on why the dump occured | |
201 popup.showPopup(); | |
202 popup.popupContent.innerHTML = null; | |
203 var err = document.createElement('error'); | |
204 var parent = document.createElement("div"); | |
205 if (typeof msg === "object") | |
206 { | |
207 err.appendChild(msg); | |
208 popup.popupContent.appendChild(msg); | |
209 | |
210 } else { | |
211 err.textContent = msg; | |
212 popup.popupContent.innerHTML = "ERROR : "+msg; | |
213 } | |
214 var xmlDoc = interfaceXMLSave(); | |
215 xmlDoc.appendChild(err); | |
216 parent.appendChild(xmlDoc); | |
217 var file = [parent.innerHTML]; | |
218 var bb = new Blob(file,{type : 'application/xml'}); | |
219 var dnlk = window.URL.createObjectURL(bb); | |
220 var a = document.createElement("a"); | |
221 a.hidden = ''; | |
222 a.href = dnlk; | |
223 a.download = "save.xml"; | |
224 a.textContent = "Save File"; | |
225 | |
226 | |
227 | |
228 popup.popupContent.appendChild(a); | |
229 } | |
230 | |
231 // Only other global function which must be defined in the interface class. Determines how to create the XML document. | |
232 function interfaceXMLSave(){ | |
233 // Create the XML string to be exported with results | |
234 var xmlDoc = document.createElement("BrowserEvaluationResult"); | |
235 var projectDocument = specification.projectXML; | |
236 projectDocument.setAttribute('file-name',url); | |
237 xmlDoc.appendChild(projectDocument); | |
238 xmlDoc.appendChild(returnDateNode()); | |
239 xmlDoc.appendChild(interfaceContext.returnNavigator()); | |
240 for (var i=0; i<testState.stateResults.length; i++) | |
241 { | |
242 xmlDoc.appendChild(testState.stateResults[i]); | |
243 } | |
244 | |
245 return xmlDoc; | |
246 } | |
247 | |
248 function linearToDecibel(gain) | |
249 { | |
250 return 20.0*Math.log10(gain); | |
251 } | |
252 | |
253 function decibelToLinear(gain) | |
254 { | |
255 return Math.pow(10,gain/20.0); | |
256 } | |
257 | |
258 function interfacePopup() { | |
259 // Creates an object to manage the popup | |
260 this.popup = null; | |
261 this.popupContent = null; | |
262 this.popupTitle = null; | |
263 this.popupResponse = null; | |
264 this.buttonProceed = null; | |
265 this.buttonPrevious = null; | |
266 this.popupOptions = null; | |
267 this.currentIndex = null; | |
268 this.responses = null; | |
269 $(window).keypress(function(e){ | |
270 if (e.keyCode == 13 && popup.popup.style.visibility == 'visible') | |
271 { | |
272 console.log(e); | |
273 popup.buttonProceed.onclick(); | |
274 e.preventDefault(); | |
275 } | |
276 }); | |
277 | |
278 this.createPopup = function(){ | |
279 // Create popup window interface | |
280 var insertPoint = document.getElementById("topLevelBody"); | |
281 var blank = document.createElement('div'); | |
282 blank.className = 'testHalt'; | |
283 | |
284 this.popup = document.createElement('div'); | |
285 this.popup.id = 'popupHolder'; | |
286 this.popup.className = 'popupHolder'; | |
287 this.popup.style.position = 'absolute'; | |
288 this.popup.style.left = (window.innerWidth/2)-250 + 'px'; | |
289 this.popup.style.top = (window.innerHeight/2)-125 + 'px'; | |
290 | |
291 this.popupContent = document.createElement('div'); | |
292 this.popupContent.id = 'popupContent'; | |
293 this.popupContent.style.marginTop = '20px'; | |
294 this.popupContent.style.marginBottom = '5px'; | |
295 this.popup.appendChild(this.popupContent); | |
296 | |
297 var titleHolder = document.createElement('div'); | |
298 titleHolder.id = 'popupTitleHolder'; | |
299 titleHolder.align = 'center'; | |
300 titleHolder.style.width = 'inherit'; | |
301 titleHolder.style.minHeight = '25px'; | |
302 titleHolder.style.maxHeight = '250px'; | |
303 titleHolder.style.overflow = 'auto'; | |
304 titleHolder.style.marginBottom = '5px'; | |
305 | |
306 this.popupTitle = document.createElement('span'); | |
307 this.popupTitle.id = 'popupTitle'; | |
308 titleHolder.appendChild(this.popupTitle); | |
309 this.popupContent.appendChild(titleHolder); | |
310 | |
311 this.popupResponse = document.createElement('div'); | |
312 this.popupResponse.id = 'popupResponse'; | |
313 this.popupResponse.align = 'center'; | |
314 this.popupResponse.style.width = 'inherit'; | |
315 this.popupResponse.style.minHeight = '50px'; | |
316 this.popupResponse.style.maxHeight = '320px'; | |
317 this.popupResponse.style.overflow = 'auto'; | |
318 this.popupContent.appendChild(this.popupResponse); | |
319 | |
320 this.buttonProceed = document.createElement('button'); | |
321 this.buttonProceed.className = 'popupButton'; | |
322 this.buttonProceed.position = 'relative'; | |
323 this.buttonProceed.style.left = '390px'; | |
324 this.buttonProceed.innerHTML = 'Next'; | |
325 this.buttonProceed.onclick = function(){popup.proceedClicked();}; | |
326 | |
327 this.buttonPrevious = document.createElement('button'); | |
328 this.buttonPrevious.className = 'popupButton'; | |
329 this.buttonPrevious.position = 'relative'; | |
330 this.buttonPrevious.style.left = '10px'; | |
331 this.buttonPrevious.innerHTML = 'Back'; | |
332 this.buttonPrevious.onclick = function(){popup.previousClick();}; | |
333 | |
334 this.popupContent.appendChild(this.buttonPrevious); | |
335 this.popupContent.appendChild(this.buttonProceed); | |
336 | |
337 this.popup.style.zIndex = -1; | |
338 this.popup.style.visibility = 'hidden'; | |
339 blank.style.zIndex = -2; | |
340 blank.style.visibility = 'hidden'; | |
341 insertPoint.appendChild(this.popup); | |
342 insertPoint.appendChild(blank); | |
343 }; | |
344 | |
345 this.showPopup = function(){ | |
346 if (this.popup == null) { | |
347 this.createPopup(); | |
348 } | |
349 this.popup.style.zIndex = 3; | |
350 this.popup.style.visibility = 'visible'; | |
351 var blank = document.getElementsByClassName('testHalt')[0]; | |
352 blank.style.zIndex = 2; | |
353 blank.style.visibility = 'visible'; | |
354 }; | |
355 | |
356 this.hidePopup = function(){ | |
357 this.popup.style.zIndex = -1; | |
358 this.popup.style.visibility = 'hidden'; | |
359 var blank = document.getElementsByClassName('testHalt')[0]; | |
360 blank.style.zIndex = -2; | |
361 blank.style.visibility = 'hidden'; | |
362 this.buttonPrevious.style.visibility = 'inherit'; | |
363 }; | |
364 | |
365 this.postNode = function() { | |
366 // This will take the node from the popupOptions and display it | |
367 var node = this.popupOptions[this.currentIndex]; | |
368 this.popupResponse.innerHTML = null; | |
369 if (node.type == 'statement') { | |
370 this.popupTitle.textContent = null; | |
371 var statement = document.createElement('span'); | |
372 statement.textContent = node.statement; | |
373 this.popupResponse.appendChild(statement); | |
374 } else if (node.type == 'question') { | |
375 this.popupTitle.textContent = node.question; | |
376 var textArea = document.createElement('textarea'); | |
377 switch (node.boxsize) { | |
378 case 'small': | |
379 textArea.cols = "20"; | |
380 textArea.rows = "1"; | |
381 break; | |
382 case 'normal': | |
383 textArea.cols = "30"; | |
384 textArea.rows = "2"; | |
385 break; | |
386 case 'large': | |
387 textArea.cols = "40"; | |
388 textArea.rows = "5"; | |
389 break; | |
390 case 'huge': | |
391 textArea.cols = "50"; | |
392 textArea.rows = "10"; | |
393 break; | |
394 } | |
395 this.popupResponse.appendChild(textArea); | |
396 textArea.focus(); | |
397 } else if (node.type == 'checkbox') { | |
398 this.popupTitle.textContent = node.statement; | |
399 var optHold = this.popupResponse; | |
400 for (var i=0; i<node.options.length; i++) { | |
401 var option = node.options[i]; | |
402 var input = document.createElement('input'); | |
403 input.id = option.id; | |
404 input.type = 'checkbox'; | |
405 var span = document.createElement('span'); | |
406 span.textContent = option.text; | |
407 var hold = document.createElement('div'); | |
408 hold.setAttribute('name','option'); | |
409 hold.style.padding = '4px'; | |
410 hold.appendChild(input); | |
411 hold.appendChild(span); | |
412 optHold.appendChild(hold); | |
413 } | |
414 } else if (node.type == 'radio') { | |
415 this.popupTitle.textContent = node.statement; | |
416 var optHold = this.popupResponse; | |
417 for (var i=0; i<node.options.length; i++) { | |
418 var option = node.options[i]; | |
419 var input = document.createElement('input'); | |
420 input.id = option.name; | |
421 input.type = 'radio'; | |
422 input.name = node.id; | |
423 var span = document.createElement('span'); | |
424 span.textContent = option.text; | |
425 var hold = document.createElement('div'); | |
426 hold.setAttribute('name','option'); | |
427 hold.style.padding = '4px'; | |
428 hold.appendChild(input); | |
429 hold.appendChild(span); | |
430 optHold.appendChild(hold); | |
431 } | |
432 } else if (node.type == 'number') { | |
433 this.popupTitle.textContent = node.statement; | |
434 var input = document.createElement('input'); | |
435 input.type = 'textarea'; | |
436 if (node.min != null) {input.min = node.min;} | |
437 if (node.max != null) {input.max = node.max;} | |
438 if (node.step != null) {input.step = node.step;} | |
439 this.popupResponse.appendChild(input); | |
440 } | |
441 var content_height = Number(this.popup.offsetHeight.toFixed()); | |
442 content_height -= Number(this.popupContent.offsetHeight.toFixed()); | |
443 content_height -=Number(this.buttonProceed.offsetHeight.toFixed()); | |
444 content_height = content_height + "px"; | |
445 this.buttonProceed.style.top = content_height; | |
446 this.buttonPrevious.style.top = content_height; | |
447 if(this.currentIndex+1 == this.popupOptions.length) { | |
448 if (this.responses.nodeName == "PRETEST") { | |
449 this.buttonProceed.textContent = 'Start'; | |
450 } else { | |
451 this.buttonProceed.textContent = 'Submit'; | |
452 } | |
453 } else { | |
454 this.buttonProceed.textContent = 'Next'; | |
455 } | |
456 if(this.currentIndex > 0) | |
457 this.buttonPrevious.style.visibility = 'visible'; | |
458 else | |
459 this.buttonPrevious.style.visibility = 'hidden'; | |
460 }; | |
461 | |
462 this.initState = function(node) { | |
463 //Call this with your preTest and postTest nodes when needed to | |
464 // initialise the popup procedure. | |
465 this.popupOptions = node.options; | |
466 if (this.popupOptions.length > 0) { | |
467 if (node.type == 'pretest') { | |
468 this.responses = document.createElement('PreTest'); | |
469 } else if (node.type == 'posttest') { | |
470 this.responses = document.createElement('PostTest'); | |
471 } else { | |
472 console.log ('WARNING - popup node neither pre or post!'); | |
473 this.responses = document.createElement('responses'); | |
474 } | |
475 this.currentIndex = 0; | |
476 this.showPopup(); | |
477 this.postNode(); | |
478 } else { | |
479 advanceState(); | |
480 } | |
481 }; | |
482 | |
483 this.proceedClicked = function() { | |
484 // Each time the popup button is clicked! | |
485 var node = this.popupOptions[this.currentIndex]; | |
486 if (node.type == 'question') { | |
487 // Must extract the question data | |
488 var textArea = $(popup.popupContent).find('textarea')[0]; | |
489 if (node.mandatory == true && textArea.value.length == 0) { | |
490 alert('This question is mandatory'); | |
491 return; | |
492 } else { | |
493 // Save the text content | |
494 var hold = document.createElement('comment'); | |
495 hold.id = node.id; | |
496 hold.innerHTML = textArea.value; | |
497 console.log("Question: "+ node.question); | |
498 console.log("Question Response: "+ textArea.value); | |
499 this.responses.appendChild(hold); | |
500 } | |
501 } else if (node.type == 'checkbox') { | |
502 // Must extract checkbox data | |
503 var optHold = this.popupResponse; | |
504 var hold = document.createElement('checkbox'); | |
505 console.log("Checkbox: "+ node.statement); | |
506 hold.id = node.id; | |
507 for (var i=0; i<optHold.childElementCount; i++) { | |
508 var input = optHold.childNodes[i].getElementsByTagName('input')[0]; | |
509 var statement = optHold.childNodes[i].getElementsByTagName('span')[0]; | |
510 var response = document.createElement('option'); | |
511 response.setAttribute('name',input.id); | |
512 response.textContent = input.checked; | |
513 hold.appendChild(response); | |
514 console.log(input.id +': '+ input.checked); | |
515 } | |
516 this.responses.appendChild(hold); | |
517 } else if (node.type == "radio") { | |
518 var optHold = this.popupResponse; | |
519 var hold = document.createElement('radio'); | |
520 console.log("Checkbox: "+ node.statement); | |
521 var responseID = null; | |
522 var i=0; | |
523 while(responseID == null) { | |
524 var input = optHold.childNodes[i].getElementsByTagName('input')[0]; | |
525 if (input.checked == true) { | |
526 responseID = i; | |
527 console.log("Selected: "+ node.options[i].name); | |
528 } | |
529 i++; | |
530 } | |
531 hold.id = node.id; | |
532 hold.setAttribute('name',node.options[responseID].name); | |
533 hold.textContent = node.options[responseID].text; | |
534 this.responses.appendChild(hold); | |
535 } else if (node.type == "number") { | |
536 var input = this.popupContent.getElementsByTagName('input')[0]; | |
537 if (node.mandatory == true && input.value.length == 0) { | |
538 alert('This question is mandatory. Please enter a number'); | |
539 return; | |
540 } | |
541 var enteredNumber = Number(input.value); | |
542 if (isNaN(enteredNumber)) { | |
543 alert('Please enter a valid number'); | |
544 return; | |
545 } | |
546 if (enteredNumber < node.min && node.min != null) { | |
547 alert('Number is below the minimum value of '+node.min); | |
548 return; | |
549 } | |
550 if (enteredNumber > node.max && node.max != null) { | |
551 alert('Number is above the maximum value of '+node.max); | |
552 return; | |
553 } | |
554 var hold = document.createElement('number'); | |
555 hold.id = node.id; | |
556 hold.textContent = input.value; | |
557 this.responses.appendChild(hold); | |
558 } | |
559 this.currentIndex++; | |
560 if (this.currentIndex < this.popupOptions.length) { | |
561 this.postNode(); | |
562 } else { | |
563 // Reached the end of the popupOptions | |
564 this.hidePopup(); | |
565 if (this.responses.nodeName == testState.stateResults[testState.stateIndex].nodeName) { | |
566 testState.stateResults[testState.stateIndex] = this.responses; | |
567 } else { | |
568 testState.stateResults[testState.stateIndex].appendChild(this.responses); | |
569 } | |
570 advanceState(); | |
571 } | |
572 }; | |
573 | |
574 this.previousClick = function() { | |
575 // Triggered when the 'Back' button is clicked in the survey | |
576 if (this.currentIndex > 0) { | |
577 this.currentIndex--; | |
578 var node = this.popupOptions[this.currentIndex]; | |
579 if (node.type != 'statement') { | |
580 var prevResp = this.responses.childNodes[this.responses.childElementCount-1]; | |
581 this.responses.removeChild(prevResp); | |
582 } | |
583 this.postNode(); | |
584 if (node.type == 'question') { | |
585 this.popupContent.getElementsByTagName('textarea')[0].value = prevResp.textContent; | |
586 } else if (node.type == 'checkbox') { | |
587 var options = this.popupContent.getElementsByTagName('input'); | |
588 var savedOptions = prevResp.getElementsByTagName('option'); | |
589 for (var i=0; i<options.length; i++) { | |
590 var id = options[i].id; | |
591 for (var j=0; j<savedOptions.length; j++) { | |
592 if (savedOptions[j].getAttribute('name') == id) { | |
593 if (savedOptions[j].textContent == 'true') {options[i].checked = true;} | |
594 else {options[i].checked = false;} | |
595 break; | |
596 } | |
597 } | |
598 } | |
599 } else if (node.type == 'number') { | |
600 this.popupContent.getElementsByTagName('input')[0].value = prevResp.textContent; | |
601 } else if (node.type == 'radio') { | |
602 var options = this.popupContent.getElementsByTagName('input'); | |
603 var name = prevResp.getAttribute('name'); | |
604 for (var i=0; i<options.length; i++) { | |
605 if (options[i].id == name) { | |
606 options[i].checked = true; | |
607 break; | |
608 } | |
609 } | |
610 } | |
611 } | |
612 }; | |
613 | |
614 this.resize = function(event) | |
615 { | |
616 // Called on window resize; | |
617 this.popup.style.left = (window.innerWidth/2)-250 + 'px'; | |
618 this.popup.style.top = (window.innerHeight/2)-125 + 'px'; | |
619 var blank = document.getElementsByClassName('testHalt')[0]; | |
620 blank.style.width = window.innerWidth; | |
621 blank.style.height = window.innerHeight; | |
622 }; | |
623 } | |
624 | |
625 function advanceState() | |
626 { | |
627 // Just for complete clarity | |
628 testState.advanceState(); | |
629 } | |
630 | |
631 function stateMachine() | |
632 { | |
633 // Object prototype for tracking and managing the test state | |
634 this.stateMap = []; | |
635 this.stateIndex = null; | |
636 this.currentStateMap = []; | |
637 this.currentIndex = null; | |
638 this.currentTestId = 0; | |
639 this.stateResults = []; | |
640 this.timerCallBackHolders = null; | |
641 this.initialise = function(){ | |
642 if (this.stateMap.length > 0) { | |
643 if(this.stateIndex != null) { | |
644 console.log('NOTE - State already initialise'); | |
645 } | |
646 this.stateIndex = -1; | |
647 var that = this; | |
648 var aH_pId = 0; | |
649 for (var id=0; id<this.stateMap.length; id++){ | |
650 var name = this.stateMap[id].type; | |
651 var obj = document.createElement(name); | |
652 if (name == 'audioHolder') { | |
653 obj.id = this.stateMap[id].id; | |
654 obj.setAttribute('presentedid',aH_pId); | |
655 aH_pId+=1; | |
656 } | |
657 this.stateResults.push(obj); | |
658 } | |
659 } else { | |
660 console.log('FATAL - StateMap not correctly constructed. EMPTY_STATE_MAP'); | |
661 } | |
662 }; | |
663 this.advanceState = function(){ | |
664 if (this.stateIndex == null) { | |
665 this.initialise(); | |
666 } | |
667 if (this.stateIndex == -1) { | |
668 console.log('Starting test...'); | |
669 } | |
670 if (this.currentIndex == null){ | |
671 if (this.currentStateMap.type == "audioHolder") { | |
672 // Save current page | |
673 this.testPageCompleted(this.stateResults[this.stateIndex],this.currentStateMap,this.currentTestId); | |
674 this.currentTestId++; | |
675 } | |
676 this.stateIndex++; | |
677 if (this.stateIndex >= this.stateMap.length) { | |
678 console.log('Test Completed'); | |
679 createProjectSave(specification.projectReturn); | |
680 } else { | |
681 this.currentStateMap = this.stateMap[this.stateIndex]; | |
682 if (this.currentStateMap.type == "audioHolder") { | |
683 console.log('Loading test page'); | |
684 interfaceContext.newPage(this.currentStateMap); | |
685 this.initialiseInnerState(this.currentStateMap); | |
686 } else if (this.currentStateMap.type == "pretest" || this.currentStateMap.type == "posttest") { | |
687 if (this.currentStateMap.options.length >= 1) { | |
688 popup.initState(this.currentStateMap); | |
689 } else { | |
690 this.advanceState(); | |
691 } | |
692 } else { | |
693 this.advanceState(); | |
694 } | |
695 } | |
696 } else { | |
697 this.advanceInnerState(); | |
698 } | |
699 }; | |
700 | |
701 this.testPageCompleted = function(store, testXML, testId) { | |
702 // Function called each time a test page has been completed | |
703 var metric = document.createElement('metric'); | |
704 if (audioEngineContext.metric.enableTestTimer) | |
705 { | |
706 var testTime = document.createElement('metricResult'); | |
707 testTime.id = 'testTime'; | |
708 testTime.textContent = audioEngineContext.timer.testDuration; | |
709 metric.appendChild(testTime); | |
710 } | |
711 store.appendChild(metric); | |
712 var audioObjects = audioEngineContext.audioObjects; | |
713 for (var i=0; i<audioObjects.length; i++) | |
714 { | |
715 var audioElement = audioEngineContext.audioObjects[i].exportXMLDOM(); | |
716 audioElement.setAttribute('presentedId',i); | |
717 store.appendChild(audioElement); | |
718 } | |
719 $(interfaceContext.commentQuestions).each(function(index,element){ | |
720 var node = element.exportXMLDOM(); | |
721 store.appendChild(node); | |
722 }); | |
723 pageXMLSave(store, testXML); | |
724 }; | |
725 | |
726 this.initialiseInnerState = function(node) { | |
727 // Parses the received testXML for pre and post test options | |
728 this.currentStateMap = []; | |
729 var preTest = node.preTest; | |
730 var postTest = node.postTest; | |
731 if (preTest == undefined) {preTest = document.createElement("preTest");} | |
732 if (postTest == undefined){postTest= document.createElement("postTest");} | |
733 this.currentStateMap.push(preTest); | |
734 this.currentStateMap.push(node); | |
735 this.currentStateMap.push(postTest); | |
736 this.currentIndex = -1; | |
737 this.advanceInnerState(); | |
738 }; | |
739 | |
740 this.advanceInnerState = function() { | |
741 this.currentIndex++; | |
742 if (this.currentIndex >= this.currentStateMap.length) { | |
743 this.currentIndex = null; | |
744 this.currentStateMap = this.stateMap[this.stateIndex]; | |
745 this.advanceState(); | |
746 } else { | |
747 if (this.currentStateMap[this.currentIndex].type == "audioHolder") { | |
748 console.log("Loading test page"+this.currentTestId); | |
749 } else if (this.currentStateMap[this.currentIndex].type == "pretest") { | |
750 popup.initState(this.currentStateMap[this.currentIndex]); | |
751 } else if (this.currentStateMap[this.currentIndex].type == "posttest") { | |
752 popup.initState(this.currentStateMap[this.currentIndex]); | |
753 } else { | |
754 this.advanceInnerState(); | |
755 } | |
756 } | |
757 }; | |
758 | |
759 this.previousState = function(){}; | |
760 } | |
761 | |
762 function AudioEngine(specification) { | |
763 | |
764 // Create two output paths, the main outputGain and fooGain. | |
765 // Output gain is default to 1 and any items for playback route here | |
766 // Foo gain is used for analysis to ensure paths get processed, but are not heard | |
767 // because web audio will optimise and any route which does not go to the destination gets ignored. | |
768 this.outputGain = audioContext.createGain(); | |
769 this.fooGain = audioContext.createGain(); | |
770 this.fooGain.gain = 0; | |
771 | |
772 // Use this to detect playback state: 0 - stopped, 1 - playing | |
773 this.status = 0; | |
774 | |
775 // Connect both gains to output | |
776 this.outputGain.connect(audioContext.destination); | |
777 this.fooGain.connect(audioContext.destination); | |
778 | |
779 // Create the timer Object | |
780 this.timer = new timer(); | |
781 // Create session metrics | |
782 this.metric = new sessionMetrics(this,specification); | |
783 | |
784 this.loopPlayback = false; | |
785 | |
786 // Create store for new audioObjects | |
787 this.audioObjects = []; | |
788 | |
789 this.buffers = []; | |
790 this.bufferObj = function() | |
791 { | |
792 this.url = null; | |
793 this.buffer = null; | |
794 this.xmlRequest = new XMLHttpRequest(); | |
795 this.xmlRequest.parent = this; | |
796 this.users = []; | |
797 this.getMedia = function(url) { | |
798 this.url = url; | |
799 this.xmlRequest.open('GET',this.url,true); | |
800 this.xmlRequest.responseType = 'arraybuffer'; | |
801 | |
802 var bufferObj = this; | |
803 | |
804 // Create callback to decode the data asynchronously | |
805 this.xmlRequest.onloadend = function() { | |
806 audioContext.decodeAudioData(bufferObj.xmlRequest.response, function(decodedData) { | |
807 bufferObj.buffer = decodedData; | |
808 for (var i=0; i<bufferObj.users.length; i++) | |
809 { | |
810 bufferObj.users[i].state = 1; | |
811 if (bufferObj.users[i].interfaceDOM != null) | |
812 { | |
813 bufferObj.users[i].bufferLoaded(bufferObj); | |
814 } | |
815 } | |
816 calculateLoudness(bufferObj.buffer,"I"); | |
817 }, function(){ | |
818 // Should only be called if there was an error, but sometimes gets called continuously | |
819 // Check here if the error is genuine | |
820 if (bufferObj.buffer == undefined) { | |
821 // Genuine error | |
822 console.log('FATAL - Error loading buffer on '+audioObj.id); | |
823 if (request.status == 404) | |
824 { | |
825 console.log('FATAL - Fragment '+audioObj.id+' 404 error'); | |
826 console.log('URL: '+audioObj.url); | |
827 errorSessionDump('Fragment '+audioObj.id+' 404 error'); | |
828 } | |
829 } | |
830 }); | |
831 }; | |
832 this.progress = 0; | |
833 this.progressCallback = function(event){ | |
834 if (event.lengthComputable) | |
835 { | |
836 this.parent.progress = event.loaded / event.total; | |
837 for (var i=0; i<this.parent.users.length; i++) | |
838 { | |
839 if(this.parent.users[i].interfaceDOM != null) | |
840 { | |
841 if (typeof this.parent.users[i].interfaceDOM.updateLoading === "function") | |
842 { | |
843 this.parent.users[i].interfaceDOM.updateLoading(this.parent.progress*100); | |
844 } | |
845 } | |
846 } | |
847 } | |
848 }; | |
849 this.xmlRequest.addEventListener("progress", this.progressCallback); | |
850 this.xmlRequest.send(); | |
851 }; | |
852 }; | |
853 | |
854 this.play = function(id) { | |
855 // Start the timer and set the audioEngine state to playing (1) | |
856 if (this.status == 0 && this.loopPlayback) { | |
857 // Check if all audioObjects are ready | |
858 if(this.checkAllReady()) | |
859 { | |
860 this.status = 1; | |
861 this.setSynchronousLoop(); | |
862 } | |
863 } | |
864 else | |
865 { | |
866 this.status = 1; | |
867 } | |
868 if (this.status== 1) { | |
869 this.timer.startTest(); | |
870 if (id == undefined) { | |
871 id = -1; | |
872 console.log('FATAL - Passed id was undefined - AudioEngineContext.play(id)'); | |
873 return; | |
874 } else { | |
875 interfaceContext.playhead.setTimePerPixel(this.audioObjects[id]); | |
876 } | |
877 if (this.loopPlayback) { | |
878 for (var i=0; i<this.audioObjects.length; i++) | |
879 { | |
880 this.audioObjects[i].play(this.timer.getTestTime()+1); | |
881 if (id == i) { | |
882 this.audioObjects[i].loopStart(); | |
883 } else { | |
884 this.audioObjects[i].loopStop(); | |
885 } | |
886 } | |
887 } else { | |
888 for (var i=0; i<this.audioObjects.length; i++) | |
889 { | |
890 if (i != id) { | |
891 this.audioObjects[i].outputGain.gain.value = 0.0; | |
892 this.audioObjects[i].stop(); | |
893 } else if (i == id) { | |
894 this.audioObjects[id].outputGain.gain.value = this.audioObjects[id].specification.gain*this.audioObjects[id].buffer.buffer.gain; | |
895 this.audioObjects[id].play(audioContext.currentTime+0.01); | |
896 } | |
897 } | |
898 } | |
899 interfaceContext.playhead.start(); | |
900 } | |
901 }; | |
902 | |
903 this.stop = function() { | |
904 // Send stop and reset command to all playback buffers and set audioEngine state to stopped (1) | |
905 if (this.status == 1) { | |
906 for (var i=0; i<this.audioObjects.length; i++) | |
907 { | |
908 this.audioObjects[i].stop(); | |
909 } | |
910 interfaceContext.playhead.stop(); | |
911 this.status = 0; | |
912 } | |
913 }; | |
914 | |
915 this.newTrack = function(element) { | |
916 // Pull data from given URL into new audio buffer | |
917 // URLs must either be from the same source OR be setup to 'Access-Control-Allow-Origin' | |
918 | |
919 // Create the audioObject with ID of the new track length; | |
920 audioObjectId = this.audioObjects.length; | |
921 this.audioObjects[audioObjectId] = new audioObject(audioObjectId); | |
922 | |
923 // Check if audioObject buffer is currently stored by full URL | |
924 var URL = element.parent.hostURL + element.url; | |
925 var buffer = null; | |
926 for (var i=0; i<this.buffers.length; i++) | |
927 { | |
928 if (URL == this.buffers[i].url) | |
929 { | |
930 buffer = this.buffers[i]; | |
931 break; | |
932 } | |
933 } | |
934 if (buffer == null) | |
935 { | |
936 console.log("[WARN]: Buffer was not loaded in pre-test! "+URL); | |
937 buffer = new this.bufferObj(); | |
938 buffer.getMedia(URL); | |
939 this.buffers.push(buffer); | |
940 } | |
941 this.audioObjects[audioObjectId].specification = element; | |
942 this.audioObjects[audioObjectId].url = URL; | |
943 buffer.users.push(this.audioObjects[audioObjectId]); | |
944 if (buffer.buffer != null) | |
945 { | |
946 this.audioObjects[audioObjectId].bufferLoaded(buffer); | |
947 } | |
948 return this.audioObjects[audioObjectId]; | |
949 }; | |
950 | |
951 this.newTestPage = function() { | |
952 this.state = 0; | |
953 this.audioObjectsReady = false; | |
954 this.metric.reset(); | |
955 for (var i=0; i < this.buffers.length; i++) | |
956 { | |
957 this.buffers[i].users = []; | |
958 } | |
959 this.audioObjects = []; | |
960 }; | |
961 | |
962 this.checkAllPlayed = function() { | |
963 arr = []; | |
964 for (var id=0; id<this.audioObjects.length; id++) { | |
965 if (this.audioObjects[id].metric.wasListenedTo == false) { | |
966 arr.push(this.audioObjects[id].id); | |
967 } | |
968 } | |
969 return arr; | |
970 }; | |
971 | |
972 this.checkAllReady = function() { | |
973 var ready = true; | |
974 for (var i=0; i<this.audioObjects.length; i++) { | |
975 if (this.audioObjects[i].state == 0) { | |
976 // Track not ready | |
977 console.log('WAIT -- audioObject '+i+' not ready yet!'); | |
978 ready = false; | |
979 }; | |
980 } | |
981 return ready; | |
982 }; | |
983 | |
984 this.setSynchronousLoop = function() { | |
985 // Pads the signals so they are all exactly the same length | |
986 var length = 0; | |
987 var maxId; | |
988 for (var i=0; i<this.audioObjects.length; i++) | |
989 { | |
990 if (length < this.audioObjects[i].buffer.buffer.length) | |
991 { | |
992 length = this.audioObjects[i].buffer.buffer.length; | |
993 maxId = i; | |
994 } | |
995 } | |
996 // Extract the audio and zero-pad | |
997 for (var i=0; i<this.audioObjects.length; i++) | |
998 { | |
999 var orig = this.audioObjects[i].buffer.buffer; | |
1000 var hold = audioContext.createBuffer(orig.numberOfChannels,length,orig.sampleRate); | |
1001 for (var c=0; c<orig.numberOfChannels; c++) | |
1002 { | |
1003 var inData = hold.getChannelData(c); | |
1004 var outData = orig.getChannelData(c); | |
1005 for (var n=0; n<orig.length; n++) | |
1006 {inData[n] = outData[n];} | |
1007 } | |
1008 hold.gain = orig.gain; | |
1009 hold.lufs = orig.lufs; | |
1010 this.audioObjects[i].buffer.buffer = hold; | |
1011 } | |
1012 }; | |
1013 | |
1014 } | |
1015 | |
1016 function audioObject(id) { | |
1017 // The main buffer object with common control nodes to the AudioEngine | |
1018 | |
1019 this.specification; | |
1020 this.id = id; | |
1021 this.state = 0; // 0 - no data, 1 - ready | |
1022 this.url = null; // Hold the URL given for the output back to the results. | |
1023 this.metric = new metricTracker(this); | |
1024 | |
1025 // Bindings for GUI | |
1026 this.interfaceDOM = null; | |
1027 this.commentDOM = null; | |
1028 | |
1029 // Create a buffer and external gain control to allow internal patching of effects and volume leveling. | |
1030 this.bufferNode = undefined; | |
1031 this.outputGain = audioContext.createGain(); | |
1032 | |
1033 // Default output gain to be zero | |
1034 this.outputGain.gain.value = 0.0; | |
1035 | |
1036 // Connect buffer to the audio graph | |
1037 this.outputGain.connect(audioEngineContext.outputGain); | |
1038 | |
1039 // the audiobuffer is not designed for multi-start playback | |
1040 // When stopeed, the buffer node is deleted and recreated with the stored buffer. | |
1041 this.buffer; | |
1042 | |
1043 this.bufferLoaded = function(callee) | |
1044 { | |
1045 // Called by the associated buffer when it has finished loading, will then 'bind' the buffer to the | |
1046 // audioObject and trigger the interfaceDOM.enable() function for user feedback | |
1047 if (audioEngineContext.loopPlayback){ | |
1048 // First copy the buffer into this.buffer | |
1049 this.buffer = new audioEngineContext.bufferObj(); | |
1050 this.buffer.url = callee.url; | |
1051 this.buffer.buffer = audioContext.createBuffer(callee.buffer.numberOfChannels, callee.buffer.length, callee.buffer.sampleRate); | |
1052 for (var c=0; c<callee.buffer.numberOfChannels; c++) | |
1053 { | |
1054 var src = callee.buffer.getChannelData(c); | |
1055 var dst = this.buffer.buffer.getChannelData(c); | |
1056 for (var n=0; n<src.length; n++) | |
1057 { | |
1058 dst[n] = src[n]; | |
1059 } | |
1060 } | |
1061 } else { | |
1062 this.buffer = callee; | |
1063 } | |
1064 this.state = 1; | |
1065 this.buffer.buffer.gain = callee.buffer.gain; | |
1066 this.buffer.buffer.lufs = callee.buffer.lufs; | |
1067 var targetLUFS = this.specification.parent.loudness; | |
1068 if (typeof targetLUFS === "number") | |
1069 { | |
1070 this.buffer.buffer.gain = decibelToLinear(targetLUFS - this.buffer.buffer.lufs); | |
1071 } else { | |
1072 this.buffer.buffer.gain = 1.0; | |
1073 } | |
1074 if (this.interfaceDOM != null) { | |
1075 this.interfaceDOM.enable(); | |
1076 } | |
1077 }; | |
1078 | |
1079 this.loopStart = function() { | |
1080 this.outputGain.gain.value = this.specification.gain*this.buffer.buffer.gain; | |
1081 this.metric.startListening(audioEngineContext.timer.getTestTime()); | |
1082 }; | |
1083 | |
1084 this.loopStop = function() { | |
1085 if (this.outputGain.gain.value != 0.0) { | |
1086 this.outputGain.gain.value = 0.0; | |
1087 this.metric.stopListening(audioEngineContext.timer.getTestTime()); | |
1088 } | |
1089 }; | |
1090 | |
1091 this.play = function(startTime) { | |
1092 if (this.bufferNode == undefined && this.buffer.buffer != undefined) { | |
1093 this.bufferNode = audioContext.createBufferSource(); | |
1094 this.bufferNode.owner = this; | |
1095 this.bufferNode.connect(this.outputGain); | |
1096 this.bufferNode.buffer = this.buffer.buffer; | |
1097 this.bufferNode.loop = audioEngineContext.loopPlayback; | |
1098 this.bufferNode.onended = function(event) { | |
1099 // Safari does not like using 'this' to reference the calling object! | |
1100 //event.currentTarget.owner.metric.stopListening(audioEngineContext.timer.getTestTime(),event.currentTarget.owner.getCurrentPosition()); | |
1101 event.currentTarget.owner.stop(); | |
1102 }; | |
1103 if (this.bufferNode.loop == false) { | |
1104 this.metric.startListening(audioEngineContext.timer.getTestTime()); | |
1105 } | |
1106 this.bufferNode.start(startTime); | |
1107 } | |
1108 }; | |
1109 | |
1110 this.stop = function() { | |
1111 if (this.bufferNode != undefined) | |
1112 { | |
1113 this.metric.stopListening(audioEngineContext.timer.getTestTime(),this.getCurrentPosition()); | |
1114 this.bufferNode.stop(0); | |
1115 this.bufferNode = undefined; | |
1116 } | |
1117 }; | |
1118 | |
1119 this.getCurrentPosition = function() { | |
1120 var time = audioEngineContext.timer.getTestTime(); | |
1121 if (this.bufferNode != undefined) { | |
1122 if (this.bufferNode.loop == true) { | |
1123 if (audioEngineContext.status == 1) { | |
1124 return (time-this.metric.listenStart)%this.buffer.buffer.duration; | |
1125 } else { | |
1126 return 0; | |
1127 } | |
1128 } else { | |
1129 if (this.metric.listenHold) { | |
1130 return time - this.metric.listenStart; | |
1131 } else { | |
1132 return 0; | |
1133 } | |
1134 } | |
1135 } else { | |
1136 return 0; | |
1137 } | |
1138 }; | |
1139 | |
1140 this.exportXMLDOM = function() { | |
1141 var root = document.createElement('audioElement'); | |
1142 root.id = this.specification.id; | |
1143 root.setAttribute('url',this.specification.url); | |
1144 var file = document.createElement('file'); | |
1145 file.setAttribute('sampleRate',this.buffer.buffer.sampleRate); | |
1146 file.setAttribute('channels',this.buffer.buffer.numberOfChannels); | |
1147 file.setAttribute('sampleCount',this.buffer.buffer.length); | |
1148 file.setAttribute('duration',this.buffer.buffer.duration); | |
1149 root.appendChild(file); | |
1150 if (this.specification.type != 'outsidereference') { | |
1151 var interfaceXML = this.interfaceDOM.exportXMLDOM(this); | |
1152 if (interfaceXML.length == undefined) { | |
1153 root.appendChild(interfaceXML); | |
1154 } else { | |
1155 for (var i=0; i<interfaceXML.length; i++) | |
1156 { | |
1157 root.appendChild(interfaceXML[i]); | |
1158 } | |
1159 } | |
1160 root.appendChild(this.commentDOM.exportXMLDOM(this)); | |
1161 if(this.specification.type == 'anchor') { | |
1162 root.setAttribute('anchor',true); | |
1163 } else if(this.specification.type == 'reference') { | |
1164 root.setAttribute('reference',true); | |
1165 } | |
1166 } | |
1167 root.appendChild(this.metric.exportXMLDOM()); | |
1168 return root; | |
1169 }; | |
1170 } | |
1171 | |
1172 function timer() | |
1173 { | |
1174 /* Timer object used in audioEngine to keep track of session timings | |
1175 * Uses the timer of the web audio API, so sample resolution | |
1176 */ | |
1177 this.testStarted = false; | |
1178 this.testStartTime = 0; | |
1179 this.testDuration = 0; | |
1180 this.minimumTestTime = 0; // No minimum test time | |
1181 this.startTest = function() | |
1182 { | |
1183 if (this.testStarted == false) | |
1184 { | |
1185 this.testStartTime = audioContext.currentTime; | |
1186 this.testStarted = true; | |
1187 this.updateTestTime(); | |
1188 audioEngineContext.metric.initialiseTest(); | |
1189 } | |
1190 }; | |
1191 this.stopTest = function() | |
1192 { | |
1193 if (this.testStarted) | |
1194 { | |
1195 this.testDuration = this.getTestTime(); | |
1196 this.testStarted = false; | |
1197 } else { | |
1198 console.log('ERR: Test tried to end before beginning'); | |
1199 } | |
1200 }; | |
1201 this.updateTestTime = function() | |
1202 { | |
1203 if (this.testStarted) | |
1204 { | |
1205 this.testDuration = audioContext.currentTime - this.testStartTime; | |
1206 } | |
1207 }; | |
1208 this.getTestTime = function() | |
1209 { | |
1210 this.updateTestTime(); | |
1211 return this.testDuration; | |
1212 }; | |
1213 } | |
1214 | |
1215 function sessionMetrics(engine,specification) | |
1216 { | |
1217 /* Used by audioEngine to link to audioObjects to minimise the timer call timers; | |
1218 */ | |
1219 this.engine = engine; | |
1220 this.lastClicked = -1; | |
1221 this.data = -1; | |
1222 this.reset = function() { | |
1223 this.lastClicked = -1; | |
1224 this.data = -1; | |
1225 }; | |
1226 | |
1227 this.enableElementInitialPosition = false; | |
1228 this.enableElementListenTracker = false; | |
1229 this.enableElementTimer = false; | |
1230 this.enableElementTracker = false; | |
1231 this.enableFlagListenedTo = false; | |
1232 this.enableFlagMoved = false; | |
1233 this.enableTestTimer = false; | |
1234 // Obtain the metrics enabled | |
1235 for (var i=0; i<specification.metrics.length; i++) | |
1236 { | |
1237 var node = specification.metrics[i]; | |
1238 switch(node.enabled) | |
1239 { | |
1240 case 'testTimer': | |
1241 this.enableTestTimer = true; | |
1242 break; | |
1243 case 'elementTimer': | |
1244 this.enableElementTimer = true; | |
1245 break; | |
1246 case 'elementTracker': | |
1247 this.enableElementTracker = true; | |
1248 break; | |
1249 case 'elementListenTracker': | |
1250 this.enableElementListenTracker = true; | |
1251 break; | |
1252 case 'elementInitialPosition': | |
1253 this.enableElementInitialPosition = true; | |
1254 break; | |
1255 case 'elementFlagListenedTo': | |
1256 this.enableFlagListenedTo = true; | |
1257 break; | |
1258 case 'elementFlagMoved': | |
1259 this.enableFlagMoved = true; | |
1260 break; | |
1261 case 'elementFlagComments': | |
1262 this.enableFlagComments = true; | |
1263 break; | |
1264 } | |
1265 } | |
1266 this.initialiseTest = function(){}; | |
1267 } | |
1268 | |
1269 function metricTracker(caller) | |
1270 { | |
1271 /* Custom object to track and collect metric data | |
1272 * Used only inside the audioObjects object. | |
1273 */ | |
1274 | |
1275 this.listenedTimer = 0; | |
1276 this.listenStart = 0; | |
1277 this.listenHold = false; | |
1278 this.initialPosition = -1; | |
1279 this.movementTracker = []; | |
1280 this.listenTracker =[]; | |
1281 this.wasListenedTo = false; | |
1282 this.wasMoved = false; | |
1283 this.hasComments = false; | |
1284 this.parent = caller; | |
1285 | |
1286 this.initialised = function(position) | |
1287 { | |
1288 if (this.initialPosition == -1) { | |
1289 this.initialPosition = position; | |
1290 } | |
1291 }; | |
1292 | |
1293 this.moved = function(time,position) | |
1294 { | |
1295 this.wasMoved = true; | |
1296 this.movementTracker[this.movementTracker.length] = [time, position]; | |
1297 }; | |
1298 | |
1299 this.startListening = function(time) | |
1300 { | |
1301 if (this.listenHold == false) | |
1302 { | |
1303 this.wasListenedTo = true; | |
1304 this.listenStart = time; | |
1305 this.listenHold = true; | |
1306 | |
1307 var evnt = document.createElement('event'); | |
1308 var testTime = document.createElement('testTime'); | |
1309 testTime.setAttribute('start',time); | |
1310 var bufferTime = document.createElement('bufferTime'); | |
1311 bufferTime.setAttribute('start',this.parent.getCurrentPosition()); | |
1312 evnt.appendChild(testTime); | |
1313 evnt.appendChild(bufferTime); | |
1314 this.listenTracker.push(evnt); | |
1315 | |
1316 console.log('slider ' + this.parent.id + ' played (' + time + ')'); // DEBUG/SAFETY: show played slider id | |
1317 } | |
1318 }; | |
1319 | |
1320 this.stopListening = function(time,bufferStopTime) | |
1321 { | |
1322 if (this.listenHold == true) | |
1323 { | |
1324 var diff = time - this.listenStart; | |
1325 this.listenedTimer += (diff); | |
1326 this.listenStart = 0; | |
1327 this.listenHold = false; | |
1328 | |
1329 var evnt = this.listenTracker[this.listenTracker.length-1]; | |
1330 var testTime = evnt.getElementsByTagName('testTime')[0]; | |
1331 var bufferTime = evnt.getElementsByTagName('bufferTime')[0]; | |
1332 testTime.setAttribute('stop',time); | |
1333 if (bufferStopTime == undefined) { | |
1334 bufferTime.setAttribute('stop',this.parent.getCurrentPosition()); | |
1335 } else { | |
1336 bufferTime.setAttribute('stop',bufferStopTime); | |
1337 } | |
1338 console.log('slider ' + this.parent.id + ' played for (' + diff + ')'); // DEBUG/SAFETY: show played slider id | |
1339 } | |
1340 }; | |
1341 | |
1342 this.exportXMLDOM = function() { | |
1343 var root = document.createElement('metric'); | |
1344 if (audioEngineContext.metric.enableElementTimer) { | |
1345 var mElementTimer = document.createElement('metricresult'); | |
1346 mElementTimer.setAttribute('name','enableElementTimer'); | |
1347 mElementTimer.textContent = this.listenedTimer; | |
1348 root.appendChild(mElementTimer); | |
1349 } | |
1350 if (audioEngineContext.metric.enableElementTracker) { | |
1351 var elementTrackerFull = document.createElement('metricResult'); | |
1352 elementTrackerFull.setAttribute('name','elementTrackerFull'); | |
1353 for (var k=0; k<this.movementTracker.length; k++) | |
1354 { | |
1355 var timePos = document.createElement('timePos'); | |
1356 timePos.id = k; | |
1357 var time = document.createElement('time'); | |
1358 time.textContent = this.movementTracker[k][0]; | |
1359 var position = document.createElement('position'); | |
1360 position.textContent = this.movementTracker[k][1]; | |
1361 timePos.appendChild(time); | |
1362 timePos.appendChild(position); | |
1363 elementTrackerFull.appendChild(timePos); | |
1364 } | |
1365 root.appendChild(elementTrackerFull); | |
1366 } | |
1367 if (audioEngineContext.metric.enableElementListenTracker) { | |
1368 var elementListenTracker = document.createElement('metricResult'); | |
1369 elementListenTracker.setAttribute('name','elementListenTracker'); | |
1370 for (var k=0; k<this.listenTracker.length; k++) { | |
1371 elementListenTracker.appendChild(this.listenTracker[k]); | |
1372 } | |
1373 root.appendChild(elementListenTracker); | |
1374 } | |
1375 if (audioEngineContext.metric.enableElementInitialPosition) { | |
1376 var elementInitial = document.createElement('metricResult'); | |
1377 elementInitial.setAttribute('name','elementInitialPosition'); | |
1378 elementInitial.textContent = this.initialPosition; | |
1379 root.appendChild(elementInitial); | |
1380 } | |
1381 if (audioEngineContext.metric.enableFlagListenedTo) { | |
1382 var flagListenedTo = document.createElement('metricResult'); | |
1383 flagListenedTo.setAttribute('name','elementFlagListenedTo'); | |
1384 flagListenedTo.textContent = this.wasListenedTo; | |
1385 root.appendChild(flagListenedTo); | |
1386 } | |
1387 if (audioEngineContext.metric.enableFlagMoved) { | |
1388 var flagMoved = document.createElement('metricResult'); | |
1389 flagMoved.setAttribute('name','elementFlagMoved'); | |
1390 flagMoved.textContent = this.wasMoved; | |
1391 root.appendChild(flagMoved); | |
1392 } | |
1393 if (audioEngineContext.metric.enableFlagComments) { | |
1394 var flagComments = document.createElement('metricResult'); | |
1395 flagComments.setAttribute('name','elementFlagComments'); | |
1396 if (this.parent.commentDOM == null) | |
1397 {flag.textContent = 'false';} | |
1398 else if (this.parent.commentDOM.textContent.length == 0) | |
1399 {flag.textContent = 'false';} | |
1400 else | |
1401 {flag.textContet = 'true';} | |
1402 root.appendChild(flagComments); | |
1403 } | |
1404 | |
1405 return root; | |
1406 }; | |
1407 } | |
1408 | |
1409 function randomiseOrder(input) | |
1410 { | |
1411 // This takes an array of information and randomises the order | |
1412 var N = input.length; | |
1413 | |
1414 var inputSequence = []; // For safety purposes: keep track of randomisation | |
1415 for (var counter = 0; counter < N; ++counter) | |
1416 inputSequence.push(counter) // Fill array | |
1417 var inputSequenceClone = inputSequence.slice(0); | |
1418 | |
1419 var holdArr = []; | |
1420 var outputSequence = []; | |
1421 for (var n=0; n<N; n++) | |
1422 { | |
1423 // First pick a random number | |
1424 var r = Math.random(); | |
1425 // Multiply and floor by the number of elements left | |
1426 r = Math.floor(r*input.length); | |
1427 // Pick out that element and delete from the array | |
1428 holdArr.push(input.splice(r,1)[0]); | |
1429 // Do the same with sequence | |
1430 outputSequence.push(inputSequence.splice(r,1)[0]); | |
1431 } | |
1432 console.log(inputSequenceClone.toString()); // print original array to console | |
1433 console.log(outputSequence.toString()); // print randomised array to console | |
1434 return holdArr; | |
1435 } | |
1436 | |
1437 function returnDateNode() | |
1438 { | |
1439 // Create an XML Node for the Date and Time a test was conducted | |
1440 // Structure is | |
1441 // <datetime> | |
1442 // <date year="##" month="##" day="##">DD/MM/YY</date> | |
1443 // <time hour="##" minute="##" sec="##">HH:MM:SS</time> | |
1444 // </datetime> | |
1445 var dateTime = new Date(); | |
1446 var year = document.createAttribute('year'); | |
1447 var month = document.createAttribute('month'); | |
1448 var day = document.createAttribute('day'); | |
1449 var hour = document.createAttribute('hour'); | |
1450 var minute = document.createAttribute('minute'); | |
1451 var secs = document.createAttribute('secs'); | |
1452 | |
1453 year.nodeValue = dateTime.getFullYear(); | |
1454 month.nodeValue = dateTime.getMonth()+1; | |
1455 day.nodeValue = dateTime.getDate(); | |
1456 hour.nodeValue = dateTime.getHours(); | |
1457 minute.nodeValue = dateTime.getMinutes(); | |
1458 secs.nodeValue = dateTime.getSeconds(); | |
1459 | |
1460 var hold = document.createElement("datetime"); | |
1461 var date = document.createElement("date"); | |
1462 date.textContent = year.nodeValue+'/'+month.nodeValue+'/'+day.nodeValue; | |
1463 var time = document.createElement("time"); | |
1464 time.textContent = hour.nodeValue+':'+minute.nodeValue+':'+secs.nodeValue; | |
1465 | |
1466 date.setAttributeNode(year); | |
1467 date.setAttributeNode(month); | |
1468 date.setAttributeNode(day); | |
1469 time.setAttributeNode(hour); | |
1470 time.setAttributeNode(minute); | |
1471 time.setAttributeNode(secs); | |
1472 | |
1473 hold.appendChild(date); | |
1474 hold.appendChild(time); | |
1475 return hold; | |
1476 | |
1477 } | |
1478 | |
1479 function Specification() { | |
1480 // Handles the decoding of the project specification XML into a simple JavaScript Object. | |
1481 | |
1482 this.interfaceType = null; | |
1483 this.commonInterface = new function() | |
1484 { | |
1485 this.options = []; | |
1486 this.optionNode = function(input) | |
1487 { | |
1488 var name = input.getAttribute('name'); | |
1489 this.type = name; | |
1490 if(this.type == "option") | |
1491 { | |
1492 this.name = input.id; | |
1493 } else if (this.type == "check") | |
1494 { | |
1495 this.check = input.id; | |
1496 } | |
1497 }; | |
1498 }; | |
1499 | |
1500 this.randomiseOrder = function(input) | |
1501 { | |
1502 // This takes an array of information and randomises the order | |
1503 var N = input.length; | |
1504 | |
1505 var inputSequence = []; // For safety purposes: keep track of randomisation | |
1506 for (var counter = 0; counter < N; ++counter) | |
1507 inputSequence.push(counter) // Fill array | |
1508 var inputSequenceClone = inputSequence.slice(0); | |
1509 | |
1510 var holdArr = []; | |
1511 var outputSequence = []; | |
1512 for (var n=0; n<N; n++) | |
1513 { | |
1514 // First pick a random number | |
1515 var r = Math.random(); | |
1516 // Multiply and floor by the number of elements left | |
1517 r = Math.floor(r*input.length); | |
1518 // Pick out that element and delete from the array | |
1519 holdArr.push(input.splice(r,1)[0]); | |
1520 // Do the same with sequence | |
1521 outputSequence.push(inputSequence.splice(r,1)[0]); | |
1522 } | |
1523 console.log(inputSequenceClone.toString()); // print original array to console | |
1524 console.log(outputSequence.toString()); // print randomised array to console | |
1525 return holdArr; | |
1526 }; | |
1527 this.projectReturn = null; | |
1528 this.randomiseOrder = null; | |
1529 this.collectMetrics = null; | |
1530 this.testPages = null; | |
1531 this.audioHolders = []; | |
1532 this.metrics = []; | |
1533 this.loudness = null; | |
1534 | |
1535 this.decode = function(projectXML) { | |
1536 // projectXML - DOM Parsed document | |
1537 this.projectXML = projectXML.childNodes[0]; | |
1538 var setupNode = projectXML.getElementsByTagName('setup')[0]; | |
1539 this.interfaceType = setupNode.getAttribute('interface'); | |
1540 this.projectReturn = setupNode.getAttribute('projectReturn'); | |
1541 this.testPages = setupNode.getAttribute('testPages'); | |
1542 if (setupNode.getAttribute('randomiseOrder') == "true") { | |
1543 this.randomiseOrder = true; | |
1544 } else {this.randomiseOrder = false;} | |
1545 if (setupNode.getAttribute('collectMetrics') == "true") { | |
1546 this.collectMetrics = true; | |
1547 } else {this.collectMetrics = false;} | |
1548 if (isNaN(Number(this.testPages)) || this.testPages == undefined) | |
1549 { | |
1550 this.testPages = null; | |
1551 } else { | |
1552 this.testPages = Number(this.testPages); | |
1553 if (this.testPages == 0) {this.testPages = null;} | |
1554 } | |
1555 if (setupNode.getAttribute('loudness') != null) | |
1556 { | |
1557 var XMLloudness = setupNode.getAttribute('loudness'); | |
1558 if (isNaN(Number(XMLloudness)) == false) | |
1559 { | |
1560 this.loudness = Number(XMLloudness); | |
1561 } | |
1562 } | |
1563 var metricCollection = setupNode.getElementsByTagName('Metric'); | |
1564 | |
1565 var setupPreTestNode = setupNode.getElementsByTagName('PreTest'); | |
1566 if (setupPreTestNode.length != 0) | |
1567 { | |
1568 setupPreTestNode = setupPreTestNode[0]; | |
1569 this.preTest.construct(setupPreTestNode); | |
1570 } | |
1571 | |
1572 var setupPostTestNode = setupNode.getElementsByTagName('PostTest'); | |
1573 if (setupPostTestNode.length != 0) | |
1574 { | |
1575 setupPostTestNode = setupPostTestNode[0]; | |
1576 this.postTest.construct(setupPostTestNode); | |
1577 } | |
1578 | |
1579 if (metricCollection.length > 0) { | |
1580 metricCollection = metricCollection[0].getElementsByTagName('metricEnable'); | |
1581 for (var i=0; i<metricCollection.length; i++) { | |
1582 this.metrics.push(new this.metricNode(metricCollection[i].textContent)); | |
1583 } | |
1584 } | |
1585 | |
1586 var commonInterfaceNode = setupNode.getElementsByTagName('interface'); | |
1587 if (commonInterfaceNode.length > 0) { | |
1588 commonInterfaceNode = commonInterfaceNode[0]; | |
1589 } else { | |
1590 commonInterfaceNode = undefined; | |
1591 } | |
1592 | |
1593 this.commonInterface = new function() { | |
1594 this.OptionNode = function(child) { | |
1595 this.type = child.nodeName; | |
1596 if (this.type == 'option') | |
1597 { | |
1598 this.name = child.getAttribute('name'); | |
1599 } | |
1600 else if (this.type == 'check') { | |
1601 this.check = child.getAttribute('name'); | |
1602 if (this.check == 'scalerange') { | |
1603 this.min = child.getAttribute('min'); | |
1604 this.max = child.getAttribute('max'); | |
1605 if (this.min == null) {this.min = 1;} | |
1606 else if (Number(this.min) > 1 && this.min != null) { | |
1607 this.min = Number(this.min)/100; | |
1608 } else { | |
1609 this.min = Number(this.min); | |
1610 } | |
1611 if (this.max == null) {this.max = 0;} | |
1612 else if (Number(this.max) > 1 && this.max != null) { | |
1613 this.max = Number(this.max)/100; | |
1614 } else { | |
1615 this.max = Number(this.max); | |
1616 } | |
1617 } | |
1618 } else if (this.type == 'anchor' || this.type == 'reference') { | |
1619 this.value = Number(child.textContent); | |
1620 this.enforce = child.getAttribute('enforce'); | |
1621 if (this.enforce == 'true') {this.enforce = true;} | |
1622 else {this.enforce = false;} | |
1623 } | |
1624 }; | |
1625 this.options = []; | |
1626 if (commonInterfaceNode != undefined) { | |
1627 var child = commonInterfaceNode.firstElementChild; | |
1628 while (child != undefined) { | |
1629 this.options.push(new this.OptionNode(child)); | |
1630 child = child.nextElementSibling; | |
1631 } | |
1632 } | |
1633 }; | |
1634 | |
1635 var audioHolders = projectXML.getElementsByTagName('audioHolder'); | |
1636 for (var i=0; i<audioHolders.length; i++) { | |
1637 var node = new this.audioHolderNode(this); | |
1638 node.decode(this,audioHolders[i]); | |
1639 this.audioHolders.push(node); | |
1640 } | |
1641 | |
1642 // New check if we need to randomise the test order | |
1643 if (this.randomiseOrder && typeof randomiseOrder === "function") | |
1644 { | |
1645 this.audioHolders = randomiseOrder(this.audioHolders); | |
1646 for (var i=0; i<this.audioHolders.length; i++) | |
1647 { | |
1648 this.audioHolders[i].presentedId = i; | |
1649 } | |
1650 } | |
1651 | |
1652 if (this.testPages != null || this.testPages != undefined) | |
1653 { | |
1654 if (this.testPages > audioHolders.length) | |
1655 { | |
1656 console.log('Warning: You have specified '+audioHolders.length+' tests but requested '+this.testPages+' be completed!'); | |
1657 this.testPages = audioHolders.length; | |
1658 } | |
1659 var aH = this.audioHolders; | |
1660 this.audioHolders = []; | |
1661 for (var i=0; i<this.testPages; i++) | |
1662 { | |
1663 this.audioHolders.push(aH[i]); | |
1664 } | |
1665 } | |
1666 }; | |
1667 | |
1668 this.encode = function() | |
1669 { | |
1670 var root = document.implementation.createDocument(null,"BrowserEvalProjectDocument"); | |
1671 // First get all the <setup> tag compiled | |
1672 var setupNode = root.createElement("setup"); | |
1673 setupNode.setAttribute('interface',this.interfaceType); | |
1674 setupNode.setAttribute('projectReturn',this.projectReturn); | |
1675 setupNode.setAttribute('randomiseOrder',this.randomiseOrder); | |
1676 setupNode.setAttribute('collectMetrics',this.collectMetrics); | |
1677 setupNode.setAttribute('testPages',this.testPages); | |
1678 if(this.loudness != null) {AHNode.setAttribute("loudness",this.loudness);} | |
1679 | |
1680 var setupPreTest = root.createElement("PreTest"); | |
1681 for (var i=0; i<this.preTest.options.length; i++) | |
1682 { | |
1683 setupPreTest.appendChild(this.preTest.options[i].exportXML(root)); | |
1684 } | |
1685 | |
1686 var setupPostTest = root.createElement("PostTest"); | |
1687 for (var i=0; i<this.postTest.options.length; i++) | |
1688 { | |
1689 setupPostTest.appendChild(this.postTest.options[i].exportXML(root)); | |
1690 } | |
1691 | |
1692 setupNode.appendChild(setupPreTest); | |
1693 setupNode.appendChild(setupPostTest); | |
1694 | |
1695 // <Metric> tag | |
1696 var Metric = root.createElement("Metric"); | |
1697 for (var i=0; i<this.metrics.length; i++) | |
1698 { | |
1699 var metricEnable = root.createElement("metricEnable"); | |
1700 metricEnable.textContent = this.metrics[i].enabled; | |
1701 Metric.appendChild(metricEnable); | |
1702 } | |
1703 setupNode.appendChild(Metric); | |
1704 | |
1705 // <interface> tag | |
1706 var CommonInterface = root.createElement("interface"); | |
1707 for (var i=0; i<this.commonInterface.options.length; i++) | |
1708 { | |
1709 var CIObj = this.commonInterface.options[i]; | |
1710 var CINode = root.createElement(CIObj.type); | |
1711 if (CIObj.type == "check") {CINode.setAttribute("name",CIObj.check);} | |
1712 else {CINode.setAttribute("name",CIObj.name);} | |
1713 CommonInterface.appendChild(CINode); | |
1714 } | |
1715 setupNode.appendChild(CommonInterface); | |
1716 | |
1717 root.getElementsByTagName("BrowserEvalProjectDocument")[0].appendChild(setupNode); | |
1718 // Time for the <audioHolder> tags | |
1719 for (var ahIndex = 0; ahIndex < this.audioHolders.length; ahIndex++) | |
1720 { | |
1721 var node = this.audioHolders[ahIndex].encode(root); | |
1722 root.getElementsByTagName("BrowserEvalProjectDocument")[0].appendChild(node); | |
1723 } | |
1724 return root; | |
1725 }; | |
1726 | |
1727 this.prepostNode = function(type) { | |
1728 this.type = type; | |
1729 this.options = []; | |
1730 | |
1731 this.OptionNode = function() { | |
1732 | |
1733 this.childOption = function() { | |
1734 this.type = 'option'; | |
1735 this.id = null; | |
1736 this.name = undefined; | |
1737 this.text = null; | |
1738 }; | |
1739 | |
1740 this.type = undefined; | |
1741 this.id = undefined; | |
1742 this.mandatory = undefined; | |
1743 this.question = undefined; | |
1744 this.statement = undefined; | |
1745 this.boxsize = undefined; | |
1746 this.options = []; | |
1747 this.min = undefined; | |
1748 this.max = undefined; | |
1749 this.step = undefined; | |
1750 | |
1751 this.decode = function(child) | |
1752 { | |
1753 this.type = child.nodeName; | |
1754 if (child.nodeName == "question") { | |
1755 this.id = child.id; | |
1756 this.mandatory; | |
1757 if (child.getAttribute('mandatory') == "true") {this.mandatory = true;} | |
1758 else {this.mandatory = false;} | |
1759 this.question = child.textContent; | |
1760 if (child.getAttribute('boxsize') == null) { | |
1761 this.boxsize = 'normal'; | |
1762 } else { | |
1763 this.boxsize = child.getAttribute('boxsize'); | |
1764 } | |
1765 } else if (child.nodeName == "statement") { | |
1766 this.statement = child.textContent; | |
1767 } else if (child.nodeName == "checkbox" || child.nodeName == "radio") { | |
1768 var element = child.firstElementChild; | |
1769 this.id = child.id; | |
1770 if (element == null) { | |
1771 console.log('Malformed' +child.nodeName+ 'entry'); | |
1772 this.statement = 'Malformed' +child.nodeName+ 'entry'; | |
1773 this.type = 'statement'; | |
1774 } else { | |
1775 this.options = []; | |
1776 while (element != null) { | |
1777 if (element.nodeName == 'statement' && this.statement == undefined){ | |
1778 this.statement = element.textContent; | |
1779 } else if (element.nodeName == 'option') { | |
1780 var node = new this.childOption(); | |
1781 node.id = element.id; | |
1782 node.name = element.getAttribute('name'); | |
1783 node.text = element.textContent; | |
1784 this.options.push(node); | |
1785 } | |
1786 element = element.nextElementSibling; | |
1787 } | |
1788 } | |
1789 } else if (child.nodeName == "number") { | |
1790 this.statement = child.textContent; | |
1791 this.id = child.id; | |
1792 this.min = child.getAttribute('min'); | |
1793 this.max = child.getAttribute('max'); | |
1794 this.step = child.getAttribute('step'); | |
1795 } | |
1796 }; | |
1797 | |
1798 this.exportXML = function(root) | |
1799 { | |
1800 var node = root.createElement(this.type); | |
1801 switch(this.type) | |
1802 { | |
1803 case "statement": | |
1804 node.textContent = this.statement; | |
1805 break; | |
1806 case "question": | |
1807 node.id = this.id; | |
1808 node.setAttribute("mandatory",this.mandatory); | |
1809 node.setAttribute("boxsize",this.boxsize); | |
1810 node.textContent = this.question; | |
1811 break; | |
1812 case "number": | |
1813 node.id = this.id; | |
1814 node.setAttribute("mandatory",this.mandatory); | |
1815 node.setAttribute("min", this.min); | |
1816 node.setAttribute("max", this.max); | |
1817 node.setAttribute("step", this.step); | |
1818 node.textContent = this.statement; | |
1819 break; | |
1820 case "checkbox": | |
1821 node.id = this.id; | |
1822 var statement = root.createElement("statement"); | |
1823 statement.textContent = this.statement; | |
1824 node.appendChild(statement); | |
1825 for (var i=0; i<this.options.length; i++) | |
1826 { | |
1827 var option = this.options[i]; | |
1828 var optionNode = root.createElement("option"); | |
1829 optionNode.id = option.id; | |
1830 optionNode.textContent = option.text; | |
1831 node.appendChild(optionNode); | |
1832 } | |
1833 break; | |
1834 case "radio": | |
1835 node.id = this.id; | |
1836 var statement = root.createElement("statement"); | |
1837 statement.textContent = this.statement; | |
1838 node.appendChild(statement); | |
1839 for (var i=0; i<this.options.length; i++) | |
1840 { | |
1841 var option = this.options[i]; | |
1842 var optionNode = root.createElement("option"); | |
1843 optionNode.setAttribute("name",option.name); | |
1844 optionNode.textContent = option.text; | |
1845 node.appendChild(optionNode); | |
1846 } | |
1847 break; | |
1848 } | |
1849 return node; | |
1850 }; | |
1851 }; | |
1852 this.construct = function(Collection) | |
1853 { | |
1854 if (Collection.childElementCount != 0) { | |
1855 var child = Collection.firstElementChild; | |
1856 var node = new this.OptionNode(); | |
1857 node.decode(child); | |
1858 this.options.push(node); | |
1859 while (child.nextElementSibling != null) { | |
1860 child = child.nextElementSibling; | |
1861 node = new this.OptionNode(); | |
1862 node.decode(child); | |
1863 this.options.push(node); | |
1864 } | |
1865 } | |
1866 }; | |
1867 }; | |
1868 this.preTest = new this.prepostNode("pretest"); | |
1869 this.postTest = new this.prepostNode("posttest"); | |
1870 | |
1871 this.metricNode = function(name) { | |
1872 this.enabled = name; | |
1873 }; | |
1874 | |
1875 this.audioHolderNode = function(parent) { | |
1876 this.type = 'audioHolder'; | |
1877 this.presentedId = undefined; | |
1878 this.id = undefined; | |
1879 this.hostURL = undefined; | |
1880 this.sampleRate = undefined; | |
1881 this.randomiseOrder = undefined; | |
1882 this.loop = undefined; | |
1883 this.elementComments = undefined; | |
1884 this.outsideReference = null; | |
1885 this.loudness = null; | |
1886 this.initialPosition = null; | |
1887 this.preTest = new parent.prepostNode("pretest"); | |
1888 this.postTest = new parent.prepostNode("pretest"); | |
1889 this.interfaces = []; | |
1890 this.commentBoxPrefix = "Comment on track"; | |
1891 this.audioElements = []; | |
1892 this.commentQuestions = []; | |
1893 | |
1894 this.decode = function(parent,xml) | |
1895 { | |
1896 this.presentedId = parent.audioHolders.length; | |
1897 this.id = xml.id; | |
1898 this.hostURL = xml.getAttribute('hostURL'); | |
1899 this.sampleRate = xml.getAttribute('sampleRate'); | |
1900 if (xml.getAttribute('randomiseOrder') == "true") {this.randomiseOrder = true;} | |
1901 else {this.randomiseOrder = false;} | |
1902 this.repeatCount = xml.getAttribute('repeatCount'); | |
1903 if (xml.getAttribute('loop') == 'true') {this.loop = true;} | |
1904 else {this.loop == false;} | |
1905 if (xml.getAttribute('elementComments') == "true") {this.elementComments = true;} | |
1906 else {this.elementComments = false;} | |
1907 if (typeof parent.loudness === "number") | |
1908 { | |
1909 this.loudness = parent.loudness; | |
1910 } | |
1911 if (typeof xml.getAttribute('initial-position') === "string") | |
1912 { | |
1913 var xmlInitialPosition = Number(xml.getAttribute('initial-position')); | |
1914 if (isNaN(xmlInitialPosition) == false) | |
1915 { | |
1916 if (xmlInitialPosition > 1) | |
1917 { | |
1918 xmlInitialPosition /= 100; | |
1919 } | |
1920 this.initialPosition = xmlInitialPosition; | |
1921 } | |
1922 } | |
1923 if (xml.getAttribute('loudness') != null) | |
1924 { | |
1925 var XMLloudness = xml.getAttribute('loudness'); | |
1926 if (isNaN(Number(XMLloudness)) == false) | |
1927 { | |
1928 this.loudness = Number(XMLloudness); | |
1929 } | |
1930 } | |
1931 var setupPreTestNode = xml.getElementsByTagName('PreTest'); | |
1932 if (setupPreTestNode.length != 0) | |
1933 { | |
1934 setupPreTestNode = setupPreTestNode[0]; | |
1935 this.preTest.construct(setupPreTestNode); | |
1936 } | |
1937 | |
1938 var setupPostTestNode = xml.getElementsByTagName('PostTest'); | |
1939 if (setupPostTestNode.length != 0) | |
1940 { | |
1941 setupPostTestNode = setupPostTestNode[0]; | |
1942 this.postTest.construct(setupPostTestNode); | |
1943 } | |
1944 | |
1945 var interfaceDOM = xml.getElementsByTagName('interface'); | |
1946 for (var i=0; i<interfaceDOM.length; i++) { | |
1947 var node = new this.interfaceNode(); | |
1948 node.decode(interfaceDOM[i]); | |
1949 this.interfaces.push(node); | |
1950 } | |
1951 this.commentBoxPrefix = xml.getElementsByTagName('commentBoxPrefix'); | |
1952 if (this.commentBoxPrefix.length != 0) { | |
1953 this.commentBoxPrefix = this.commentBoxPrefix[0].textContent; | |
1954 } else { | |
1955 this.commentBoxPrefix = "Comment on track"; | |
1956 } | |
1957 var audioElementsDOM = xml.getElementsByTagName('audioElements'); | |
1958 var outsideReferenceHolder = null; | |
1959 for (var i=0; i<audioElementsDOM.length; i++) { | |
1960 var node = new this.audioElementNode(); | |
1961 node.decode(this,audioElementsDOM[i]); | |
1962 if (audioElementsDOM[i].getAttribute('type') == 'outsidereference') { | |
1963 if (this.outsideReference == null) { | |
1964 outsideReferenceHolder = node; | |
1965 this.outsideReference = i; | |
1966 } else { | |
1967 console.log('Error only one audioelement can be of type outsidereference per audioholder'); | |
1968 this.audioElements.push(node); | |
1969 console.log('Element id '+audioElementsDOM[i].id+' made into normal node'); | |
1970 } | |
1971 } else { | |
1972 this.audioElements.push(node); | |
1973 } | |
1974 } | |
1975 | |
1976 if (this.randomiseOrder == true && typeof randomiseOrder === "function") | |
1977 { | |
1978 this.audioElements = randomiseOrder(this.audioElements); | |
1979 } | |
1980 if (outsideReferenceHolder != null) | |
1981 { | |
1982 this.audioElements.push(outsideReferenceHolder); | |
1983 this.outsideReference = this.audioElements.length-1; | |
1984 } | |
1985 | |
1986 | |
1987 var commentQuestionsDOM = xml.getElementsByTagName('CommentQuestion'); | |
1988 for (var i=0; i<commentQuestionsDOM.length; i++) { | |
1989 var node = new this.commentQuestionNode(); | |
1990 node.decode(commentQuestionsDOM[i]); | |
1991 this.commentQuestions.push(node); | |
1992 } | |
1993 }; | |
1994 | |
1995 this.encode = function(root) | |
1996 { | |
1997 var AHNode = root.createElement("audioHolder"); | |
1998 AHNode.id = this.id; | |
1999 AHNode.setAttribute("hostURL",this.hostURL); | |
2000 AHNode.setAttribute("sampleRate",this.sampleRate); | |
2001 AHNode.setAttribute("randomiseOrder",this.randomiseOrder); | |
2002 AHNode.setAttribute("repeatCount",this.repeatCount); | |
2003 AHNode.setAttribute("loop",this.loop); | |
2004 AHNode.setAttribute("elementComments",this.elementComments); | |
2005 if(this.loudness != null) {AHNode.setAttribute("loudness",this.loudness);} | |
2006 if(this.initialPosition != null) { | |
2007 AHNode.setAttribute("loudness",this.initialPosition*100); | |
2008 } | |
2009 for (var i=0; i<this.interfaces.length; i++) | |
2010 { | |
2011 AHNode.appendChild(this.interfaces[i].encode(root)); | |
2012 } | |
2013 | |
2014 for (var i=0; i<this.audioElements.length; i++) { | |
2015 AHNode.appendChild(this.audioElements[i].encode(root)); | |
2016 } | |
2017 // Create <CommentQuestion> | |
2018 for (var i=0; i<this.commentQuestions.length; i++) | |
2019 { | |
2020 AHNode.appendChild(this.commentQuestions[i].exportXML(root)); | |
2021 } | |
2022 | |
2023 // Create <PreTest> | |
2024 var AHPreTest = root.createElement("PreTest"); | |
2025 for (var i=0; i<this.preTest.options.length; i++) | |
2026 { | |
2027 AHPreTest.appendChild(this.preTest.options[i].exportXML(root)); | |
2028 } | |
2029 | |
2030 var AHPostTest = root.createElement("PostTest"); | |
2031 for (var i=0; i<this.postTest.options.length; i++) | |
2032 { | |
2033 AHPostTest.appendChild(this.postTest.options[i].exportXML(root)); | |
2034 } | |
2035 AHNode.appendChild(AHPreTest); | |
2036 AHNode.appendChild(AHPostTest); | |
2037 return AHNode; | |
2038 }; | |
2039 | |
2040 this.interfaceNode = function() { | |
2041 this.title = undefined; | |
2042 this.options = []; | |
2043 this.scale = []; | |
2044 this.name = undefined; | |
2045 this.decode = function(DOM) | |
2046 { | |
2047 var title = DOM.getElementsByTagName('title'); | |
2048 if (title.length == 0) {this.title = null;} | |
2049 else {this.title = title[0].textContent;} | |
2050 var name = DOM.getAttribute("name"); | |
2051 if (name != undefined) {this.name = name;} | |
2052 this.options = parent.commonInterface.options; | |
2053 var scale = DOM.getElementsByTagName('scale'); | |
2054 this.scale = []; | |
2055 for (var i=0; i<scale.length; i++) { | |
2056 var arr = [null, null]; | |
2057 arr[0] = scale[i].getAttribute('position'); | |
2058 arr[1] = scale[i].textContent; | |
2059 this.scale.push(arr); | |
2060 } | |
2061 }; | |
2062 this.encode = function(root) | |
2063 { | |
2064 var node = root.createElement("interface"); | |
2065 if (this.title != undefined) | |
2066 { | |
2067 var title = root.createElement("title"); | |
2068 title.textContent = this.title; | |
2069 node.appendChild(title); | |
2070 } | |
2071 for (var i=0; i<this.options.length; i++) | |
2072 { | |
2073 var optionNode = root.createElement(this.options[i].type); | |
2074 if (this.options[i].type == "option") | |
2075 { | |
2076 optionNode.setAttribute("name",this.options[i].name); | |
2077 } else if (this.options[i].type == "check") { | |
2078 optionNode.setAttribute("check",this.options[i].check); | |
2079 } else if (this.options[i].type == "scalerange") { | |
2080 optionNode.setAttribute("min",this.options[i].min*100); | |
2081 optionNode.setAttribute("max",this.options[i].max*100); | |
2082 } | |
2083 node.appendChild(optionNode); | |
2084 } | |
2085 for (var i=0; i<this.scale.length; i++) { | |
2086 var scale = root.createElement("scale"); | |
2087 scale.setAttribute("position",this.scale[i][0]); | |
2088 scale.textContent = this.scale[i][1]; | |
2089 node.appendChild(scale); | |
2090 } | |
2091 return node; | |
2092 }; | |
2093 }; | |
2094 | |
2095 this.audioElementNode = function() { | |
2096 this.url = null; | |
2097 this.id = null; | |
2098 this.parent = null; | |
2099 this.type = "normal"; | |
2100 this.marker = false; | |
2101 this.enforce = false; | |
2102 this.gain = 1.0; | |
2103 this.decode = function(parent,xml) | |
2104 { | |
2105 this.url = xml.getAttribute('url'); | |
2106 this.id = xml.id; | |
2107 this.parent = parent; | |
2108 this.type = xml.getAttribute('type'); | |
2109 var gain = xml.getAttribute('gain'); | |
2110 if (isNaN(gain) == false && gain != null) | |
2111 { | |
2112 this.gain = decibelToLinear(Number(gain)); | |
2113 } | |
2114 if (this.type == null) {this.type = "normal";} | |
2115 if (this.type == 'anchor') {this.anchor = true;} | |
2116 else {this.anchor = false;} | |
2117 if (this.type == 'reference') {this.reference = true;} | |
2118 else {this.reference = false;} | |
2119 if (this.anchor == true || this.reference == true) | |
2120 { | |
2121 this.marker = xml.getAttribute('marker'); | |
2122 if (this.marker != undefined) | |
2123 { | |
2124 this.marker = Number(this.marker); | |
2125 if (isNaN(this.marker) == false) | |
2126 { | |
2127 if (this.marker > 1) | |
2128 { this.marker /= 100.0;} | |
2129 if (this.marker >= 0 && this.marker <= 1) | |
2130 { | |
2131 this.enforce = true; | |
2132 return; | |
2133 } else { | |
2134 console.log("ERROR - Marker of audioElement "+this.id+" is not between 0 and 1 (float) or 0 and 100 (integer)!"); | |
2135 console.log("ERROR - Marker not enforced!"); | |
2136 } | |
2137 } else { | |
2138 console.log("ERROR - Marker of audioElement "+this.id+" is not a number!"); | |
2139 console.log("ERROR - Marker not enforced!"); | |
2140 } | |
2141 } | |
2142 } | |
2143 }; | |
2144 this.encode = function(root) | |
2145 { | |
2146 var AENode = root.createElement("audioElements"); | |
2147 AENode.id = this.id; | |
2148 AENode.setAttribute("url",this.url); | |
2149 AENode.setAttribute("type",this.type); | |
2150 AENode.setAttribute("gain",linearToDecibel(this.gain)); | |
2151 if (this.marker != false) | |
2152 { | |
2153 AENode.setAttribute("marker",this.marker*100); | |
2154 } | |
2155 return AENode; | |
2156 }; | |
2157 }; | |
2158 | |
2159 this.commentQuestionNode = function(xml) { | |
2160 this.id = null; | |
2161 this.type = undefined; | |
2162 this.question = undefined; | |
2163 this.options = []; | |
2164 this.statement = undefined; | |
2165 | |
2166 this.childOption = function() { | |
2167 this.type = 'option'; | |
2168 this.name = null; | |
2169 this.text = null; | |
2170 }; | |
2171 this.exportXML = function(root) | |
2172 { | |
2173 var CQNode = root.createElement("CommentQuestion"); | |
2174 CQNode.id = this.id; | |
2175 CQNode.setAttribute("type",this.type); | |
2176 switch(this.type) | |
2177 { | |
2178 case "text": | |
2179 CQNode.textContent = this.question; | |
2180 break; | |
2181 case "radio": | |
2182 var statement = root.createElement("statement"); | |
2183 statement.textContent = this.statement; | |
2184 CQNode.appendChild(statement); | |
2185 for (var i=0; i<this.options.length; i++) | |
2186 { | |
2187 var optionNode = root.createElement("option"); | |
2188 optionNode.setAttribute("name",this.options[i].name); | |
2189 optionNode.textContent = this.options[i].text; | |
2190 CQNode.appendChild(optionNode); | |
2191 } | |
2192 break; | |
2193 case "checkbox": | |
2194 var statement = root.createElement("statement"); | |
2195 statement.textContent = this.statement; | |
2196 CQNode.appendChild(statement); | |
2197 for (var i=0; i<this.options.length; i++) | |
2198 { | |
2199 var optionNode = root.createElement("option"); | |
2200 optionNode.setAttribute("name",this.options[i].name); | |
2201 optionNode.textContent = this.options[i].text; | |
2202 CQNode.appendChild(optionNode); | |
2203 } | |
2204 break; | |
2205 } | |
2206 return CQNode; | |
2207 }; | |
2208 this.decode = function(xml) { | |
2209 this.id = xml.id; | |
2210 if (xml.getAttribute('mandatory') == 'true') {this.mandatory = true;} | |
2211 else {this.mandatory = false;} | |
2212 this.type = xml.getAttribute('type'); | |
2213 if (this.type == undefined) {this.type = 'text';} | |
2214 switch (this.type) { | |
2215 case 'text': | |
2216 this.question = xml.textContent; | |
2217 break; | |
2218 case 'radio': | |
2219 var child = xml.firstElementChild; | |
2220 this.options = []; | |
2221 while (child != undefined) { | |
2222 if (child.nodeName == 'statement' && this.statement == undefined) { | |
2223 this.statement = child.textContent; | |
2224 } else if (child.nodeName == 'option') { | |
2225 var node = new this.childOption(); | |
2226 node.name = child.getAttribute('name'); | |
2227 node.text = child.textContent; | |
2228 this.options.push(node); | |
2229 } | |
2230 child = child.nextElementSibling; | |
2231 } | |
2232 break; | |
2233 case 'checkbox': | |
2234 var child = xml.firstElementChild; | |
2235 this.options = []; | |
2236 while (child != undefined) { | |
2237 if (child.nodeName == 'statement' && this.statement == undefined) { | |
2238 this.statement = child.textContent; | |
2239 } else if (child.nodeName == 'option') { | |
2240 var node = new this.childOption(); | |
2241 node.name = child.getAttribute('name'); | |
2242 node.text = child.textContent; | |
2243 this.options.push(node); | |
2244 } | |
2245 child = child.nextElementSibling; | |
2246 } | |
2247 break; | |
2248 } | |
2249 }; | |
2250 }; | |
2251 }; | |
2252 } | |
2253 | |
2254 function Interface(specificationObject) { | |
2255 // This handles the bindings between the interface and the audioEngineContext; | |
2256 this.specification = specificationObject; | |
2257 this.insertPoint = document.getElementById("topLevelBody"); | |
2258 | |
2259 this.newPage = function(audioHolderObject) | |
2260 { | |
2261 audioEngineContext.newTestPage(); | |
2262 /// CHECK FOR SAMPLE RATE COMPATIBILITY | |
2263 if (audioHolderObject.sampleRate != undefined) { | |
2264 if (Number(audioHolderObject.sampleRate) != audioContext.sampleRate) { | |
2265 var errStr = 'Sample rates do not match! Requested '+Number(audioHolderObject.sampleRate)+', got '+audioContext.sampleRate+'. Please set the sample rate to match before completing this test.'; | |
2266 alert(errStr); | |
2267 return; | |
2268 } | |
2269 } | |
2270 | |
2271 audioEngineContext.loopPlayback = audioHolderObject.loop; | |
2272 // Delete any previous audioObjects associated with the audioEngine | |
2273 audioEngineContext.audioObjects = []; | |
2274 interfaceContext.deleteCommentBoxes(); | |
2275 interfaceContext.deleteCommentQuestions(); | |
2276 loadTest(audioHolderObject); | |
2277 }; | |
2278 | |
2279 // Bounded by interface!! | |
2280 // Interface object MUST have an exportXMLDOM method which returns the various DOM levels | |
2281 // For example, APE returns the slider position normalised in a <value> tag. | |
2282 this.interfaceObjects = []; | |
2283 this.interfaceObject = function(){}; | |
2284 | |
2285 this.resizeWindow = function(event) | |
2286 { | |
2287 popup.resize(event); | |
2288 for(var i=0; i<this.commentBoxes.length; i++) | |
2289 {this.commentBoxes[i].resize();} | |
2290 for(var i=0; i<this.commentQuestions.length; i++) | |
2291 {this.commentQuestions[i].resize();} | |
2292 try | |
2293 { | |
2294 resizeWindow(event); | |
2295 } | |
2296 catch(err) | |
2297 { | |
2298 console.log("Warning - Interface does not have Resize option"); | |
2299 console.log(err); | |
2300 } | |
2301 }; | |
2302 | |
2303 this.returnNavigator = function() | |
2304 { | |
2305 var node = document.createElement("navigator"); | |
2306 var platform = document.createElement("platform"); | |
2307 platform.textContent = navigator.platform; | |
2308 var vendor = document.createElement("vendor"); | |
2309 vendor.textContent = navigator.vendor; | |
2310 var userAgent = document.createElement("uagent"); | |
2311 userAgent.textContent = navigator.userAgent; | |
2312 node.appendChild(platform); | |
2313 node.appendChild(vendor); | |
2314 node.appendChild(userAgent); | |
2315 return node; | |
2316 }; | |
2317 | |
2318 this.commentBoxes = []; | |
2319 this.elementCommentBox = function(audioObject) { | |
2320 var element = audioObject.specification; | |
2321 this.audioObject = audioObject; | |
2322 this.id = audioObject.id; | |
2323 var audioHolderObject = audioObject.specification.parent; | |
2324 // Create document objects to hold the comment boxes | |
2325 this.trackComment = document.createElement('div'); | |
2326 this.trackComment.className = 'comment-div'; | |
2327 this.trackComment.id = 'comment-div-'+audioObject.id; | |
2328 // Create a string next to each comment asking for a comment | |
2329 this.trackString = document.createElement('span'); | |
2330 this.trackString.innerHTML = audioHolderObject.commentBoxPrefix+' '+audioObject.id; | |
2331 // Create the HTML5 comment box 'textarea' | |
2332 this.trackCommentBox = document.createElement('textarea'); | |
2333 this.trackCommentBox.rows = '4'; | |
2334 this.trackCommentBox.cols = '100'; | |
2335 this.trackCommentBox.name = 'trackComment'+audioObject.id; | |
2336 this.trackCommentBox.className = 'trackComment'; | |
2337 var br = document.createElement('br'); | |
2338 // Add to the holder. | |
2339 this.trackComment.appendChild(this.trackString); | |
2340 this.trackComment.appendChild(br); | |
2341 this.trackComment.appendChild(this.trackCommentBox); | |
2342 | |
2343 this.exportXMLDOM = function() { | |
2344 var root = document.createElement('comment'); | |
2345 if (this.audioObject.specification.parent.elementComments) { | |
2346 var question = document.createElement('question'); | |
2347 question.textContent = this.trackString.textContent; | |
2348 var response = document.createElement('response'); | |
2349 response.textContent = this.trackCommentBox.value; | |
2350 console.log("Comment frag-"+this.id+": "+response.textContent); | |
2351 root.appendChild(question); | |
2352 root.appendChild(response); | |
2353 } | |
2354 return root; | |
2355 }; | |
2356 this.resize = function() | |
2357 { | |
2358 var boxwidth = (window.innerWidth-100)/2; | |
2359 if (boxwidth >= 600) | |
2360 { | |
2361 boxwidth = 600; | |
2362 } | |
2363 else if (boxwidth < 400) | |
2364 { | |
2365 boxwidth = 400; | |
2366 } | |
2367 this.trackComment.style.width = boxwidth+"px"; | |
2368 this.trackCommentBox.style.width = boxwidth-6+"px"; | |
2369 }; | |
2370 this.resize(); | |
2371 }; | |
2372 | |
2373 this.commentQuestions = []; | |
2374 | |
2375 this.commentBox = function(commentQuestion) { | |
2376 this.specification = commentQuestion; | |
2377 // Create document objects to hold the comment boxes | |
2378 this.holder = document.createElement('div'); | |
2379 this.holder.className = 'comment-div'; | |
2380 // Create a string next to each comment asking for a comment | |
2381 this.string = document.createElement('span'); | |
2382 this.string.innerHTML = commentQuestion.question; | |
2383 // Create the HTML5 comment box 'textarea' | |
2384 this.textArea = document.createElement('textarea'); | |
2385 this.textArea.rows = '4'; | |
2386 this.textArea.cols = '100'; | |
2387 this.textArea.className = 'trackComment'; | |
2388 var br = document.createElement('br'); | |
2389 // Add to the holder. | |
2390 this.holder.appendChild(this.string); | |
2391 this.holder.appendChild(br); | |
2392 this.holder.appendChild(this.textArea); | |
2393 | |
2394 this.exportXMLDOM = function() { | |
2395 var root = document.createElement('comment'); | |
2396 root.id = this.specification.id; | |
2397 root.setAttribute('type',this.specification.type); | |
2398 root.textContent = this.textArea.value; | |
2399 console.log("Question: "+this.string.textContent); | |
2400 console.log("Response: "+root.textContent); | |
2401 return root; | |
2402 }; | |
2403 this.resize = function() | |
2404 { | |
2405 var boxwidth = (window.innerWidth-100)/2; | |
2406 if (boxwidth >= 600) | |
2407 { | |
2408 boxwidth = 600; | |
2409 } | |
2410 else if (boxwidth < 400) | |
2411 { | |
2412 boxwidth = 400; | |
2413 } | |
2414 this.holder.style.width = boxwidth+"px"; | |
2415 this.textArea.style.width = boxwidth-6+"px"; | |
2416 }; | |
2417 this.resize(); | |
2418 }; | |
2419 | |
2420 this.radioBox = function(commentQuestion) { | |
2421 this.specification = commentQuestion; | |
2422 // Create document objects to hold the comment boxes | |
2423 this.holder = document.createElement('div'); | |
2424 this.holder.className = 'comment-div'; | |
2425 // Create a string next to each comment asking for a comment | |
2426 this.string = document.createElement('span'); | |
2427 this.string.innerHTML = commentQuestion.statement; | |
2428 var br = document.createElement('br'); | |
2429 // Add to the holder. | |
2430 this.holder.appendChild(this.string); | |
2431 this.holder.appendChild(br); | |
2432 this.options = []; | |
2433 this.inputs = document.createElement('div'); | |
2434 this.span = document.createElement('div'); | |
2435 this.inputs.align = 'center'; | |
2436 this.inputs.style.marginLeft = '12px'; | |
2437 this.span.style.marginLeft = '12px'; | |
2438 this.span.align = 'center'; | |
2439 this.span.style.marginTop = '15px'; | |
2440 | |
2441 var optCount = commentQuestion.options.length; | |
2442 for (var i=0; i<optCount; i++) | |
2443 { | |
2444 var div = document.createElement('div'); | |
2445 div.style.width = '80px'; | |
2446 div.style.float = 'left'; | |
2447 var input = document.createElement('input'); | |
2448 input.type = 'radio'; | |
2449 input.name = commentQuestion.id; | |
2450 input.setAttribute('setvalue',commentQuestion.options[i].name); | |
2451 input.className = 'comment-radio'; | |
2452 div.appendChild(input); | |
2453 this.inputs.appendChild(div); | |
2454 | |
2455 | |
2456 div = document.createElement('div'); | |
2457 div.style.width = '80px'; | |
2458 div.style.float = 'left'; | |
2459 div.align = 'center'; | |
2460 var span = document.createElement('span'); | |
2461 span.textContent = commentQuestion.options[i].text; | |
2462 span.className = 'comment-radio-span'; | |
2463 div.appendChild(span); | |
2464 this.span.appendChild(div); | |
2465 this.options.push(input); | |
2466 } | |
2467 this.holder.appendChild(this.span); | |
2468 this.holder.appendChild(this.inputs); | |
2469 | |
2470 this.exportXMLDOM = function() { | |
2471 var root = document.createElement('comment'); | |
2472 root.id = this.specification.id; | |
2473 root.setAttribute('type',this.specification.type); | |
2474 var question = document.createElement('question'); | |
2475 question.textContent = this.string.textContent; | |
2476 var response = document.createElement('response'); | |
2477 var i=0; | |
2478 while(this.options[i].checked == false) { | |
2479 i++; | |
2480 if (i >= this.options.length) { | |
2481 break; | |
2482 } | |
2483 } | |
2484 if (i >= this.options.length) { | |
2485 response.textContent = 'null'; | |
2486 } else { | |
2487 response.textContent = this.options[i].getAttribute('setvalue'); | |
2488 response.setAttribute('number',i); | |
2489 } | |
2490 console.log('Comment: '+question.textContent); | |
2491 console.log('Response: '+response.textContent); | |
2492 root.appendChild(question); | |
2493 root.appendChild(response); | |
2494 return root; | |
2495 }; | |
2496 this.resize = function() | |
2497 { | |
2498 var boxwidth = (window.innerWidth-100)/2; | |
2499 if (boxwidth >= 600) | |
2500 { | |
2501 boxwidth = 600; | |
2502 } | |
2503 else if (boxwidth < 400) | |
2504 { | |
2505 boxwidth = 400; | |
2506 } | |
2507 this.holder.style.width = boxwidth+"px"; | |
2508 var text = this.holder.children[2]; | |
2509 var options = this.holder.children[3]; | |
2510 var optCount = options.children.length; | |
2511 var spanMargin = Math.floor(((boxwidth-20-(optCount*80))/(optCount))/2)+'px'; | |
2512 var options = options.firstChild; | |
2513 var text = text.firstChild; | |
2514 options.style.marginRight = spanMargin; | |
2515 options.style.marginLeft = spanMargin; | |
2516 text.style.marginRight = spanMargin; | |
2517 text.style.marginLeft = spanMargin; | |
2518 while(options.nextSibling != undefined) | |
2519 { | |
2520 options = options.nextSibling; | |
2521 text = text.nextSibling; | |
2522 options.style.marginRight = spanMargin; | |
2523 options.style.marginLeft = spanMargin; | |
2524 text.style.marginRight = spanMargin; | |
2525 text.style.marginLeft = spanMargin; | |
2526 } | |
2527 }; | |
2528 this.resize(); | |
2529 }; | |
2530 | |
2531 this.checkboxBox = function(commentQuestion) { | |
2532 this.specification = commentQuestion; | |
2533 // Create document objects to hold the comment boxes | |
2534 this.holder = document.createElement('div'); | |
2535 this.holder.className = 'comment-div'; | |
2536 // Create a string next to each comment asking for a comment | |
2537 this.string = document.createElement('span'); | |
2538 this.string.innerHTML = commentQuestion.statement; | |
2539 var br = document.createElement('br'); | |
2540 // Add to the holder. | |
2541 this.holder.appendChild(this.string); | |
2542 this.holder.appendChild(br); | |
2543 this.options = []; | |
2544 this.inputs = document.createElement('div'); | |
2545 this.span = document.createElement('div'); | |
2546 this.inputs.align = 'center'; | |
2547 this.inputs.style.marginLeft = '12px'; | |
2548 this.span.style.marginLeft = '12px'; | |
2549 this.span.align = 'center'; | |
2550 this.span.style.marginTop = '15px'; | |
2551 | |
2552 var optCount = commentQuestion.options.length; | |
2553 for (var i=0; i<optCount; i++) | |
2554 { | |
2555 var div = document.createElement('div'); | |
2556 div.style.width = '80px'; | |
2557 div.style.float = 'left'; | |
2558 var input = document.createElement('input'); | |
2559 input.type = 'checkbox'; | |
2560 input.name = commentQuestion.id; | |
2561 input.setAttribute('setvalue',commentQuestion.options[i].name); | |
2562 input.className = 'comment-radio'; | |
2563 div.appendChild(input); | |
2564 this.inputs.appendChild(div); | |
2565 | |
2566 | |
2567 div = document.createElement('div'); | |
2568 div.style.width = '80px'; | |
2569 div.style.float = 'left'; | |
2570 div.align = 'center'; | |
2571 var span = document.createElement('span'); | |
2572 span.textContent = commentQuestion.options[i].text; | |
2573 span.className = 'comment-radio-span'; | |
2574 div.appendChild(span); | |
2575 this.span.appendChild(div); | |
2576 this.options.push(input); | |
2577 } | |
2578 this.holder.appendChild(this.span); | |
2579 this.holder.appendChild(this.inputs); | |
2580 | |
2581 this.exportXMLDOM = function() { | |
2582 var root = document.createElement('comment'); | |
2583 root.id = this.specification.id; | |
2584 root.setAttribute('type',this.specification.type); | |
2585 var question = document.createElement('question'); | |
2586 question.textContent = this.string.textContent; | |
2587 root.appendChild(question); | |
2588 console.log('Comment: '+question.textContent); | |
2589 for (var i=0; i<this.options.length; i++) { | |
2590 var response = document.createElement('response'); | |
2591 response.textContent = this.options[i].checked; | |
2592 response.setAttribute('name',this.options[i].getAttribute('setvalue')); | |
2593 root.appendChild(response); | |
2594 console.log('Response '+response.getAttribute('name') +': '+response.textContent); | |
2595 } | |
2596 return root; | |
2597 }; | |
2598 this.resize = function() | |
2599 { | |
2600 var boxwidth = (window.innerWidth-100)/2; | |
2601 if (boxwidth >= 600) | |
2602 { | |
2603 boxwidth = 600; | |
2604 } | |
2605 else if (boxwidth < 400) | |
2606 { | |
2607 boxwidth = 400; | |
2608 } | |
2609 this.holder.style.width = boxwidth+"px"; | |
2610 var text = this.holder.children[2]; | |
2611 var options = this.holder.children[3]; | |
2612 var optCount = options.children.length; | |
2613 var spanMargin = Math.floor(((boxwidth-20-(optCount*80))/(optCount))/2)+'px'; | |
2614 var options = options.firstChild; | |
2615 var text = text.firstChild; | |
2616 options.style.marginRight = spanMargin; | |
2617 options.style.marginLeft = spanMargin; | |
2618 text.style.marginRight = spanMargin; | |
2619 text.style.marginLeft = spanMargin; | |
2620 while(options.nextSibling != undefined) | |
2621 { | |
2622 options = options.nextSibling; | |
2623 text = text.nextSibling; | |
2624 options.style.marginRight = spanMargin; | |
2625 options.style.marginLeft = spanMargin; | |
2626 text.style.marginRight = spanMargin; | |
2627 text.style.marginLeft = spanMargin; | |
2628 } | |
2629 }; | |
2630 this.resize(); | |
2631 }; | |
2632 | |
2633 this.createCommentBox = function(audioObject) { | |
2634 var node = new this.elementCommentBox(audioObject); | |
2635 this.commentBoxes.push(node); | |
2636 audioObject.commentDOM = node; | |
2637 return node; | |
2638 }; | |
2639 | |
2640 this.sortCommentBoxes = function() { | |
2641 var holder = []; | |
2642 while (this.commentBoxes.length > 0) { | |
2643 var node = this.commentBoxes.pop(0); | |
2644 holder[node.id] = node; | |
2645 } | |
2646 this.commentBoxes = holder; | |
2647 }; | |
2648 | |
2649 this.showCommentBoxes = function(inject, sort) { | |
2650 if (sort) {interfaceContext.sortCommentBoxes();} | |
2651 for (var i=0; i<interfaceContext.commentBoxes.length; i++) { | |
2652 inject.appendChild(this.commentBoxes[i].trackComment); | |
2653 } | |
2654 }; | |
2655 | |
2656 this.deleteCommentBoxes = function() { | |
2657 this.commentBoxes = []; | |
2658 }; | |
2659 | |
2660 this.createCommentQuestion = function(element) { | |
2661 var node; | |
2662 if (element.type == 'text') { | |
2663 node = new this.commentBox(element); | |
2664 } else if (element.type == 'radio') { | |
2665 node = new this.radioBox(element); | |
2666 } else if (element.type == 'checkbox') { | |
2667 node = new this.checkboxBox(element); | |
2668 } | |
2669 this.commentQuestions.push(node); | |
2670 return node; | |
2671 }; | |
2672 | |
2673 this.deleteCommentQuestions = function() | |
2674 { | |
2675 this.commentQuestions = []; | |
2676 }; | |
2677 | |
2678 this.playhead = new function() | |
2679 { | |
2680 this.object = document.createElement('div'); | |
2681 this.object.className = 'playhead'; | |
2682 this.object.align = 'left'; | |
2683 var curTime = document.createElement('div'); | |
2684 curTime.style.width = '50px'; | |
2685 this.curTimeSpan = document.createElement('span'); | |
2686 this.curTimeSpan.textContent = '00:00'; | |
2687 curTime.appendChild(this.curTimeSpan); | |
2688 this.object.appendChild(curTime); | |
2689 this.scrubberTrack = document.createElement('div'); | |
2690 this.scrubberTrack.className = 'playhead-scrub-track'; | |
2691 | |
2692 this.scrubberHead = document.createElement('div'); | |
2693 this.scrubberHead.id = 'playhead-scrubber'; | |
2694 this.scrubberTrack.appendChild(this.scrubberHead); | |
2695 this.object.appendChild(this.scrubberTrack); | |
2696 | |
2697 this.timePerPixel = 0; | |
2698 this.maxTime = 0; | |
2699 | |
2700 this.playbackObject; | |
2701 | |
2702 this.setTimePerPixel = function(audioObject) { | |
2703 //maxTime must be in seconds | |
2704 this.playbackObject = audioObject; | |
2705 this.maxTime = audioObject.buffer.buffer.duration; | |
2706 var width = 490; //500 - 10, 5 each side of the tracker head | |
2707 this.timePerPixel = this.maxTime/490; | |
2708 if (this.maxTime < 60) { | |
2709 this.curTimeSpan.textContent = '0.00'; | |
2710 } else { | |
2711 this.curTimeSpan.textContent = '00:00'; | |
2712 } | |
2713 }; | |
2714 | |
2715 this.update = function() { | |
2716 // Update the playhead position, startPlay must be called | |
2717 if (this.timePerPixel > 0) { | |
2718 var time = this.playbackObject.getCurrentPosition(); | |
2719 if (time > 0) { | |
2720 var width = 490; | |
2721 var pix = Math.floor(time/this.timePerPixel); | |
2722 this.scrubberHead.style.left = pix+'px'; | |
2723 if (this.maxTime > 60.0) { | |
2724 var secs = time%60; | |
2725 var mins = Math.floor((time-secs)/60); | |
2726 secs = secs.toString(); | |
2727 secs = secs.substr(0,2); | |
2728 mins = mins.toString(); | |
2729 this.curTimeSpan.textContent = mins+':'+secs; | |
2730 } else { | |
2731 time = time.toString(); | |
2732 this.curTimeSpan.textContent = time.substr(0,4); | |
2733 } | |
2734 } else { | |
2735 this.scrubberHead.style.left = '0px'; | |
2736 if (this.maxTime < 60) { | |
2737 this.curTimeSpan.textContent = '0.00'; | |
2738 } else { | |
2739 this.curTimeSpan.textContent = '00:00'; | |
2740 } | |
2741 } | |
2742 } | |
2743 }; | |
2744 | |
2745 this.interval = undefined; | |
2746 | |
2747 this.start = function() { | |
2748 if (this.playbackObject != undefined && this.interval == undefined) { | |
2749 if (this.maxTime < 60) { | |
2750 this.interval = setInterval(function(){interfaceContext.playhead.update();},10); | |
2751 } else { | |
2752 this.interval = setInterval(function(){interfaceContext.playhead.update();},100); | |
2753 } | |
2754 } | |
2755 }; | |
2756 this.stop = function() { | |
2757 clearInterval(this.interval); | |
2758 this.interval = undefined; | |
2759 if (this.maxTime < 60) { | |
2760 this.curTimeSpan.textContent = '0.00'; | |
2761 } else { | |
2762 this.curTimeSpan.textContent = '00:00'; | |
2763 } | |
2764 }; | |
2765 }; | |
2766 | |
2767 // Global Checkers | |
2768 // These functions will help enforce the checkers | |
2769 this.checkHiddenAnchor = function() | |
2770 { | |
2771 var audioHolder = testState.currentStateMap[testState.currentIndex]; | |
2772 if (audioHolder.anchorId != null) | |
2773 { | |
2774 var audioObject = audioEngineContext.audioObjects[audioHolder.anchorId]; | |
2775 if (audioObject.interfaceDOM.getValue() > audioObject.specification.marker && audioObject.interfaceDOM.enforce == true) | |
2776 { | |
2777 // Anchor is not set below | |
2778 console.log('Anchor node not below marker value'); | |
2779 alert('Please keep listening'); | |
2780 return false; | |
2781 } | |
2782 } | |
2783 return true; | |
2784 }; | |
2785 | |
2786 this.checkHiddenReference = function() | |
2787 { | |
2788 var audioHolder = testState.currentStateMap[testState.currentIndex]; | |
2789 if (audioHolder.referenceId != null) | |
2790 { | |
2791 var audioObject = audioEngineContext.audioObjects[audioHolder.referenceId]; | |
2792 if (audioObject.interfaceDOM.getValue() < audioObject.specification.marker && audioObject.interfaceDOM.enforce == true) | |
2793 { | |
2794 // Anchor is not set below | |
2795 console.log('Reference node not above marker value'); | |
2796 alert('Please keep listening'); | |
2797 return false; | |
2798 } | |
2799 } | |
2800 return true; | |
2801 }; | |
2802 | |
2803 this.checkFragmentsFullyPlayed = function () | |
2804 { | |
2805 // Checks the entire file has been played back | |
2806 // NOTE ! This will return true IF playback is Looped!!! | |
2807 if (audioEngineContext.loopPlayback) | |
2808 { | |
2809 console.log("WARNING - Looped source: Cannot check fragments are fully played"); | |
2810 return true; | |
2811 } | |
2812 var check_pass = true; | |
2813 var error_obj = []; | |
2814 for (var i = 0; i<audioEngineContext.audioObjects.length; i++) | |
2815 { | |
2816 var object = audioEngineContext.audioObjects[i]; | |
2817 var time = object.buffer.buffer.duration; | |
2818 var metric = object.metric; | |
2819 var passed = false; | |
2820 for (var j=0; j<metric.listenTracker.length; j++) | |
2821 { | |
2822 var bt = metric.listenTracker[j].getElementsByTagName('buffertime'); | |
2823 var start_time = Number(bt[0].getAttribute('start')); | |
2824 var stop_time = Number(bt[0].getAttribute('stop')); | |
2825 var delta = stop_time - start_time; | |
2826 if (delta >= time) | |
2827 { | |
2828 passed = true; | |
2829 break; | |
2830 } | |
2831 } | |
2832 if (passed == false) | |
2833 { | |
2834 check_pass = false; | |
2835 console.log("Continue listening to track-"+i); | |
2836 error_obj.push(i); | |
2837 } | |
2838 } | |
2839 if (check_pass == false) | |
2840 { | |
2841 var str_start = "You have not completely listened to fragments "; | |
2842 for (var i=0; i<error_obj.length; i++) | |
2843 { | |
2844 str_start += error_obj[i]; | |
2845 if (i != error_obj.length-1) | |
2846 { | |
2847 str_start += ', '; | |
2848 } | |
2849 } | |
2850 str_start += ". Please keep listening"; | |
2851 console.log("[ALERT]: "+str_start); | |
2852 alert(str_start); | |
2853 } | |
2854 }; | |
2855 this.checkAllMoved = function() | |
2856 { | |
2857 var str = "You have not moved "; | |
2858 var failed = []; | |
2859 for (var i in audioEngineContext.audioObjects) | |
2860 { | |
2861 if(audioEngineContext.audioObjects[i].metric.wasMoved == false && audioEngineContext.audioObjects[i].specification.type != 'outsidereference') | |
2862 { | |
2863 failed.push(audioEngineContext.audioObjects[i].id); | |
2864 } | |
2865 } | |
2866 if (failed.length == 0) | |
2867 { | |
2868 return true; | |
2869 } else if (failed.length == 1) | |
2870 { | |
2871 str += 'track '+failed[0]; | |
2872 } else { | |
2873 str += 'tracks '; | |
2874 for (var i=0; i<failed.length-1; i++) | |
2875 { | |
2876 str += failed[i]+', '; | |
2877 } | |
2878 str += 'and '+failed[i]; | |
2879 } | |
2880 str +='.'; | |
2881 alert(str); | |
2882 console.log(str); | |
2883 return false; | |
2884 }; | |
2885 this.checkAllPlayed = function() | |
2886 { | |
2887 var str = "You have not played "; | |
2888 var failed = []; | |
2889 for (var i in audioEngineContext.audioObjects) | |
2890 { | |
2891 if(audioEngineContext.audioObjects[i].metric.wasListenedTo == false) | |
2892 { | |
2893 failed.push(audioEngineContext.audioObjects[i].id); | |
2894 } | |
2895 } | |
2896 if (failed.length == 0) | |
2897 { | |
2898 return true; | |
2899 } else if (failed.length == 1) | |
2900 { | |
2901 str += 'track '+failed[0]; | |
2902 } else { | |
2903 str += 'tracks '; | |
2904 for (var i=0; i<failed.length-1; i++) | |
2905 { | |
2906 str += failed[i]+', '; | |
2907 } | |
2908 str += 'and '+failed[i]; | |
2909 } | |
2910 str +='.'; | |
2911 alert(str); | |
2912 console.log(str); | |
2913 return false; | |
2914 }; | |
2915 } |