webaudioevaluationtool: test_create/test

annotate test_create/test_create.html @ 776:0795031754d7

STASH: UNSTABLE. Implementing APE multiple sliders.

author	Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
date	Tue, 08 Dec 2015 12:01:48 +0000
parents	67c6048d920f
children	3123565e0c49

rev	line source
n@767	1 <!DOCTYPE html>
n@767	2 <html lang="en">
n@767	3 <head>
n@767	4 <meta charset="utf-8">
n@767	5
n@767	6 <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
n@767	7 Remove this if you use the .htaccess -->
n@767	8 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
n@767	9
n@767	10 <title>WAET: Test Creator</title>
n@767	11
n@767	12 <meta name="viewport" content="width=device-width; initial-scale=1.0">
n@767	13 <script type="text/javascript">
n@767	14
n@767	15 var APEInterfaceOptions = [["playhead","page-count"],["Show the playhead/scrubber bar", "Show test page count"]];
n@767	16 var APEInterfaceChecks = [["fragmentPlayed","fragmentFullPlayback","fragmentMoved","fragmentComments"],["All Fragments Played","All Fragments Played in entirety","All sliders moved","All fragments have comments"]];
n@767	17 var APEInterfaceMetrics = [["testTimer","elementTimer","elementTracker","elementTrackerFull","elementFlagListenedTo","elementFlagMoved","elementFlagComments"],["Test Duration","Total time each fragment was listened to","Return initialised position of marker","Fragment movement tracker with timestamps","Flag if fragment listened to","Flag if fragment moved","Flag if fragment has comments"]];
n@767	18 var MUSHRAInterfaceOptions = [[],[]];
n@767	19 var MUSHRAInterfaceChecks = [["fragmentPlayed","fragmentMoved","fragmentComments"],["All Fragments Played","All sliders moved","All fragments have comments"]];
n@767	20 var MUSHRAInterfaceMetrics = [["testTimer","elementTimer","elementTracker","elementTrackerFull","elementFlagListenedTo","elementFlagMoved","elementFlagComments"],["Test Duration","Total time each fragment was listened to","Return initialised position of marker","Fragment movement tracker with timestamps","Flag if fragment listened to","Flag if fragment moved","Flag if fragment has comments"]];
n@767	21 var popupInstance;
n@767	22 var specificationNode;
n@767	23 var audioContext;
n@767	24 var audioObjects = [];
n@767	25 window.onload = function()
n@767	26 {
n@767	27 var AudioContext = window.AudioContext \|\| window.webkitAudioContext;
n@767	28 audioContext = new AudioContext;
n@767	29 popupInstance = new popup();
n@767	30 popupInstance.advanceState();
n@767	31 specificationNode = new Specification();
n@767	32 specificationNode.projectReturn = "null";
n@767	33 };
n@767	34
n@767	35 function popup()
n@767	36 {
n@767	37 var x = window.innerWidth;
n@767	38 var y = window.innerHeight;
n@767	39 this.popupHolder = document.createElement('div');
n@767	40 this.popupHolder.style.visibility = 'hidden';
n@767	41 this.popupContent = document.createElement('div');
n@767	42 this.popupTitle = document.createElement('div');
n@767	43 this.popupBody = document.createElement('div');
n@767	44 this.popupFooter = document.createElement('div');
n@767	45 this.popupTitleText = document.createElement('span');
n@767	46 this.popupTitle.appendChild(this.popupTitleText);
n@767	47
n@767	48 this.popupHolder.className = "popup";
n@767	49 this.popupHolder.style.left = (x-500)/2 +'px';
n@767	50 this.popupHolder.style.top = (y-400)/2 + 'px';
n@767	51 this.popupContent.style.padding = "20px";
n@767	52 this.popupHolder.appendChild(this.popupContent);
n@767	53
n@767	54 this.popupTitle.style.width = "100%";
n@767	55 this.popupTitle.style.height = "50px";
n@767	56 this.popupTitle.style.fontSize = "xx-large";
n@767	57 this.popupContent.appendChild(this.popupTitle);
n@767	58
n@767	59 this.popupBody.style.width = "100%";
n@767	60 this.popupBody.style.height = "280px";
n@767	61 this.popupContent.appendChild(this.popupBody);
n@767	62
n@767	63 this.popupFooter.style.width = "100%";
n@767	64 this.popupFooter.style.height = "30px";
n@767	65 this.popupContent.appendChild(this.popupFooter);
n@767	66 var body = document.getElementsByTagName('body')[0];
n@767	67 body.appendChild(this.popupHolder);
n@767	68
n@767	69 this.pageBlank = document.createElement('div');
n@767	70 body.appendChild(this.pageBlank);
n@767	71 this.pageBlank.style.width = "100%";
n@767	72 this.pageBlank.style.height = "100%";
n@767	73 this.pageBlank.style.position = "absolute";
n@767	74 this.pageBlank.style.left = "0px";
n@767	75 this.pageBlank.style.top = "0px";
n@767	76 this.pageBlank.style.backgroundColor = "rgba(0,0,0,0.5)";
n@767	77 this.pageBlank.style.visibility = 'hidden';
n@767	78
n@767	79 this.state = 0;
n@767	80 this.dataTransfer = null;
n@767	81
n@767	82 this.showPopup = function()
n@767	83 {
n@767	84 this.popupHolder.style.visibility = 'visible';
n@767	85 this.popupHolder.style.zIndex = "3";
n@767	86 this.pageBlank.style.visibility = 'visible';
n@767	87 this.pageBlank.style.zIndex = "2";
n@767	88 };
n@767	89
n@767	90 this.hidePopup = function()
n@767	91 {
n@767	92 this.popupHolder.style.visibility = 'hidden';
n@767	93 this.popupHolder.style.zIndex = "-1";
n@767	94 this.pageBlank.style.visibility = 'hidden';
n@767	95 this.pageBlank.style.zIndex = "-2";
n@767	96 };
n@767	97
n@767	98 this.init = function()
n@767	99 {
n@767	100 this.popupTitleText.textContent = "Welcome";
n@767	101 var text = document.createElement('span');
n@767	102 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";
n@767	103 var dnd = document.createElement('div');
n@767	104 dnd.style.width = "100%";
n@767	105 dnd.style.height = "50px";
n@767	106 dnd.className = "dragndrop";
n@767	107 dnd.ondragover = function(e) {
n@767	108 e.stopPropagation();
n@767	109 e.preventDefault();
n@767	110 };
n@767	111 dnd.ondragenter = function(e) {
n@767	112 e.stopPropagation();
n@767	113 e.preventDefault();
n@767	114 this.style.backgroundColor = '#AAFFAA';
n@767	115 };
n@767	116 dnd.ondragleave = function(e) {
n@767	117 e.stopPropagation();
n@767	118 e.preventDefault();
n@767	119 this.style.backgroundColor = "#FFFFFF";
n@767	120 };
n@767	121 dnd.ondrop = function(e) {
n@767	122 e.stopPropagation();
n@767	123 e.preventDefault();
n@767	124
n@767	125 var file = e.dataTransfer.files[0];
n@767	126
n@767	127 // Uses HTML5 FileAPI - https://w3c.github.io/FileAPI/#filereader-interface
n@767	128 var reader = new FileReader();
n@767	129 reader.onload = function() {
n@767	130 var parse = new DOMParser();
n@767	131 var xml = parse.parseFromString(reader.result,'text/xml');
n@767	132 specificationNode.decode(xml);
n@767	133 popupInstance.hidePopup();
n@767	134 SpecificationToHTML();
n@767	135 };
n@767	136 reader.readAsText(file);
n@767	137
n@767	138 };
n@767	139 this.popupBody.appendChild(text);
n@767	140 this.popupBody.appendChild(dnd);
n@767	141 this.showPopup();
n@767	142
n@767	143 var button = document.createElement('button');
n@767	144 button.className = "popupButton";
n@767	145 button.textContent = "New File";
n@767	146 button.onclick = function(event) {
n@767	147 popupInstance.advanceState();
n@767	148 };
n@767	149 this.popupFooter.appendChild(button);
n@767	150 };
n@767	151
n@767	152 this.advanceState = function()
n@767	153 {
n@767	154 this.popupBody.innerHTML = null;
n@767	155 this.popupFooter.innerHTML = null;
n@767	156 this.popupTitleText.textContent = null;
n@767	157 switch(this.state)
n@767	158 {
n@767	159 case 0:
n@767	160 this.init();
n@767	161 break;
n@767	162 case 1:
n@767	163 this.popupTitleText.textContent = "Test Type";
n@767	164 var text = document.createElement("span");
n@767	165 text.textContent = "What type of test would you like to use. Currently APE (Audio Perceptual Evaluation) and MUSHRA style interfaces are available";
n@767	166 this.popupBody.appendChild(text);
n@767	167 var select = document.createElement("select");
n@767	168 select.id="interface-select";
n@767	169 var opt1 = document.createElement("option");
n@767	170 opt1.value = "APE";
n@767	171 opt1.textContent = "APE";
n@767	172 select.appendChild(opt1);
n@767	173 var opt2 = document.createElement("option");
n@767	174 opt2.value = "MUSHRA";
n@767	175 opt2.textContent = "MUSHRA";
n@767	176 select.appendChild(opt2);
n@767	177 this.popupBody.appendChild(select);
n@767	178
n@767	179 var button = document.createElement('button');
n@767	180 button.className = "popupButton";
n@767	181 button.textContent = "Submit";
n@767	182 button.onclick = function(event) {
n@767	183 var select = document.getElementById("interface-select");
n@767	184 specificationNode.interfaceType = select.value;
n@767	185 specificationNode.collectMetrics = true;
n@767	186 popupInstance.advanceState();
n@767	187 };
n@767	188 this.popupFooter.appendChild(button);
n@767	189 break;
n@767	190 case 2:
n@767	191 this.popupTitleText.textContent = "Test Options";
n@767	192 var holder = document.createElement('div');
n@767	193 holder.style.margin = "5px";
n@767	194 var checkbox = document.createElement('input');
n@767	195 checkbox.type = 'checkbox';
n@767	196 checkbox.id = "Randomise-Page";
n@767	197 var text = document.createElement('span');
n@767	198 text.textContent = "Randomise Page Order";
n@767	199 holder.appendChild(checkbox);
n@767	200 holder.appendChild(text);
n@767	201 this.popupBody.appendChild(holder);
n@767	202 switch(specificationNode.interfaceType)
n@767	203 {
n@767	204 case "APE":
n@767	205 for (var i=0; i<APEInterfaceOptions[0].length; i++)
n@767	206 {
n@767	207 holder = document.createElement('div');
n@767	208 holder.style.margin = "5px";
n@767	209 checkbox = document.createElement('input');
n@767	210 checkbox.type = 'checkbox';
n@767	211 checkbox.setAttribute("name","option");
n@767	212 checkbox.id = APEInterfaceOptions[0][i];
n@767	213 text = document.createElement('span');
n@767	214 text.textContent = APEInterfaceOptions[1][i];
n@767	215 holder.appendChild(checkbox);
n@767	216 holder.appendChild(text);
n@767	217 this.popupBody.appendChild(holder);
n@767	218 }
n@767	219 for (var i=0; i<APEInterfaceChecks[0].length; i++)
n@767	220 {
n@767	221 holder = document.createElement('div');
n@767	222 holder.style.margin = "5px";
n@767	223 checkbox = document.createElement('input');
n@767	224 checkbox.type = 'checkbox';
n@767	225 checkbox.setAttribute("name","check");
n@767	226 checkbox.id = APEInterfaceChecks[0][i];
n@767	227 text = document.createElement('span');
n@767	228 text.textContent = APEInterfaceChecks[1][i];
n@767	229 holder.appendChild(checkbox);
n@767	230 holder.appendChild(text);
n@767	231 this.popupBody.appendChild(holder);
n@767	232 }
n@767	233 break;
n@767	234 case "MUSHRA":
n@767	235 for (var i=0; i<MUSHRAInterfaceOptions[0].length; i++)
n@767	236 {
n@767	237 holder = document.createElement('div');
n@767	238 holder.style.margin = "5px";
n@767	239 checkbox = document.createElement('input');
n@767	240 checkbox.type = 'checkbox';
n@767	241 checkbox.setAttribute("name","option");
n@767	242 checkbox.id = MUSHRAInterfaceOptions[0][i];
n@767	243 text = document.createElement('span');
n@767	244 text.textContent = MUSHRAInterfaceOptions[1][i];
n@767	245 holder.appendChild(checkbox);
n@767	246 holder.appendChild(text);
n@767	247 this.popupBody.appendChild(holder);
n@767	248 }
n@767	249 for (var i=0; i<MUSHRAInterfaceChecks[0].length; i++)
n@767	250 {
n@767	251 holder = document.createElement('div');
n@767	252 holder.style.margin = "5px";
n@767	253 checkbox = document.createElement('input');
n@767	254 checkbox.type = 'checkbox';
n@767	255 checkbox.setAttribute("name","check");
n@767	256 checkbox.id = MUSHRAInterfaceChecks[0][i];
n@767	257 text = document.createElement('span');
n@767	258 text.textContent = MUSHRAInterfaceChecks[1][i];
n@767	259 holder.appendChild(checkbox);
n@767	260 holder.appendChild(text);
n@767	261 this.popupBody.appendChild(holder);
n@767	262 }
n@767	263 }
n@767	264 var button = document.createElement('button');
n@767	265 button.className = "popupButton";
n@767	266 button.textContent = "Submit";
n@767	267 button.onclick = function(event) {
n@767	268 var optHold = popupInstance.popupBody;
n@767	269 var opt = optHold.firstChild;
n@767	270 var input = opt.getElementsByTagName('input')[0];
n@767	271 specificationNode.randomiseOrder = input.checked;
n@767	272 while(opt.nextSibling != null)
n@767	273 {
n@767	274 opt = opt.nextSibling;
n@767	275 input = opt.getElementsByTagName('input')[0];
n@767	276 if (input.checked)
n@767	277 {
n@767	278 specificationNode.commonInterface.options.push(new specificationNode.commonInterface.optionNode(input));
n@767	279 }
n@767	280
n@767	281 }
n@767	282 popupInstance.advanceState();
n@767	283 };
n@767	284 this.popupFooter.appendChild(button);
n@767	285 break;
n@767	286 case 3:
n@767	287 audioObjects = [];
n@767	288 this.popupTitleText.textContent = "Test Page";
n@767	289 var span = document.createElement('span');
n@767	290 span.textContent = "Drag and drop your audio files into the box below to add them to a test page";
n@767	291 this.popupBody.appendChild(span);
n@767	292 var dnd = document.createElement('div');
n@767	293 dnd.id = "audio-holder-drop";
n@767	294 dnd.style.width = "100%";
n@767	295 dnd.style.minHeight = "50px";
n@767	296 dnd.style.maxHeight = "220px";
n@767	297 dnd.style.overflow = 'auto';
n@767	298 dnd.className = "dragndrop";
n@767	299 dnd.ondragover = function(e) {
n@767	300 if(e.preventDefault) {e.preventDefault();}
n@767	301 return false;
n@767	302 };
n@767	303 dnd.ondragenter = function(e) {
n@767	304 if(e.preventDefault) {e.preventDefault();}
n@767	305 return false;
n@767	306 };
n@767	307 dnd.ondrop = function(e) {
n@767	308 if(e.preventDefault) {e.preventDefault();}
n@767	309 var dt = e.dataTransfer;
n@767	310 var body = document.getElementById("audio-holder-drop");
n@767	311 var files = dt.files;
n@767	312 for (var i = 0, f; f = files[i]; i++)
n@767	313 {
n@767	314 var ao = new audioObject();
n@767	315 ao.constructTrack(f);
n@767	316 audioObjects.push(ao);
n@767	317 var dndHeader = document.createElement('div');
n@767	318 dndHeader.style.width = "100%";
n@767	319 dndHeader.style.height = "20px";
n@767	320 dndHeader.style.borderBottom = "#DDD";
n@767	321 dndHeader.style.borderBottomWidth = "1px";
n@767	322 dndHeader.style.borderBottomStyle = "solid";
n@767	323 dndHeader.setAttribute('aoID',audioObjects.length-1);
n@767	324 var dndHInclude = document.createElement('div');
n@767	325 dndHInclude.style.width = "30px";
n@767	326 dndHInclude.className = "dndheaderelement";
n@767	327 var includeCheck = document.createElement('input');
n@767	328 includeCheck.type = "checkbox";
n@767	329 includeCheck.name = "include-check";
n@767	330 includeCheck.checked = true;
n@767	331 includeCheck.onchange = function()
n@767	332 {
n@767	333 var i = event.currentTarget.parentElement.parentElement.getAttribute('aoID');
n@767	334 audioObjects[i].include = event.currentTarget.checked;
n@767	335 };
n@767	336 dndHInclude.appendChild(includeCheck);
n@767	337 dndHeader.appendChild(dndHInclude);
n@767	338 var dndHTitle = document.createElement('div');
n@767	339 dndHTitle.style.width = "180px";
n@767	340 dndHTitle.className = "dndheaderelement";
n@767	341 var text = document.createElement('span');
n@767	342 text.textContent = f.name;
n@767	343 dndHTitle.appendChild(text);
n@767	344 dndHeader.appendChild(dndHTitle);
n@767	345 var dndHID = document.createElement('div');
n@767	346 dndHID.style.width = "100px";
n@767	347 dndHID.className = "dndheaderelement";
n@767	348 var IDInput = document.createElement('input');
n@767	349 IDInput.name = "audio-fragment-ID";
n@767	350 IDInput.value = f.name.split('.')[0];
n@767	351 IDInput.onchange = function()
n@767	352 {
n@767	353 var allIDInput = document.getElementsByName("audio-fragment-ID");
n@767	354 var isCopy = new Array(allIDInput.length);
n@767	355 isCopy.fill(0,0,this.length);
n@767	356 if (allIDInput.length > 1)
n@767	357 {
n@767	358 for (var j=0; j<allIDInput.length; j++)
n@767	359 {
n@767	360 var textCompare1 = allIDInput[j].value;
n@767	361 for (var k=j+1; k<allIDInput.length; k++)
n@767	362 {
n@767	363 var textCompare2 = allIDInput[k].value;
n@767	364 if (textCompare1 == textCompare2)
n@767	365 {
n@767	366 isCopy[j] = 1;
n@767	367 isCopy[k] = 1;
n@767	368 }
n@767	369 }
n@767	370 }
n@767	371 }
n@767	372 var button = document.getElementById('submit');
n@767	373 button.disabled = false;
n@767	374 for (var j=0; j<allIDInput.length; j++)
n@767	375 {
n@767	376 if (isCopy[j] == 1)
n@767	377 {
n@767	378 allIDInput[j].style.backgroundColor = '#F22';
n@767	379 button.disabled = true;
n@767	380 }
n@767	381 else
n@767	382 {
n@767	383 allIDInput[j].style.backgroundColor = '#FFF';
n@767	384 audioObjects[j].id = allIDInput[j].value;
n@767	385 }
n@767	386 }
n@767	387 };
n@767	388 IDInput.style.width = "96px";
n@767	389 dndHID.appendChild(IDInput);
n@767	390 dndHeader.appendChild(dndHID);
n@767	391 var dndHPlay = document.createElement('div');
n@767	392 dndHPlay.style.width = "100px";
n@767	393 dndHPlay.className = "dndheaderelement";
n@767	394 var audio = document.createElement('button');
n@767	395 audio.textContent = 'Play';
n@767	396 audio.className = "popupButton";
n@767	397 audio.style.height = "inherit";
n@767	398 audio.onclick = function()
n@767	399 {
n@767	400 var i = event.currentTarget.parentElement.parentElement.getAttribute('aoID');
n@767	401 audioObjects[i].play();
n@767	402 };
n@767	403 dndHPlay.appendChild(audio);
n@767	404 dndHeader.appendChild(dndHPlay);
n@767	405 dnd.appendChild(dndHeader);
n@767	406 IDInput.onchange();
n@767	407 }
n@767	408 };
n@767	409 var dndHeader = document.createElement('div');
n@767	410 dndHeader.style.width = "100%";
n@767	411 dndHeader.style.height = "15px";
n@767	412 dndHeader.style.borderBottom = "#DDD";
n@767	413 dndHeader.style.borderBottomWidth = "1px";
n@767	414 dndHeader.style.borderBottomStyle = "solid";
n@767	415 var dndHInclude = document.createElement('div');
n@767	416 dndHInclude.style.width = "30px";
n@767	417 dndHInclude.className = "dndheaderelement";
n@767	418 var text = document.createElement('span');
n@767	419 text.textContent = "Inc.";
n@767	420 dndHInclude.appendChild(text);
n@767	421 dndHeader.appendChild(dndHInclude);
n@767	422 var dndHTitle = document.createElement('div');
n@767	423 dndHTitle.style.width = "180px";
n@767	424 dndHTitle.className = "dndheaderelement";
n@767	425 text = document.createElement('span');
n@767	426 text.textContent = "File Name";
n@767	427 dndHTitle.appendChild(text);
n@767	428 dndHeader.appendChild(dndHTitle);
n@767	429 var dndHID = document.createElement('div');
n@767	430 dndHID.style.width = "100px";
n@767	431 dndHID.className = "dndheaderelement";
n@767	432 text = document.createElement('span');
n@767	433 text.textContent = "ID";
n@767	434 dndHID.appendChild(text);
n@767	435 dndHeader.appendChild(dndHID);
n@767	436 var dndHPlay = document.createElement('div');
n@767	437 dndHPlay.style.width = "100px";
n@767	438 dndHPlay.className = "dndheaderelement";
n@767	439 text = document.createElement('span');
n@767	440 text.textContent = "Sample";
n@767	441 dndHPlay.appendChild(text);
n@767	442 dndHeader.appendChild(dndHPlay);
n@767	443 dnd.appendChild(dndHeader);
n@767	444 this.popupBody.appendChild(dnd);
n@767	445 var button = document.createElement('button');
n@767	446 button.id = 'submit';
n@767	447 button.className = "popupButton";
n@767	448 button.textContent = "Submit";
n@767	449 button.onclick = function(event)
n@767	450 {
n@767	451 // Construct the audio-holder nodes;
n@767	452 for (var i=0; i<audioObjects.length; i++)
n@767	453 {
n@767	454 if (!audioObjects[i].include)
n@767	455 {
n@767	456 audioObjects.pop(audioObjects[i]);
n@767	457 }
n@767	458 }
n@767	459 if (audioObjects.length != 0)
n@767	460 {
n@767	461 popupInstance.advanceState();
n@767	462 }
n@767	463 };
n@767	464 this.popupFooter.appendChild(button);
n@767	465 break;
n@767	466 case 4:
n@767	467 this.popupTitleText.textContent = "Test Page - Options";
n@767	468 var span = document.createElement('span');
n@767	469 span.textContent = "Set your test page options here";
n@767	470 this.popupBody.appendChild(span);
n@767	471 var pair = document.createElement('div');
n@767	472 pair.style.margin = '5px';
n@767	473 var text = document.createElement('span');
n@767	474 text.textContent = "Page ID:";
n@767	475 var input = document.createElement('input');
n@767	476 input.value = specificationNode.audioHolders.length;
n@767	477 input.id = "id";
n@767	478 pair.appendChild(text);
n@767	479 pair.appendChild(input);
n@767	480 this.popupBody.appendChild(pair);
n@767	481 pair = document.createElement('div');
n@767	482 pair.style.margin = '5px';
n@767	483 text = document.createElement('span');
n@767	484 text.textContent = "Randomise Fragment Order";
n@767	485 input = document.createElement('input');
n@767	486 input.type = "checkbox";
n@767	487 input.id = "randomiseOrder";
n@767	488 pair.appendChild(input);
n@767	489 pair.appendChild(text);
n@767	490 this.popupBody.appendChild(pair);
n@767	491 pair = document.createElement('div');
n@767	492 pair.style.margin = '5px';
n@767	493 text = document.createElement('span');
n@767	494 text.textContent = "Loop Fragment Playback";
n@767	495 input = document.createElement('input');
n@767	496 input.type = "checkbox";
n@767	497 input.id = "loop";
n@767	498 pair.appendChild(input);
n@767	499 pair.appendChild(text);
n@767	500 this.popupBody.appendChild(pair);
n@767	501 pair = document.createElement('div');
n@767	502 pair.style.margin = '5px';
n@767	503 text = document.createElement('span');
n@767	504 text.textContent = "Show fragment comment boxes";
n@767	505 input = document.createElement('input');
n@767	506 input.type = "checkbox";
n@767	507 input.id = "elementComments";
n@767	508 pair.appendChild(input);
n@767	509 pair.appendChild(text);
n@767	510 this.popupBody.appendChild(pair);
n@767	511 var button = document.createElement('button');
n@767	512 button.id = 'submit';
n@767	513 button.className = "popupButton";
n@767	514 button.textContent = "Next";
n@767	515 button.onclick = function(event)
n@767	516 {
n@767	517 var ah = new specificationNode.audioHolderNode(specificationNode);
n@767	518 ah.id = document.getElementById('id').value;
n@767	519 ah.presentedId = specificationNode.audioHolders.length;
n@767	520 ah.hostURL = ah.id+'/';
n@767	521 ah.randomiseOrder = document.getElementById('randomiseOrder').checked;
n@767	522 ah.loop = document.getElementById('loop').checked;
n@767	523 ah.elementComments = document.getElementById('elementComments').checked;
n@767	524 for (var i=0; i<audioObjects.length; i++)
n@767	525 {
n@767	526 ah.audioElements.push(new ah.audioElementNode(ah,audioObjects[i]));
n@767	527 }
n@767	528 specificationNode.audioHolders.push(ah);
n@767	529 popupInstance.advanceState();
n@767	530 };
n@767	531 this.popupFooter.appendChild(button);
n@767	532 break;
n@767	533 case 5:
n@767	534 this.dataTransfer = null;
n@767	535 this.popupTitleText.textContent = "Test Page - Pre/Post Survey";
n@767	536 var span = document.createElement('span');
n@767	537 span.textContent = "Add your pre test page options here";
n@767	538 this.popupBody.appendChild(span);
n@767	539 var preHolder = document.createElement('div');
n@767	540 preHolder.id = "preHolder";
n@767	541 preHolder.style.width = "460px";
n@767	542 preHolder.style.minHeight = "100px";
n@767	543 preHolder.style.maxHeight = "220px";
n@767	544 preHolder.style.overflow = 'auto';
n@767	545 preHolder.style.border = "black";
n@767	546 preHolder.style.borderStyle = "solid";
n@767	547 preHolder.style.borderWidth = "1px";
n@767	548 this.popupBody.appendChild(preHolder);
n@767	549 var audioHolder = specificationNode.audioHolders[specificationNode.audioHolders.length-1];
n@767	550 var preHeaderHolder = document.createElement('div');
n@767	551 preHeaderHolder.style.width = "456px";
n@767	552 preHeaderHolder.style.height= "20px";
n@767	553 preHeaderHolder.style.margin= "2px";
n@767	554 preHeaderHolder.style.borderBottom = "#DDD";
n@767	555 preHeaderHolder.style.borderBottomWidth = "1px";
n@767	556 preHeaderHolder.style.borderBottomStyle = "solid";
n@767	557 var mvH = document.createElement('div');
n@767	558 mvH.className = "dndheaderelement";
n@767	559 mvH.style.width = "50px";
n@767	560 var text = document.createElement('span');
n@767	561 text.textContent = "Order";
n@767	562 mvH.appendChild(text);
n@767	563 preHeaderHolder.appendChild(mvH);
n@767	564 var idH = document.createElement('div');
n@767	565 idH.className = "dndheaderelement";
n@767	566 idH.style.width = "150px";
n@767	567 text = document.createElement('span');
n@767	568 text.textContent = "ID";
n@767	569 idH.appendChild(text);
n@767	570 preHeaderHolder.appendChild(idH);
n@767	571 var tH = document.createElement('div');
n@767	572 tH.className = "dndheaderelement";
n@767	573 tH.style.width = "150px";
n@767	574 text = document.createElement('span');
n@767	575 text.textContent = "Type";
n@767	576 tH.appendChild(text);
n@767	577 preHeaderHolder.appendChild(tH);
n@767	578 var editH = document.createElement('div');
n@767	579 editH.className = "dndheaderelement";
n@767	580 editH.style.width = "50px";
n@767	581 text = document.createElement('span');
n@767	582 text.textContent = "Edit";
n@767	583 editH.appendChild(text);
n@767	584 preHeaderHolder.appendChild(editH);
n@767	585 var deleteH = document.createElement('div');
n@767	586 deleteH.className = "dndheaderelement";
n@767	587 deleteH.style.width = "50px";
n@767	588 text = document.createElement('span');
n@767	589 text.textContent = "Delete";
n@767	590 deleteH.appendChild(text);
n@767	591 preHeaderHolder.appendChild(deleteH);
n@767	592 preHolder.appendChild(preHeaderHolder);
n@767	593
n@767	594
n@767	595 for (var i=0; i<audioHolder.preTest.options.length; i++)
n@767	596 {
n@767	597 var optionNode = audioHolder.preTest.options[i];
n@767	598 var entry = document.createElement('div');
n@767	599 entry.style.width = "456px";
n@767	600 entry.style.height= "20px";
n@767	601 entry.style.margin= "2px";
n@767	602 entry.style.borderBottom = "#DDD";
n@767	603 entry.style.borderBottomWidth = "1px";
n@767	604 entry.style.borderBottomStyle = "solid";
n@767	605 entry.setAttribute("node-id",i);
n@767	606 var node = audioHolder.preTest.options[i];
n@767	607 var mvH = document.createElement('div');
n@767	608 mvH.className = "dndheaderelement";
n@767	609 mvH.style.width = "50px";
n@767	610 var mvup = document.createElement("button");
n@767	611 mvup.textContent = "Up";
n@767	612 mvup.style.width = "25px";
n@767	613 mvup.style.padding = "1px 0px";
n@767	614 mvup.onclick = function()
n@767	615 {
n@767	616 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	617 if (i != 0)
n@767	618 {
n@767	619 var next = audioHolder.preTest.options[i-1];
n@767	620 var cur = audioHolder.preTest.options[i];
n@767	621 audioHolder.preTest.options[i-1] = cur;
n@767	622 audioHolder.preTest.options[i] = next;
n@767	623 popupInstance.state = 5;
n@767	624 popupInstance.advanceState();
n@767	625 }
n@767	626 };
n@767	627 mvH.appendChild(mvup);
n@767	628 var mvdn = document.createElement("button");
n@767	629 mvdn.textContent = "Dn";
n@767	630 mvdn.style.width = "25px";
n@767	631 mvdn.style.padding = "1px 0px";
n@767	632 mvdn.onclick = function()
n@767	633 {
n@767	634 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	635 if (i != audioHolder.preTest.options.length-1)
n@767	636 {
n@767	637 var next = audioHolder.preTest.options[i+1];
n@767	638 var cur = audioHolder.preTest.options[i];
n@767	639 audioHolder.preTest.options[i+1] = cur;
n@767	640 audioHolder.preTest.options[i] = next;
n@767	641 popupInstance.state = 5;
n@767	642 popupInstance.advanceState();
n@767	643 }
n@767	644 };
n@767	645 mvH.appendChild(mvdn);
n@767	646 entry.appendChild(mvH);
n@767	647 var idH = document.createElement('div');
n@767	648 idH.className = "dndheaderelement";
n@767	649 idH.style.width = "150px";
n@767	650 if (optionNode.type != "statement")
n@767	651 {
n@767	652 var span = document.createElement('span');
n@767	653 span.textContent = optionNode.id;
n@767	654 idH.appendChild(span);
n@767	655 }
n@767	656 entry.appendChild(idH);
n@767	657 var typeH = document.createElement('div');
n@767	658 typeH.className = "dndheaderelement";
n@767	659 typeH.style.width = "150px";
n@767	660 var span = document.createElement('span');
n@767	661 span.textContent = optionNode.type;
n@767	662 typeH.appendChild(span);
n@767	663 entry.appendChild(typeH);
n@767	664 var editH = document.createElement('div');
n@767	665 editH.className = "dndheaderelement";
n@767	666 editH.style.width = "50px";
n@767	667 var editButton = document.createElement("button");
n@767	668 editButton.textContent = "Edit";
n@767	669 editButton.style.width = "48px";
n@767	670 editButton.style.padding = "1px 0px";
n@767	671 editButton.onclick = function()
n@767	672 {
n@767	673 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	674 popupInstance.dataTransfer = new function() {
n@767	675 this.title = "Edit Test Node";
n@767	676 this.parent = specificationNode.audioHolders[specificationNode.audioHolders.length-1].preTest;
n@767	677 this.node = this.parent.options[i];
n@767	678 this.previousState = 5;
n@767	679 };
n@767	680 popupInstance.advanceState();
n@767	681 };
n@767	682 editH.appendChild(editButton);
n@767	683 entry.appendChild(editH);
n@767	684 var deleteH = document.createElement('div');
n@767	685 deleteH.className = "dndheaderelement";
n@767	686 deleteH.style.width = "50px";
n@767	687 var deleteButton = document.createElement("button");
n@767	688 deleteButton.textContent = "Del";
n@767	689 deleteButton.style.width = "48px";
n@767	690 deleteButton.style.padding = "1px 0px";
n@767	691 deleteButton.onclick = function()
n@767	692 {
n@767	693 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	694 var j = i+1;
n@767	695 while(j < audioHolder.preTest.options.length)
n@767	696 {
n@767	697 audioHolder.preTest.options[i] = audioHolder.preTest.options[j];
n@767	698 j++;
n@767	699 i++;
n@767	700 }
n@767	701 audioHolder.preTest.options.pop();
n@767	702 popupInstance.state = 5;
n@767	703 popupInstance.advanceState();
n@767	704 };
n@767	705 deleteH.appendChild(deleteButton);
n@767	706 entry.appendChild(deleteH);
n@767	707 preHolder.appendChild(entry);
n@767	708 }
n@767	709 var entry = document.createElement('div');
n@767	710 entry.style.width = "456px";
n@767	711 entry.style.height= "20px";
n@767	712 entry.style.margin= "2px";
n@767	713 entry.style.borderBottom = "#DDD";
n@767	714 entry.style.borderBottomWidth = "1px";
n@767	715 entry.style.borderBottomStyle = "solid";
n@767	716 entry.align = "center";
n@767	717 var addPre = document.createElement('button');
n@767	718 addPre.className = "popupButton";
n@767	719 addPre.textContent = "Add New Entry";
n@767	720 addPre.style.height = "20px";
n@767	721 addPre.onclick = function()
n@767	722 {
n@767	723 popupInstance.dataTransfer = new function() {
n@767	724 this.title = "New Pre Test Node";
n@767	725 this.parent = specificationNode.audioHolders[specificationNode.audioHolders.length-1].preTest;
n@767	726 this.node = null;
n@767	727 this.previousState = 5;
n@767	728 };
n@767	729 popupInstance.advanceState();
n@767	730 };
n@767	731 entry.appendChild(addPre);
n@767	732 preHolder.appendChild(entry);
n@767	733
n@767	734 var span = document.createElement('span');
n@767	735 span.textContent = "Add your post test page options here";
n@767	736 this.popupBody.appendChild(span);
n@767	737 var postHolder = document.createElement('div');
n@767	738 postHolder.id = "preHolder";
n@767	739 postHolder.style.width = "100%";
n@767	740 postHolder.style.minHeight = "100px";
n@767	741 postHolder.style.maxHeight = "220px";
n@767	742 postHolder.style.overflow = 'auto';
n@767	743 postHolder.style.border = "black";
n@767	744 postHolder.style.borderStyle = "solid";
n@767	745 postHolder.style.borderWidth = "1px";
n@767	746 this.popupBody.appendChild(postHolder);
n@767	747 var postHeaderHolder = document.createElement('div');
n@767	748 postHeaderHolder.style.width = "456px";
n@767	749 postHeaderHolder.style.height= "20px";
n@767	750 postHeaderHolder.style.margin= "2px";
n@767	751 postHeaderHolder.style.borderBottom = "#DDD";
n@767	752 postHeaderHolder.style.borderBottomWidth = "1px";
n@767	753 postHeaderHolder.style.borderBottomStyle = "solid";
n@767	754 var mvH = document.createElement('div');
n@767	755 mvH.className = "dndheaderelement";
n@767	756 mvH.style.width = "50px";
n@767	757 var text = document.createElement('span');
n@767	758 text.textContent = "Order";
n@767	759 mvH.appendChild(text);
n@767	760 postHeaderHolder.appendChild(mvH);
n@767	761 var idH = document.createElement('div');
n@767	762 idH.className = "dndheaderelement";
n@767	763 idH.style.width = "150px";
n@767	764 text = document.createElement('span');
n@767	765 text.textContent = "ID";
n@767	766 idH.appendChild(text);
n@767	767 postHeaderHolder.appendChild(idH);
n@767	768 var tH = document.createElement('div');
n@767	769 tH.className = "dndheaderelement";
n@767	770 tH.style.width = "150px";
n@767	771 text = document.createElement('span');
n@767	772 text.textContent = "Type";
n@767	773 tH.appendChild(text);
n@767	774 postHeaderHolder.appendChild(tH);
n@767	775 var editH = document.createElement('div');
n@767	776 editH.className = "dndheaderelement";
n@767	777 editH.style.width = "50px";
n@767	778 text = document.createElement('span');
n@767	779 text.textContent = "Edit";
n@767	780 editH.appendChild(text);
n@767	781 postHeaderHolder.appendChild(editH);
n@767	782 var deleteH = document.createElement('div');
n@767	783 deleteH.className = "dndheaderelement";
n@767	784 deleteH.style.width = "50px";
n@767	785 text = document.createElement('span');
n@767	786 text.textContent = "Delete";
n@767	787 deleteH.appendChild(text);
n@767	788 postHeaderHolder.appendChild(deleteH);
n@767	789 postHolder.appendChild(postHeaderHolder);
n@767	790
n@767	791 for (var i=0; i<audioHolder.postTest.options.length; i++)
n@767	792 {
n@767	793 var optionNode = audioHolder.postTest.options[i];
n@767	794 var entry = document.createElement('div');
n@767	795 entry.style.width = "456px";
n@767	796 entry.style.height= "20px";
n@767	797 entry.style.margin= "2px";
n@767	798 entry.style.borderBottom = "#DDD";
n@767	799 entry.style.borderBottomWidth = "1px";
n@767	800 entry.style.borderBottomStyle = "solid";
n@767	801 entry.setAttribute("node-id",i);
n@767	802 var node = audioHolder.postTest.options[i];
n@767	803 var mvH = document.createElement('div');
n@767	804 mvH.className = "dndheaderelement";
n@767	805 mvH.style.width = "50px";
n@767	806 var mvup = document.createElement("button");
n@767	807 mvup.textContent = "Up";
n@767	808 mvup.style.width = "25px";
n@767	809 mvup.style.padding = "1px 0px";
n@767	810 mvup.onclick = function()
n@767	811 {
n@767	812 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	813 if (i != 0)
n@767	814 {
n@767	815 var next = audioHolder.postTest.options[i-1];
n@767	816 var cur = audioHolder.postTest.options[i];
n@767	817 audioHolder.postTest.options[i-1] = cur;
n@767	818 audioHolder.postTest.options[i] = next;
n@767	819 popupInstance.state = 5;
n@767	820 popupInstance.advanceState();
n@767	821 }
n@767	822 };
n@767	823 mvH.appendChild(mvup);
n@767	824 var mvdn = document.createElement("button");
n@767	825 mvdn.textContent = "Dn";
n@767	826 mvdn.style.width = "25px";
n@767	827 mvdn.style.padding = "1px 0px";
n@767	828 mvdn.onclick = function()
n@767	829 {
n@767	830 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	831 if (i != audioHolder.postTest.options.length-1)
n@767	832 {
n@767	833 var next = audioHolder.postTest.options[i+1];
n@767	834 var cur = audioHolder.postTest.options[i];
n@767	835 audioHolder.postTest.options[i+1] = cur;
n@767	836 audioHolder.postTest.options[i] = next;
n@767	837 popupInstance.state = 5;
n@767	838 popupInstance.advanceState();
n@767	839 }
n@767	840 };
n@767	841 mvH.appendChild(mvdn);
n@767	842 entry.appendChild(mvH);
n@767	843 var idH = document.createElement('div');
n@767	844 idH.className = "dndheaderelement";
n@767	845 idH.style.width = "150px";
n@767	846 if (optionNode.type != "statement")
n@767	847 {
n@767	848 var span = document.createElement('span');
n@767	849 span.textContent = optionNode.id;
n@767	850 idH.appendChild(span);
n@767	851 }
n@767	852 entry.appendChild(idH);
n@767	853 var typeH = document.createElement('div');
n@767	854 typeH.className = "dndheaderelement";
n@767	855 typeH.style.width = "150px";
n@767	856 var span = document.createElement('span');
n@767	857 span.textContent = optionNode.type;
n@767	858 typeH.appendChild(span);
n@767	859 entry.appendChild(typeH);
n@767	860 var editH = document.createElement('div');
n@767	861 editH.className = "dndheaderelement";
n@767	862 editH.style.width = "50px";
n@767	863 var editButton = document.createElement("button");
n@767	864 editButton.textContent = "Edit";
n@767	865 editButton.style.width = "48px";
n@767	866 editButton.style.padding = "1px 0px";
n@767	867 editButton.onclick = function()
n@767	868 {
n@767	869 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	870 popupInstance.dataTransfer = new function() {
n@767	871 this.title = "Edit Test Node";
n@767	872 this.parent = specificationNode.audioHolders[specificationNode.audioHolders.length-1].postTest;
n@767	873 this.node = this.parent.options[i];
n@767	874 this.previousState = 5;
n@767	875 };
n@767	876 popupInstance.advanceState();
n@767	877 };
n@767	878 editH.appendChild(editButton);
n@767	879 entry.appendChild(editH);
n@767	880 var deleteH = document.createElement('div');
n@767	881 deleteH.className = "dndheaderelement";
n@767	882 deleteH.style.width = "50px";
n@767	883 var deleteButton = document.createElement("button");
n@767	884 deleteButton.textContent = "Del";
n@767	885 deleteButton.style.width = "48px";
n@767	886 deleteButton.style.padding = "1px 0px";
n@767	887 deleteButton.onclick = function()
n@767	888 {
n@767	889 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	890 var j = i+1;
n@767	891 while(j < audioHolder.postTest.options.length)
n@767	892 {
n@767	893 audioHolder.postTest.options[i] = audioHolder.postTest.options[j];
n@767	894 j++;
n@767	895 i++;
n@767	896 }
n@767	897 audioHolder.postTest.options.pop();
n@767	898 popupInstance.state = 5;
n@767	899 popupInstance.advanceState();
n@767	900 };
n@767	901 deleteH.appendChild(deleteButton);
n@767	902 entry.appendChild(deleteH);
n@767	903 postHolder.appendChild(entry);
n@767	904 }
n@767	905
n@767	906 var entry = document.createElement('div');
n@767	907 entry.style.width = "456px";
n@767	908 entry.style.height= "20px";
n@767	909 entry.style.margin= "2px";
n@767	910 entry.style.borderBottom = "#DDD";
n@767	911 entry.style.borderBottomWidth = "1px";
n@767	912 entry.style.borderBottomStyle = "solid";
n@767	913 entry.align = "center";
n@767	914 var addPost = document.createElement('button');
n@767	915 addPost.className = "popupButton";
n@767	916 addPost.textContent = "Add New Entry";
n@767	917 addPost.style.height = "20px";
n@767	918 addPost.onclick = function()
n@767	919 {
n@767	920 popupInstance.dataTransfer = new function() {
n@767	921 this.title = "New Pre Test Node";
n@767	922 this.parent = specificationNode.audioHolders[specificationNode.audioHolders.length-1].postTest;
n@767	923 this.node = null;
n@767	924 this.previousState = 5;
n@767	925 };
n@767	926 popupInstance.advanceState();
n@767	927 };
n@767	928 entry.appendChild(addPost);
n@767	929 postHolder.appendChild(entry);
n@767	930
n@767	931 var button = document.createElement('button');
n@767	932 button.id = 'submit';
n@767	933 button.className = "popupButton";
n@767	934 button.textContent = "Finish";
n@767	935 button.onclick = function(event)
n@767	936 {
n@767	937 popupInstance.state = 7;
n@767	938 popupInstance.advanceState();
n@767	939 };
n@767	940 this.popupFooter.appendChild(button);
n@767	941 button = document.createElement('button');
n@767	942 button.id = 'submit';
n@767	943 button.className = "popupButton";
n@767	944 button.textContent = "Add Another Page";
n@767	945 button.onclick = function(event)
n@767	946 {
n@767	947 popupInstance.state = 3;
n@767	948 popupInstance.advanceState();
n@767	949 };
n@767	950 this.popupFooter.appendChild(button);
n@767	951 break;
n@767	952 case 6:
n@767	953 this.popupTitleText.textContent = this.dataTransfer.title;
n@767	954 var span = document.createElement('span');
n@767	955 span.textContent = "Select survey settings here";
n@767	956 this.popupBody.appendChild(span);
n@767	957 var div = document.createElement('div');
n@767	958 span = document.createElement("span");
n@767	959 span.textContent = "Survey Type";
n@767	960 var select = document.createElement("select");
n@767	961 select.id="survey-select";
n@767	962 var option = document.createElement('option');
n@767	963 option.textContent = "Statement";
n@767	964 option.value = "statement";
n@767	965 select.appendChild(option);
n@767	966 option = document.createElement('option');
n@767	967 option.textContent = "Question";
n@767	968 option.value = "question";
n@767	969 select.appendChild(option);
n@767	970 option = document.createElement('option');
n@767	971 option.textContent = "Number";
n@767	972 option.value = "number";
n@767	973 select.appendChild(option);
n@767	974 option = document.createElement('option');
n@767	975 option.textContent = "Radio";
n@767	976 option.value = "radio";
n@767	977 select.appendChild(option);
n@767	978 option = document.createElement('option');
n@767	979 option.textContent = "Checkbox";
n@767	980 option.value = "checkbox";
n@767	981 select.appendChild(option);
n@767	982 this.popupBody.appendChild(select);
n@767	983 var options = document.createElement('div');
n@767	984 options.id = "survey-options";
n@767	985 this.popupBody.appendChild(options);
n@767	986 var button = document.createElement('button');
n@767	987 button.id = 'submit';
n@767	988 button.className = "popupButton";
n@767	989 button.textContent = "Add";
n@767	990 button.onclick = function(event)
n@767	991 {
n@767	992 var parent = popupInstance.dataTransfer.parent;
n@767	993 if (popupInstance.dataTransfer.node == null)
n@767	994 {
n@767	995 var node = new parent.OptionNode();
n@767	996 } else
n@767	997 {
n@767	998 var node = popupInstance.dataTransfer.node;
n@767	999 }
n@767	1000 node.type = document.getElementById("survey-select").value;
n@767	1001 switch(node.type)
n@767	1002 {
n@767	1003 case "statement":
n@767	1004 node.statement = document.getElementById("statement").value;
n@767	1005 break;
n@767	1006 case "question":
n@767	1007 node.question = document.getElementById("question").value;
n@767	1008 node.id = document.getElementById("ID").value;
n@767	1009 node.mandatory = document.getElementById("mandatory").checked;
n@767	1010 node.boxsize = document.getElementById("boxsize").value;
n@767	1011 break;
n@767	1012 }
n@767	1013 if (popupInstance.dataTransfer.node == null)
n@767	1014 {parent.options.push(node);}
n@767	1015 popupInstance.state = popupInstance.dataTransfer.previousState;
n@767	1016 popupInstance.advanceState();
n@767	1017 };
n@767	1018 this.popupFooter.appendChild(button);
n@767	1019 select.onchange = function()
n@767	1020 {
n@767	1021 var options = document.getElementById("survey-options");
n@767	1022 options.innerHTML = null;
n@767	1023 switch(this.value)
n@767	1024 {
n@767	1025 case "statement":
n@767	1026 var span = document.createElement('span');
n@767	1027 span.textContent = "Enter Statement";
n@767	1028 var tA = document.createElement('textarea');
n@767	1029 tA.id = "statement";
n@767	1030 tA.style.width = "460px";
n@767	1031 tA.style.height = "96px";
n@767	1032 if (popupInstance.dataTransfer.node != null)
n@767	1033 {tA.value = this.dataTransfer.node.statement;}
n@767	1034 options.appendChild(span);
n@767	1035 options.appendChild(tA);
n@767	1036 break;
n@767	1037 case "question":
n@767	1038 var span = document.createElement('span');
n@767	1039 span.textContent = "Enter Question";
n@767	1040 var tA = document.createElement('textarea');
n@767	1041 tA.style.width = "460px";
n@767	1042 tA.style.height = "54px";
n@767	1043 tA.id = "question";
n@767	1044 options.appendChild(span);
n@767	1045 options.appendChild(tA);
n@767	1046 var div = document.createElement('div');
n@767	1047 var input = document.createElement('input');
n@767	1048 input.id = "ID";
n@767	1049 span = document.createElement('span');
n@767	1050 span.textContent = "ID:";
n@767	1051 div.appendChild(span);
n@767	1052 div.appendChild(input);
n@767	1053 options.appendChild(div);
n@767	1054 div = document.createElement('div');
n@767	1055 input = document.createElement('input');
n@767	1056 input.type = "checkbox";
n@767	1057 input.id = "mandatory";
n@767	1058 span = document.createElement('span');
n@767	1059 span.textContent = "Mandatory";
n@767	1060 div.appendChild(span);
n@767	1061 div.appendChild(input);
n@767	1062 options.appendChild(div);
n@767	1063 div = document.createElement('div');
n@767	1064 var boxsize = document.createElement("select");
n@767	1065 boxsize.id = "boxsize";
n@767	1066 var selOpt = document.createElement("option");
n@767	1067 selOpt.value = "normal";
n@767	1068 selOpt.textContent = "Normal";
n@767	1069 boxsize.appendChild(selOpt);
n@767	1070 selOpt = document.createElement("option");
n@767	1071 selOpt.value = "small";
n@767	1072 selOpt.textContent = "Small";
n@767	1073 boxsize.appendChild(selOpt);
n@767	1074 selOpt = document.createElement("option");
n@767	1075 selOpt.value = "large";
n@767	1076 selOpt.textContent = "Large";
n@767	1077 boxsize.appendChild(selOpt);
n@767	1078 selOpt = document.createElement("option");
n@767	1079 selOpt.value = "huge";
n@767	1080 selOpt.textContent = "Huge";
n@767	1081 boxsize.appendChild(selOpt);
n@767	1082 span = document.createElement('span');
n@767	1083 span.textContent = "Response Text Area";
n@767	1084 div.appendChild(span);
n@767	1085 div.appendChild(boxsize);
n@767	1086 options.appendChild(div);
n@767	1087 if (popupInstance.dataTransfer.node != null)
n@767	1088 {
n@767	1089 tA.value = popupInstance.dataTransfer.node.question;
n@767	1090 document.getElementById("ID").value = popupInstance.dataTransfer.node.id;
n@767	1091 document.getElementById("mandatory").value = popupInstance.dataTransfer.node.mandatory;
n@767	1092 document.getElementById("boxsize").value = popupInstance.dataTransfer.node.boxsize;
n@767	1093 }
n@767	1094 break;
n@767	1095 case "number":
n@767	1096 var span = document.createElement('span');
n@767	1097 span.textContent = "Enter Question";
n@767	1098 var tA = document.createElement('textarea');
n@767	1099 tA.style.width = "460px";
n@767	1100 tA.style.height = "54px";
n@767	1101 tA.id = "question";
n@767	1102 options.appendChild(span);
n@767	1103 options.appendChild(tA);
n@767	1104 var div = document.createElement('div');
n@767	1105 var input = document.createElement('input');
n@767	1106 input.id = "ID";
n@767	1107 span = document.createElement('span');
n@767	1108 span.textContent = "ID:";
n@767	1109 div.appendChild(span);
n@767	1110 div.appendChild(input);
n@767	1111 options.appendChild(div);
n@767	1112 div = document.createElement('div');
n@767	1113 input = document.createElement('input');
n@767	1114 input.type = "checkbox";
n@767	1115 input.id = "mandatory";
n@767	1116 span = document.createElement('span');
n@767	1117 span.textContent = "Mandatory";
n@767	1118 div.appendChild(span);
n@767	1119 div.appendChild(input);
n@767	1120 options.appendChild(div);
n@767	1121 div = document.createElement('div');
n@767	1122 break;
n@767	1123 }
n@767	1124 };
n@767	1125 if (this.dataTransfer.node != null)
n@767	1126 {
n@767	1127 select.value = this.dataTransfer.node.type;
n@767	1128 }
n@767	1129 select.onchange();
n@767	1130 break;
n@767	1131 case 7:
n@767	1132 this.dataTransfer = null;
n@767	1133 this.popupTitleText.textContent = "Test Session - Pre/Post Survey";
n@767	1134 var span = document.createElement('span');
n@767	1135 span.textContent = "Add your pre test session and post test session survey options here";
n@767	1136 this.popupBody.appendChild(span);
n@767	1137 var preHolder = document.createElement('div');
n@767	1138 preHolder.id = "preHolder";
n@767	1139 preHolder.style.width = "460px";
n@767	1140 preHolder.style.minHeight = "100px";
n@767	1141 preHolder.style.maxHeight = "220px";
n@767	1142 preHolder.style.overflow = 'auto';
n@767	1143 preHolder.style.border = "black";
n@767	1144 preHolder.style.borderStyle = "solid";
n@767	1145 preHolder.style.borderWidth = "1px";
n@767	1146 this.popupBody.appendChild(preHolder);
n@767	1147 var preHeaderHolder = document.createElement('div');
n@767	1148 preHeaderHolder.style.width = "456px";
n@767	1149 preHeaderHolder.style.height= "20px";
n@767	1150 preHeaderHolder.style.margin= "2px";
n@767	1151 preHeaderHolder.style.borderBottom = "#DDD";
n@767	1152 preHeaderHolder.style.borderBottomWidth = "1px";
n@767	1153 preHeaderHolder.style.borderBottomStyle = "solid";
n@767	1154 var mvH = document.createElement('div');
n@767	1155 mvH.className = "dndheaderelement";
n@767	1156 mvH.style.width = "50px";
n@767	1157 var text = document.createElement('span');
n@767	1158 text.textContent = "Order";
n@767	1159 mvH.appendChild(text);
n@767	1160 preHeaderHolder.appendChild(mvH);
n@767	1161 var idH = document.createElement('div');
n@767	1162 idH.className = "dndheaderelement";
n@767	1163 idH.style.width = "150px";
n@767	1164 text = document.createElement('span');
n@767	1165 text.textContent = "ID";
n@767	1166 idH.appendChild(text);
n@767	1167 preHeaderHolder.appendChild(idH);
n@767	1168 var tH = document.createElement('div');
n@767	1169 tH.className = "dndheaderelement";
n@767	1170 tH.style.width = "150px";
n@767	1171 text = document.createElement('span');
n@767	1172 text.textContent = "Type";
n@767	1173 tH.appendChild(text);
n@767	1174 preHeaderHolder.appendChild(tH);
n@767	1175 var editH = document.createElement('div');
n@767	1176 editH.className = "dndheaderelement";
n@767	1177 editH.style.width = "50px";
n@767	1178 text = document.createElement('span');
n@767	1179 text.textContent = "Edit";
n@767	1180 editH.appendChild(text);
n@767	1181 preHeaderHolder.appendChild(editH);
n@767	1182 var deleteH = document.createElement('div');
n@767	1183 deleteH.className = "dndheaderelement";
n@767	1184 deleteH.style.width = "50px";
n@767	1185 text = document.createElement('span');
n@767	1186 text.textContent = "Delete";
n@767	1187 deleteH.appendChild(text);
n@767	1188 preHeaderHolder.appendChild(deleteH);
n@767	1189 preHolder.appendChild(preHeaderHolder);
n@767	1190
n@767	1191
n@767	1192 for (var i=0; i<specificationNode.preTest.options.length; i++)
n@767	1193 {
n@767	1194 var optionNode = specificationNode.preTest.options[i];
n@767	1195 var entry = document.createElement('div');
n@767	1196 entry.style.width = "456px";
n@767	1197 entry.style.height= "20px";
n@767	1198 entry.style.margin= "2px";
n@767	1199 entry.style.borderBottom = "#DDD";
n@767	1200 entry.style.borderBottomWidth = "1px";
n@767	1201 entry.style.borderBottomStyle = "solid";
n@767	1202 entry.setAttribute("node-id",i);
n@767	1203 var node = specificationNode.preTest.options[i];
n@767	1204 var mvH = document.createElement('div');
n@767	1205 mvH.className = "dndheaderelement";
n@767	1206 mvH.style.width = "50px";
n@767	1207 var mvup = document.createElement("button");
n@767	1208 mvup.textContent = "Up";
n@767	1209 mvup.style.width = "25px";
n@767	1210 mvup.style.padding = "1px 0px";
n@767	1211 mvup.onclick = function()
n@767	1212 {
n@767	1213 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	1214 if (i != 0)
n@767	1215 {
n@767	1216 var next = specificationNode.preTest.options[i-1];
n@767	1217 var cur = specificationNode.preTest.options[i];
n@767	1218 specificationNode.preTest.options[i-1] = cur;
n@767	1219 specificationNode.preTest.options[i] = next;
n@767	1220 popupInstance.state = 7;
n@767	1221 popupInstance.advanceState();
n@767	1222 }
n@767	1223 };
n@767	1224 mvH.appendChild(mvup);
n@767	1225 var mvdn = document.createElement("button");
n@767	1226 mvdn.textContent = "Dn";
n@767	1227 mvdn.style.width = "25px";
n@767	1228 mvdn.style.padding = "1px 0px";
n@767	1229 mvdn.onclick = function()
n@767	1230 {
n@767	1231 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	1232 if (i != specificationNode.preTest.options.length-1)
n@767	1233 {
n@767	1234 var next = specificationNode.preTest.options[i+1];
n@767	1235 var cur = specificationNode.preTest.options[i];
n@767	1236 specificationNode.preTest.options[i+1] = cur;
n@767	1237 specificationNode.preTest.options[i] = next;
n@767	1238 popupInstance.state = 7;
n@767	1239 popupInstance.advanceState();
n@767	1240 }
n@767	1241 };
n@767	1242 mvH.appendChild(mvdn);
n@767	1243 entry.appendChild(mvH);
n@767	1244 var idH = document.createElement('div');
n@767	1245 idH.className = "dndheaderelement";
n@767	1246 idH.style.width = "150px";
n@767	1247 if (optionNode.type != "statement")
n@767	1248 {
n@767	1249 var span = document.createElement('span');
n@767	1250 span.textContent = optionNode.id;
n@767	1251 idH.appendChild(span);
n@767	1252 }
n@767	1253 entry.appendChild(idH);
n@767	1254 var typeH = document.createElement('div');
n@767	1255 typeH.className = "dndheaderelement";
n@767	1256 typeH.style.width = "150px";
n@767	1257 var span = document.createElement('span');
n@767	1258 span.textContent = optionNode.type;
n@767	1259 typeH.appendChild(span);
n@767	1260 entry.appendChild(typeH);
n@767	1261 var editH = document.createElement('div');
n@767	1262 editH.className = "dndheaderelement";
n@767	1263 editH.style.width = "50px";
n@767	1264 var editButton = document.createElement("button");
n@767	1265 editButton.textContent = "Edit";
n@767	1266 editButton.style.width = "48px";
n@767	1267 editButton.style.padding = "1px 0px";
n@767	1268 editButton.onclick = function()
n@767	1269 {
n@767	1270 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	1271 popupInstance.dataTransfer = new function() {
n@767	1272 this.title = "Edit Test Node";
n@767	1273 this.parent = specificationNode.preTest;
n@767	1274 this.node = this.parent.options[i];
n@767	1275 this.previousState = 7;
n@767	1276 };
n@767	1277 popupInstace.state = 6;
n@767	1278 popupInstance.advanceState();
n@767	1279 };
n@767	1280 editH.appendChild(editButton);
n@767	1281 entry.appendChild(editH);
n@767	1282 var deleteH = document.createElement('div');
n@767	1283 deleteH.className = "dndheaderelement";
n@767	1284 deleteH.style.width = "50px";
n@767	1285 var deleteButton = document.createElement("button");
n@767	1286 deleteButton.textContent = "Del";
n@767	1287 deleteButton.style.width = "48px";
n@767	1288 deleteButton.style.padding = "1px 0px";
n@767	1289 deleteButton.onclick = function()
n@767	1290 {
n@767	1291 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	1292 var j = i+1;
n@767	1293 while(j < specificationNode.preTest.options.length)
n@767	1294 {
n@767	1295 specificationNode.preTest.options[i] = specificationNode.preTest.options[j];
n@767	1296 j++;
n@767	1297 i++;
n@767	1298 }
n@767	1299 specificationNode.preTest.options.pop();
n@767	1300 popupInstance.state = 7;
n@767	1301 popupInstance.advanceState();
n@767	1302 };
n@767	1303 deleteH.appendChild(deleteButton);
n@767	1304 entry.appendChild(deleteH);
n@767	1305 preHolder.appendChild(entry);
n@767	1306 }
n@767	1307 var entry = document.createElement('div');
n@767	1308 entry.style.width = "456px";
n@767	1309 entry.style.height= "20px";
n@767	1310 entry.style.margin= "2px";
n@767	1311 entry.style.borderBottom = "#DDD";
n@767	1312 entry.style.borderBottomWidth = "1px";
n@767	1313 entry.style.borderBottomStyle = "solid";
n@767	1314 entry.align = "center";
n@767	1315 var addPre = document.createElement('button');
n@767	1316 addPre.className = "popupButton";
n@767	1317 addPre.textContent = "Add New Entry";
n@767	1318 addPre.style.height = "20px";
n@767	1319 addPre.onclick = function()
n@767	1320 {
n@767	1321 popupInstance.dataTransfer = new function() {
n@767	1322 this.title = "New Pre Test Node";
n@767	1323 this.parent = specificationNode.preTest;
n@767	1324 this.node = null;
n@767	1325 this.previousState = 7;
n@767	1326 };
n@767	1327 popupInstance.state = 6;
n@767	1328 popupInstance.advanceState();
n@767	1329 };
n@767	1330 entry.appendChild(addPre);
n@767	1331 preHolder.appendChild(entry);
n@767	1332
n@767	1333 var span = document.createElement('span');
n@767	1334 span.textContent = "Add your post test page options here";
n@767	1335 this.popupBody.appendChild(span);
n@767	1336 var postHolder = document.createElement('div');
n@767	1337 postHolder.id = "preHolder";
n@767	1338 postHolder.style.width = "100%";
n@767	1339 postHolder.style.minHeight = "100px";
n@767	1340 postHolder.style.maxHeight = "220px";
n@767	1341 postHolder.style.overflow = 'auto';
n@767	1342 postHolder.style.border = "black";
n@767	1343 postHolder.style.borderStyle = "solid";
n@767	1344 postHolder.style.borderWidth = "1px";
n@767	1345 this.popupBody.appendChild(postHolder);
n@767	1346 var postHeaderHolder = document.createElement('div');
n@767	1347 postHeaderHolder.style.width = "456px";
n@767	1348 postHeaderHolder.style.height= "20px";
n@767	1349 postHeaderHolder.style.margin= "2px";
n@767	1350 postHeaderHolder.style.borderBottom = "#DDD";
n@767	1351 postHeaderHolder.style.borderBottomWidth = "1px";
n@767	1352 postHeaderHolder.style.borderBottomStyle = "solid";
n@767	1353 var mvH = document.createElement('div');
n@767	1354 mvH.className = "dndheaderelement";
n@767	1355 mvH.style.width = "50px";
n@767	1356 var text = document.createElement('span');
n@767	1357 text.textContent = "Order";
n@767	1358 mvH.appendChild(text);
n@767	1359 postHeaderHolder.appendChild(mvH);
n@767	1360 var idH = document.createElement('div');
n@767	1361 idH.className = "dndheaderelement";
n@767	1362 idH.style.width = "150px";
n@767	1363 text = document.createElement('span');
n@767	1364 text.textContent = "ID";
n@767	1365 idH.appendChild(text);
n@767	1366 postHeaderHolder.appendChild(idH);
n@767	1367 var tH = document.createElement('div');
n@767	1368 tH.className = "dndheaderelement";
n@767	1369 tH.style.width = "150px";
n@767	1370 text = document.createElement('span');
n@767	1371 text.textContent = "Type";
n@767	1372 tH.appendChild(text);
n@767	1373 postHeaderHolder.appendChild(tH);
n@767	1374 var editH = document.createElement('div');
n@767	1375 editH.className = "dndheaderelement";
n@767	1376 editH.style.width = "50px";
n@767	1377 text = document.createElement('span');
n@767	1378 text.textContent = "Edit";
n@767	1379 editH.appendChild(text);
n@767	1380 postHeaderHolder.appendChild(editH);
n@767	1381 var deleteH = document.createElement('div');
n@767	1382 deleteH.className = "dndheaderelement";
n@767	1383 deleteH.style.width = "50px";
n@767	1384 text = document.createElement('span');
n@767	1385 text.textContent = "Delete";
n@767	1386 deleteH.appendChild(text);
n@767	1387 postHeaderHolder.appendChild(deleteH);
n@767	1388 postHolder.appendChild(postHeaderHolder);
n@767	1389
n@767	1390 for (var i=0; i<specificationNode.postTest.options.length; i++)
n@767	1391 {
n@767	1392 var optionNode = specificationNode.postTest.options[i];
n@767	1393 var entry = document.createElement('div');
n@767	1394 entry.style.width = "456px";
n@767	1395 entry.style.height= "20px";
n@767	1396 entry.style.margin= "2px";
n@767	1397 entry.style.borderBottom = "#DDD";
n@767	1398 entry.style.borderBottomWidth = "1px";
n@767	1399 entry.style.borderBottomStyle = "solid";
n@767	1400 entry.setAttribute("node-id",i);
n@767	1401 var node = specificationNode.postTest.options[i];
n@767	1402 var mvH = document.createElement('div');
n@767	1403 mvH.className = "dndheaderelement";
n@767	1404 mvH.style.width = "50px";
n@767	1405 var mvup = document.createElement("button");
n@767	1406 mvup.textContent = "Up";
n@767	1407 mvup.style.width = "25px";
n@767	1408 mvup.style.padding = "1px 0px";
n@767	1409 mvup.onclick = function()
n@767	1410 {
n@767	1411 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	1412 if (i != 0)
n@767	1413 {
n@767	1414 var next = specificationNode.postTest.options[i-1];
n@767	1415 var cur = specificationNode.postTest.options[i];
n@767	1416 specificationNode.postTest.options[i-1] = cur;
n@767	1417 specificationNode.postTest.options[i] = next;
n@767	1418 popupInstance.state = 7;
n@767	1419 popupInstance.advanceState();
n@767	1420 }
n@767	1421 };
n@767	1422 mvH.appendChild(mvup);
n@767	1423 var mvdn = document.createElement("button");
n@767	1424 mvdn.textContent = "Dn";
n@767	1425 mvdn.style.width = "25px";
n@767	1426 mvdn.style.padding = "1px 0px";
n@767	1427 mvdn.onclick = function()
n@767	1428 {
n@767	1429 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	1430 if (i != specificationNode.postTest.options.length-1)
n@767	1431 {
n@767	1432 var next = specificationNode.postTest.options[i+1];
n@767	1433 var cur = specificationNode.postTest.options[i];
n@767	1434 specificationNode.postTest.options[i+1] = cur;
n@767	1435 specificationNode.postTest.options[i] = next;
n@767	1436 popupInstance.state = 7;
n@767	1437 popupInstance.advanceState();
n@767	1438 }
n@767	1439 };
n@767	1440 mvH.appendChild(mvdn);
n@767	1441 entry.appendChild(mvH);
n@767	1442 var idH = document.createElement('div');
n@767	1443 idH.className = "dndheaderelement";
n@767	1444 idH.style.width = "150px";
n@767	1445 if (optionNode.type != "statement")
n@767	1446 {
n@767	1447 var span = document.createElement('span');
n@767	1448 span.textContent = optionNode.id;
n@767	1449 idH.appendChild(span);
n@767	1450 }
n@767	1451 entry.appendChild(idH);
n@767	1452 var typeH = document.createElement('div');
n@767	1453 typeH.className = "dndheaderelement";
n@767	1454 typeH.style.width = "150px";
n@767	1455 var span = document.createElement('span');
n@767	1456 span.textContent = optionNode.type;
n@767	1457 typeH.appendChild(span);
n@767	1458 entry.appendChild(typeH);
n@767	1459 var editH = document.createElement('div');
n@767	1460 editH.className = "dndheaderelement";
n@767	1461 editH.style.width = "50px";
n@767	1462 var editButton = document.createElement("button");
n@767	1463 editButton.textContent = "Edit";
n@767	1464 editButton.style.width = "48px";
n@767	1465 editButton.style.padding = "1px 0px";
n@767	1466 editButton.onclick = function()
n@767	1467 {
n@767	1468 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	1469 popupInstance.dataTransfer = new function() {
n@767	1470 this.title = "Edit Test Node";
n@767	1471 this.parent = specificationNode.postTest;
n@767	1472 this.node = this.parent.options[i];
n@767	1473 this.previousState = 7;
n@767	1474 };
n@767	1475 popupInstance.state = 6;
n@767	1476 popupInstance.advanceState();
n@767	1477 };
n@767	1478 editH.appendChild(editButton);
n@767	1479 entry.appendChild(editH);
n@767	1480 var deleteH = document.createElement('div');
n@767	1481 deleteH.className = "dndheaderelement";
n@767	1482 deleteH.style.width = "50px";
n@767	1483 var deleteButton = document.createElement("button");
n@767	1484 deleteButton.textContent = "Del";
n@767	1485 deleteButton.style.width = "48px";
n@767	1486 deleteButton.style.padding = "1px 0px";
n@767	1487 deleteButton.onclick = function()
n@767	1488 {
n@767	1489 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@767	1490 var j = i+1;
n@767	1491 while(j < specificationNode.postTest.options.length)
n@767	1492 {
n@767	1493 specificationNode.postTest.options[i] = specificationNode.postTest.options[j];
n@767	1494 j++;
n@767	1495 i++;
n@767	1496 }
n@767	1497 audioHolder.postTest.options.pop();
n@767	1498 popupInstance.state = 7;
n@767	1499 popupInstance.advanceState();
n@767	1500 };
n@767	1501 deleteH.appendChild(deleteButton);
n@767	1502 entry.appendChild(deleteH);
n@767	1503 postHolder.appendChild(entry);
n@767	1504 }
n@767	1505
n@767	1506 var entry = document.createElement('div');
n@767	1507 entry.style.width = "456px";
n@767	1508 entry.style.height= "20px";
n@767	1509 entry.style.margin= "2px";
n@767	1510 entry.style.borderBottom = "#DDD";
n@767	1511 entry.style.borderBottomWidth = "1px";
n@767	1512 entry.style.borderBottomStyle = "solid";
n@767	1513 entry.align = "center";
n@767	1514 var addPost = document.createElement('button');
n@767	1515 addPost.className = "popupButton";
n@767	1516 addPost.textContent = "Add New Entry";
n@767	1517 addPost.style.height = "20px";
n@767	1518 addPost.onclick = function()
n@767	1519 {
n@767	1520 popupInstance.dataTransfer = new function() {
n@767	1521 this.title = "New Pre Test Node";
n@767	1522 this.parent = specificationNode.postTest;
n@767	1523 this.node = null;
n@767	1524 this.previousState = 7;
n@767	1525 };
n@767	1526 popupInstance.state = 6;
n@767	1527 popupInstance.advanceState();
n@767	1528 };
n@767	1529 entry.appendChild(addPost);
n@767	1530 postHolder.appendChild(entry);
n@767	1531
n@767	1532 var button = document.createElement('button');
n@767	1533 button.id = 'submit';
n@767	1534 button.className = "popupButton";
n@767	1535 button.textContent = "Finish";
n@767	1536 button.onclick = function(event)
n@767	1537 {
n@767	1538 popupInstance.state = 8;
n@767	1539 popupInstance.advanceState();
n@767	1540 };
n@767	1541 this.popupFooter.appendChild(button);
n@767	1542 break;
n@767	1543 case 8:
n@767	1544 this.hidePopup();
n@767	1545 this.state = 0;
n@767	1546 SpecificationToHTML ();
n@767	1547 }
n@767	1548 this.state++;
n@767	1549 };
n@767	1550 };
n@767	1551
n@767	1552 function audioObject()
n@767	1553 {
n@767	1554 // Used to hold audio information in buffers for quick playback
n@767	1555 this.bufferObject;
n@767	1556 this.bufferNode = undefined;
n@767	1557 this.state = 0;
n@767	1558 this.gain = audioContext.createGain();
n@767	1559 this.gain.connect(audioContext.destination);
n@767	1560 this.include = true;
n@767	1561 this.id = undefined;
n@767	1562 this.file = undefined;
n@767	1563
n@767	1564 this.play = function()
n@767	1565 {
n@767	1566 if (this.bufferNode != undefined)
n@767	1567 {
n@767	1568 this.bufferNode.stop(0);
n@767	1569 this.bufferNode = undefined;
n@767	1570 }
n@767	1571 if(this.state == 1)
n@767	1572 {
n@767	1573 this.bufferNode = audioContext.createBufferSource();
n@767	1574 this.bufferNode.connect(this.gain);
n@767	1575 this.bufferNode.buffer = this.bufferObject;
n@767	1576 this.bufferNode.onended = function(event) {
n@767	1577 // Safari does not like using 'this' to reference the calling object!
n@767	1578 event.currentTarget = undefined;
n@767	1579 };
n@767	1580 this.bufferNode.start(audioContext.currentTime);
n@767	1581 this.bufferNode.stop(audioContext.currentTime+3);
n@767	1582 }
n@767	1583 };
n@767	1584
n@767	1585 this.constructTrack = function(file) {
n@767	1586 var reader = new FileReader();
n@767	1587 this.file = file;
n@767	1588 var audioObj = this;
n@767	1589 // Create callback to decode the data asynchronously
n@767	1590 reader.onloadend = function() {
n@767	1591 audioContext.decodeAudioData(reader.result, function(decodedData) {
n@767	1592 audioObj.bufferObject = decodedData;
n@767	1593 audioObj.state = 1;
n@767	1594 }, function(){});
n@767	1595 };
n@767	1596 reader.readAsArrayBuffer(file);
n@767	1597 };
n@767	1598 };
n@767	1599
n@767	1600 function Specification() {
n@767	1601 // Handles the decoding of the project specification XML into a simple JavaScript Object.
n@767	1602
n@767	1603 this.interfaceType = null;
n@767	1604 this.commonInterface = new function()
n@767	1605 {
n@767	1606 this.options = [];
n@767	1607 this.optionNode = function(input)
n@767	1608 {
n@767	1609 var name = input.getAttribute('name');
n@767	1610 this.type = name;
n@767	1611 if(this.type == "option")
n@767	1612 {
n@767	1613 this.name = input.id;
n@767	1614 } else if (this.type == "check")
n@767	1615 {
n@767	1616 this.check = input.id;
n@767	1617 }
n@767	1618 };
n@767	1619 };
n@774	1620
n@774	1621 this.randomiseOrder = function(input)
n@774	1622 {
n@774	1623 // This takes an array of information and randomises the order
n@774	1624 var N = input.length;
n@774	1625
n@774	1626 var inputSequence = []; // For safety purposes: keep track of randomisation
n@774	1627 for (var counter = 0; counter < N; ++counter)
n@774	1628 inputSequence.push(counter) // Fill array
n@774	1629 var inputSequenceClone = inputSequence.slice(0);
n@774	1630
n@774	1631 var holdArr = [];
n@774	1632 var outputSequence = [];
n@774	1633 for (var n=0; n<N; n++)
n@774	1634 {
n@774	1635 // First pick a random number
n@774	1636 var r = Math.random();
n@774	1637 // Multiply and floor by the number of elements left
n@774	1638 r = Math.floor(r*input.length);
n@774	1639 // Pick out that element and delete from the array
n@774	1640 holdArr.push(input.splice(r,1)[0]);
n@774	1641 // Do the same with sequence
n@774	1642 outputSequence.push(inputSequence.splice(r,1)[0]);
n@774	1643 }
n@774	1644 console.log(inputSequenceClone.toString()); // print original array to console
n@774	1645 console.log(outputSequence.toString()); // print randomised array to console
n@774	1646 return holdArr;
n@774	1647 };
n@767	1648 this.projectReturn = null;
n@767	1649 this.randomiseOrder = null;
n@767	1650 this.collectMetrics = null;
n@767	1651 this.testPages = null;
n@767	1652 this.audioHolders = [];
n@767	1653 this.metrics = [];
n@767	1654
n@767	1655 this.decode = function(projectXML) {
n@767	1656 // projectXML - DOM Parsed document
n@767	1657 this.projectXML = projectXML.childNodes[0];
n@767	1658 var setupNode = projectXML.getElementsByTagName('setup')[0];
n@767	1659 this.interfaceType = setupNode.getAttribute('interface');
n@767	1660 this.projectReturn = setupNode.getAttribute('projectReturn');
n@767	1661 this.testPages = setupNode.getAttribute('testPages');
n@767	1662 if (setupNode.getAttribute('randomiseOrder') == "true") {
n@767	1663 this.randomiseOrder = true;
n@767	1664 } else {this.randomiseOrder = false;}
n@767	1665 if (setupNode.getAttribute('collectMetrics') == "true") {
n@767	1666 this.collectMetrics = true;
n@767	1667 } else {this.collectMetrics = false;}
n@767	1668 if (isNaN(Number(this.testPages)) \|\| this.testPages == undefined)
n@767	1669 {
n@767	1670 this.testPages = null;
n@767	1671 } else {
n@767	1672 this.testPages = Number(this.testPages);
n@767	1673 if (this.testPages == 0) {this.testPages = null;}
n@767	1674 }
n@767	1675 var metricCollection = setupNode.getElementsByTagName('Metric');
n@767	1676
n@767	1677 var setupPreTestNode = setupNode.getElementsByTagName('PreTest');
n@767	1678 if (setupPreTestNode.length != 0)
n@767	1679 {
n@767	1680 setupPreTestNode = setupPreTestNode[0];
n@767	1681 this.preTest.construct(setupPreTestNode);
n@767	1682 }
n@767	1683
n@767	1684 var setupPostTestNode = setupNode.getElementsByTagName('PostTest');
n@767	1685 if (setupPostTestNode.length != 0)
n@767	1686 {
n@767	1687 setupPostTestNode = setupPostTestNode[0];
n@767	1688 this.postTest.construct(setupPostTestNode);
n@767	1689 }
n@767	1690
n@767	1691 if (metricCollection.length > 0) {
n@767	1692 metricCollection = metricCollection[0].getElementsByTagName('metricEnable');
n@767	1693 for (var i=0; i<metricCollection.length; i++) {
n@767	1694 this.metrics.push(new this.metricNode(metricCollection[i].textContent));
n@767	1695 }
n@767	1696 }
n@767	1697
n@767	1698 var commonInterfaceNode = setupNode.getElementsByTagName('interface');
n@767	1699 if (commonInterfaceNode.length > 0) {
n@767	1700 commonInterfaceNode = commonInterfaceNode[0];
n@767	1701 } else {
n@767	1702 commonInterfaceNode = undefined;
n@767	1703 }
n@767	1704
n@767	1705 this.commonInterface = new function() {
n@767	1706 this.OptionNode = function(child) {
n@767	1707 this.type = child.nodeName;
n@767	1708 if (this.type == 'option')
n@767	1709 {
n@767	1710 this.name = child.getAttribute('name');
n@767	1711 }
n@767	1712 else if (this.type == 'check') {
n@767	1713 this.check = child.getAttribute('name');
n@767	1714 if (this.check == 'scalerange') {
n@767	1715 this.min = child.getAttribute('min');
n@767	1716 this.max = child.getAttribute('max');
n@767	1717 if (this.min == null) {this.min = 1;}
n@767	1718 else if (Number(this.min) > 1 && this.min != null) {
n@767	1719 this.min = Number(this.min)/100;
n@767	1720 } else {
n@767	1721 this.min = Number(this.min);
n@767	1722 }
n@767	1723 if (this.max == null) {this.max = 0;}
n@767	1724 else if (Number(this.max) > 1 && this.max != null) {
n@767	1725 this.max = Number(this.max)/100;
n@767	1726 } else {
n@767	1727 this.max = Number(this.max);
n@767	1728 }
n@767	1729 }
n@767	1730 } else if (this.type == 'anchor' \|\| this.type == 'reference') {
n@767	1731 this.value = Number(child.textContent);
n@767	1732 this.enforce = child.getAttribute('enforce');
n@767	1733 if (this.enforce == 'true') {this.enforce = true;}
n@767	1734 else {this.enforce = false;}
n@767	1735 }
n@767	1736 };
n@767	1737 this.options = [];
n@767	1738 if (commonInterfaceNode != undefined) {
n@767	1739 var child = commonInterfaceNode.firstElementChild;
n@767	1740 while (child != undefined) {
n@767	1741 this.options.push(new this.OptionNode(child));
n@767	1742 child = child.nextElementSibling;
n@767	1743 }
n@767	1744 }
n@767	1745 };
n@767	1746
n@767	1747 var audioHolders = projectXML.getElementsByTagName('audioHolder');
n@767	1748 for (var i=0; i<audioHolders.length; i++) {
n@767	1749 var node = new this.audioHolderNode(this);
n@767	1750 node.decode(this,audioHolders[i]);
n@767	1751 this.audioHolders.push(node);
n@767	1752 }
n@767	1753
n@767	1754 // New check if we need to randomise the test order
n@767	1755 if (this.randomiseOrder)
n@767	1756 {
n@767	1757 this.audioHolders = randomiseOrder(this.audioHolders);
n@767	1758 for (var i=0; i<this.audioHolders.length; i++)
n@767	1759 {
n@767	1760 this.audioHolders[i].presentedId = i;
n@767	1761 }
n@767	1762 }
n@767	1763
n@767	1764 if (this.testPages != null \|\| this.testPages != undefined)
n@767	1765 {
n@767	1766 if (this.testPages > audioHolders.length)
n@767	1767 {
n@767	1768 console.log('Warning: You have specified '+audioHolders.length+' tests but requested '+this.testPages+' be completed!');
n@767	1769 this.testPages = audioHolders.length;
n@767	1770 }
n@767	1771 var aH = this.audioHolders;
n@767	1772 this.audioHolders = [];
n@767	1773 for (var i=0; i<this.testPages; i++)
n@767	1774 {
n@767	1775 this.audioHolders.push(aH[i]);
n@767	1776 }
n@767	1777 }
n@767	1778 };
n@767	1779
n@767	1780 this.encode = function()
n@767	1781 {
n@767	1782 var root = document.implementation.createDocument(null,"BrowserEvalProjectDocument");
n@767	1783 // First get all the <setup> tag compiled
n@767	1784 var setupNode = root.createElement("setup");
n@767	1785 setupNode.setAttribute('interface',this.interfaceType);
n@767	1786 setupNode.setAttribute('projectReturn',this.projectReturn);
n@767	1787 setupNode.setAttribute('randomiseOrder',this.randomiseOrder);
n@767	1788 setupNode.setAttribute('collectMetrics',this.collectMetrics);
n@767	1789 setupNode.setAttribute('testPages',this.testPages);
n@767	1790
n@767	1791 var setupPreTest = root.createElement("PreTest");
n@767	1792 for (var i=0; i<this.preTest.options.length; i++)
n@767	1793 {
n@767	1794 setupPreTest.appendChild(this.preTest.options[i].exportXML(root));
n@767	1795 }
n@767	1796
n@767	1797 var setupPostTest = root.createElement("PostTest");
n@767	1798 for (var i=0; i<this.postTest.options.length; i++)
n@767	1799 {
n@767	1800 setupPostTest.appendChild(this.postTest.options[i].exportXML(root));
n@767	1801 }
n@767	1802
n@767	1803 setupNode.appendChild(setupPreTest);
n@767	1804 setupNode.appendChild(setupPostTest);
n@767	1805
n@767	1806 // <Metric> tag
n@767	1807 var Metric = root.createElement("Metric");
n@767	1808 for (var i=0; i<this.metrics.length; i++)
n@767	1809 {
n@767	1810 var metricEnable = root.createElement("metricEnable");
n@767	1811 metricEnable.textContent = this.metrics[i].enabled;
n@767	1812 Metric.appendChild(metricEnable);
n@767	1813 }
n@767	1814 setupNode.appendChild(Metric);
n@767	1815
n@767	1816 // <interface> tag
n@767	1817 var CommonInterface = root.createElement("interface");
n@767	1818 for (var i=0; i<this.commonInterface.options.length; i++)
n@767	1819 {
n@767	1820 var CIObj = this.commonInterface.options[i];
n@767	1821 var CINode = root.createElement(CIObj.type);
n@767	1822 if (CIObj.type == "check") {CINode.setAttribute("name",CIObj.check);}
n@767	1823 else {CINode.setAttribute("name",CIObj.name);}
n@767	1824 CommonInterface.appendChild(CINode);
n@767	1825 }
n@767	1826 setupNode.appendChild(CommonInterface);
n@767	1827
n@767	1828 root.getElementsByTagName("BrowserEvalProjectDocument")[0].appendChild(setupNode);
n@767	1829 // Time for the <audioHolder> tags
n@767	1830 for (var ahIndex = 0; ahIndex < this.audioHolders.length; ahIndex++)
n@767	1831 {
n@767	1832 var node = this.audioHolders[ahIndex].encode(root);
n@767	1833 root.getElementsByTagName("BrowserEvalProjectDocument")[0].appendChild(node);
n@767	1834 }
n@767	1835 return root;
n@767	1836 };
n@767	1837
n@767	1838 this.prepostNode = function(type) {
n@767	1839 this.type = type;
n@767	1840 this.options = [];
n@767	1841
n@767	1842 this.OptionNode = function() {
n@767	1843
n@767	1844 this.childOption = function() {
n@767	1845 this.type = 'option';
n@767	1846 this.id = null;
n@767	1847 this.name = undefined;
n@767	1848 this.text = null;
n@767	1849 };
n@767	1850
n@767	1851 this.type = undefined;
n@767	1852 this.id = undefined;
n@767	1853 this.mandatory = undefined;
n@767	1854 this.question = undefined;
n@767	1855 this.statement = undefined;
n@767	1856 this.boxsize = undefined;
n@767	1857 this.options = [];
n@767	1858 this.min = undefined;
n@767	1859 this.max = undefined;
n@767	1860 this.step = undefined;
n@767	1861
n@767	1862 this.decode = function(child)
n@767	1863 {
n@767	1864 this.type = child.nodeName;
n@767	1865 if (child.nodeName == "question") {
n@767	1866 this.id = child.id;
n@767	1867 this.mandatory;
n@767	1868 if (child.getAttribute('mandatory') == "true") {this.mandatory = true;}
n@767	1869 else {this.mandatory = false;}
n@767	1870 this.question = child.textContent;
n@767	1871 if (child.getAttribute('boxsize') == null) {
n@767	1872 this.boxsize = 'normal';
n@767	1873 } else {
n@767	1874 this.boxsize = child.getAttribute('boxsize');
n@767	1875 }
n@767	1876 } else if (child.nodeName == "statement") {
n@767	1877 this.statement = child.textContent;
n@767	1878 } else if (child.nodeName == "checkbox" \|\| child.nodeName == "radio") {
n@767	1879 var element = child.firstElementChild;
n@767	1880 this.id = child.id;
n@767	1881 if (element == null) {
n@767	1882 console.log('Malformed' +child.nodeName+ 'entry');
n@767	1883 this.statement = 'Malformed' +child.nodeName+ 'entry';
n@767	1884 this.type = 'statement';
n@767	1885 } else {
n@767	1886 this.options = [];
n@767	1887 while (element != null) {
n@767	1888 if (element.nodeName == 'statement' && this.statement == undefined){
n@767	1889 this.statement = element.textContent;
n@767	1890 } else if (element.nodeName == 'option') {
n@767	1891 var node = new this.childOption();
n@767	1892 node.id = element.id;
n@767	1893 node.name = element.getAttribute('name');
n@767	1894 node.text = element.textContent;
n@767	1895 this.options.push(node);
n@767	1896 }
n@767	1897 element = element.nextElementSibling;
n@767	1898 }
n@767	1899 }
n@767	1900 } else if (child.nodeName == "number") {
n@767	1901 this.statement = child.textContent;
n@767	1902 this.id = child.id;
n@767	1903 this.min = child.getAttribute('min');
n@767	1904 this.max = child.getAttribute('max');
n@767	1905 this.step = child.getAttribute('step');
n@767	1906 }
n@767	1907 };
n@767	1908
n@767	1909 this.exportXML = function(root)
n@767	1910 {
n@767	1911 var node = root.createElement(this.type);
n@767	1912 switch(this.type)
n@767	1913 {
n@767	1914 case "statement":
n@767	1915 node.textContent = this.statement;
n@767	1916 break;
n@767	1917 case "question":
n@767	1918 node.id = this.id;
n@767	1919 node.setAttribute("mandatory",this.mandatory);
n@767	1920 node.setAttribute("boxsize",this.boxsize);
n@767	1921 node.textContent = this.question;
n@767	1922 break;
n@767	1923 case "number":
n@767	1924 node.id = this.id;
n@767	1925 node.setAttribute("mandatory",this.mandatory);
n@767	1926 node.setAttribute("min", this.min);
n@767	1927 node.setAttribute("max", this.max);
n@767	1928 node.setAttribute("step", this.step);
n@768	1929 node.textContent = this.statement;
n@767	1930 break;
n@767	1931 case "checkbox":
n@767	1932 node.id = this.id;
n@767	1933 var statement = root.createElement("statement");
n@767	1934 statement.textContent = this.statement;
n@767	1935 node.appendChild(statement);
n@767	1936 for (var i=0; i<this.options.length; i++)
n@767	1937 {
n@767	1938 var option = this.options[i];
n@767	1939 var optionNode = root.createElement("option");
n@767	1940 optionNode.id = option.id;
n@767	1941 optionNode.textContent = option.text;
n@767	1942 node.appendChild(optionNode);
n@767	1943 }
n@767	1944 break;
n@767	1945 case "radio":
n@767	1946 node.id = this.id;
n@767	1947 var statement = root.createElement("statement");
n@767	1948 statement.textContent = this.statement;
n@767	1949 node.appendChild(statement);
n@767	1950 for (var i=0; i<this.options.length; i++)
n@767	1951 {
n@767	1952 var option = this.options[i];
n@767	1953 var optionNode = root.createElement("option");
n@767	1954 optionNode.setAttribute("name",option.name);
n@767	1955 optionNode.textContent = option.text;
n@767	1956 node.appendChild(optionNode);
n@767	1957 }
n@767	1958 break;
n@767	1959 }
n@767	1960 return node;
n@767	1961 };
n@767	1962 };
n@767	1963 this.construct = function(Collection)
n@767	1964 {
n@767	1965 if (Collection.childElementCount != 0) {
n@767	1966 var child = Collection.firstElementChild;
n@767	1967 var node = new this.OptionNode();
n@767	1968 node.decode(child);
n@767	1969 this.options.push(node);
n@767	1970 while (child.nextElementSibling != null) {
n@767	1971 child = child.nextElementSibling;
n@767	1972 node = new this.OptionNode();
n@767	1973 node.decode(child);
n@767	1974 this.options.push(node);
n@767	1975 }
n@767	1976 }
n@767	1977 };
n@767	1978 };
n@767	1979 this.preTest = new this.prepostNode("pretest");
n@767	1980 this.postTest = new this.prepostNode("posttest");
n@767	1981
n@767	1982 this.metricNode = function(name) {
n@767	1983 this.enabled = name;
n@767	1984 };
n@767	1985
n@767	1986 this.audioHolderNode = function(parent) {
n@767	1987 this.type = 'audioHolder';
n@767	1988 this.presentedId = undefined;
n@767	1989 this.id = undefined;
n@767	1990 this.hostURL = undefined;
n@767	1991 this.sampleRate = undefined;
n@767	1992 this.randomiseOrder = undefined;
n@767	1993 this.loop = undefined;
n@767	1994 this.elementComments = undefined;
n@767	1995 this.outsideReference = null;
n@767	1996 this.preTest = new parent.prepostNode("pretest");
n@767	1997 this.postTest = new parent.prepostNode("pretest");
n@767	1998 this.interfaces = [];
n@767	1999 this.commentBoxPrefix = "Comment on track";
n@767	2000 this.audioElements = [];
n@767	2001 this.commentQuestions = [];
n@767	2002
n@767	2003 this.decode = function(parent,xml)
n@767	2004 {
n@767	2005 this.presentedId = parent.audioHolders.length;
n@767	2006 this.id = xml.id;
n@767	2007 this.hostURL = xml.getAttribute('hostURL');
n@767	2008 this.sampleRate = xml.getAttribute('sampleRate');
n@767	2009 if (xml.getAttribute('randomiseOrder') == "true") {this.randomiseOrder = true;}
n@767	2010 else {this.randomiseOrder = false;}
n@767	2011 this.repeatCount = xml.getAttribute('repeatCount');
n@767	2012 if (xml.getAttribute('loop') == 'true') {this.loop = true;}
n@767	2013 else {this.loop == false;}
n@767	2014 if (xml.getAttribute('elementComments') == "true") {this.elementComments = true;}
n@767	2015 else {this.elementComments = false;}
n@767	2016
n@767	2017 var setupPreTestNode = xml.getElementsByTagName('PreTest');
n@767	2018 if (setupPreTestNode.length != 0)
n@767	2019 {
n@767	2020 setupPreTestNode = setupPreTestNode[0];
n@767	2021 this.preTest.construct(setupPreTestNode);
n@767	2022 }
n@767	2023
n@767	2024 var setupPostTestNode = xml.getElementsByTagName('PostTest');
n@767	2025 if (setupPostTestNode.length != 0)
n@767	2026 {
n@767	2027 setupPostTestNode = setupPostTestNode[0];
n@767	2028 this.postTest.construct(setupPostTestNode);
n@767	2029 }
n@767	2030
n@767	2031 var interfaceDOM = xml.getElementsByTagName('interface');
n@767	2032 for (var i=0; i<interfaceDOM.length; i++) {
n@767	2033 var node = new this.interfaceNode();
n@767	2034 node.decode(interfaceDOM[i]);
n@767	2035 this.interfaces.push(node);
n@767	2036 }
n@767	2037 this.commentBoxPrefix = xml.getElementsByTagName('commentBoxPrefix');
n@767	2038 if (this.commentBoxPrefix.length != 0) {
n@767	2039 this.commentBoxPrefix = this.commentBoxPrefix[0].textContent;
n@767	2040 } else {
n@767	2041 this.commentBoxPrefix = "Comment on track";
n@767	2042 }
n@767	2043 var audioElementsDOM = xml.getElementsByTagName('audioElements');
n@767	2044 for (var i=0; i<audioElementsDOM.length; i++) {
n@767	2045 var node = new this.audioElementNode();
n@769	2046 node.decode(this,audioElementsDOM[i]);
n@767	2047 if (audioElementsDOM[i].getAttribute('type') == 'outsidereference') {
n@767	2048 if (this.outsideReference == null) {
n@769	2049 this.outsideReference = node;
n@767	2050 } else {
n@767	2051 console.log('Error only one audioelement can be of type outsidereference per audioholder');
n@767	2052 this.audioElements.push(node);
n@767	2053 console.log('Element id '+audioElementsDOM[i].id+' made into normal node');
n@767	2054 }
n@767	2055 } else {
n@767	2056 this.audioElements.push(node);
n@767	2057 }
n@767	2058 }
n@767	2059
n@774	2060 if (this.randomiseOrder == true)
n@774	2061 {
n@774	2062 this.audioElements = randomiseOrder(this.audioElements);
n@774	2063 }
n@774	2064
n@767	2065 var commentQuestionsDOM = xml.getElementsByTagName('CommentQuestion');
n@767	2066 for (var i=0; i<commentQuestionsDOM.length; i++) {
n@767	2067 var node = new this.commentQuestionNode();
n@767	2068 node.decode(commentQuestionsDOM[i]);
n@767	2069 this.commentQuestions.push(node);
n@767	2070 }
n@767	2071 };
n@767	2072
n@767	2073 this.encode = function(root)
n@767	2074 {
n@767	2075 var AHNode = root.createElement("audioHolder");
n@767	2076 AHNode.id = this.id;
n@767	2077 AHNode.setAttribute("hostURL",this.hostURL);
n@767	2078 AHNode.setAttribute("sampleRate",this.sampleRate);
n@767	2079 AHNode.setAttribute("randomiseOrder",this.randomiseOrder);
n@767	2080 AHNode.setAttribute("repeatCount",this.repeatCount);
n@767	2081 AHNode.setAttribute("loop",this.loop);
n@767	2082 AHNode.setAttribute("elementComments",this.elementComments);
n@767	2083
n@767	2084 for (var i=0; i<this.interfaces.length; i++)
n@767	2085 {
n@767	2086 AHNode.appendChild(this.interfaces[i].encode(root));
n@767	2087 }
n@767	2088
n@767	2089 for (var i=0; i<this.audioElements.length; i++) {
n@767	2090 AHNode.appendChild(this.audioElements[i].encode(root));
n@767	2091 }
n@767	2092 // Create <CommentQuestion>
n@767	2093 for (var i=0; i<this.commentQuestions.length; i++)
n@767	2094 {
n@767	2095 AHNode.appendChild(this.commentQuestions[i].exportXML(root));
n@767	2096 }
n@767	2097
n@767	2098 // Create <PreTest>
n@767	2099 var AHPreTest = root.createElement("PreTest");
n@767	2100 for (var i=0; i<this.preTest.options.length; i++)
n@767	2101 {
n@767	2102 AHPreTest.appendChild(this.preTest.options[i].exportXML(root));
n@767	2103 }
n@767	2104
n@767	2105 var AHPostTest = root.createElement("PostTest");
n@767	2106 for (var i=0; i<this.postTest.options.length; i++)
n@767	2107 {
n@767	2108 AHPostTest.appendChild(this.postTest.options[i].exportXML(root));
n@767	2109 }
n@767	2110 AHNode.appendChild(AHPreTest);
n@767	2111 AHNode.appendChild(AHPostTest);
n@767	2112 return AHNode;
n@767	2113 };
n@767	2114
n@767	2115 this.interfaceNode = function() {
n@767	2116 this.title = undefined;
n@767	2117 this.options = [];
n@767	2118 this.scale = [];
n@767	2119 this.decode = function(DOM)
n@767	2120 {
n@767	2121 var title = DOM.getElementsByTagName('title');
n@767	2122 if (title.length == 0) {this.title = null;}
n@767	2123 else {this.title = title[0].textContent;}
n@767	2124 this.options = parent.commonInterface.options;
n@767	2125 var scale = DOM.getElementsByTagName('scale');
n@767	2126 this.scale = [];
n@767	2127 for (var i=0; i<scale.length; i++) {
n@767	2128 var arr = [null, null];
n@767	2129 arr[0] = scale[i].getAttribute('position');
n@767	2130 arr[1] = scale[i].textContent;
n@767	2131 this.scale.push(arr);
n@767	2132 }
n@767	2133 };
n@767	2134 this.encode = function(root)
n@767	2135 {
n@767	2136 var node = root.createElement("interface");
n@767	2137 if (this.title != undefined)
n@767	2138 {
n@767	2139 var title = root.createElement("title");
n@767	2140 title.textContent = this.title;
n@767	2141 node.appendChild(title);
n@767	2142 }
n@767	2143 for (var i=0; i<this.options.length; i++)
n@767	2144 {
n@767	2145 var optionNode = root.createElement(this.options[i].type);
n@767	2146 if (this.options[i].type == "option")
n@767	2147 {
n@767	2148 optionNode.setAttribute("name",this.options[i].name);
n@767	2149 } else if (this.options[i].type == "check") {
n@767	2150 optionNode.setAttribute("check",this.options[i].check);
n@767	2151 } else if (this.options[i].type == "scalerange") {
n@767	2152 optionNode.setAttribute("min",this.options[i].min*100);
n@767	2153 optionNode.setAttribute("max",this.options[i].max*100);
n@767	2154 }
n@767	2155 node.appendChild(optionNode);
n@767	2156 }
n@767	2157 for (var i=0; i<this.scale.length; i++) {
n@767	2158 var scale = root.createElement("scale");
n@767	2159 scale.setAttribute("position",this.scale[i][0]);
n@767	2160 scale.textContent = this.scale[i][1];
n@767	2161 node.appendChild(scale);
n@767	2162 }
n@767	2163 return node;
n@767	2164 };
n@767	2165 };
n@767	2166
n@767	2167 this.audioElementNode = function() {
n@767	2168 this.url = null;
n@767	2169 this.id = null;
n@767	2170 this.parent = null;
n@767	2171 this.type = "normal";
n@767	2172 this.marker = false;
n@767	2173 this.enforce = false;
n@767	2174 this.decode = function(parent,xml)
n@767	2175 {
n@767	2176 this.url = xml.getAttribute('url');
n@767	2177 this.id = xml.id;
n@767	2178 this.parent = parent;
n@767	2179 this.type = xml.getAttribute('type');
n@767	2180 if (this.type == null) {this.type = "normal";}
n@767	2181 if (this.type == 'anchor') {this.anchor = true;}
n@767	2182 else {this.anchor = false;}
n@767	2183 if (this.type == 'reference') {this.reference = true;}
n@767	2184 else {this.reference = false;}
n@767	2185
n@767	2186 if (this.anchor == true \|\| this.reference == true)
n@767	2187 {
n@767	2188 this.marker = xml.getAttribute('marker');
n@767	2189 if (this.marker != undefined)
n@767	2190 {
n@767	2191 this.marker = Number(this.marker);
n@767	2192 if (isNaN(this.marker) == false)
n@767	2193 {
n@767	2194 if (this.marker > 1)
n@767	2195 { this.marker /= 100.0;}
n@767	2196 if (this.marker >= 0 && this.marker <= 1)
n@767	2197 {
n@767	2198 this.enforce = true;
n@767	2199 return;
n@767	2200 } else {
n@767	2201 console.log("ERROR - Marker of audioElement "+this.id+" is not between 0 and 1 (float) or 0 and 100 (integer)!");
n@767	2202 console.log("ERROR - Marker not enforced!");
n@767	2203 }
n@767	2204 } else {
n@767	2205 console.log("ERROR - Marker of audioElement "+this.id+" is not a number!");
n@767	2206 console.log("ERROR - Marker not enforced!");
n@767	2207 }
n@767	2208 }
n@767	2209 }
n@767	2210 };
n@767	2211 this.encode = function(root)
n@767	2212 {
n@767	2213 var AENode = root.createElement("audioElements");
n@767	2214 AENode.id = this.id;
n@767	2215 AENode.setAttribute("url",this.url);
n@767	2216 AENode.setAttribute("type",this.type);
n@767	2217 if (this.marker != false)
n@767	2218 {
n@767	2219 AENode.setAttribute("marker",this.marker*100);
n@767	2220 }
n@767	2221 return AENode;
n@767	2222 };
n@767	2223 };
n@767	2224
n@767	2225 this.commentQuestionNode = function(xml) {
n@767	2226 this.id = null;
n@767	2227 this.type = undefined;
n@767	2228 this.question = undefined;
n@767	2229 this.options = [];
n@767	2230 this.statement = undefined;
n@767	2231
n@767	2232 this.childOption = function() {
n@767	2233 this.type = 'option';
n@767	2234 this.name = null;
n@767	2235 this.text = null;
n@767	2236 };
n@767	2237 this.exportXML = function(root)
n@767	2238 {
n@767	2239 var CQNode = root.createElement("CommentQuestion");
n@767	2240 CQNode.id = this.id;
n@767	2241 CQNode.setAttribute("type",this.type);
n@767	2242 switch(this.type)
n@767	2243 {
n@767	2244 case "text":
n@767	2245 CQNode.textContent = this.question;
n@767	2246 break;
n@768	2247 case "radio":
n@768	2248 var statement = root.createElement("statement");
n@768	2249 statement.textContent = this.statement;
n@768	2250 CQNode.appendChild(statement);
n@768	2251 for (var i=0; i<this.options.length; i++)
n@768	2252 {
n@768	2253 var optionNode = root.createElement("option");
n@768	2254 optionNode.setAttribute("name",this.options[i].name);
n@768	2255 optionNode.textContent = this.options[i].text;
n@768	2256 CQNode.appendChild(optionNode);
n@768	2257 }
n@768	2258 break;
n@768	2259 case "checkbox":
n@767	2260 var statement = root.createElement("statement");
n@767	2261 statement.textContent = this.statement;
n@767	2262 CQNode.appendChild(statement);
n@767	2263 for (var i=0; i<this.options.length; i++)
n@767	2264 {
n@767	2265 var optionNode = root.createElement("option");
n@767	2266 optionNode.setAttribute("name",this.options[i].name);
n@767	2267 optionNode.textContent = this.options[i].text;
n@767	2268 CQNode.appendChild(optionNode);
n@767	2269 }
n@767	2270 break;
n@767	2271 }
n@767	2272 return CQNode;
n@767	2273 };
n@767	2274 this.decode = function(xml) {
n@767	2275 this.id = xml.id;
n@767	2276 if (xml.getAttribute('mandatory') == 'true') {this.mandatory = true;}
n@767	2277 else {this.mandatory = false;}
n@767	2278 this.type = xml.getAttribute('type');
n@767	2279 if (this.type == undefined) {this.type = 'text';}
n@767	2280 switch (this.type) {
n@767	2281 case 'text':
n@767	2282 this.question = xml.textContent;
n@767	2283 break;
n@767	2284 case 'radio':
n@767	2285 var child = xml.firstElementChild;
n@767	2286 this.options = [];
n@767	2287 while (child != undefined) {
n@767	2288 if (child.nodeName == 'statement' && this.statement == undefined) {
n@767	2289 this.statement = child.textContent;
n@767	2290 } else if (child.nodeName == 'option') {
n@767	2291 var node = new this.childOption();
n@767	2292 node.name = child.getAttribute('name');
n@767	2293 node.text = child.textContent;
n@767	2294 this.options.push(node);
n@767	2295 }
n@767	2296 child = child.nextElementSibling;
n@767	2297 }
n@767	2298 break;
n@767	2299 case 'checkbox':
n@767	2300 var child = xml.firstElementChild;
n@767	2301 this.options = [];
n@767	2302 while (child != undefined) {
n@767	2303 if (child.nodeName == 'statement' && this.statement == undefined) {
n@767	2304 this.statement = child.textContent;
n@767	2305 } else if (child.nodeName == 'option') {
n@767	2306 var node = new this.childOption();
n@767	2307 node.name = child.getAttribute('name');
n@767	2308 node.text = child.textContent;
n@767	2309 this.options.push(node);
n@767	2310 }
n@767	2311 child = child.nextElementSibling;
n@767	2312 }
n@767	2313 break;
n@767	2314 }
n@767	2315 };
n@767	2316 };
n@767	2317 };
n@767	2318 }
n@774	2319
n@767	2320 function createDeleteNodeButton(node)
n@767	2321 {
n@767	2322 var button = document.createElement("button");
n@767	2323 button.textContent = "Delete";
n@767	2324 button.onclick = function(event)
n@767	2325 {
n@767	2326 var node = event.target.parentElement;
n@767	2327 node.parentElement.removeChild(node);
n@767	2328 };
n@767	2329 return button;
n@767	2330 }
n@767	2331
n@767	2332 function SpecificationToHTML()
n@767	2333 {
n@767	2334 // Take information from Specification Node and format it into an HTML layout
n@767	2335 var destination = document.getElementById("content");
n@767	2336 // Setup Header Node
n@767	2337 var setupNode = document.createElement("div");
n@767	2338 setupNode.className = "topLevel";
n@767	2339 setupNode.name = "setup";
n@767	2340 var title = document.createElement("h2");
n@767	2341 title.textContent = "Setup";
n@767	2342 setupNode.appendChild(title);
n@767	2343 // Interface Type
n@767	2344 var div = document.createElement("div");
n@767	2345 div.name = "attributes";
n@767	2346 div.style.margin = "5px";
n@767	2347 var select = document.createElement("select");
n@767	2348 select.id = "interfaceSelect";
n@767	2349 select.style.margin = "5px";
n@767	2350 var option = document.createElement("option");
n@767	2351 option.value = "APE";
n@767	2352 option.textContent = "APE";
n@767	2353 select.appendChild(option);
n@767	2354 option = document.createElement("option");
n@767	2355 option.value = "MUSHRA";
n@767	2356 option.textContent = "MUSHRA";
n@767	2357 select.appendChild(option);
n@767	2358 select.value = specificationNode.interfaceType;
n@767	2359 select.onchange = function(event)
n@767	2360 {
n@767	2361 specificationNode.interfaceType = event.currentTarget.value;
n@767	2362 };
n@767	2363 var span = document.createElement("span");
n@767	2364 span.textContent = "Interface Type";
n@767	2365 div.appendChild(span);
n@767	2366 div.appendChild(select);
n@767	2367 // Project Return Attribute
n@767	2368 span = document.createElement("span");
n@767	2369 span.style.margin = "5px";
n@767	2370 span.textContent = "Project Return";
n@767	2371 var input = document.createElement("input");
n@767	2372 input.value = specificationNode.projectReturn;
n@767	2373 input.id = "projectReturn";
n@767	2374 input.style.margin = "5px";
n@767	2375 input.onchange = function(event) {
n@767	2376 specificationNode.projectReturn = event.currentTarget.value;
n@767	2377 };
n@767	2378 div.appendChild(span);
n@767	2379 div.appendChild(input);
n@767	2380 // Randomise Order
n@767	2381 span = document.createElement("span");
n@767	2382 span.textContent = "Randomise Order";
n@767	2383 input = document.createElement("input");
n@767	2384 input.id = "randomiseOrder";
n@767	2385 input.style.margin = "5px";
n@767	2386 input.type = "checkbox";
n@767	2387 input.checked = specificationNode.randomiseOrder;
n@767	2388 input.onchange = function(event) {
n@767	2389 specificationNode.randomiseOrder = event.currentTarget.checked;
n@767	2390 };
n@767	2391 div.appendChild(span);
n@767	2392 div.appendChild(input);
n@767	2393 setupNode.appendChild(div);
n@767	2394
n@767	2395 // Now create the common Interface Node
n@767	2396 var commonInterface = document.createElement("div");
n@767	2397 commonInterface.id = "interface";
n@767	2398 commonInterface.className = "SecondLevel";
n@767	2399 var title = document.createElement("h3");
n@767	2400 title.textContent = "Common Interface";
n@767	2401 commonInterface.appendChild(title);
n@767	2402 var div = document.createElement("div");
n@767	2403 div.name = "attributes";
n@767	2404 var interfaceOptions;
n@767	2405 var interfaceChecks;
n@767	2406 switch(select.value)
n@767	2407 {
n@767	2408 case "APE":
n@767	2409 interfaceOptions = APEInterfaceOptions;
n@767	2410 interfaceChecks = APEInterfaceChecks;
n@767	2411 break;
n@767	2412 case "MUSHRA":
n@767	2413 interfaceOptions = MUSHRAInterfaceOptions;
n@767	2414 interfaceChecks = MUSHRAInterfaceChecks;
n@767	2415 break;
n@767	2416 }
n@767	2417 for (var i=0; i<interfaceOptions[0].length; i++)
n@767	2418 {
n@767	2419 var span = document.createElement("span");
n@767	2420 span.textContent = interfaceOptions[1][i];
n@767	2421 var input = document.createElement("input");
n@767	2422 input.type = "checkbox";
n@767	2423 input.id = interfaceOptions[0][i];
n@767	2424 input.setAttribute("name", "option");
n@767	2425 div.appendChild(input);
n@767	2426 div.appendChild(span);
n@767	2427 commonInterface.appendChild(div);
n@767	2428 for (var j=0; j<specificationNode.commonInterface.options.length; j++)
n@767	2429 {
n@767	2430 if (specificationNode.commonInterface.options[j].name == interfaceOptions[0][i])
n@767	2431 {
n@767	2432 input.checked = true;
n@767	2433 break;
n@767	2434 }
n@767	2435 }
n@767	2436 input.onchange = function(event) {
n@767	2437 var id = event.currentTarget.id;
n@767	2438 if (event.currentTarget.checked) {
n@767	2439 specificationNode.commonInterface.options.push(new specificationNode.commonInterface.optionNode(event.currentTarget));
n@767	2440 } else {
n@767	2441 for (var j=0; j<specificationNode.commonInterface.options.length; j++)
n@767	2442 {
n@767	2443 if (specificationNode.commonInterface.options[j].name == event.currentTarget.id)
n@767	2444 {
n@767	2445 specificationNode.commonInterface.options.splice(j,1);
n@767	2446 break;
n@767	2447 }
n@767	2448 }
n@767	2449 }
n@767	2450 };
n@767	2451 }
n@767	2452 for (var i=0; i<interfaceChecks[0].length; i++)
n@767	2453 {
n@767	2454 var span = document.createElement("span");
n@767	2455 span.textContent = interfaceChecks[1][i];
n@767	2456 var input = document.createElement("input");
n@767	2457 input.type = "checkbox";
n@767	2458 input.id = interfaceChecks[0][i];
n@767	2459 input.setAttribute("name", "check");
n@767	2460 div.appendChild(input);
n@767	2461 div.appendChild(span);
n@767	2462 commonInterface.appendChild(div);
n@767	2463 for (var j=0; j<specificationNode.commonInterface.options.length; j++)
n@767	2464 {
n@767	2465 if (specificationNode.commonInterface.options[j].check == interfaceChecks[0][i])
n@767	2466 {
n@767	2467 input.checked = true;
n@767	2468 break;
n@767	2469 }
n@767	2470 }
n@767	2471 input.onchange = function(event) {
n@767	2472 var id = event.currentTarget.id;
n@767	2473 if (event.currentTarget.checked) {
n@767	2474 specificationNode.commonInterface.options.push(new specificationNode.commonInterface.optionNode(event.currentTarget));
n@767	2475 } else {
n@767	2476 for (var j=0; j<specificationNode.commonInterface.options.length; j++)
n@767	2477 {
n@767	2478 if (specificationNode.commonInterface.options[j].name == event.currentTarget.id)
n@767	2479 {
n@767	2480 specificationNode.commonInterface.options.splice(j,1);
n@767	2481 break;
n@767	2482 }
n@767	2483 }
n@767	2484 }
n@767	2485 };
n@767	2486 }
n@767	2487 setupNode.appendChild(commonInterface);
n@767	2488 // Now the Metric Node
n@767	2489 var metrics = document.createElement("div");
n@767	2490 metrics.id = "metrics";
n@767	2491 metrics.className = "SecondLevel";
n@767	2492 var title = document.createElement("h3");
n@767	2493 title.textContent = "Metric Collections";
n@767	2494 metrics.appendChild(title);
n@767	2495 var div = document.createElement("div");
n@767	2496 div.name = "attributes";
n@767	2497 metrics.appendChild(div);
n@767	2498 var supportedMetrics;
n@767	2499 switch(select.value)
n@767	2500 {
n@767	2501 case "APE":
n@767	2502 supportedMetrics = APEInterfaceMetrics;
n@767	2503 break;
n@767	2504 case "MUSHRA":
n@767	2505 supportedMetrics = MUSHRAInterfaceMetrics;
n@767	2506 break;
n@767	2507 }
n@767	2508
n@767	2509 for (var i=0; i<supportedMetrics[0].length; i++)
n@767	2510 {
n@767	2511 var span = document.createElement("span");
n@767	2512 span.textContent = supportedMetrics[1][i];
n@767	2513 var input = document.createElement("input");
n@767	2514 input.type = "checkbox";
n@767	2515 input.id = supportedMetrics[0][i];
n@767	2516 div.appendChild(input);
n@767	2517 div.appendChild(span);
n@767	2518 for (var j=0; j<specificationNode.metrics.length; j++)
n@767	2519 {
n@767	2520 if (specificationNode.metrics[j].enabled == supportedMetrics[0][i])
n@767	2521 {
n@767	2522 input.checked = true;
n@767	2523 }
n@767	2524 }
n@767	2525 input.onchange = function(event)
n@767	2526 {
n@767	2527 if (event.currentTarget.checked) {
n@767	2528 specificationNode.metrics.push(new specificationNode.metricNode(event.currentTarget.id));
n@767	2529 } else {
n@767	2530 for (var j=0; j<specificationNode.metrics.length; j++)
n@767	2531 {
n@767	2532 if (specificationNode.metrics[j].enabled == event.currentTarget.id)
n@767	2533 {
n@767	2534 specificationNode.metrics.splice(j,1);
n@767	2535 break;
n@767	2536 }
n@767	2537 }
n@767	2538 }
n@767	2539 };
n@767	2540 }
n@767	2541
n@767	2542 setupNode.appendChild(metrics);
n@767	2543
n@767	2544 // Test Session Pre Test
n@767	2545 var preTest = document.createElement("div");
n@767	2546 preTest.id = "preTest";
n@767	2547 preTest.className = "SecondLevel";
n@767	2548 var title = document.createElement("h3");
n@767	2549 title.textContent = "Pre test Survey";
n@767	2550 preTest.appendChild(title);
n@767	2551 var div = document.createElement("div");
n@767	2552 div.name = "attributes";
n@767	2553 for (var j=0; j<specificationNode.preTest.options.length; j++)
n@767	2554 {
n@767	2555 var node = PPSurveyToHTML(specificationNode.preTest.options[j]);
n@767	2556 node.className = "SecondLevel";
n@767	2557 node.id = preTest.id+"-"+j;
n@767	2558 var del_button = document.createElement("button");
n@767	2559 del_button.textContent = "Delete";
n@767	2560 del_button.onclick = function(event) {
n@767	2561 var node = event.currentTarget.parentElement;
n@767	2562 var id = node.id.split("-")[1];
n@767	2563 specificationNode.preTest.options.splice(id,1);
n@767	2564 node.parentElement.removeChild(node);
n@767	2565 };
n@767	2566 node.appendChild(del_button);
n@767	2567 preTest.appendChild(node);
n@767	2568 }
n@767	2569 setupNode.appendChild(preTest);
n@767	2570
n@767	2571 // Test Session Post Test
n@767	2572 var postTest = document.createElement("div");
n@767	2573 postTest.id = "postTest";
n@767	2574 postTest.className = "SecondLevel";
n@767	2575 var title = document.createElement("h3");
n@767	2576 title.textContent = "Post test Survey";
n@767	2577 postTest.appendChild(title);
n@767	2578 var div = document.createElement("div");
n@767	2579 div.name = "attributes";
n@767	2580
n@767	2581 for (var j=0; j<specificationNode.postTest.options.length; j++)
n@767	2582 {
n@767	2583 var node = PPSurveyToHTML(specificationNode.postTest.options[j]);
n@767	2584 node.className = "SecondLevel";
n@767	2585 node.id = postTest.id+"-"+j;
n@767	2586 var del_button = document.createElement("button");
n@767	2587 del_button.textContent = "Delete";
n@767	2588 del_button.onclick = function(event) {
n@767	2589 var node = event.currentTarget.parentElement;
n@767	2590 var id = node.id.split("-")[1];
n@767	2591 specificationNode.postTest.options.splice(id,1);
n@767	2592 node.parentElement.removeChild(node);
n@767	2593 };
n@767	2594 node.appendChild(del_button);
n@767	2595 postTest.appendChild(node);
n@767	2596 }
n@767	2597
n@767	2598 setupNode.appendChild(postTest);
n@767	2599
n@767	2600 destination.appendChild(setupNode);
n@767	2601
n@767	2602 // Now we step through the AudioHolders
n@767	2603 for (var i=0; i<specificationNode.audioHolders.length; i++)
n@767	2604 {
n@767	2605 var aH = specificationNode.audioHolders[i];
n@767	2606 var aHTML = document.createElement("div");
n@767	2607 aHTML.name = "audioHolder";
n@767	2608 aHTML.id = "audioHolder-"+i;
n@767	2609 aHTML.className = "topLevel";
n@767	2610 aHTML.appendChild(createDeleteNodeButton());
n@767	2611 destination.appendChild(aHTML);
n@767	2612 var title = document.createElement("h2");
n@767	2613 title.textContent = "Audio Holder "+aH.id;
n@767	2614 aHTML.appendChild(title);
n@767	2615 var attributes = document.createElement("div");
n@767	2616 attributes.name = "attributes";
n@767	2617 aHTML.appendChild(attributes);
n@767	2618 var text = document.createElement("span");
n@767	2619 text.textContent = "ID: ";
n@767	2620 var input = document.createElement("input");
n@767	2621 input.id = aHTML.id+"-id";
n@767	2622 input.value = aH.id;
n@767	2623 input.onchange = function()
n@767	2624 {
n@767	2625 var IDSplit = event.currentTarget.id.split('-');
n@767	2626 var aholderID = IDSplit[0]+"-"+IDSplit[1];
n@767	2627 var aholder = document.getElementById(aholderID);
n@767	2628 title = aholder.getElementsByTagName("h2")[0];
n@767	2629 title.textContent = "Audio Holder "+event.currentTarget.value;
n@767	2630 specificationNode.audioHolders[IDSplit[1]].id = event.currentTarget.value;
n@767	2631 };
n@767	2632 text.style.margin = "5px";
n@767	2633 input.style.margin = "5px";
n@767	2634 attributes.appendChild(text);
n@767	2635 attributes.appendChild(input);
n@767	2636 text = document.createElement("span");
n@767	2637 text.textContent = "Host URL: ";
n@767	2638 input = document.createElement("input");
n@767	2639 input.id = aHTML.id+"-hostURL";
n@767	2640 input.value = aH.hostURL;
n@767	2641 input.onchange = function()
n@767	2642 {
n@767	2643 var IDSplit = event.currentTarget.id.split('-');
n@767	2644 specificationNode.audioHolders[IDSplit[1]].hostURL = event.currentTarget.value;
n@767	2645 };
n@767	2646 text.style.margin = "5px";
n@767	2647 input.style.margin = "5px";
n@767	2648 attributes.appendChild(text);
n@767	2649 attributes.appendChild(input);
n@767	2650 text = document.createElement("span");
n@767	2651 text.textContent = "Loop Fragments: ";
n@767	2652 input = document.createElement("input");
n@767	2653 input.id = aHTML.id+"-loop";
n@767	2654 input.type = "checkbox";
n@767	2655 input.checked = aH.loop;
n@767	2656 input.onchange = function()
n@767	2657 {
n@767	2658 var IDSplit = event.currentTarget.id.split('-');
n@767	2659 specificationNode.audioHolders[IDSplit[1]].loop = event.currentTarget.checked;
n@767	2660 };
n@767	2661 text.style.margin = "5px";
n@767	2662 input.style.margin = "5px";
n@767	2663 attributes.appendChild(text);
n@767	2664 attributes.appendChild(input);
n@767	2665 text = document.createElement("span");
n@767	2666 text.textContent = "Randomise Order: ";
n@767	2667 input = document.createElement("input");
n@767	2668 input.id = aHTML.id+"-randomiseOrder";
n@767	2669 input.type = "checkbox";
n@767	2670 input.checked = aH.randomiseOrder;
n@767	2671 input.onchange = function()
n@767	2672 {
n@767	2673 var IDSplit = event.currentTarget.id.split('-');
n@767	2674 specificationNode.audioHolders[IDSplit[1]].randomiseOrder = event.currentTarget.checked;
n@767	2675 };
n@767	2676 text.style.margin = "5px";
n@767	2677 input.style.margin = "5px";
n@767	2678 attributes.appendChild(text);
n@767	2679 attributes.appendChild(input);
n@767	2680 text = document.createElement("span");
n@767	2681 text.textContent = "Show Fragment Comments";
n@767	2682 input = document.createElement("input");
n@767	2683 input.id = aHTML.id+"-elementComments";
n@767	2684 input.type = "checkbox";
n@767	2685 input.checked = aH.elementComments;
n@767	2686 input.onchange = function()
n@767	2687 {
n@767	2688 var IDSplit = event.currentTarget.id.split('-');
n@767	2689 specificationNode.audioHolders[IDSplit[1]].elementComments = event.currentTarget.checked;
n@767	2690 };
n@767	2691 text.style.margin = "5px";
n@767	2692 input.style.margin = "5px";
n@767	2693 attributes.appendChild(text);
n@767	2694 attributes.appendChild(input);
n@767	2695
n@767	2696 // Test Session Pre Test
n@767	2697 var preTest = document.createElement("div");
n@767	2698 preTest.id = aHTML.id+"-pretest";
n@767	2699 preTest.className = "SecondLevel";
n@767	2700 var title = document.createElement("h3");
n@767	2701 title.textContent = "Pre test Survey";
n@767	2702 preTest.appendChild(title);
n@767	2703 var div = document.createElement("div");
n@767	2704 div.name = "attributes";
n@767	2705
n@767	2706 for (var j=0; j<aH.preTest.options.length; j++)
n@767	2707 {
n@767	2708 var node = PPSurveyToHTML(aH.preTest.options[j]);
n@767	2709 node.className = "SecondLevel";
n@767	2710 node.id = preTest.id+"-"+j;
n@767	2711 var button_delete = document.createElement("button");
n@767	2712 button_delete.textContent = "Delete";
n@767	2713 button_delete.onclick = function(event)
n@767	2714 {
n@767	2715 var node = event.currentTarget.parentElement;
n@767	2716 var IDSplit = node.id.split("-");
n@767	2717 var preTest = specificationNode.audioHolders[IDSplit[1]].preTest;
n@767	2718 preTest.options.splice(IDSplit[3],1);
n@767	2719 node.parentElement.removeChild(node);
n@767	2720 };
n@767	2721 node.appendChild(button_delete);
n@767	2722 preTest.appendChild(node);
n@767	2723 }
n@767	2724
n@767	2725 aHTML.appendChild(preTest);
n@767	2726
n@767	2727 // Test Session Post Test
n@767	2728 var postTest = document.createElement("div");
n@767	2729 postTest.id = aHTML.id+"-postTest";
n@767	2730 postTest.className = "SecondLevel";
n@767	2731 var title = document.createElement("h3");
n@767	2732 title.textContent = "Post test Survey";
n@767	2733 postTest.appendChild(title);
n@767	2734 var div = document.createElement("div");
n@767	2735 div.name = "attributes";
n@767	2736
n@767	2737 for (var j=0; j<aH.postTest.options.length; j++)
n@767	2738 {
n@767	2739 var node = PPSurveyToHTML(aH.postTest.options[j]);
n@767	2740 node.className = "SecondLevel";
n@767	2741 node.id = postTest.id+"-"+j;
n@767	2742 var button_delete = document.createElement("button");
n@767	2743 button_delete.textContent = "Delete";
n@767	2744 button_delete.onclick = function(event)
n@767	2745 {
n@767	2746 var node = event.currentTarget.parentElement;
n@767	2747 var IDSplit = node.id.split("-");
n@767	2748 var postTest = specificationNode.audioHolders[IDSplit[1]].postTest;
n@767	2749 postTest.options.splice(IDSplit[3],1);
n@767	2750 node.parentElement.removeChild(node);
n@767	2751 };
n@767	2752 node.appendChild(button_delete);
n@767	2753 postTest.appendChild(node);
n@767	2754 }
n@767	2755
n@767	2756 aHTML.appendChild(postTest);
n@767	2757
n@767	2758 //Audio Elements
n@767	2759 var audioElems = document.createElement("div");
n@767	2760 audioElems.id = aHTML.id+"-audioElements";
n@767	2761 audioElems.className = "SecondLevel";
n@767	2762 var title = document.createElement("h3");
n@767	2763 title.textContent = "Audio Elements";
n@767	2764 audioElems.appendChild(title);
n@767	2765 for (var i=0; i<aH.audioElements.length; i++)
n@767	2766 {
n@767	2767 var entry = document.createElement("div");
n@767	2768 entry.className = "SecondLevel";
n@767	2769 entry.id = audioElems.id+"-"+aH.audioElements[i].id;
n@767	2770 var text = document.createElement("span");
n@767	2771 text.textContent = "ID:";
n@767	2772 var input = document.createElement("input");
n@767	2773 input.id = entry.id+"-id";
n@767	2774 input.value = aH.audioElements[i].id;
n@767	2775 input.onchange = function() {
n@767	2776 var IDSplit = event.currentTarget.id.split("-");
n@767	2777 var ahNode = specificationNode.audioHolders[IDSplit[1]];
n@767	2778 ahNode.audioElements[IDSplit[3]].id = event.currentTarget.value;
n@767	2779 };
n@767	2780 text.style.margin = "5px";
n@767	2781 input.style.margin = "5px";
n@767	2782 entry.appendChild(text);
n@767	2783 entry.appendChild(input);
n@767	2784 text = document.createElement("span");
n@767	2785 text.textContent = "URL:";
n@767	2786 input = document.createElement("input");
n@767	2787 input.id = entry.id+"-URL";
n@767	2788 input.value = aH.audioElements[i].url;
n@767	2789 input.onchange = function() {
n@767	2790 var IDSplit = event.currentTarget.id.split("-");
n@767	2791 var ahNode = specificationNode.audioHolders[IDSplit[1]];
n@767	2792 ahNode.audioElements[IDSplit[3]].url = event.currentTarget.value;
n@767	2793 };
n@767	2794 text.style.margin = "5px";
n@767	2795 input.style.margin = "5px";
n@767	2796 entry.appendChild(text);
n@767	2797 entry.appendChild(input);
n@767	2798 var button_delete = document.createElement("button");
n@767	2799 button_delete.textContent = "Delete";
n@767	2800 button_delete.onclick = function() {
n@767	2801 var node = event.currentTarget.parentElement;
n@767	2802 var IDSplit = node.id.split("-");
n@767	2803 var ahNode = specificationNode.audioHolders[IDSplit[1]];
n@767	2804 ahNode.audioElements.splice(IDSplit[3],1);
n@767	2805 node.parentElement.removeChild(node);
n@767	2806 };
n@767	2807 entry.appendChild(button_delete);
n@767	2808 audioElems.appendChild(entry);
n@767	2809 }
n@767	2810 aHTML.appendChild(audioElems);
n@767	2811 }
n@767	2812
n@767	2813 function PPSurveyToHTML(node)
n@767	2814 {
n@767	2815 var holder = document.createElement("div");
n@767	2816 var title = document.createElement("h4");
n@767	2817 holder.appendChild(title);
n@767	2818 var attributes = document.createElement("div");
n@767	2819 holder.appendChild(attributes);
n@767	2820 switch(node.type)
n@767	2821 {
n@767	2822 case "statement":
n@767	2823 title.textContent = "Statement";
n@767	2824 var tA = document.createElement("textarea");
n@767	2825 attributes.style.height = "150px";
n@767	2826 tA.style.width = "500px";
n@767	2827 tA.style.height = "100px";
n@767	2828 tA.value = node.statement;
n@767	2829 attributes.appendChild(tA);
n@767	2830 break;
n@767	2831 case "question":
n@767	2832 title.textContent = "Question";
n@767	2833 var text = document.createElement("span");
n@767	2834 text.textContent = "ID :";
n@767	2835 var input = document.createElement("input");
n@767	2836 input.name = "id";
n@767	2837 input.value = node.id;
n@767	2838 text.style.margin = "5px";
n@767	2839 input.style.margin = "5px";
n@767	2840 attributes.appendChild(text);
n@767	2841 attributes.appendChild(input);
n@767	2842 text = document.createElement("span");
n@767	2843 text.textContent = "Question";
n@767	2844 input = document.createElement("input");
n@767	2845 input.name = "question";
n@767	2846 input.style.width = "400px";
n@767	2847 input.value = node.question;
n@767	2848 text.style.margin = "5px";
n@767	2849 input.style.margin = "5px";
n@767	2850 attributes.appendChild(text);
n@767	2851 attributes.appendChild(input);
n@767	2852 text = document.createElement("span");
n@767	2853 text.textContent = "Mandatory";
n@767	2854 input = document.createElement("input");
n@767	2855 input.name = "mandatory";
n@767	2856 input.type = "checkbox";
n@767	2857 input.checked = node.mandatory;
n@767	2858 text.style.margin = "5px";
n@767	2859 input.style.margin = "5px";
n@767	2860 attributes.appendChild(text);
n@767	2861 attributes.appendChild(input);
n@767	2862 text = document.createElement("span");
n@767	2863 text.textContent = "Reply box size";
n@767	2864 input = document.createElement("select");
n@767	2865 input.name = "boxsize";
n@767	2866 var option = document.createElement("option");
n@767	2867 option.textContent = "Normal";
n@767	2868 option.value = "normal";
n@767	2869 input.appendChild(option);
n@767	2870 option = document.createElement("option");
n@767	2871 option.textContent = "Large";
n@767	2872 option.value = "large";
n@767	2873 input.appendChild(option);
n@767	2874 option = document.createElement("option");
n@767	2875 option.textContent = "Small";
n@767	2876 option.value = "small";
n@767	2877 input.appendChild(option);
n@767	2878 option = document.createElement("option");
n@767	2879 option.textContent = "Huge";
n@767	2880 option.value = "huge";
n@767	2881 input.appendChild(option);
n@767	2882 text.style.margin = "5px";
n@767	2883 input.style.margin = "5px";
n@767	2884 attributes.appendChild(text);
n@767	2885 attributes.appendChild(input);
n@767	2886 input.value = node.boxsize;
n@767	2887 break;
n@767	2888 }
n@767	2889 return holder;
n@767	2890 }
n@767	2891 }
n@767	2892 function exportToXML()
n@767	2893 {
n@767	2894 var xmlDoc = specificationNode.encode();
n@767	2895 var oSerializer = new XMLSerializer();
n@767	2896 xmlDoc = oSerializer.serializeToString(xmlDoc);
n@767	2897 var parent = document.createElement("div");
n@767	2898 var file = [xmlDoc];
n@767	2899 var bb = new Blob(file,{type : 'application/xml'});
n@767	2900 var dnlk = window.URL.createObjectURL(bb);
n@767	2901 var a = document.createElement("a");
n@767	2902 a.hidden = '';
n@767	2903 a.href = dnlk;
n@767	2904 a.download = "save.xml";
n@767	2905 a.textContent = "Save File";
n@767	2906
n@767	2907 popupInstance.showPopup();
n@767	2908 popupInstance.popupBody.innerHTML = null;
n@767	2909 var body = document.createElement("span");
n@767	2910 body.textContent = "Right click and save the file using the link below. Place this file in your WAET directory as 'project.xml' in the example_eval/ directory. Place your media files in the location specified by the Host URL entries. If you wish to review this XML or edit it, refresh this tool and drag your XML document into the page on the welcome screen.";
n@767	2911 popupInstance.popupBody.appendChild(body);
n@767	2912 popupInstance.popupBody.appendChild(a);
n@767	2913 popupInstance.popupTitle.innerHTML = "<span>Thank You</span>";
n@767	2914 }
n@767	2915 </script>
n@767	2916 <style>
n@767	2917 div.popup {
n@767	2918 width: 500px;
n@767	2919 position: absolute;
n@767	2920 height: 400px;
n@767	2921 background-color: #fff;
n@767	2922 border-radius: 10px;
n@767	2923 box-shadow: 0px 0px 50px #000;
n@767	2924 z-index: 2;
n@767	2925 }
n@767	2926
n@767	2927 button.popupButton {
n@767	2928 /* Button for popup window
n@767	2929 */
n@767	2930 min-width: 50px;
n@767	2931 height: 25px;
n@767	2932 position: relative;
n@767	2933 border-radius: 5px;
n@767	2934 border: #444;
n@767	2935 border-width: 1px;
n@767	2936 border-style: solid;
n@767	2937 background-color: #fff;
n@767	2938 }
n@767	2939
n@767	2940 div.dragndrop {
n@767	2941 margin-top: 10px;
n@767	2942 border:#000000;
n@767	2943 border-style: dashed;
n@767	2944 border-width: 2px;
n@767	2945 }
n@767	2946 div.dndheaderelement {
n@767	2947 float: left;
n@767	2948 height: 100%;
n@767	2949 border-right: #DDDDDD;
n@767	2950 border-right-width: 1px;
n@767	2951 border-right-style: solid;
n@767	2952 }
n@767	2953 div.dndheaderelement span{
n@767	2954 padding-left: 5px;
n@767	2955 }
n@767	2956
n@767	2957 div.topLevel {
n@767	2958 border: #000;
n@767	2959 border-style: solid;
n@767	2960 border-width: 5px;
n@767	2961 padding: 10px;
n@767	2962 margin: 10px;
n@767	2963 }
n@767	2964
n@767	2965 div.SecondLevel {
n@767	2966 border: #000;
n@767	2967 border-style: solid;
n@767	2968 border-width: 1px;
n@767	2969 padding: 10px;
n@767	2970 margin: 10px;
n@767	2971 }
n@767	2972 </style>
n@767	2973 </head>
n@767	2974
n@767	2975 <body>
n@767	2976 <div id="export">
n@767	2977 <button id="exportToXML" onclick="exportToXML();">Export XML</button>
n@767	2978 </div>
n@767	2979 <div id="content"></div>
n@767	2980 </body>
n@767	2981 </html>

Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 776:0795031754d7