webaudioevaluationtool: test_create/test

annotate test_create/test_create.html @ 490:632c82c7052a Dev_main

Feature #1234: Completed fix

author	Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
date	Tue, 26 Jan 2016 14:20:43 +0000
parents	db353cc479b8
children	9a8ede168aba

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

Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 490:632c82c7052a Dev_main