Mercurial > hg > webaudioevaluationtool

comparison test_create/test_create.html @ 816:9c579fc05a09

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Updating test create using questions
author Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
date Wed, 23 Sep 2015 11:42:11 +0100
parents
children bc6c35b0a49d
comparison
equal deleted inserted replaced
-1:000000000000 816:9c579fc05a09
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="utf-8">
5
6 <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
7 Remove this if you use the .htaccess -->
8 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
9
10 <title>WAET: Test Creator</title>
11
12 <meta name="viewport" content="width=device-width; initial-scale=1.0">
13 <script type="text/javascript">
14
15 var APEInterfaceOptions = [["playhead","page-count"],["Show the playhead/scrubber bar", "Show test page count"]];
16 var APEInterfaceChecks = [["fragmentPlayed","fragmentFullPlayback","fragmentMoved","fragmentComments"],["All Fragments Played","All Fragments Played in entirety","All sliders moved","All fragments have comments"]];
17 var MUSHRAInterfaceOptions = [[],[]];
18 var MUSHRAInterfaceChecks = [["fragmentPlayed","fragmentMoved","fragmentComments"],["All Fragments Played","All sliders moved","All fragments have comments"]];
19 var popupInstance;
20 var specificationNode;
21 var audioContext;
22 window.onload = function()
23 {
24 var AudioContext = window.AudioContext || window.webkitAudioContext;
25 audioContext = new AudioContext;
26 popupInstance = new popup();
27 popupInstance.advanceState();
28 specificationNode = new Specification();
29 };
30
31 function popup()
32 {
33 var x = window.innerWidth;
34 var y = window.innerHeight;
35 this.popupHolder = document.createElement('div');
36 this.popupHolder.style.visibility = 'hidden';
37 this.popupContent = document.createElement('div');
38 this.popupTitle = document.createElement('div');
39 this.popupBody = document.createElement('div');
40 this.popupFooter = document.createElement('div');
41 this.popupTitleText = document.createElement('span');
42 this.popupTitle.appendChild(this.popupTitleText);
43
44 this.popupHolder.className = "popup";
45 this.popupHolder.style.left = (x-500)/2 +'px';
46 this.popupHolder.style.top = (y-400)/2 + 'px';
47 this.popupContent.style.padding = "20px";
48 this.popupHolder.appendChild(this.popupContent);
49
50 this.popupTitle.style.width = "100%";
51 this.popupTitle.style.height = "50px";
52 this.popupTitle.style.fontSize = "xx-large";
53 this.popupContent.appendChild(this.popupTitle);
54
55 this.popupBody.style.width = "100%";
56 this.popupBody.style.height = "280px";
57 this.popupContent.appendChild(this.popupBody);
58
59 this.popupFooter.style.width = "100%";
60 this.popupFooter.style.height = "30px";
61 this.popupContent.appendChild(this.popupFooter);
62 var body = document.getElementsByTagName('body')[0];
63 body.appendChild(this.popupHolder);
64
65 this.pageBlank = document.createElement('div');
66 body.appendChild(this.pageBlank);
67 this.pageBlank.style.width = "100%";
68 this.pageBlank.style.height = "100%";
69 this.pageBlank.style.position = "absolute";
70 this.pageBlank.style.left = "0px";
71 this.pageBlank.style.top = "0px";
72 this.pageBlank.style.backgroundColor = "rgba(0,0,0,0.5)";
73 this.pageBlank.style.visibility = 'hidden';
74
75 this.state = 0;
76
77 this.showPopup = function()
78 {
79 this.popupHolder.style.visibility = 'visible';
80 this.popupHolder.style.zIndex = "3";
81 this.pageBlank.style.visibility = 'visible';
82 this.pageBlank.style.zIndex = "2";
83 };
84
85 this.hidePopup = function()
86 {
87 this.popupHolder.style.visibility = 'hidden';
88 this.popupHolder.style.zIndex = "-1";
89 this.pageBlank.style.visibility = 'hidden';
90 this.pageBlank.style.zIndex = "-2";
91 };
92
93 this.init = function()
94 {
95 this.popupTitleText.textContent = "Welcome";
96 var text = document.createElement('span');
97 text.textContent = "Thank you for downloading the Web Audio Evaluation Toolbox. This page will help guide you through creating the documents required to run a test. If you have an existing XML file you wish to edit, please drag and drop it into the box below";
98 var dnd = document.createElement('div');
99 dnd.style.width = "100%";
100 dnd.style.height = "50px";
101 dnd.className = "dragndrop";
102 this.popupBody.appendChild(text);
103 this.popupBody.appendChild(dnd);
104 this.showPopup();
105
106 var button = document.createElement('button');
107 button.className = "popupButton";
108 button.textContent = "New File";
109 button.onclick = function(event) {
110 popupInstance.advanceState();
111 };
112 this.popupFooter.appendChild(button);
113 };
114
115 this.advanceState = function()
116 {
117 this.popupBody.innerHTML = null;
118 this.popupFooter.innerHTML = null;
119 this.popupTitleText.textContent = null;
120 switch(this.state)
121 {
122 case 0:
123 this.init();
124 break;
125 case 1:
126 this.popupTitleText.textContent = "Test Type";
127 var text = document.createElement("span");
128 text.textContent = "What type of test would you like to use. Currently APE (Audio Perceptual Evaluation) and MUSHRA style interfaces are available";
129 this.popupBody.appendChild(text);
130 var select = document.createElement("select");
131 select.id="interface-select";
132 var opt1 = document.createElement("option");
133 opt1.value = "APE";
134 opt1.textContent = "APE";
135 select.appendChild(opt1);
136 var opt2 = document.createElement("option");
137 opt2.value = "MUSHRA";
138 opt2.textContent = "MUSHRA";
139 select.appendChild(opt2);
140 this.popupBody.appendChild(select);
141
142 var button = document.createElement('button');
143 button.className = "popupButton";
144 button.textContent = "Submit";
145 button.onclick = function(event) {
146 var select = document.getElementById("interface-select");
147 specificationNode.interfaceType = select.value;
148 specificationNode.collectMetrics = true;
149 popupInstance.advanceState();
150 };
151 this.popupFooter.appendChild(button);
152 break;
153 case 2:
154 this.popupTitleText.textContent = "Test Options";
155 var holder = document.createElement('div');
156 holder.style.margin = "5px";
157 var checkbox = document.createElement('input');
158 checkbox.type = 'checkbox';
159 checkbox.id = "Randomise-Page";
160 var text = document.createElement('span');
161 text.textContent = "Randomise Page Order";
162 holder.appendChild(checkbox);
163 holder.appendChild(text);
164 this.popupBody.appendChild(holder);
165 switch(specificationNode.interfaceType)
166 {
167 case "APE":
168 for (var i=0; i<APEInterfaceOptions[0].length; i++)
169 {
170 holder = document.createElement('div');
171 holder.style.margin = "5px";
172 checkbox = document.createElement('input');
173 checkbox.type = 'checkbox';
174 checkbox.setAttribute("name","option");
175 checkbox.id = APEInterfaceOptions[0][i];
176 text = document.createElement('span');
177 text.textContent = APEInterfaceOptions[1][i];
178 holder.appendChild(checkbox);
179 holder.appendChild(text);
180 this.popupBody.appendChild(holder);
181 }
182 for (var i=0; i<APEInterfaceChecks[0].length; i++)
183 {
184 holder = document.createElement('div');
185 holder.style.margin = "5px";
186 checkbox = document.createElement('input');
187 checkbox.type = 'checkbox';
188 checkbox.setAttribute("name","check");
189 checkbox.id = APEInterfaceChecks[0][i];
190 text = document.createElement('span');
191 text.textContent = APEInterfaceChecks[1][i];
192 holder.appendChild(checkbox);
193 holder.appendChild(text);
194 this.popupBody.appendChild(holder);
195 }
196 break;
197 case "MUSHRA":
198 for (var i=0; i<MUSHRAInterfaceOptions[0].length; i++)
199 {
200 holder = document.createElement('div');
201 holder.style.margin = "5px";
202 checkbox = document.createElement('input');
203 checkbox.type = 'checkbox';
204 checkbox.setAttribute("name","option");
205 checkbox.id = MUSHRAInterfaceOptions[0][i];
206 text = document.createElement('span');
207 text.textContent = MUSHRAInterfaceOptions[1][i];
208 holder.appendChild(checkbox);
209 holder.appendChild(text);
210 this.popupBody.appendChild(holder);
211 }
212 for (var i=0; i<MUSHRAInterfaceChecks[0].length; i++)
213 {
214 holder = document.createElement('div');
215 holder.style.margin = "5px";
216 checkbox = document.createElement('input');
217 checkbox.type = 'checkbox';
218 checkbox.setAttribute("name","check");
219 checkbox.id = MUSHRAInterfaceChecks[0][i];
220 text = document.createElement('span');
221 text.textContent = MUSHRAInterfaceChecks[1][i];
222 holder.appendChild(checkbox);
223 holder.appendChild(text);
224 this.popupBody.appendChild(holder);
225 }
226 }
227 var button = document.createElement('button');
228 button.className = "popupButton";
229 button.textContent = "Submit";
230 button.onclick = function(event) {
231 var optHold = popupInstance.popupBody;
232 var opt = optHold.firstChild;
233 var input = opt.getElementsByTagName('input')[0];
234 specificationNode.randomiseOrder = input.checked;
235 while(opt.nextSibling != null)
236 {
237 opt = opt.nextSibling;
238 input = opt.getElementsByTagName('input')[0];
239 if (input.checked)
240 {
241 specificationNode.commonInterface.options.push(new specificationNode.commonInterface.optionNode(input));
242 }
243
244 }
245 popupInstance.advanceState();
246 };
247 this.popupFooter.appendChild(button);
248 break;
249 case 3:
250 this.popupTitleText.textContent = "Test Page";
251 var span = document.createElement('span');
252 span.textContent = "Drag and drop your audio files into the box below to add them to a test page";
253 this.popupBody.appendChild(span);
254 var dnd = document.createElement('div');
255 dnd.id = "audio-holder-drop";
256 dnd.style.width = "100%";
257 dnd.style.minHeight = "50px";
258 dnd.style.maxHeight = "220px";
259 dnd.style.overflow = 'auto';
260 dnd.className = "dragndrop";
261 dnd.ondragover = function(e) {
262 if(e.preventDefault) {e.preventDefault();}
263 return false;
264 };
265 dnd.ondragenter = function(e) {
266 if(e.preventDefault) {e.preventDefault();}
267 return false;
268 };
269 dnd.ondrop = function(e) {
270 if(e.preventDefault) {e.preventDefault();}
271 var dt = e.dataTransfer;
272 var body = document.getElementById("audio-holder-drop");
273 var files = dt.files;
274 for (var i = 0, f; f = files[i]; i++)
275 {
276 var dndHeader = document.createElement('div');
277 dndHeader.style.width = "100%";
278 dndHeader.style.height = "20px";
279 dndHeader.style.borderBottom = "#DDD";
280 dndHeader.style.borderBottomWidth = "1px";
281 dndHeader.style.borderBottomStyle = "solid";
282 var dndHInclude = document.createElement('div');
283 dndHInclude.style.width = "30px";
284 dndHInclude.className = "dndheaderelement";
285 var includeCheck = document.createElement('input');
286 includeCheck.type = "checkbox";
287 includeCheck.name = "include-check";
288 includeCheck.checked = true;
289 dndHInclude.appendChild(includeCheck);
290 dndHeader.appendChild(dndHInclude);
291 var dndHTitle = document.createElement('div');
292 dndHTitle.style.width = "180px";
293 dndHTitle.className = "dndheaderelement";
294 var text = document.createElement('span');
295 text.textContent = f.name;
296 dndHTitle.appendChild(text);
297 dndHeader.appendChild(dndHTitle);
298 var dndHID = document.createElement('div');
299 dndHID.style.width = "100px";
300 dndHID.className = "dndheaderelement";
301 var IDInput = document.createElement('input');
302 IDInput.name = "ID";
303 IDInput.value = f.name.split('.')[0];
304 IDInput.style.width = "96px";
305 // TODO: Automatic checking for common ID;
306 dndHID.appendChild(IDInput);
307 dndHeader.appendChild(dndHID);
308 var dndHPlay = document.createElement('div');
309 dndHPlay.style.width = "100px";
310 dndHPlay.className = "dndheaderelement";
311 var audio = document.createElement('audio');
312 dndHPlay.appendChild(audio);
313 dndHeader.appendChild(dndHPlay);
314 dnd.appendChild(dndHeader);
315 }
316 };
317 var dndHeader = document.createElement('div');
318 dndHeader.style.width = "100%";
319 dndHeader.style.height = "15px";
320 dndHeader.style.borderBottom = "#DDD";
321 dndHeader.style.borderBottomWidth = "1px";
322 dndHeader.style.borderBottomStyle = "solid";
323 var dndHInclude = document.createElement('div');
324 dndHInclude.style.width = "30px";
325 dndHInclude.className = "dndheaderelement";
326 var text = document.createElement('span');
327 text.textContent = "Inc.";
328 dndHInclude.appendChild(text);
329 dndHeader.appendChild(dndHInclude);
330 var dndHTitle = document.createElement('div');
331 dndHTitle.style.width = "180px";
332 dndHTitle.className = "dndheaderelement";
333 text = document.createElement('span');
334 text.textContent = "File Name";
335 dndHTitle.appendChild(text);
336 dndHeader.appendChild(dndHTitle);
337 var dndHID = document.createElement('div');
338 dndHID.style.width = "100px";
339 dndHID.className = "dndheaderelement";
340 text = document.createElement('span');
341 text.textContent = "ID";
342 dndHID.appendChild(text);
343 dndHeader.appendChild(dndHID);
344 var dndHPlay = document.createElement('div');
345 dndHPlay.style.width = "100px";
346 dndHPlay.className = "dndheaderelement";
347 text = document.createElement('span');
348 text.textContent = "Sample";
349 dndHPlay.appendChild(text);
350 dndHeader.appendChild(dndHPlay);
351 dnd.appendChild(dndHeader);
352 this.popupBody.appendChild(dnd);
353 var button = document.createElement('button');
354 button.className = "popupButton";
355 button.textContent = "Submit";
356 button.onclick = function(event)
357 {
358
359 };
360 this.popupFooter.appendChild(button);
361 }
362 this.state++;
363 };
364 };
365
366 function Specification() {
367 // Handles the decoding of the project specification XML into a simple JavaScript Object.
368
369 this.interfaceType = null;
370 this.commonInterface = new function()
371 {
372 this.options = [];
373 this.optionNode = function(input)
374 {
375 var name = input.getAttribute('name');
376 this.type = name;
377 if(this.type == "option")
378 {
379 this.name = input.id;
380 } else if (this.type == "check")
381 {
382 this.check = input.id;
383 }
384 };
385 };
386 this.projectReturn = null;
387 this.randomiseOrder = null;
388 this.collectMetrics = null;
389 this.testPages = null;
390 this.preTest = null;
391 this.postTest = null;
392 this.audioHolders = [];
393
394 this.decode = function() {
395 // projectXML - DOM Parsed document
396 this.projectXML = projectXML.childNodes[0];
397 var setupNode = projectXML.getElementsByTagName('setup')[0];
398 this.interfaceType = setupNode.getAttribute('interface');
399 this.projectReturn = setupNode.getAttribute('projectReturn');
400 this.testPages = setupNode.getAttribute('testPages');
401 if (setupNode.getAttribute('randomiseOrder') == "true") {
402 this.randomiseOrder = true;
403 } else {this.randomiseOrder = false;}
404 if (setupNode.getAttribute('collectMetrics') == "true") {
405 this.collectMetrics = true;
406 } else {this.collectMetrics = false;}
407 if (isNaN(Number(this.testPages)) || this.testPages == undefined)
408 {
409 this.testPages = null;
410 } else {
411 this.testPages = Number(this.testPages);
412 if (this.testPages == 0) {this.testPages = null;}
413 }
414 var metricCollection = setupNode.getElementsByTagName('Metric');
415
416 this.preTest = new this.prepostNode('pretest',setupNode.getElementsByTagName('PreTest'));
417 this.postTest = new this.prepostNode('posttest',setupNode.getElementsByTagName('PostTest'));
418
419 if (metricCollection.length > 0) {
420 metricCollection = metricCollection[0].getElementsByTagName('metricEnable');
421 for (var i=0; i<metricCollection.length; i++) {
422 this.metrics.push(new this.metricNode(metricCollection[i].textContent));
423 }
424 }
425
426 var commonInterfaceNode = setupNode.getElementsByTagName('interface');
427 if (commonInterfaceNode.length > 0) {
428 commonInterfaceNode = commonInterfaceNode[0];
429 } else {
430 commonInterfaceNode = undefined;
431 }
432
433 this.commonInterface = new function() {
434 this.OptionNode = function(child) {
435 this.type = child.nodeName;
436 if (this.type == 'option')
437 {
438 this.name = child.getAttribute('name');
439 }
440 else if (this.type == 'check') {
441 this.check = child.getAttribute('name');
442 if (this.check == 'scalerange') {
443 this.min = child.getAttribute('min');
444 this.max = child.getAttribute('max');
445 if (this.min == null) {this.min = 1;}
446 else if (Number(this.min) > 1 && this.min != null) {
447 this.min = Number(this.min)/100;
448 } else {
449 this.min = Number(this.min);
450 }
451 if (this.max == null) {this.max = 0;}
452 else if (Number(this.max) > 1 && this.max != null) {
453 this.max = Number(this.max)/100;
454 } else {
455 this.max = Number(this.max);
456 }
457 }
458 } else if (this.type == 'anchor' || this.type == 'reference') {
459 this.value = Number(child.textContent);
460 this.enforce = child.getAttribute('enforce');
461 if (this.enforce == 'true') {this.enforce = true;}
462 else {this.enforce = false;}
463 }
464 };
465 this.options = [];
466 if (commonInterfaceNode != undefined) {
467 var child = commonInterfaceNode.firstElementChild;
468 while (child != undefined) {
469 this.options.push(new this.OptionNode(child));
470 child = child.nextElementSibling;
471 }
472 }
473 };
474
475 var audioHolders = projectXML.getElementsByTagName('audioHolder');
476 for (var i=0; i<audioHolders.length; i++) {
477 this.audioHolders.push(new this.audioHolderNode(this,audioHolders[i]));
478 }
479
480 // New check if we need to randomise the test order
481 if (this.randomiseOrder)
482 {
483 this.audioHolders = randomiseOrder(this.audioHolders);
484 for (var i=0; i<this.audioHolders.length; i++)
485 {
486 this.audioHolders[i].presentedId = i;
487 }
488 }
489
490 if (this.testPages != null || this.testPages != undefined)
491 {
492 if (this.testPages > audioHolders.length)
493 {
494 console.log('Warning: You have specified '+audioHolders.length+' tests but requested '+this.testPages+' be completed!');
495 this.testPages = audioHolders.length;
496 }
497 var aH = this.audioHolders;
498 this.audioHolders = [];
499 for (var i=0; i<this.testPages; i++)
500 {
501 this.audioHolders.push(aH[i]);
502 }
503 }
504 };
505
506 this.prepostNode = function(type,Collection) {
507 this.type = type;
508 this.options = [];
509
510 this.OptionNode = function(child) {
511
512 this.childOption = function(element) {
513 this.type = 'option';
514 this.id = element.id;
515 this.name = element.getAttribute('name');
516 this.text = element.textContent;
517 };
518
519 this.type = child.nodeName;
520 if (child.nodeName == "question") {
521 this.id = child.id;
522 this.mandatory;
523 if (child.getAttribute('mandatory') == "true") {this.mandatory = true;}
524 else {this.mandatory = false;}
525 this.question = child.textContent;
526 if (child.getAttribute('boxsize') == null) {
527 this.boxsize = 'normal';
528 } else {
529 this.boxsize = child.getAttribute('boxsize');
530 }
531 } else if (child.nodeName == "statement") {
532 this.statement = child.textContent;
533 } else if (child.nodeName == "checkbox" || child.nodeName == "radio") {
534 var element = child.firstElementChild;
535 this.id = child.id;
536 if (element == null) {
537 console.log('Malformed' +child.nodeName+ 'entry');
538 this.statement = 'Malformed' +child.nodeName+ 'entry';
539 this.type = 'statement';
540 } else {
541 this.options = [];
542 while (element != null) {
543 if (element.nodeName == 'statement' && this.statement == undefined){
544 this.statement = element.textContent;
545 } else if (element.nodeName == 'option') {
546 this.options.push(new this.childOption(element));
547 }
548 element = element.nextElementSibling;
549 }
550 }
551 } else if (child.nodeName == "number") {
552 this.statement = child.textContent;
553 this.id = child.id;
554 this.min = child.getAttribute('min');
555 this.max = child.getAttribute('max');
556 this.step = child.getAttribute('step');
557 }
558 };
559
560 // On construction:
561 if (Collection.length != 0) {
562 Collection = Collection[0];
563 if (Collection.childElementCount != 0) {
564 var child = Collection.firstElementChild;
565 this.options.push(new this.OptionNode(child));
566 while (child.nextElementSibling != null) {
567 child = child.nextElementSibling;
568 this.options.push(new this.OptionNode(child));
569 }
570 }
571 }
572 };
573
574 this.metricNode = function(name) {
575 this.enabled = name;
576 };
577
578 this.audioHolderNode = function(parent,xml) {
579 this.type = 'audioHolder';
580 this.presentedId = parent.audioHolders.length;
581 this.interfaceNode = function(DOM) {
582 var title = DOM.getElementsByTagName('title');
583 if (title.length == 0) {this.title = null;}
584 else {this.title = title[0].textContent;}
585 this.options = parent.commonInterface.options;
586 var scale = DOM.getElementsByTagName('scale');
587 this.scale = [];
588 for (var i=0; i<scale.length; i++) {
589 var arr = [null, null];
590 arr[0] = scale[i].getAttribute('position');
591 arr[1] = scale[i].textContent;
592 this.scale.push(arr);
593 }
594 };
595
596 this.audioElementNode = function(parent,xml) {
597 this.url = xml.getAttribute('url');
598 this.id = xml.id;
599 this.parent = parent;
600 this.type = xml.getAttribute('type');
601 if (this.type == null) {this.type = "normal";}
602 if (this.type == 'anchor') {this.anchor = true;}
603 else {this.anchor = false;}
604 if (this.type == 'reference') {this.reference = true;}
605 else {this.reference = false;}
606
607 this.marker = xml.getAttribute('marker');
608 if (this.marker == null) {this.marker = undefined;}
609
610 if (this.anchor == true) {
611 if (this.marker != undefined) {this.enforce = true;}
612 else {this.enforce = enforceAnchor;}
613 this.marker = anchor;
614 }
615 else if (this.reference == true) {
616 if (this.marker != undefined) {this.enforce = true;}
617 else {this.enforce = enforceReference;}
618 this.marker = reference;
619 }
620
621 if (this.marker != undefined) {
622 this.marker = Number(this.marker);
623 if (this.marker > 1) {this.marker /= 100;}
624 }
625 };
626
627 this.commentQuestionNode = function(xml) {
628 this.childOption = function(element) {
629 this.type = 'option';
630 this.name = element.getAttribute('name');
631 this.text = element.textContent;
632 };
633 this.id = xml.id;
634 if (xml.getAttribute('mandatory') == 'true') {this.mandatory = true;}
635 else {this.mandatory = false;}
636 this.type = xml.getAttribute('type');
637 if (this.type == undefined) {this.type = 'text';}
638 switch (this.type) {
639 case 'text':
640 this.question = xml.textContent;
641 break;
642 case 'radio':
643 var child = xml.firstElementChild;
644 this.options = [];
645 while (child != undefined) {
646 if (child.nodeName == 'statement' && this.statement == undefined) {
647 this.statement = child.textContent;
648 } else if (child.nodeName == 'option') {
649 this.options.push(new this.childOption(child));
650 }
651 child = child.nextElementSibling;
652 }
653 break;
654 case 'checkbox':
655 var child = xml.firstElementChild;
656 this.options = [];
657 while (child != undefined) {
658 if (child.nodeName == 'statement' && this.statement == undefined) {
659 this.statement = child.textContent;
660 } else if (child.nodeName == 'option') {
661 this.options.push(new this.childOption(child));
662 }
663 child = child.nextElementSibling;
664 }
665 break;
666 }
667 };
668
669 this.id = xml.id;
670 this.hostURL = xml.getAttribute('hostURL');
671 this.sampleRate = xml.getAttribute('sampleRate');
672 if (xml.getAttribute('randomiseOrder') == "true") {this.randomiseOrder = true;}
673 else {this.randomiseOrder = false;}
674 this.repeatCount = xml.getAttribute('repeatCount');
675 if (xml.getAttribute('loop') == 'true') {this.loop = true;}
676 else {this.loop == false;}
677 if (xml.getAttribute('elementComments') == "true") {this.elementComments = true;}
678 else {this.elementComments = false;}
679
680 var anchor = xml.getElementsByTagName('anchor');
681 var enforceAnchor = false;
682 if (anchor.length == 0) {
683 // Find anchor in commonInterface;
684 for (var i=0; i<parent.commonInterface.options.length; i++) {
685 if(parent.commonInterface.options[i].type == 'anchor') {
686 anchor = parent.commonInterface.options[i].value;
687 enforceAnchor = parent.commonInterface.options[i].enforce;
688 break;
689 }
690 }
691 if (typeof(anchor) == "object") {
692 anchor = null;
693 }
694 } else {
695 anchor = anchor[0].textContent;
696 }
697
698 var reference = xml.getElementsByTagName('anchor');
699 var enforceReference = false;
700 if (reference.length == 0) {
701 // Find anchor in commonInterface;
702 for (var i=0; i<parent.commonInterface.options.length; i++) {
703 if(parent.commonInterface.options[i].type == 'reference') {
704 reference = parent.commonInterface.options[i].value;
705 enforceReference = parent.commonInterface.options[i].enforce;
706 break;
707 }
708 }
709 if (typeof(reference) == "object") {
710 reference = null;
711 }
712 } else {
713 reference = reference[0].textContent;
714 }
715
716 if (typeof(anchor) == 'number') {
717 if (anchor > 1 && anchor < 100) {anchor /= 100.0;}
718 }
719
720 if (typeof(reference) == 'number') {
721 if (reference > 1 && reference < 100) {reference /= 100.0;}
722 }
723
724 this.preTest = new parent.prepostNode('pretest',xml.getElementsByTagName('PreTest'));
725 this.postTest = new parent.prepostNode('posttest',xml.getElementsByTagName('PostTest'));
726
727 this.interfaces = [];
728 var interfaceDOM = xml.getElementsByTagName('interface');
729 for (var i=0; i<interfaceDOM.length; i++) {
730 this.interfaces.push(new this.interfaceNode(interfaceDOM[i]));
731 }
732
733 this.commentBoxPrefix = xml.getElementsByTagName('commentBoxPrefix');
734 if (this.commentBoxPrefix.length != 0) {
735 this.commentBoxPrefix = this.commentBoxPrefix[0].textContent;
736 } else {
737 this.commentBoxPrefix = "Comment on track";
738 }
739
740 this.audioElements =[];
741 var audioElementsDOM = xml.getElementsByTagName('audioElements');
742 this.outsideReference = null;
743 for (var i=0; i<audioElementsDOM.length; i++) {
744 if (audioElementsDOM[i].getAttribute('type') == 'outsidereference') {
745 if (this.outsideReference == null) {
746 this.outsideReference = new this.audioElementNode(this,audioElementsDOM[i]);
747 } else {
748 console.log('Error only one audioelement can be of type outsidereference per audioholder');
749 this.audioElements.push(new this.audioElementNode(this,audioElementsDOM[i]));
750 console.log('Element id '+audioElementsDOM[i].id+' made into normal node');
751 }
752 } else {
753 this.audioElements.push(new this.audioElementNode(this,audioElementsDOM[i]));
754 }
755 }
756
757 if (this.randomiseOrder) {
758 this.audioElements = randomiseOrder(this.audioElements);
759 }
760
761 // Check only one anchor and one reference per audioNode
762 var anchor = [];
763 var reference = [];
764 this.anchorId = null;
765 this.referenceId = null;
766 for (var i=0; i<this.audioElements.length; i++)
767 {
768 if (this.audioElements[i].anchor == true) {anchor.push(i);}
769 if (this.audioElements[i].reference == true) {reference.push(i);}
770 }
771
772 if (anchor.length > 1) {
773 console.log('Error - cannot have more than one anchor!');
774 console.log('Each anchor node will be a normal mode to continue the test');
775 for (var i=0; i<anchor.length; i++)
776 {
777 this.audioElements[anchor[i]].anchor = false;
778 this.audioElements[anchor[i]].value = undefined;
779 }
780 } else {this.anchorId = anchor[0];}
781 if (reference.length > 1) {
782 console.log('Error - cannot have more than one anchor!');
783 console.log('Each anchor node will be a normal mode to continue the test');
784 for (var i=0; i<reference.length; i++)
785 {
786 this.audioElements[reference[i]].reference = false;
787 this.audioElements[reference[i]].value = undefined;
788 }
789 } else {this.referenceId = reference[0];}
790
791 this.commentQuestions = [];
792 var commentQuestionsDOM = xml.getElementsByTagName('CommentQuestion');
793 for (var i=0; i<commentQuestionsDOM.length; i++) {
794 this.commentQuestions.push(new this.commentQuestionNode(commentQuestionsDOM[i]));
795 }
796 };
797 }
798 </script>
799 <style>
800 div.popup {
801 width: 500px;
802 position: absolute;
803 height: 400px;
804 background-color: #fff;
805 border-radius: 10px;
806 box-shadow: 0px 0px 50px #000;
807 z-index: 2;
808 }
809
810 button.popupButton {
811 /* Button for popup window
812 */
813 min-width: 50px;
814 height: 25px;
815 position: relative;
816 border-radius: 5px;
817 border: #444;
818 border-width: 1px;
819 border-style: solid;
820 background-color: #fff;
821 }
822
823 div.dragndrop {
824 margin-top: 10px;
825 border:#000000;
826 border-style: dashed;
827 border-width: 2px;
828 }
829 div.dndheaderelement {
830 float: left;
831 height: 100%;
832 border-right: #DDDDDD;
833 border-right-width: 1px;
834 border-right-style: solid;
835 }
836 div.dndheaderelement span{
837 padding-left: 5px;
838 }
839 </style>
840 </head>
841
842 <body>
843 <div id="content"></div>
844 </body>
845 </html>