webaudioevaluationtool: test_create/test

annotate test_create/test_create.html @ 1086:f9c9a40f33bd

Merge. Pull of revision info from dev_main.

author	Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
date	Wed, 23 Dec 2015 14:36:00 +0000
parents	43801b3d6131 888292c88c33
children	eef2d4ea18fb

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

Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 1086:f9c9a40f33bd