webaudioevaluationtool: test_create/test

annotate test_create/test_create.html @ 749:07c996307cbd

Bug #1510 Fixed.

author	Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
date	Mon, 21 Dec 2015 11:53:05 +0000
parents
children	43801b3d6131 2cd9f09455a5

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

Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 749:07c996307cbd