webaudioevaluationtool: test_create/test

annotate test_create/test_create.html @ 814:22ad83e232f7

Fixing Win/OSX differences for APE slider, unstable.

author	Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
date	Mon, 23 Nov 2015 17:44:25 +0000
parents
children	1db3dd91fb26

rev	line source
n@814	1 <!DOCTYPE html>
n@814	2 <html lang="en">
n@814	3 <head>
n@814	4 <meta charset="utf-8">
n@814	5
n@814	6 <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
n@814	7 Remove this if you use the .htaccess -->
n@814	8 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
n@814	9
n@814	10 <title>WAET: Test Creator</title>
n@814	11
n@814	12 <meta name="viewport" content="width=device-width; initial-scale=1.0">
n@814	13 <script type="text/javascript">
n@814	14
n@814	15 var APEInterfaceOptions = [["playhead","page-count"],["Show the playhead/scrubber bar", "Show test page count"]];
n@814	16 var APEInterfaceChecks = [["fragmentPlayed","fragmentFullPlayback","fragmentMoved","fragmentComments"],["All Fragments Played","All Fragments Played in entirety","All sliders moved","All fragments have comments"]];
n@814	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@814	18 var MUSHRAInterfaceOptions = [[],[]];
n@814	19 var MUSHRAInterfaceChecks = [["fragmentPlayed","fragmentMoved","fragmentComments"],["All Fragments Played","All sliders moved","All fragments have comments"]];
n@814	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@814	21 var popupInstance;
n@814	22 var specificationNode;
n@814	23 var audioContext;
n@814	24 var audioObjects = [];
n@814	25 window.onload = function()
n@814	26 {
n@814	27 var AudioContext = window.AudioContext \|\| window.webkitAudioContext;
n@814	28 audioContext = new AudioContext;
n@814	29 popupInstance = new popup();
n@814	30 popupInstance.advanceState();
n@814	31 specificationNode = new Specification();
n@814	32 specificationNode.projectReturn = "null";
n@814	33 };
n@814	34
n@814	35 function popup()
n@814	36 {
n@814	37 var x = window.innerWidth;
n@814	38 var y = window.innerHeight;
n@814	39 this.popupHolder = document.createElement('div');
n@814	40 this.popupHolder.style.visibility = 'hidden';
n@814	41 this.popupContent = document.createElement('div');
n@814	42 this.popupTitle = document.createElement('div');
n@814	43 this.popupBody = document.createElement('div');
n@814	44 this.popupFooter = document.createElement('div');
n@814	45 this.popupTitleText = document.createElement('span');
n@814	46 this.popupTitle.appendChild(this.popupTitleText);
n@814	47
n@814	48 this.popupHolder.className = "popup";
n@814	49 this.popupHolder.style.left = (x-500)/2 +'px';
n@814	50 this.popupHolder.style.top = (y-400)/2 + 'px';
n@814	51 this.popupContent.style.padding = "20px";
n@814	52 this.popupHolder.appendChild(this.popupContent);
n@814	53
n@814	54 this.popupTitle.style.width = "100%";
n@814	55 this.popupTitle.style.height = "50px";
n@814	56 this.popupTitle.style.fontSize = "xx-large";
n@814	57 this.popupContent.appendChild(this.popupTitle);
n@814	58
n@814	59 this.popupBody.style.width = "100%";
n@814	60 this.popupBody.style.height = "280px";
n@814	61 this.popupContent.appendChild(this.popupBody);
n@814	62
n@814	63 this.popupFooter.style.width = "100%";
n@814	64 this.popupFooter.style.height = "30px";
n@814	65 this.popupContent.appendChild(this.popupFooter);
n@814	66 var body = document.getElementsByTagName('body')[0];
n@814	67 body.appendChild(this.popupHolder);
n@814	68
n@814	69 this.pageBlank = document.createElement('div');
n@814	70 body.appendChild(this.pageBlank);
n@814	71 this.pageBlank.style.width = "100%";
n@814	72 this.pageBlank.style.height = "100%";
n@814	73 this.pageBlank.style.position = "absolute";
n@814	74 this.pageBlank.style.left = "0px";
n@814	75 this.pageBlank.style.top = "0px";
n@814	76 this.pageBlank.style.backgroundColor = "rgba(0,0,0,0.5)";
n@814	77 this.pageBlank.style.visibility = 'hidden';
n@814	78
n@814	79 this.state = 0;
n@814	80 this.dataTransfer = null;
n@814	81
n@814	82 this.showPopup = function()
n@814	83 {
n@814	84 this.popupHolder.style.visibility = 'visible';
n@814	85 this.popupHolder.style.zIndex = "3";
n@814	86 this.pageBlank.style.visibility = 'visible';
n@814	87 this.pageBlank.style.zIndex = "2";
n@814	88 };
n@814	89
n@814	90 this.hidePopup = function()
n@814	91 {
n@814	92 this.popupHolder.style.visibility = 'hidden';
n@814	93 this.popupHolder.style.zIndex = "-1";
n@814	94 this.pageBlank.style.visibility = 'hidden';
n@814	95 this.pageBlank.style.zIndex = "-2";
n@814	96 };
n@814	97
n@814	98 this.init = function()
n@814	99 {
n@814	100 this.popupTitleText.textContent = "Welcome";
n@814	101 var text = document.createElement('span');
n@814	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@814	103 var dnd = document.createElement('div');
n@814	104 dnd.style.width = "100%";
n@814	105 dnd.style.height = "50px";
n@814	106 dnd.className = "dragndrop";
n@814	107 this.popupBody.appendChild(text);
n@814	108 this.popupBody.appendChild(dnd);
n@814	109 this.showPopup();
n@814	110
n@814	111 var button = document.createElement('button');
n@814	112 button.className = "popupButton";
n@814	113 button.textContent = "New File";
n@814	114 button.onclick = function(event) {
n@814	115 popupInstance.advanceState();
n@814	116 };
n@814	117 this.popupFooter.appendChild(button);
n@814	118 };
n@814	119
n@814	120 this.advanceState = function()
n@814	121 {
n@814	122 this.popupBody.innerHTML = null;
n@814	123 this.popupFooter.innerHTML = null;
n@814	124 this.popupTitleText.textContent = null;
n@814	125 switch(this.state)
n@814	126 {
n@814	127 case 0:
n@814	128 this.init();
n@814	129 break;
n@814	130 case 1:
n@814	131 this.popupTitleText.textContent = "Test Type";
n@814	132 var text = document.createElement("span");
n@814	133 text.textContent = "What type of test would you like to use. Currently APE (Audio Perceptual Evaluation) and MUSHRA style interfaces are available";
n@814	134 this.popupBody.appendChild(text);
n@814	135 var select = document.createElement("select");
n@814	136 select.id="interface-select";
n@814	137 var opt1 = document.createElement("option");
n@814	138 opt1.value = "APE";
n@814	139 opt1.textContent = "APE";
n@814	140 select.appendChild(opt1);
n@814	141 var opt2 = document.createElement("option");
n@814	142 opt2.value = "MUSHRA";
n@814	143 opt2.textContent = "MUSHRA";
n@814	144 select.appendChild(opt2);
n@814	145 this.popupBody.appendChild(select);
n@814	146
n@814	147 var button = document.createElement('button');
n@814	148 button.className = "popupButton";
n@814	149 button.textContent = "Submit";
n@814	150 button.onclick = function(event) {
n@814	151 var select = document.getElementById("interface-select");
n@814	152 specificationNode.interfaceType = select.value;
n@814	153 specificationNode.collectMetrics = true;
n@814	154 popupInstance.advanceState();
n@814	155 };
n@814	156 this.popupFooter.appendChild(button);
n@814	157 break;
n@814	158 case 2:
n@814	159 this.popupTitleText.textContent = "Test Options";
n@814	160 var holder = document.createElement('div');
n@814	161 holder.style.margin = "5px";
n@814	162 var checkbox = document.createElement('input');
n@814	163 checkbox.type = 'checkbox';
n@814	164 checkbox.id = "Randomise-Page";
n@814	165 var text = document.createElement('span');
n@814	166 text.textContent = "Randomise Page Order";
n@814	167 holder.appendChild(checkbox);
n@814	168 holder.appendChild(text);
n@814	169 this.popupBody.appendChild(holder);
n@814	170 switch(specificationNode.interfaceType)
n@814	171 {
n@814	172 case "APE":
n@814	173 for (var i=0; i<APEInterfaceOptions[0].length; i++)
n@814	174 {
n@814	175 holder = document.createElement('div');
n@814	176 holder.style.margin = "5px";
n@814	177 checkbox = document.createElement('input');
n@814	178 checkbox.type = 'checkbox';
n@814	179 checkbox.setAttribute("name","option");
n@814	180 checkbox.id = APEInterfaceOptions[0][i];
n@814	181 text = document.createElement('span');
n@814	182 text.textContent = APEInterfaceOptions[1][i];
n@814	183 holder.appendChild(checkbox);
n@814	184 holder.appendChild(text);
n@814	185 this.popupBody.appendChild(holder);
n@814	186 }
n@814	187 for (var i=0; i<APEInterfaceChecks[0].length; i++)
n@814	188 {
n@814	189 holder = document.createElement('div');
n@814	190 holder.style.margin = "5px";
n@814	191 checkbox = document.createElement('input');
n@814	192 checkbox.type = 'checkbox';
n@814	193 checkbox.setAttribute("name","check");
n@814	194 checkbox.id = APEInterfaceChecks[0][i];
n@814	195 text = document.createElement('span');
n@814	196 text.textContent = APEInterfaceChecks[1][i];
n@814	197 holder.appendChild(checkbox);
n@814	198 holder.appendChild(text);
n@814	199 this.popupBody.appendChild(holder);
n@814	200 }
n@814	201 break;
n@814	202 case "MUSHRA":
n@814	203 for (var i=0; i<MUSHRAInterfaceOptions[0].length; i++)
n@814	204 {
n@814	205 holder = document.createElement('div');
n@814	206 holder.style.margin = "5px";
n@814	207 checkbox = document.createElement('input');
n@814	208 checkbox.type = 'checkbox';
n@814	209 checkbox.setAttribute("name","option");
n@814	210 checkbox.id = MUSHRAInterfaceOptions[0][i];
n@814	211 text = document.createElement('span');
n@814	212 text.textContent = MUSHRAInterfaceOptions[1][i];
n@814	213 holder.appendChild(checkbox);
n@814	214 holder.appendChild(text);
n@814	215 this.popupBody.appendChild(holder);
n@814	216 }
n@814	217 for (var i=0; i<MUSHRAInterfaceChecks[0].length; i++)
n@814	218 {
n@814	219 holder = document.createElement('div');
n@814	220 holder.style.margin = "5px";
n@814	221 checkbox = document.createElement('input');
n@814	222 checkbox.type = 'checkbox';
n@814	223 checkbox.setAttribute("name","check");
n@814	224 checkbox.id = MUSHRAInterfaceChecks[0][i];
n@814	225 text = document.createElement('span');
n@814	226 text.textContent = MUSHRAInterfaceChecks[1][i];
n@814	227 holder.appendChild(checkbox);
n@814	228 holder.appendChild(text);
n@814	229 this.popupBody.appendChild(holder);
n@814	230 }
n@814	231 }
n@814	232 var button = document.createElement('button');
n@814	233 button.className = "popupButton";
n@814	234 button.textContent = "Submit";
n@814	235 button.onclick = function(event) {
n@814	236 var optHold = popupInstance.popupBody;
n@814	237 var opt = optHold.firstChild;
n@814	238 var input = opt.getElementsByTagName('input')[0];
n@814	239 specificationNode.randomiseOrder = input.checked;
n@814	240 while(opt.nextSibling != null)
n@814	241 {
n@814	242 opt = opt.nextSibling;
n@814	243 input = opt.getElementsByTagName('input')[0];
n@814	244 if (input.checked)
n@814	245 {
n@814	246 specificationNode.commonInterface.options.push(new specificationNode.commonInterface.optionNode(input));
n@814	247 }
n@814	248
n@814	249 }
n@814	250 popupInstance.advanceState();
n@814	251 };
n@814	252 this.popupFooter.appendChild(button);
n@814	253 break;
n@814	254 case 3:
n@814	255 audioObjects = [];
n@814	256 this.popupTitleText.textContent = "Test Page";
n@814	257 var span = document.createElement('span');
n@814	258 span.textContent = "Drag and drop your audio files into the box below to add them to a test page";
n@814	259 this.popupBody.appendChild(span);
n@814	260 var dnd = document.createElement('div');
n@814	261 dnd.id = "audio-holder-drop";
n@814	262 dnd.style.width = "100%";
n@814	263 dnd.style.minHeight = "50px";
n@814	264 dnd.style.maxHeight = "220px";
n@814	265 dnd.style.overflow = 'auto';
n@814	266 dnd.className = "dragndrop";
n@814	267 dnd.ondragover = function(e) {
n@814	268 if(e.preventDefault) {e.preventDefault();}
n@814	269 return false;
n@814	270 };
n@814	271 dnd.ondragenter = function(e) {
n@814	272 if(e.preventDefault) {e.preventDefault();}
n@814	273 return false;
n@814	274 };
n@814	275 dnd.ondrop = function(e) {
n@814	276 if(e.preventDefault) {e.preventDefault();}
n@814	277 var dt = e.dataTransfer;
n@814	278 var body = document.getElementById("audio-holder-drop");
n@814	279 var files = dt.files;
n@814	280 for (var i = 0, f; f = files[i]; i++)
n@814	281 {
n@814	282 var ao = new audioObject();
n@814	283 ao.constructTrack(f);
n@814	284 audioObjects.push(ao);
n@814	285 var dndHeader = document.createElement('div');
n@814	286 dndHeader.style.width = "100%";
n@814	287 dndHeader.style.height = "20px";
n@814	288 dndHeader.style.borderBottom = "#DDD";
n@814	289 dndHeader.style.borderBottomWidth = "1px";
n@814	290 dndHeader.style.borderBottomStyle = "solid";
n@814	291 dndHeader.setAttribute('aoID',audioObjects.length-1);
n@814	292 var dndHInclude = document.createElement('div');
n@814	293 dndHInclude.style.width = "30px";
n@814	294 dndHInclude.className = "dndheaderelement";
n@814	295 var includeCheck = document.createElement('input');
n@814	296 includeCheck.type = "checkbox";
n@814	297 includeCheck.name = "include-check";
n@814	298 includeCheck.checked = true;
n@814	299 includeCheck.onchange = function()
n@814	300 {
n@814	301 var i = event.currentTarget.parentElement.parentElement.getAttribute('aoID');
n@814	302 audioObjects[i].include = event.currentTarget.checked;
n@814	303 };
n@814	304 dndHInclude.appendChild(includeCheck);
n@814	305 dndHeader.appendChild(dndHInclude);
n@814	306 var dndHTitle = document.createElement('div');
n@814	307 dndHTitle.style.width = "180px";
n@814	308 dndHTitle.className = "dndheaderelement";
n@814	309 var text = document.createElement('span');
n@814	310 text.textContent = f.name;
n@814	311 dndHTitle.appendChild(text);
n@814	312 dndHeader.appendChild(dndHTitle);
n@814	313 var dndHID = document.createElement('div');
n@814	314 dndHID.style.width = "100px";
n@814	315 dndHID.className = "dndheaderelement";
n@814	316 var IDInput = document.createElement('input');
n@814	317 IDInput.name = "audio-fragment-ID";
n@814	318 IDInput.value = f.name.split('.')[0];
n@814	319 IDInput.onchange = function()
n@814	320 {
n@814	321 var allIDInput = document.getElementsByName("audio-fragment-ID");
n@814	322 var isCopy = new Array(allIDInput.length);
n@814	323 isCopy.fill(0,0,this.length);
n@814	324 if (allIDInput.length > 1)
n@814	325 {
n@814	326 for (var j=0; j<allIDInput.length; j++)
n@814	327 {
n@814	328 var textCompare1 = allIDInput[j].value;
n@814	329 for (var k=j+1; k<allIDInput.length; k++)
n@814	330 {
n@814	331 var textCompare2 = allIDInput[k].value;
n@814	332 if (textCompare1 == textCompare2)
n@814	333 {
n@814	334 isCopy[j] = 1;
n@814	335 isCopy[k] = 1;
n@814	336 }
n@814	337 }
n@814	338 }
n@814	339 }
n@814	340 var button = document.getElementById('submit');
n@814	341 button.disabled = false;
n@814	342 for (var j=0; j<allIDInput.length; j++)
n@814	343 {
n@814	344 if (isCopy[j] == 1)
n@814	345 {
n@814	346 allIDInput[j].style.backgroundColor = '#F22';
n@814	347 button.disabled = true;
n@814	348 }
n@814	349 else
n@814	350 {
n@814	351 allIDInput[j].style.backgroundColor = '#FFF';
n@814	352 audioObjects[j].id = allIDInput[j].value;
n@814	353 }
n@814	354 }
n@814	355 };
n@814	356 IDInput.style.width = "96px";
n@814	357 dndHID.appendChild(IDInput);
n@814	358 dndHeader.appendChild(dndHID);
n@814	359 var dndHPlay = document.createElement('div');
n@814	360 dndHPlay.style.width = "100px";
n@814	361 dndHPlay.className = "dndheaderelement";
n@814	362 var audio = document.createElement('button');
n@814	363 audio.textContent = 'Play';
n@814	364 audio.className = "popupButton";
n@814	365 audio.style.height = "inherit";
n@814	366 audio.onclick = function()
n@814	367 {
n@814	368 var i = event.currentTarget.parentElement.parentElement.getAttribute('aoID');
n@814	369 audioObjects[i].play();
n@814	370 };
n@814	371 dndHPlay.appendChild(audio);
n@814	372 dndHeader.appendChild(dndHPlay);
n@814	373 dnd.appendChild(dndHeader);
n@814	374 IDInput.onchange();
n@814	375 }
n@814	376 };
n@814	377 var dndHeader = document.createElement('div');
n@814	378 dndHeader.style.width = "100%";
n@814	379 dndHeader.style.height = "15px";
n@814	380 dndHeader.style.borderBottom = "#DDD";
n@814	381 dndHeader.style.borderBottomWidth = "1px";
n@814	382 dndHeader.style.borderBottomStyle = "solid";
n@814	383 var dndHInclude = document.createElement('div');
n@814	384 dndHInclude.style.width = "30px";
n@814	385 dndHInclude.className = "dndheaderelement";
n@814	386 var text = document.createElement('span');
n@814	387 text.textContent = "Inc.";
n@814	388 dndHInclude.appendChild(text);
n@814	389 dndHeader.appendChild(dndHInclude);
n@814	390 var dndHTitle = document.createElement('div');
n@814	391 dndHTitle.style.width = "180px";
n@814	392 dndHTitle.className = "dndheaderelement";
n@814	393 text = document.createElement('span');
n@814	394 text.textContent = "File Name";
n@814	395 dndHTitle.appendChild(text);
n@814	396 dndHeader.appendChild(dndHTitle);
n@814	397 var dndHID = document.createElement('div');
n@814	398 dndHID.style.width = "100px";
n@814	399 dndHID.className = "dndheaderelement";
n@814	400 text = document.createElement('span');
n@814	401 text.textContent = "ID";
n@814	402 dndHID.appendChild(text);
n@814	403 dndHeader.appendChild(dndHID);
n@814	404 var dndHPlay = document.createElement('div');
n@814	405 dndHPlay.style.width = "100px";
n@814	406 dndHPlay.className = "dndheaderelement";
n@814	407 text = document.createElement('span');
n@814	408 text.textContent = "Sample";
n@814	409 dndHPlay.appendChild(text);
n@814	410 dndHeader.appendChild(dndHPlay);
n@814	411 dnd.appendChild(dndHeader);
n@814	412 this.popupBody.appendChild(dnd);
n@814	413 var button = document.createElement('button');
n@814	414 button.id = 'submit';
n@814	415 button.className = "popupButton";
n@814	416 button.textContent = "Submit";
n@814	417 button.onclick = function(event)
n@814	418 {
n@814	419 // Construct the audio-holder nodes;
n@814	420 for (var i=0; i<audioObjects.length; i++)
n@814	421 {
n@814	422 if (!audioObjects[i].include)
n@814	423 {
n@814	424 audioObjects.pop(audioObjects[i]);
n@814	425 }
n@814	426 }
n@814	427 if (audioObjects.length != 0)
n@814	428 {
n@814	429 popupInstance.advanceState();
n@814	430 }
n@814	431 };
n@814	432 this.popupFooter.appendChild(button);
n@814	433 break;
n@814	434 case 4:
n@814	435 this.popupTitleText.textContent = "Test Page - Options";
n@814	436 var span = document.createElement('span');
n@814	437 span.textContent = "Set your test page options here";
n@814	438 this.popupBody.appendChild(span);
n@814	439 var pair = document.createElement('div');
n@814	440 pair.style.margin = '5px';
n@814	441 var text = document.createElement('span');
n@814	442 text.textContent = "Page ID:";
n@814	443 var input = document.createElement('input');
n@814	444 input.value = specificationNode.audioHolders.length;
n@814	445 input.id = "id";
n@814	446 pair.appendChild(text);
n@814	447 pair.appendChild(input);
n@814	448 this.popupBody.appendChild(pair);
n@814	449 pair = document.createElement('div');
n@814	450 pair.style.margin = '5px';
n@814	451 text = document.createElement('span');
n@814	452 text.textContent = "Randomise Fragment Order";
n@814	453 input = document.createElement('input');
n@814	454 input.type = "checkbox";
n@814	455 input.id = "randomiseOrder";
n@814	456 pair.appendChild(input);
n@814	457 pair.appendChild(text);
n@814	458 this.popupBody.appendChild(pair);
n@814	459 pair = document.createElement('div');
n@814	460 pair.style.margin = '5px';
n@814	461 text = document.createElement('span');
n@814	462 text.textContent = "Loop Fragment Playback";
n@814	463 input = document.createElement('input');
n@814	464 input.type = "checkbox";
n@814	465 input.id = "loop";
n@814	466 pair.appendChild(input);
n@814	467 pair.appendChild(text);
n@814	468 this.popupBody.appendChild(pair);
n@814	469 pair = document.createElement('div');
n@814	470 pair.style.margin = '5px';
n@814	471 text = document.createElement('span');
n@814	472 text.textContent = "Show fragment comment boxes";
n@814	473 input = document.createElement('input');
n@814	474 input.type = "checkbox";
n@814	475 input.id = "elementComments";
n@814	476 pair.appendChild(input);
n@814	477 pair.appendChild(text);
n@814	478 this.popupBody.appendChild(pair);
n@814	479 var button = document.createElement('button');
n@814	480 button.id = 'submit';
n@814	481 button.className = "popupButton";
n@814	482 button.textContent = "Next";
n@814	483 button.onclick = function(event)
n@814	484 {
n@814	485 var ah = new specificationNode.audioHolderNode(specificationNode);
n@814	486 ah.id = document.getElementById('id').value;
n@814	487 ah.presentedId = specificationNode.audioHolders.length;
n@814	488 ah.hostURL = ah.id+'/';
n@814	489 ah.randomiseOrder = document.getElementById('randomiseOrder').checked;
n@814	490 ah.loop = document.getElementById('loop').checked;
n@814	491 ah.elementComments = document.getElementById('elementComments').checked;
n@814	492 for (var i=0; i<audioObjects.length; i++)
n@814	493 {
n@814	494 ah.audioElements.push(new ah.audioElementNode(ah,audioObjects[i]));
n@814	495 }
n@814	496 specificationNode.audioHolders.push(ah);
n@814	497 popupInstance.advanceState();
n@814	498 };
n@814	499 this.popupFooter.appendChild(button);
n@814	500 break;
n@814	501 case 5:
n@814	502 this.dataTransfer = null;
n@814	503 this.popupTitleText.textContent = "Test Page - Pre/Post Survey";
n@814	504 var span = document.createElement('span');
n@814	505 span.textContent = "Add your pre test page options here";
n@814	506 this.popupBody.appendChild(span);
n@814	507 var preHolder = document.createElement('div');
n@814	508 preHolder.id = "preHolder";
n@814	509 preHolder.style.width = "460px";
n@814	510 preHolder.style.minHeight = "100px";
n@814	511 preHolder.style.maxHeight = "220px";
n@814	512 preHolder.style.overflow = 'auto';
n@814	513 preHolder.style.border = "black";
n@814	514 preHolder.style.borderStyle = "solid";
n@814	515 preHolder.style.borderWidth = "1px";
n@814	516 this.popupBody.appendChild(preHolder);
n@814	517 var audioHolder = specificationNode.audioHolders[specificationNode.audioHolders.length-1];
n@814	518 var preHeaderHolder = document.createElement('div');
n@814	519 preHeaderHolder.style.width = "456px";
n@814	520 preHeaderHolder.style.height= "20px";
n@814	521 preHeaderHolder.style.margin= "2px";
n@814	522 preHeaderHolder.style.borderBottom = "#DDD";
n@814	523 preHeaderHolder.style.borderBottomWidth = "1px";
n@814	524 preHeaderHolder.style.borderBottomStyle = "solid";
n@814	525 var mvH = document.createElement('div');
n@814	526 mvH.className = "dndheaderelement";
n@814	527 mvH.style.width = "50px";
n@814	528 var text = document.createElement('span');
n@814	529 text.textContent = "Order";
n@814	530 mvH.appendChild(text);
n@814	531 preHeaderHolder.appendChild(mvH);
n@814	532 var idH = document.createElement('div');
n@814	533 idH.className = "dndheaderelement";
n@814	534 idH.style.width = "150px";
n@814	535 text = document.createElement('span');
n@814	536 text.textContent = "ID";
n@814	537 idH.appendChild(text);
n@814	538 preHeaderHolder.appendChild(idH);
n@814	539 var tH = document.createElement('div');
n@814	540 tH.className = "dndheaderelement";
n@814	541 tH.style.width = "150px";
n@814	542 text = document.createElement('span');
n@814	543 text.textContent = "Type";
n@814	544 tH.appendChild(text);
n@814	545 preHeaderHolder.appendChild(tH);
n@814	546 var editH = document.createElement('div');
n@814	547 editH.className = "dndheaderelement";
n@814	548 editH.style.width = "50px";
n@814	549 text = document.createElement('span');
n@814	550 text.textContent = "Edit";
n@814	551 editH.appendChild(text);
n@814	552 preHeaderHolder.appendChild(editH);
n@814	553 var deleteH = document.createElement('div');
n@814	554 deleteH.className = "dndheaderelement";
n@814	555 deleteH.style.width = "50px";
n@814	556 text = document.createElement('span');
n@814	557 text.textContent = "Delete";
n@814	558 deleteH.appendChild(text);
n@814	559 preHeaderHolder.appendChild(deleteH);
n@814	560 preHolder.appendChild(preHeaderHolder);
n@814	561
n@814	562
n@814	563 for (var i=0; i<audioHolder.preTest.options.length; i++)
n@814	564 {
n@814	565 var optionNode = audioHolder.preTest.options[i];
n@814	566 var entry = document.createElement('div');
n@814	567 entry.style.width = "456px";
n@814	568 entry.style.height= "20px";
n@814	569 entry.style.margin= "2px";
n@814	570 entry.style.borderBottom = "#DDD";
n@814	571 entry.style.borderBottomWidth = "1px";
n@814	572 entry.style.borderBottomStyle = "solid";
n@814	573 entry.setAttribute("node-id",i);
n@814	574 var node = audioHolder.preTest.options[i];
n@814	575 var mvH = document.createElement('div');
n@814	576 mvH.className = "dndheaderelement";
n@814	577 mvH.style.width = "50px";
n@814	578 var mvup = document.createElement("button");
n@814	579 mvup.textContent = "Up";
n@814	580 mvup.style.width = "25px";
n@814	581 mvup.style.padding = "1px 0px";
n@814	582 mvup.onclick = function()
n@814	583 {
n@814	584 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	585 if (i != 0)
n@814	586 {
n@814	587 var next = audioHolder.preTest.options[i-1];
n@814	588 var cur = audioHolder.preTest.options[i];
n@814	589 audioHolder.preTest.options[i-1] = cur;
n@814	590 audioHolder.preTest.options[i] = next;
n@814	591 popupInstance.state = 5;
n@814	592 popupInstance.advanceState();
n@814	593 }
n@814	594 };
n@814	595 mvH.appendChild(mvup);
n@814	596 var mvdn = document.createElement("button");
n@814	597 mvdn.textContent = "Dn";
n@814	598 mvdn.style.width = "25px";
n@814	599 mvdn.style.padding = "1px 0px";
n@814	600 mvdn.onclick = function()
n@814	601 {
n@814	602 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	603 if (i != audioHolder.preTest.options.length-1)
n@814	604 {
n@814	605 var next = audioHolder.preTest.options[i+1];
n@814	606 var cur = audioHolder.preTest.options[i];
n@814	607 audioHolder.preTest.options[i+1] = cur;
n@814	608 audioHolder.preTest.options[i] = next;
n@814	609 popupInstance.state = 5;
n@814	610 popupInstance.advanceState();
n@814	611 }
n@814	612 };
n@814	613 mvH.appendChild(mvdn);
n@814	614 entry.appendChild(mvH);
n@814	615 var idH = document.createElement('div');
n@814	616 idH.className = "dndheaderelement";
n@814	617 idH.style.width = "150px";
n@814	618 if (optionNode.type != "statement")
n@814	619 {
n@814	620 var span = document.createElement('span');
n@814	621 span.textContent = optionNode.id;
n@814	622 idH.appendChild(span);
n@814	623 }
n@814	624 entry.appendChild(idH);
n@814	625 var typeH = document.createElement('div');
n@814	626 typeH.className = "dndheaderelement";
n@814	627 typeH.style.width = "150px";
n@814	628 var span = document.createElement('span');
n@814	629 span.textContent = optionNode.type;
n@814	630 typeH.appendChild(span);
n@814	631 entry.appendChild(typeH);
n@814	632 var editH = document.createElement('div');
n@814	633 editH.className = "dndheaderelement";
n@814	634 editH.style.width = "50px";
n@814	635 var editButton = document.createElement("button");
n@814	636 editButton.textContent = "Edit";
n@814	637 editButton.style.width = "48px";
n@814	638 editButton.style.padding = "1px 0px";
n@814	639 editButton.onclick = function()
n@814	640 {
n@814	641 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	642 popupInstance.dataTransfer = new function() {
n@814	643 this.title = "Edit Test Node";
n@814	644 this.parent = specificationNode.audioHolders[specificationNode.audioHolders.length-1].preTest;
n@814	645 this.node = this.parent.options[i];
n@814	646 this.previousState = 5;
n@814	647 };
n@814	648 popupInstance.advanceState();
n@814	649 };
n@814	650 editH.appendChild(editButton);
n@814	651 entry.appendChild(editH);
n@814	652 var deleteH = document.createElement('div');
n@814	653 deleteH.className = "dndheaderelement";
n@814	654 deleteH.style.width = "50px";
n@814	655 var deleteButton = document.createElement("button");
n@814	656 deleteButton.textContent = "Del";
n@814	657 deleteButton.style.width = "48px";
n@814	658 deleteButton.style.padding = "1px 0px";
n@814	659 deleteButton.onclick = function()
n@814	660 {
n@814	661 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	662 var j = i+1;
n@814	663 while(j < audioHolder.preTest.options.length)
n@814	664 {
n@814	665 audioHolder.preTest.options[i] = audioHolder.preTest.options[j];
n@814	666 j++;
n@814	667 i++;
n@814	668 }
n@814	669 audioHolder.preTest.options.pop();
n@814	670 popupInstance.state = 5;
n@814	671 popupInstance.advanceState();
n@814	672 };
n@814	673 deleteH.appendChild(deleteButton);
n@814	674 entry.appendChild(deleteH);
n@814	675 preHolder.appendChild(entry);
n@814	676 }
n@814	677 var entry = document.createElement('div');
n@814	678 entry.style.width = "456px";
n@814	679 entry.style.height= "20px";
n@814	680 entry.style.margin= "2px";
n@814	681 entry.style.borderBottom = "#DDD";
n@814	682 entry.style.borderBottomWidth = "1px";
n@814	683 entry.style.borderBottomStyle = "solid";
n@814	684 entry.align = "center";
n@814	685 var addPre = document.createElement('button');
n@814	686 addPre.className = "popupButton";
n@814	687 addPre.textContent = "Add New Entry";
n@814	688 addPre.style.height = "20px";
n@814	689 addPre.onclick = function()
n@814	690 {
n@814	691 popupInstance.dataTransfer = new function() {
n@814	692 this.title = "New Pre Test Node";
n@814	693 this.parent = specificationNode.audioHolders[specificationNode.audioHolders.length-1].preTest;
n@814	694 this.node = null;
n@814	695 this.previousState = 5;
n@814	696 };
n@814	697 popupInstance.advanceState();
n@814	698 };
n@814	699 entry.appendChild(addPre);
n@814	700 preHolder.appendChild(entry);
n@814	701
n@814	702 var span = document.createElement('span');
n@814	703 span.textContent = "Add your post test page options here";
n@814	704 this.popupBody.appendChild(span);
n@814	705 var postHolder = document.createElement('div');
n@814	706 postHolder.id = "preHolder";
n@814	707 postHolder.style.width = "100%";
n@814	708 postHolder.style.minHeight = "100px";
n@814	709 postHolder.style.maxHeight = "220px";
n@814	710 postHolder.style.overflow = 'auto';
n@814	711 postHolder.style.border = "black";
n@814	712 postHolder.style.borderStyle = "solid";
n@814	713 postHolder.style.borderWidth = "1px";
n@814	714 this.popupBody.appendChild(postHolder);
n@814	715 var postHeaderHolder = document.createElement('div');
n@814	716 postHeaderHolder.style.width = "456px";
n@814	717 postHeaderHolder.style.height= "20px";
n@814	718 postHeaderHolder.style.margin= "2px";
n@814	719 postHeaderHolder.style.borderBottom = "#DDD";
n@814	720 postHeaderHolder.style.borderBottomWidth = "1px";
n@814	721 postHeaderHolder.style.borderBottomStyle = "solid";
n@814	722 var mvH = document.createElement('div');
n@814	723 mvH.className = "dndheaderelement";
n@814	724 mvH.style.width = "50px";
n@814	725 var text = document.createElement('span');
n@814	726 text.textContent = "Order";
n@814	727 mvH.appendChild(text);
n@814	728 postHeaderHolder.appendChild(mvH);
n@814	729 var idH = document.createElement('div');
n@814	730 idH.className = "dndheaderelement";
n@814	731 idH.style.width = "150px";
n@814	732 text = document.createElement('span');
n@814	733 text.textContent = "ID";
n@814	734 idH.appendChild(text);
n@814	735 postHeaderHolder.appendChild(idH);
n@814	736 var tH = document.createElement('div');
n@814	737 tH.className = "dndheaderelement";
n@814	738 tH.style.width = "150px";
n@814	739 text = document.createElement('span');
n@814	740 text.textContent = "Type";
n@814	741 tH.appendChild(text);
n@814	742 postHeaderHolder.appendChild(tH);
n@814	743 var editH = document.createElement('div');
n@814	744 editH.className = "dndheaderelement";
n@814	745 editH.style.width = "50px";
n@814	746 text = document.createElement('span');
n@814	747 text.textContent = "Edit";
n@814	748 editH.appendChild(text);
n@814	749 postHeaderHolder.appendChild(editH);
n@814	750 var deleteH = document.createElement('div');
n@814	751 deleteH.className = "dndheaderelement";
n@814	752 deleteH.style.width = "50px";
n@814	753 text = document.createElement('span');
n@814	754 text.textContent = "Delete";
n@814	755 deleteH.appendChild(text);
n@814	756 postHeaderHolder.appendChild(deleteH);
n@814	757 postHolder.appendChild(postHeaderHolder);
n@814	758
n@814	759 for (var i=0; i<audioHolder.postTest.options.length; i++)
n@814	760 {
n@814	761 var optionNode = audioHolder.postTest.options[i];
n@814	762 var entry = document.createElement('div');
n@814	763 entry.style.width = "456px";
n@814	764 entry.style.height= "20px";
n@814	765 entry.style.margin= "2px";
n@814	766 entry.style.borderBottom = "#DDD";
n@814	767 entry.style.borderBottomWidth = "1px";
n@814	768 entry.style.borderBottomStyle = "solid";
n@814	769 entry.setAttribute("node-id",i);
n@814	770 var node = audioHolder.postTest.options[i];
n@814	771 var mvH = document.createElement('div');
n@814	772 mvH.className = "dndheaderelement";
n@814	773 mvH.style.width = "50px";
n@814	774 var mvup = document.createElement("button");
n@814	775 mvup.textContent = "Up";
n@814	776 mvup.style.width = "25px";
n@814	777 mvup.style.padding = "1px 0px";
n@814	778 mvup.onclick = function()
n@814	779 {
n@814	780 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	781 if (i != 0)
n@814	782 {
n@814	783 var next = audioHolder.postTest.options[i-1];
n@814	784 var cur = audioHolder.postTest.options[i];
n@814	785 audioHolder.postTest.options[i-1] = cur;
n@814	786 audioHolder.postTest.options[i] = next;
n@814	787 popupInstance.state = 5;
n@814	788 popupInstance.advanceState();
n@814	789 }
n@814	790 };
n@814	791 mvH.appendChild(mvup);
n@814	792 var mvdn = document.createElement("button");
n@814	793 mvdn.textContent = "Dn";
n@814	794 mvdn.style.width = "25px";
n@814	795 mvdn.style.padding = "1px 0px";
n@814	796 mvdn.onclick = function()
n@814	797 {
n@814	798 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	799 if (i != audioHolder.postTest.options.length-1)
n@814	800 {
n@814	801 var next = audioHolder.postTest.options[i+1];
n@814	802 var cur = audioHolder.postTest.options[i];
n@814	803 audioHolder.postTest.options[i+1] = cur;
n@814	804 audioHolder.postTest.options[i] = next;
n@814	805 popupInstance.state = 5;
n@814	806 popupInstance.advanceState();
n@814	807 }
n@814	808 };
n@814	809 mvH.appendChild(mvdn);
n@814	810 entry.appendChild(mvH);
n@814	811 var idH = document.createElement('div');
n@814	812 idH.className = "dndheaderelement";
n@814	813 idH.style.width = "150px";
n@814	814 if (optionNode.type != "statement")
n@814	815 {
n@814	816 var span = document.createElement('span');
n@814	817 span.textContent = optionNode.id;
n@814	818 idH.appendChild(span);
n@814	819 }
n@814	820 entry.appendChild(idH);
n@814	821 var typeH = document.createElement('div');
n@814	822 typeH.className = "dndheaderelement";
n@814	823 typeH.style.width = "150px";
n@814	824 var span = document.createElement('span');
n@814	825 span.textContent = optionNode.type;
n@814	826 typeH.appendChild(span);
n@814	827 entry.appendChild(typeH);
n@814	828 var editH = document.createElement('div');
n@814	829 editH.className = "dndheaderelement";
n@814	830 editH.style.width = "50px";
n@814	831 var editButton = document.createElement("button");
n@814	832 editButton.textContent = "Edit";
n@814	833 editButton.style.width = "48px";
n@814	834 editButton.style.padding = "1px 0px";
n@814	835 editButton.onclick = function()
n@814	836 {
n@814	837 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	838 popupInstance.dataTransfer = new function() {
n@814	839 this.title = "Edit Test Node";
n@814	840 this.parent = specificationNode.audioHolders[specificationNode.audioHolders.length-1].postTest;
n@814	841 this.node = this.parent.options[i];
n@814	842 this.previousState = 5;
n@814	843 };
n@814	844 popupInstance.advanceState();
n@814	845 };
n@814	846 editH.appendChild(editButton);
n@814	847 entry.appendChild(editH);
n@814	848 var deleteH = document.createElement('div');
n@814	849 deleteH.className = "dndheaderelement";
n@814	850 deleteH.style.width = "50px";
n@814	851 var deleteButton = document.createElement("button");
n@814	852 deleteButton.textContent = "Del";
n@814	853 deleteButton.style.width = "48px";
n@814	854 deleteButton.style.padding = "1px 0px";
n@814	855 deleteButton.onclick = function()
n@814	856 {
n@814	857 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	858 var j = i+1;
n@814	859 while(j < audioHolder.postTest.options.length)
n@814	860 {
n@814	861 audioHolder.postTest.options[i] = audioHolder.postTest.options[j];
n@814	862 j++;
n@814	863 i++;
n@814	864 }
n@814	865 audioHolder.postTest.options.pop();
n@814	866 popupInstance.state = 5;
n@814	867 popupInstance.advanceState();
n@814	868 };
n@814	869 deleteH.appendChild(deleteButton);
n@814	870 entry.appendChild(deleteH);
n@814	871 postHolder.appendChild(entry);
n@814	872 }
n@814	873
n@814	874 var entry = document.createElement('div');
n@814	875 entry.style.width = "456px";
n@814	876 entry.style.height= "20px";
n@814	877 entry.style.margin= "2px";
n@814	878 entry.style.borderBottom = "#DDD";
n@814	879 entry.style.borderBottomWidth = "1px";
n@814	880 entry.style.borderBottomStyle = "solid";
n@814	881 entry.align = "center";
n@814	882 var addPost = document.createElement('button');
n@814	883 addPost.className = "popupButton";
n@814	884 addPost.textContent = "Add New Entry";
n@814	885 addPost.style.height = "20px";
n@814	886 addPost.onclick = function()
n@814	887 {
n@814	888 popupInstance.dataTransfer = new function() {
n@814	889 this.title = "New Pre Test Node";
n@814	890 this.parent = specificationNode.audioHolders[specificationNode.audioHolders.length-1].postTest;
n@814	891 this.node = null;
n@814	892 this.previousState = 5;
n@814	893 };
n@814	894 popupInstance.advanceState();
n@814	895 };
n@814	896 entry.appendChild(addPost);
n@814	897 postHolder.appendChild(entry);
n@814	898
n@814	899 var button = document.createElement('button');
n@814	900 button.id = 'submit';
n@814	901 button.className = "popupButton";
n@814	902 button.textContent = "Finish";
n@814	903 button.onclick = function(event)
n@814	904 {
n@814	905 popupInstance.state = 7;
n@814	906 popupInstance.advanceState();
n@814	907 };
n@814	908 this.popupFooter.appendChild(button);
n@814	909 button = document.createElement('button');
n@814	910 button.id = 'submit';
n@814	911 button.className = "popupButton";
n@814	912 button.textContent = "Add Another Page";
n@814	913 button.onclick = function(event)
n@814	914 {
n@814	915 popupInstance.state = 3;
n@814	916 popupInstance.advanceState();
n@814	917 };
n@814	918 this.popupFooter.appendChild(button);
n@814	919 break;
n@814	920 case 6:
n@814	921 this.popupTitleText.textContent = this.dataTransfer.title;
n@814	922 var span = document.createElement('span');
n@814	923 span.textContent = "Select survey settings here";
n@814	924 this.popupBody.appendChild(span);
n@814	925 var div = document.createElement('div');
n@814	926 span = document.createElement("span");
n@814	927 span.textContent = "Survey Type";
n@814	928 var select = document.createElement("select");
n@814	929 select.id="survey-select";
n@814	930 var option = document.createElement('option');
n@814	931 option.textContent = "Statement";
n@814	932 option.value = "statement";
n@814	933 select.appendChild(option);
n@814	934 option = document.createElement('option');
n@814	935 option.textContent = "Question";
n@814	936 option.value = "question";
n@814	937 select.appendChild(option);
n@814	938 option = document.createElement('option');
n@814	939 option.textContent = "Number";
n@814	940 option.value = "number";
n@814	941 select.appendChild(option);
n@814	942 option = document.createElement('option');
n@814	943 option.textContent = "Radio";
n@814	944 option.value = "radio";
n@814	945 select.appendChild(option);
n@814	946 option = document.createElement('option');
n@814	947 option.textContent = "Checkbox";
n@814	948 option.value = "checkbox";
n@814	949 select.appendChild(option);
n@814	950 this.popupBody.appendChild(select);
n@814	951 var options = document.createElement('div');
n@814	952 options.id = "survey-options";
n@814	953 this.popupBody.appendChild(options);
n@814	954 var button = document.createElement('button');
n@814	955 button.id = 'submit';
n@814	956 button.className = "popupButton";
n@814	957 button.textContent = "Add";
n@814	958 button.onclick = function(event)
n@814	959 {
n@814	960 var parent = popupInstance.dataTransfer.parent;
n@814	961 if (popupInstance.dataTransfer.node == null)
n@814	962 {
n@814	963 var node = new parent.OptionNode();
n@814	964 } else
n@814	965 {
n@814	966 var node = popupInstance.dataTransfer.node;
n@814	967 }
n@814	968 node.type = document.getElementById("survey-select").value;
n@814	969 switch(node.type)
n@814	970 {
n@814	971 case "statement":
n@814	972 node.statement = document.getElementById("statement").value;
n@814	973 break;
n@814	974 case "question":
n@814	975 node.question = document.getElementById("question").value;
n@814	976 node.id = document.getElementById("ID").value;
n@814	977 node.mandatory = document.getElementById("mandatory").checked;
n@814	978 node.boxsize = document.getElementById("boxsize").value;
n@814	979 break;
n@814	980 }
n@814	981 if (popupInstance.dataTransfer.node == null)
n@814	982 {parent.options.push(node);}
n@814	983 popupInstance.state = popupInstance.dataTransfer.previousState;
n@814	984 popupInstance.advanceState();
n@814	985 };
n@814	986 this.popupFooter.appendChild(button);
n@814	987 select.onchange = function()
n@814	988 {
n@814	989 var options = document.getElementById("survey-options");
n@814	990 options.innerHTML = null;
n@814	991 switch(this.value)
n@814	992 {
n@814	993 case "statement":
n@814	994 var span = document.createElement('span');
n@814	995 span.textContent = "Enter Statement";
n@814	996 var tA = document.createElement('textarea');
n@814	997 tA.id = "statement";
n@814	998 tA.style.width = "460px";
n@814	999 tA.style.height = "96px";
n@814	1000 if (popupInstance.dataTransfer.node != null)
n@814	1001 {tA.value = this.dataTransfer.node.statement;}
n@814	1002 options.appendChild(span);
n@814	1003 options.appendChild(tA);
n@814	1004 break;
n@814	1005 case "question":
n@814	1006 var span = document.createElement('span');
n@814	1007 span.textContent = "Enter Question";
n@814	1008 var tA = document.createElement('textarea');
n@814	1009 tA.style.width = "460px";
n@814	1010 tA.style.height = "54px";
n@814	1011 tA.id = "question";
n@814	1012 options.appendChild(span);
n@814	1013 options.appendChild(tA);
n@814	1014 var div = document.createElement('div');
n@814	1015 var input = document.createElement('input');
n@814	1016 input.id = "ID";
n@814	1017 span = document.createElement('span');
n@814	1018 span.textContent = "ID:";
n@814	1019 div.appendChild(span);
n@814	1020 div.appendChild(input);
n@814	1021 options.appendChild(div);
n@814	1022 div = document.createElement('div');
n@814	1023 input = document.createElement('input');
n@814	1024 input.type = "checkbox";
n@814	1025 input.id = "mandatory";
n@814	1026 span = document.createElement('span');
n@814	1027 span.textContent = "Mandatory";
n@814	1028 div.appendChild(span);
n@814	1029 div.appendChild(input);
n@814	1030 options.appendChild(div);
n@814	1031 div = document.createElement('div');
n@814	1032 var boxsize = document.createElement("select");
n@814	1033 boxsize.id = "boxsize";
n@814	1034 var selOpt = document.createElement("option");
n@814	1035 selOpt.value = "normal";
n@814	1036 selOpt.textContent = "Normal";
n@814	1037 boxsize.appendChild(selOpt);
n@814	1038 selOpt = document.createElement("option");
n@814	1039 selOpt.value = "small";
n@814	1040 selOpt.textContent = "Small";
n@814	1041 boxsize.appendChild(selOpt);
n@814	1042 selOpt = document.createElement("option");
n@814	1043 selOpt.value = "large";
n@814	1044 selOpt.textContent = "Large";
n@814	1045 boxsize.appendChild(selOpt);
n@814	1046 selOpt = document.createElement("option");
n@814	1047 selOpt.value = "huge";
n@814	1048 selOpt.textContent = "Huge";
n@814	1049 boxsize.appendChild(selOpt);
n@814	1050 span = document.createElement('span');
n@814	1051 span.textContent = "Response Text Area";
n@814	1052 div.appendChild(span);
n@814	1053 div.appendChild(boxsize);
n@814	1054 options.appendChild(div);
n@814	1055 if (popupInstance.dataTransfer.node != null)
n@814	1056 {
n@814	1057 tA.value = popupInstance.dataTransfer.node.question;
n@814	1058 document.getElementById("ID").value = popupInstance.dataTransfer.node.id;
n@814	1059 document.getElementById("mandatory").value = popupInstance.dataTransfer.node.mandatory;
n@814	1060 document.getElementById("boxsize").value = popupInstance.dataTransfer.node.boxsize;
n@814	1061 }
n@814	1062 break;
n@814	1063 case "number":
n@814	1064 var span = document.createElement('span');
n@814	1065 span.textContent = "Enter Question";
n@814	1066 var tA = document.createElement('textarea');
n@814	1067 tA.style.width = "460px";
n@814	1068 tA.style.height = "54px";
n@814	1069 tA.id = "question";
n@814	1070 options.appendChild(span);
n@814	1071 options.appendChild(tA);
n@814	1072 var div = document.createElement('div');
n@814	1073 var input = document.createElement('input');
n@814	1074 input.id = "ID";
n@814	1075 span = document.createElement('span');
n@814	1076 span.textContent = "ID:";
n@814	1077 div.appendChild(span);
n@814	1078 div.appendChild(input);
n@814	1079 options.appendChild(div);
n@814	1080 div = document.createElement('div');
n@814	1081 input = document.createElement('input');
n@814	1082 input.type = "checkbox";
n@814	1083 input.id = "mandatory";
n@814	1084 span = document.createElement('span');
n@814	1085 span.textContent = "Mandatory";
n@814	1086 div.appendChild(span);
n@814	1087 div.appendChild(input);
n@814	1088 options.appendChild(div);
n@814	1089 div = document.createElement('div');
n@814	1090 break;
n@814	1091 }
n@814	1092 };
n@814	1093 if (this.dataTransfer.node != null)
n@814	1094 {
n@814	1095 select.value = this.dataTransfer.node.type;
n@814	1096 }
n@814	1097 select.onchange();
n@814	1098 break;
n@814	1099 case 7:
n@814	1100 this.dataTransfer = null;
n@814	1101 this.popupTitleText.textContent = "Test Session - Pre/Post Survey";
n@814	1102 var span = document.createElement('span');
n@814	1103 span.textContent = "Add your pre test session and post test session survey options here";
n@814	1104 this.popupBody.appendChild(span);
n@814	1105 var preHolder = document.createElement('div');
n@814	1106 preHolder.id = "preHolder";
n@814	1107 preHolder.style.width = "460px";
n@814	1108 preHolder.style.minHeight = "100px";
n@814	1109 preHolder.style.maxHeight = "220px";
n@814	1110 preHolder.style.overflow = 'auto';
n@814	1111 preHolder.style.border = "black";
n@814	1112 preHolder.style.borderStyle = "solid";
n@814	1113 preHolder.style.borderWidth = "1px";
n@814	1114 this.popupBody.appendChild(preHolder);
n@814	1115 var preHeaderHolder = document.createElement('div');
n@814	1116 preHeaderHolder.style.width = "456px";
n@814	1117 preHeaderHolder.style.height= "20px";
n@814	1118 preHeaderHolder.style.margin= "2px";
n@814	1119 preHeaderHolder.style.borderBottom = "#DDD";
n@814	1120 preHeaderHolder.style.borderBottomWidth = "1px";
n@814	1121 preHeaderHolder.style.borderBottomStyle = "solid";
n@814	1122 var mvH = document.createElement('div');
n@814	1123 mvH.className = "dndheaderelement";
n@814	1124 mvH.style.width = "50px";
n@814	1125 var text = document.createElement('span');
n@814	1126 text.textContent = "Order";
n@814	1127 mvH.appendChild(text);
n@814	1128 preHeaderHolder.appendChild(mvH);
n@814	1129 var idH = document.createElement('div');
n@814	1130 idH.className = "dndheaderelement";
n@814	1131 idH.style.width = "150px";
n@814	1132 text = document.createElement('span');
n@814	1133 text.textContent = "ID";
n@814	1134 idH.appendChild(text);
n@814	1135 preHeaderHolder.appendChild(idH);
n@814	1136 var tH = document.createElement('div');
n@814	1137 tH.className = "dndheaderelement";
n@814	1138 tH.style.width = "150px";
n@814	1139 text = document.createElement('span');
n@814	1140 text.textContent = "Type";
n@814	1141 tH.appendChild(text);
n@814	1142 preHeaderHolder.appendChild(tH);
n@814	1143 var editH = document.createElement('div');
n@814	1144 editH.className = "dndheaderelement";
n@814	1145 editH.style.width = "50px";
n@814	1146 text = document.createElement('span');
n@814	1147 text.textContent = "Edit";
n@814	1148 editH.appendChild(text);
n@814	1149 preHeaderHolder.appendChild(editH);
n@814	1150 var deleteH = document.createElement('div');
n@814	1151 deleteH.className = "dndheaderelement";
n@814	1152 deleteH.style.width = "50px";
n@814	1153 text = document.createElement('span');
n@814	1154 text.textContent = "Delete";
n@814	1155 deleteH.appendChild(text);
n@814	1156 preHeaderHolder.appendChild(deleteH);
n@814	1157 preHolder.appendChild(preHeaderHolder);
n@814	1158
n@814	1159
n@814	1160 for (var i=0; i<specificationNode.preTest.options.length; i++)
n@814	1161 {
n@814	1162 var optionNode = specificationNode.preTest.options[i];
n@814	1163 var entry = document.createElement('div');
n@814	1164 entry.style.width = "456px";
n@814	1165 entry.style.height= "20px";
n@814	1166 entry.style.margin= "2px";
n@814	1167 entry.style.borderBottom = "#DDD";
n@814	1168 entry.style.borderBottomWidth = "1px";
n@814	1169 entry.style.borderBottomStyle = "solid";
n@814	1170 entry.setAttribute("node-id",i);
n@814	1171 var node = specificationNode.preTest.options[i];
n@814	1172 var mvH = document.createElement('div');
n@814	1173 mvH.className = "dndheaderelement";
n@814	1174 mvH.style.width = "50px";
n@814	1175 var mvup = document.createElement("button");
n@814	1176 mvup.textContent = "Up";
n@814	1177 mvup.style.width = "25px";
n@814	1178 mvup.style.padding = "1px 0px";
n@814	1179 mvup.onclick = function()
n@814	1180 {
n@814	1181 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	1182 if (i != 0)
n@814	1183 {
n@814	1184 var next = specificationNode.preTest.options[i-1];
n@814	1185 var cur = specificationNode.preTest.options[i];
n@814	1186 specificationNode.preTest.options[i-1] = cur;
n@814	1187 specificationNode.preTest.options[i] = next;
n@814	1188 popupInstance.state = 7;
n@814	1189 popupInstance.advanceState();
n@814	1190 }
n@814	1191 };
n@814	1192 mvH.appendChild(mvup);
n@814	1193 var mvdn = document.createElement("button");
n@814	1194 mvdn.textContent = "Dn";
n@814	1195 mvdn.style.width = "25px";
n@814	1196 mvdn.style.padding = "1px 0px";
n@814	1197 mvdn.onclick = function()
n@814	1198 {
n@814	1199 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	1200 if (i != specificationNode.preTest.options.length-1)
n@814	1201 {
n@814	1202 var next = specificationNode.preTest.options[i+1];
n@814	1203 var cur = specificationNode.preTest.options[i];
n@814	1204 specificationNode.preTest.options[i+1] = cur;
n@814	1205 specificationNode.preTest.options[i] = next;
n@814	1206 popupInstance.state = 7;
n@814	1207 popupInstance.advanceState();
n@814	1208 }
n@814	1209 };
n@814	1210 mvH.appendChild(mvdn);
n@814	1211 entry.appendChild(mvH);
n@814	1212 var idH = document.createElement('div');
n@814	1213 idH.className = "dndheaderelement";
n@814	1214 idH.style.width = "150px";
n@814	1215 if (optionNode.type != "statement")
n@814	1216 {
n@814	1217 var span = document.createElement('span');
n@814	1218 span.textContent = optionNode.id;
n@814	1219 idH.appendChild(span);
n@814	1220 }
n@814	1221 entry.appendChild(idH);
n@814	1222 var typeH = document.createElement('div');
n@814	1223 typeH.className = "dndheaderelement";
n@814	1224 typeH.style.width = "150px";
n@814	1225 var span = document.createElement('span');
n@814	1226 span.textContent = optionNode.type;
n@814	1227 typeH.appendChild(span);
n@814	1228 entry.appendChild(typeH);
n@814	1229 var editH = document.createElement('div');
n@814	1230 editH.className = "dndheaderelement";
n@814	1231 editH.style.width = "50px";
n@814	1232 var editButton = document.createElement("button");
n@814	1233 editButton.textContent = "Edit";
n@814	1234 editButton.style.width = "48px";
n@814	1235 editButton.style.padding = "1px 0px";
n@814	1236 editButton.onclick = function()
n@814	1237 {
n@814	1238 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	1239 popupInstance.dataTransfer = new function() {
n@814	1240 this.title = "Edit Test Node";
n@814	1241 this.parent = specificationNode.preTest;
n@814	1242 this.node = this.parent.options[i];
n@814	1243 this.previousState = 7;
n@814	1244 };
n@814	1245 popupInstace.state = 6;
n@814	1246 popupInstance.advanceState();
n@814	1247 };
n@814	1248 editH.appendChild(editButton);
n@814	1249 entry.appendChild(editH);
n@814	1250 var deleteH = document.createElement('div');
n@814	1251 deleteH.className = "dndheaderelement";
n@814	1252 deleteH.style.width = "50px";
n@814	1253 var deleteButton = document.createElement("button");
n@814	1254 deleteButton.textContent = "Del";
n@814	1255 deleteButton.style.width = "48px";
n@814	1256 deleteButton.style.padding = "1px 0px";
n@814	1257 deleteButton.onclick = function()
n@814	1258 {
n@814	1259 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	1260 var j = i+1;
n@814	1261 while(j < specificationNode.preTest.options.length)
n@814	1262 {
n@814	1263 specificationNode.preTest.options[i] = specificationNode.preTest.options[j];
n@814	1264 j++;
n@814	1265 i++;
n@814	1266 }
n@814	1267 specificationNode.preTest.options.pop();
n@814	1268 popupInstance.state = 7;
n@814	1269 popupInstance.advanceState();
n@814	1270 };
n@814	1271 deleteH.appendChild(deleteButton);
n@814	1272 entry.appendChild(deleteH);
n@814	1273 preHolder.appendChild(entry);
n@814	1274 }
n@814	1275 var entry = document.createElement('div');
n@814	1276 entry.style.width = "456px";
n@814	1277 entry.style.height= "20px";
n@814	1278 entry.style.margin= "2px";
n@814	1279 entry.style.borderBottom = "#DDD";
n@814	1280 entry.style.borderBottomWidth = "1px";
n@814	1281 entry.style.borderBottomStyle = "solid";
n@814	1282 entry.align = "center";
n@814	1283 var addPre = document.createElement('button');
n@814	1284 addPre.className = "popupButton";
n@814	1285 addPre.textContent = "Add New Entry";
n@814	1286 addPre.style.height = "20px";
n@814	1287 addPre.onclick = function()
n@814	1288 {
n@814	1289 popupInstance.dataTransfer = new function() {
n@814	1290 this.title = "New Pre Test Node";
n@814	1291 this.parent = specificationNode.preTest;
n@814	1292 this.node = null;
n@814	1293 this.previousState = 7;
n@814	1294 };
n@814	1295 popupInstance.state = 6;
n@814	1296 popupInstance.advanceState();
n@814	1297 };
n@814	1298 entry.appendChild(addPre);
n@814	1299 preHolder.appendChild(entry);
n@814	1300
n@814	1301 var span = document.createElement('span');
n@814	1302 span.textContent = "Add your post test page options here";
n@814	1303 this.popupBody.appendChild(span);
n@814	1304 var postHolder = document.createElement('div');
n@814	1305 postHolder.id = "preHolder";
n@814	1306 postHolder.style.width = "100%";
n@814	1307 postHolder.style.minHeight = "100px";
n@814	1308 postHolder.style.maxHeight = "220px";
n@814	1309 postHolder.style.overflow = 'auto';
n@814	1310 postHolder.style.border = "black";
n@814	1311 postHolder.style.borderStyle = "solid";
n@814	1312 postHolder.style.borderWidth = "1px";
n@814	1313 this.popupBody.appendChild(postHolder);
n@814	1314 var postHeaderHolder = document.createElement('div');
n@814	1315 postHeaderHolder.style.width = "456px";
n@814	1316 postHeaderHolder.style.height= "20px";
n@814	1317 postHeaderHolder.style.margin= "2px";
n@814	1318 postHeaderHolder.style.borderBottom = "#DDD";
n@814	1319 postHeaderHolder.style.borderBottomWidth = "1px";
n@814	1320 postHeaderHolder.style.borderBottomStyle = "solid";
n@814	1321 var mvH = document.createElement('div');
n@814	1322 mvH.className = "dndheaderelement";
n@814	1323 mvH.style.width = "50px";
n@814	1324 var text = document.createElement('span');
n@814	1325 text.textContent = "Order";
n@814	1326 mvH.appendChild(text);
n@814	1327 postHeaderHolder.appendChild(mvH);
n@814	1328 var idH = document.createElement('div');
n@814	1329 idH.className = "dndheaderelement";
n@814	1330 idH.style.width = "150px";
n@814	1331 text = document.createElement('span');
n@814	1332 text.textContent = "ID";
n@814	1333 idH.appendChild(text);
n@814	1334 postHeaderHolder.appendChild(idH);
n@814	1335 var tH = document.createElement('div');
n@814	1336 tH.className = "dndheaderelement";
n@814	1337 tH.style.width = "150px";
n@814	1338 text = document.createElement('span');
n@814	1339 text.textContent = "Type";
n@814	1340 tH.appendChild(text);
n@814	1341 postHeaderHolder.appendChild(tH);
n@814	1342 var editH = document.createElement('div');
n@814	1343 editH.className = "dndheaderelement";
n@814	1344 editH.style.width = "50px";
n@814	1345 text = document.createElement('span');
n@814	1346 text.textContent = "Edit";
n@814	1347 editH.appendChild(text);
n@814	1348 postHeaderHolder.appendChild(editH);
n@814	1349 var deleteH = document.createElement('div');
n@814	1350 deleteH.className = "dndheaderelement";
n@814	1351 deleteH.style.width = "50px";
n@814	1352 text = document.createElement('span');
n@814	1353 text.textContent = "Delete";
n@814	1354 deleteH.appendChild(text);
n@814	1355 postHeaderHolder.appendChild(deleteH);
n@814	1356 postHolder.appendChild(postHeaderHolder);
n@814	1357
n@814	1358 for (var i=0; i<specificationNode.postTest.options.length; i++)
n@814	1359 {
n@814	1360 var optionNode = specificationNode.postTest.options[i];
n@814	1361 var entry = document.createElement('div');
n@814	1362 entry.style.width = "456px";
n@814	1363 entry.style.height= "20px";
n@814	1364 entry.style.margin= "2px";
n@814	1365 entry.style.borderBottom = "#DDD";
n@814	1366 entry.style.borderBottomWidth = "1px";
n@814	1367 entry.style.borderBottomStyle = "solid";
n@814	1368 entry.setAttribute("node-id",i);
n@814	1369 var node = specificationNode.postTest.options[i];
n@814	1370 var mvH = document.createElement('div');
n@814	1371 mvH.className = "dndheaderelement";
n@814	1372 mvH.style.width = "50px";
n@814	1373 var mvup = document.createElement("button");
n@814	1374 mvup.textContent = "Up";
n@814	1375 mvup.style.width = "25px";
n@814	1376 mvup.style.padding = "1px 0px";
n@814	1377 mvup.onclick = function()
n@814	1378 {
n@814	1379 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	1380 if (i != 0)
n@814	1381 {
n@814	1382 var next = specificationNode.postTest.options[i-1];
n@814	1383 var cur = specificationNode.postTest.options[i];
n@814	1384 specificationNode.postTest.options[i-1] = cur;
n@814	1385 specificationNode.postTest.options[i] = next;
n@814	1386 popupInstance.state = 7;
n@814	1387 popupInstance.advanceState();
n@814	1388 }
n@814	1389 };
n@814	1390 mvH.appendChild(mvup);
n@814	1391 var mvdn = document.createElement("button");
n@814	1392 mvdn.textContent = "Dn";
n@814	1393 mvdn.style.width = "25px";
n@814	1394 mvdn.style.padding = "1px 0px";
n@814	1395 mvdn.onclick = function()
n@814	1396 {
n@814	1397 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	1398 if (i != specificationNode.postTest.options.length-1)
n@814	1399 {
n@814	1400 var next = specificationNode.postTest.options[i+1];
n@814	1401 var cur = specificationNode.postTest.options[i];
n@814	1402 specificationNode.postTest.options[i+1] = cur;
n@814	1403 specificationNode.postTest.options[i] = next;
n@814	1404 popupInstance.state = 7;
n@814	1405 popupInstance.advanceState();
n@814	1406 }
n@814	1407 };
n@814	1408 mvH.appendChild(mvdn);
n@814	1409 entry.appendChild(mvH);
n@814	1410 var idH = document.createElement('div');
n@814	1411 idH.className = "dndheaderelement";
n@814	1412 idH.style.width = "150px";
n@814	1413 if (optionNode.type != "statement")
n@814	1414 {
n@814	1415 var span = document.createElement('span');
n@814	1416 span.textContent = optionNode.id;
n@814	1417 idH.appendChild(span);
n@814	1418 }
n@814	1419 entry.appendChild(idH);
n@814	1420 var typeH = document.createElement('div');
n@814	1421 typeH.className = "dndheaderelement";
n@814	1422 typeH.style.width = "150px";
n@814	1423 var span = document.createElement('span');
n@814	1424 span.textContent = optionNode.type;
n@814	1425 typeH.appendChild(span);
n@814	1426 entry.appendChild(typeH);
n@814	1427 var editH = document.createElement('div');
n@814	1428 editH.className = "dndheaderelement";
n@814	1429 editH.style.width = "50px";
n@814	1430 var editButton = document.createElement("button");
n@814	1431 editButton.textContent = "Edit";
n@814	1432 editButton.style.width = "48px";
n@814	1433 editButton.style.padding = "1px 0px";
n@814	1434 editButton.onclick = function()
n@814	1435 {
n@814	1436 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	1437 popupInstance.dataTransfer = new function() {
n@814	1438 this.title = "Edit Test Node";
n@814	1439 this.parent = specificationNode.postTest;
n@814	1440 this.node = this.parent.options[i];
n@814	1441 this.previousState = 7;
n@814	1442 };
n@814	1443 popupInstance.state = 6;
n@814	1444 popupInstance.advanceState();
n@814	1445 };
n@814	1446 editH.appendChild(editButton);
n@814	1447 entry.appendChild(editH);
n@814	1448 var deleteH = document.createElement('div');
n@814	1449 deleteH.className = "dndheaderelement";
n@814	1450 deleteH.style.width = "50px";
n@814	1451 var deleteButton = document.createElement("button");
n@814	1452 deleteButton.textContent = "Del";
n@814	1453 deleteButton.style.width = "48px";
n@814	1454 deleteButton.style.padding = "1px 0px";
n@814	1455 deleteButton.onclick = function()
n@814	1456 {
n@814	1457 var i = Number(event.currentTarget.parentElement.parentElement.getAttribute("node-id"));
n@814	1458 var j = i+1;
n@814	1459 while(j < specificationNode.postTest.options.length)
n@814	1460 {
n@814	1461 specificationNode.postTest.options[i] = specificationNode.postTest.options[j];
n@814	1462 j++;
n@814	1463 i++;
n@814	1464 }
n@814	1465 audioHolder.postTest.options.pop();
n@814	1466 popupInstance.state = 7;
n@814	1467 popupInstance.advanceState();
n@814	1468 };
n@814	1469 deleteH.appendChild(deleteButton);
n@814	1470 entry.appendChild(deleteH);
n@814	1471 postHolder.appendChild(entry);
n@814	1472 }
n@814	1473
n@814	1474 var entry = document.createElement('div');
n@814	1475 entry.style.width = "456px";
n@814	1476 entry.style.height= "20px";
n@814	1477 entry.style.margin= "2px";
n@814	1478 entry.style.borderBottom = "#DDD";
n@814	1479 entry.style.borderBottomWidth = "1px";
n@814	1480 entry.style.borderBottomStyle = "solid";
n@814	1481 entry.align = "center";
n@814	1482 var addPost = document.createElement('button');
n@814	1483 addPost.className = "popupButton";
n@814	1484 addPost.textContent = "Add New Entry";
n@814	1485 addPost.style.height = "20px";
n@814	1486 addPost.onclick = function()
n@814	1487 {
n@814	1488 popupInstance.dataTransfer = new function() {
n@814	1489 this.title = "New Pre Test Node";
n@814	1490 this.parent = specificationNode.postTest;
n@814	1491 this.node = null;
n@814	1492 this.previousState = 7;
n@814	1493 };
n@814	1494 popupInstance.state = 6;
n@814	1495 popupInstance.advanceState();
n@814	1496 };
n@814	1497 entry.appendChild(addPost);
n@814	1498 postHolder.appendChild(entry);
n@814	1499
n@814	1500 var button = document.createElement('button');
n@814	1501 button.id = 'submit';
n@814	1502 button.className = "popupButton";
n@814	1503 button.textContent = "Finish";
n@814	1504 button.onclick = function(event)
n@814	1505 {
n@814	1506 popupInstance.state = 8;
n@814	1507 popupInstance.advanceState();
n@814	1508 };
n@814	1509 this.popupFooter.appendChild(button);
n@814	1510 break;
n@814	1511 case 8:
n@814	1512 this.hidePopup();
n@814	1513 this.state = 0;
n@814	1514 SpecficationToHTML();
n@814	1515 }
n@814	1516 this.state++;
n@814	1517 };
n@814	1518 };
n@814	1519
n@814	1520 function audioObject()
n@814	1521 {
n@814	1522 // Used to hold audio information in buffers for quick playback
n@814	1523 this.bufferObject;
n@814	1524 this.bufferNode = undefined;
n@814	1525 this.state = 0;
n@814	1526 this.gain = audioContext.createGain();
n@814	1527 this.gain.connect(audioContext.destination);
n@814	1528 this.include = true;
n@814	1529 this.id = undefined;
n@814	1530 this.file = undefined;
n@814	1531
n@814	1532 this.play = function()
n@814	1533 {
n@814	1534 if (this.bufferNode != undefined)
n@814	1535 {
n@814	1536 this.bufferNode.stop(0);
n@814	1537 this.bufferNode = undefined;
n@814	1538 }
n@814	1539 if(this.state == 1)
n@814	1540 {
n@814	1541 this.bufferNode = audioContext.createBufferSource();
n@814	1542 this.bufferNode.connect(this.gain);
n@814	1543 this.bufferNode.buffer = this.bufferObject;
n@814	1544 this.bufferNode.onended = function(event) {
n@814	1545 // Safari does not like using 'this' to reference the calling object!
n@814	1546 event.currentTarget = undefined;
n@814	1547 };
n@814	1548 this.bufferNode.start(audioContext.currentTime);
n@814	1549 this.bufferNode.stop(audioContext.currentTime+3);
n@814	1550 }
n@814	1551 };
n@814	1552
n@814	1553 this.constructTrack = function(file) {
n@814	1554 var reader = new FileReader();
n@814	1555 this.file = file;
n@814	1556 var audioObj = this;
n@814	1557 // Create callback to decode the data asynchronously
n@814	1558 reader.onloadend = function() {
n@814	1559 audioContext.decodeAudioData(reader.result, function(decodedData) {
n@814	1560 audioObj.bufferObject = decodedData;
n@814	1561 audioObj.state = 1;
n@814	1562 }, function(){});
n@814	1563 };
n@814	1564 reader.readAsArrayBuffer(file);
n@814	1565 };
n@814	1566 };
n@814	1567
n@814	1568 function Specification() {
n@814	1569 // Handles the decoding of the project specification XML into a simple JavaScript Object.
n@814	1570
n@814	1571 this.interfaceType = null;
n@814	1572 this.commonInterface = new function()
n@814	1573 {
n@814	1574 this.options = [];
n@814	1575 this.optionNode = function(input)
n@814	1576 {
n@814	1577 var name = input.getAttribute('name');
n@814	1578 this.type = name;
n@814	1579 if(this.type == "option")
n@814	1580 {
n@814	1581 this.name = input.id;
n@814	1582 } else if (this.type == "check")
n@814	1583 {
n@814	1584 this.check = input.id;
n@814	1585 }
n@814	1586 };
n@814	1587 };
n@814	1588 this.projectReturn = null;
n@814	1589 this.randomiseOrder = null;
n@814	1590 this.collectMetrics = null;
n@814	1591 this.testPages = null;
n@814	1592 this.audioHolders = [];
n@814	1593 this.metrics = [];
n@814	1594
n@814	1595 this.decode = function() {
n@814	1596 // projectXML - DOM Parsed document
n@814	1597 this.projectXML = projectXML.childNodes[0];
n@814	1598 var setupNode = projectXML.getElementsByTagName('setup')[0];
n@814	1599 this.interfaceType = setupNode.getAttribute('interface');
n@814	1600 this.projectReturn = setupNode.getAttribute('projectReturn');
n@814	1601 this.testPages = setupNode.getAttribute('testPages');
n@814	1602 if (setupNode.getAttribute('randomiseOrder') == "true") {
n@814	1603 this.randomiseOrder = true;
n@814	1604 } else {this.randomiseOrder = false;}
n@814	1605 if (setupNode.getAttribute('collectMetrics') == "true") {
n@814	1606 this.collectMetrics = true;
n@814	1607 } else {this.collectMetrics = false;}
n@814	1608 if (isNaN(Number(this.testPages)) \|\| this.testPages == undefined)
n@814	1609 {
n@814	1610 this.testPages = null;
n@814	1611 } else {
n@814	1612 this.testPages = Number(this.testPages);
n@814	1613 if (this.testPages == 0) {this.testPages = null;}
n@814	1614 }
n@814	1615 var metricCollection = setupNode.getElementsByTagName('Metric');
n@814	1616
n@814	1617 this.preTest = new this.prepostNode('pretest',setupNode.getElementsByTagName('PreTest'));
n@814	1618 this.postTest = new this.prepostNode('posttest',setupNode.getElementsByTagName('PostTest'));
n@814	1619
n@814	1620 if (metricCollection.length > 0) {
n@814	1621 metricCollection = metricCollection[0].getElementsByTagName('metricEnable');
n@814	1622 for (var i=0; i<metricCollection.length; i++) {
n@814	1623 this.metrics.push(new this.metricNode(metricCollection[i].textContent));
n@814	1624 }
n@814	1625 }
n@814	1626
n@814	1627 var commonInterfaceNode = setupNode.getElementsByTagName('interface');
n@814	1628 if (commonInterfaceNode.length > 0) {
n@814	1629 commonInterfaceNode = commonInterfaceNode[0];
n@814	1630 } else {
n@814	1631 commonInterfaceNode = undefined;
n@814	1632 }
n@814	1633
n@814	1634 this.commonInterface = new function() {
n@814	1635 this.OptionNode = function(child) {
n@814	1636 this.type = child.nodeName;
n@814	1637 if (this.type == 'option')
n@814	1638 {
n@814	1639 this.name = child.getAttribute('name');
n@814	1640 }
n@814	1641 else if (this.type == 'check') {
n@814	1642 this.check = child.getAttribute('name');
n@814	1643 if (this.check == 'scalerange') {
n@814	1644 this.min = child.getAttribute('min');
n@814	1645 this.max = child.getAttribute('max');
n@814	1646 if (this.min == null) {this.min = 1;}
n@814	1647 else if (Number(this.min) > 1 && this.min != null) {
n@814	1648 this.min = Number(this.min)/100;
n@814	1649 } else {
n@814	1650 this.min = Number(this.min);
n@814	1651 }
n@814	1652 if (this.max == null) {this.max = 0;}
n@814	1653 else if (Number(this.max) > 1 && this.max != null) {
n@814	1654 this.max = Number(this.max)/100;
n@814	1655 } else {
n@814	1656 this.max = Number(this.max);
n@814	1657 }
n@814	1658 }
n@814	1659 } else if (this.type == 'anchor' \|\| this.type == 'reference') {
n@814	1660 this.value = Number(child.textContent);
n@814	1661 this.enforce = child.getAttribute('enforce');
n@814	1662 if (this.enforce == 'true') {this.enforce = true;}
n@814	1663 else {this.enforce = false;}
n@814	1664 }
n@814	1665 };
n@814	1666 this.options = [];
n@814	1667 if (commonInterfaceNode != undefined) {
n@814	1668 var child = commonInterfaceNode.firstElementChild;
n@814	1669 while (child != undefined) {
n@814	1670 this.options.push(new this.OptionNode(child));
n@814	1671 child = child.nextElementSibling;
n@814	1672 }
n@814	1673 }
n@814	1674 };
n@814	1675
n@814	1676 var audioHolders = projectXML.getElementsByTagName('audioHolder');
n@814	1677 for (var i=0; i<audioHolders.length; i++) {
n@814	1678 this.audioHolders.push(new this.audioHolderNode(this,audioHolders[i]));
n@814	1679 }
n@814	1680
n@814	1681 // New check if we need to randomise the test order
n@814	1682 if (this.randomiseOrder)
n@814	1683 {
n@814	1684 this.audioHolders = randomiseOrder(this.audioHolders);
n@814	1685 for (var i=0; i<this.audioHolders.length; i++)
n@814	1686 {
n@814	1687 this.audioHolders[i].presentedId = i;
n@814	1688 }
n@814	1689 }
n@814	1690
n@814	1691 if (this.testPages != null \|\| this.testPages != undefined)
n@814	1692 {
n@814	1693 if (this.testPages > audioHolders.length)
n@814	1694 {
n@814	1695 console.log('Warning: You have specified '+audioHolders.length+' tests but requested '+this.testPages+' be completed!');
n@814	1696 this.testPages = audioHolders.length;
n@814	1697 }
n@814	1698 var aH = this.audioHolders;
n@814	1699 this.audioHolders = [];
n@814	1700 for (var i=0; i<this.testPages; i++)
n@814	1701 {
n@814	1702 this.audioHolders.push(aH[i]);
n@814	1703 }
n@814	1704 }
n@814	1705 };
n@814	1706
n@814	1707 this.prepostNode = function(type) {
n@814	1708 this.type = type;
n@814	1709 this.options = [];
n@814	1710
n@814	1711 this.OptionNode = function() {
n@814	1712
n@814	1713 this.childOption = function() {
n@814	1714 this.type = 'option';
n@814	1715 this.id = element.id;
n@814	1716 this.name = element.getAttribute('name');
n@814	1717 this.text = element.textContent;
n@814	1718 };
n@814	1719
n@814	1720 this.type = undefined;
n@814	1721 this.id = undefined;
n@814	1722 this.mandatory = undefined;
n@814	1723 this.question = undefined;
n@814	1724 this.statement = undefined;
n@814	1725 this.boxsize = undefined;
n@814	1726 this.options = [];
n@814	1727 this.min = undefined;
n@814	1728 this.max = undefined;
n@814	1729 this.step = undefined;
n@814	1730
n@814	1731 };
n@814	1732 };
n@814	1733
n@814	1734 this.metricNode = function(name) {
n@814	1735 this.enabled = name;
n@814	1736 };
n@814	1737
n@814	1738 this.audioHolderNode = function(parent) {
n@814	1739 this.type = 'audioHolder';
n@814	1740 this.presentedId = undefined;
n@814	1741 this.id = undefined;
n@814	1742 this.hostURL = undefined;
n@814	1743 this.sampleRate = undefined;
n@814	1744 this.randomiseOrder = undefined;
n@814	1745 this.loop = undefined;
n@814	1746 this.elementComments = undefined;
n@814	1747 this.preTest = new parent.prepostNode('pretest');
n@814	1748 this.postTest = new parent.prepostNode('posttest');
n@814	1749 this.interfaces = [];
n@814	1750 this.commentBoxPrefix = "Comment on track";
n@814	1751 this.audioElements = [];
n@814	1752 this.commentQuestions = [];
n@814	1753
n@814	1754 this.interfaceNode = function(DOM) {
n@814	1755 var title = DOM.getElementsByTagName('title');
n@814	1756 if (title.length == 0) {this.title = null;}
n@814	1757 else {this.title = title[0].textContent;}
n@814	1758 this.options = parent.commonInterface.options;
n@814	1759 var scale = DOM.getElementsByTagName('scale');
n@814	1760 this.scale = [];
n@814	1761 for (var i=0; i<scale.length; i++) {
n@814	1762 var arr = [null, null];
n@814	1763 arr[0] = scale[i].getAttribute('position');
n@814	1764 arr[1] = scale[i].textContent;
n@814	1765 this.scale.push(arr);
n@814	1766 }
n@814	1767 };
n@814	1768
n@814	1769 this.audioElementNode = function(parent,audioObject) {
n@814	1770 this.url = audioObject.file.name;
n@814	1771 this.id = audioObject.id;
n@814	1772 this.parent = parent;
n@814	1773 this.type = "normal";
n@814	1774
n@814	1775 this.marker = undefined;
n@814	1776 };
n@814	1777
n@814	1778 this.commentQuestionNode = function(xml) {
n@814	1779 this.childOption = function(element) {
n@814	1780 this.type = 'option';
n@814	1781 this.name = element.getAttribute('name');
n@814	1782 this.text = element.textContent;
n@814	1783 };
n@814	1784 this.id = xml.id;
n@814	1785 if (xml.getAttribute('mandatory') == 'true') {this.mandatory = true;}
n@814	1786 else {this.mandatory = false;}
n@814	1787 this.type = xml.getAttribute('type');
n@814	1788 if (this.type == undefined) {this.type = 'text';}
n@814	1789 switch (this.type) {
n@814	1790 case 'text':
n@814	1791 this.question = xml.textContent;
n@814	1792 break;
n@814	1793 case 'radio':
n@814	1794 var child = xml.firstElementChild;
n@814	1795 this.options = [];
n@814	1796 while (child != undefined) {
n@814	1797 if (child.nodeName == 'statement' && this.statement == undefined) {
n@814	1798 this.statement = child.textContent;
n@814	1799 } else if (child.nodeName == 'option') {
n@814	1800 this.options.push(new this.childOption(child));
n@814	1801 }
n@814	1802 child = child.nextElementSibling;
n@814	1803 }
n@814	1804 break;
n@814	1805 case 'checkbox':
n@814	1806 var child = xml.firstElementChild;
n@814	1807 this.options = [];
n@814	1808 while (child != undefined) {
n@814	1809 if (child.nodeName == 'statement' && this.statement == undefined) {
n@814	1810 this.statement = child.textContent;
n@814	1811 } else if (child.nodeName == 'option') {
n@814	1812 this.options.push(new this.childOption(child));
n@814	1813 }
n@814	1814 child = child.nextElementSibling;
n@814	1815 }
n@814	1816 break;
n@814	1817 }
n@814	1818 };
n@814	1819 };
n@814	1820
n@814	1821 this.preTest = new this.prepostNode("pretest");
n@814	1822 this.postTest = new this.prepostNode("posttest");
n@814	1823 }
n@814	1824 function SpecficationToHTML()
n@814	1825 {
n@814	1826 // Take information from Specification Node and format it into an HTML layout
n@814	1827 var destination = document.getElementById("content");
n@814	1828 // Setup Header Node
n@814	1829 var setupNode = document.createElement("div");
n@814	1830 setupNode.className = "topLevel";
n@814	1831 setupNode.name = "setup";
n@814	1832 var title = document.createElement("h2");
n@814	1833 title.textContent = "Setup";
n@814	1834 setupNode.appendChild(title);
n@814	1835 // Interface Type
n@814	1836 var div = document.createElement("div");
n@814	1837 div.name = "attributes";
n@814	1838 div.style.margin = "5px";
n@814	1839 var select = document.createElement("select");
n@814	1840 select.id = "interfaceSelect";
n@814	1841 select.style.margin = "5px";
n@814	1842 var option = document.createElement("option");
n@814	1843 option.value = "APE";
n@814	1844 option.textContent = "APE";
n@814	1845 select.appendChild(option);
n@814	1846 option = document.createElement("option");
n@814	1847 option.value = "MUSHRA";
n@814	1848 option.textContent = "MUSHRA";
n@814	1849 select.appendChild(option);
n@814	1850 select.value = specificationNode.interfaceType;
n@814	1851 var span = document.createElement("span");
n@814	1852 span.textContent = "Interface Type";
n@814	1853 div.appendChild(span);
n@814	1854 div.appendChild(select);
n@814	1855 // Project Return Attribute
n@814	1856 span = document.createElement("span");
n@814	1857 span.style.margin = "5px";
n@814	1858 span.textContent = "Project Return";
n@814	1859 var input = document.createElement("input");
n@814	1860 input.value = specificationNode.projectReturn;
n@814	1861 input.id = "projectReturn";
n@814	1862 input.style.margin = "5px";
n@814	1863 div.appendChild(span);
n@814	1864 div.appendChild(input);
n@814	1865 // Randomise Order
n@814	1866 span = document.createElement("span");
n@814	1867 span.textContent = "Randomise Order";
n@814	1868 input = document.createElement("input");
n@814	1869 input.id = "randomiseOrder";
n@814	1870 input.style.margin = "5px";
n@814	1871 input.type = "checkbox";
n@814	1872 input.value = specificationNode.projectReturn;
n@814	1873 div.appendChild(span);
n@814	1874 div.appendChild(input);
n@814	1875 setupNode.appendChild(div);
n@814	1876
n@814	1877 // Now create the common Interface Node
n@814	1878 var commonInterface = document.createElement("div");
n@814	1879 commonInterface.id = "interface";
n@814	1880 commonInterface.className = "SecondLevel";
n@814	1881 var title = document.createElement("h3");
n@814	1882 title.textContent = "Common Interface";
n@814	1883 commonInterface.appendChild(title);
n@814	1884 var div = document.createElement("div");
n@814	1885 div.name = "attributes";
n@814	1886 var interfaceOptions;
n@814	1887 var interfaceChecks;
n@814	1888 switch(select.value)
n@814	1889 {
n@814	1890 case "APE":
n@814	1891 interfaceOptions = APEInterfaceOptions;
n@814	1892 interfaceChecks = APEInterfaceChecks;
n@814	1893 break;
n@814	1894 case "MUSHRA":
n@814	1895 interfaceOptions = MUSHRAInterfaceOptions;
n@814	1896 interfaceChecks = MUSHRAInterfaceChecks;
n@814	1897 break;
n@814	1898 }
n@814	1899 for (var i=0; i<interfaceOptions[0].length; i++)
n@814	1900 {
n@814	1901 var span = document.createElement("span");
n@814	1902 span.textContent = interfaceOptions[1][i];
n@814	1903 var input = document.createElement("input");
n@814	1904 input.type = "checkbox";
n@814	1905 input.id = interfaceOptions[0][i];
n@814	1906 div.appendChild(input);
n@814	1907 div.appendChild(span);
n@814	1908 commonInterface.appendChild(div);
n@814	1909 for (var j=0; j<specificationNode.commonInterface.options.length; j++)
n@814	1910 {
n@814	1911 if (specificationNode.commonInterface.options[j].name == interfaceOptions[0][i])
n@814	1912 {
n@814	1913 input.checked = true;
n@814	1914 break;
n@814	1915 }
n@814	1916 }
n@814	1917 }
n@814	1918 for (var i=0; i<interfaceChecks[0].length; i++)
n@814	1919 {
n@814	1920 var span = document.createElement("span");
n@814	1921 span.textContent = interfaceChecks[1][i];
n@814	1922 var input = document.createElement("input");
n@814	1923 input.type = "checkbox";
n@814	1924 input.id = interfaceChecks[0][i];
n@814	1925 div.appendChild(input);
n@814	1926 div.appendChild(span);
n@814	1927 commonInterface.appendChild(div);
n@814	1928 for (var j=0; j<specificationNode.commonInterface.options.length; j++)
n@814	1929 {
n@814	1930 if (specificationNode.commonInterface.options[j].check == interfaceChecks[0][i])
n@814	1931 {
n@814	1932 input.checked = true;
n@814	1933 break;
n@814	1934 }
n@814	1935 }
n@814	1936 }
n@814	1937 setupNode.appendChild(commonInterface);
n@814	1938 // Now the Metric Node
n@814	1939 var metrics = document.createElement("div");
n@814	1940 metrics.id = "metrics";
n@814	1941 metrics.className = "SecondLevel";
n@814	1942 var title = document.createElement("h3");
n@814	1943 title.textContent = "Metric Collections";
n@814	1944 metrics.appendChild(title);
n@814	1945 var div = document.createElement("div");
n@814	1946 div.name = "attributes";
n@814	1947 metrics.appendChild(div);
n@814	1948 var supportedMetrics;
n@814	1949 switch(select.value)
n@814	1950 {
n@814	1951 case "APE":
n@814	1952 supportedMetrics = APEInterfaceMetrics;
n@814	1953 break;
n@814	1954 case "MUSHRA":
n@814	1955 supportedMetrics = MUSHRAInterfaceMetrics;
n@814	1956 break;
n@814	1957 }
n@814	1958
n@814	1959 for (var i=0; i<supportedMetrics[0].length; i++)
n@814	1960 {
n@814	1961 var span = document.createElement("span");
n@814	1962 span.textContent = supportedMetrics[1][i];
n@814	1963 var input = document.createElement("input");
n@814	1964 input.type = "checkbox";
n@814	1965 input.id = supportedMetrics[0][i];
n@814	1966 div.appendChild(input);
n@814	1967 div.appendChild(span);
n@814	1968 for (var j=0; j<specificationNode.metrics.length; j++)
n@814	1969 {
n@814	1970 if (specificationNode.metrics[j].enabled == supportedMetrics[0][i])
n@814	1971 {
n@814	1972 input.checked = true;
n@814	1973 }
n@814	1974 }
n@814	1975 }
n@814	1976
n@814	1977 setupNode.appendChild(metrics);
n@814	1978
n@814	1979 // Test Session Pre Test
n@814	1980 var preTest = document.createElement("div");
n@814	1981 preTest.id = "preTest";
n@814	1982 preTest.className = "SecondLevel";
n@814	1983 var title = document.createElement("h3");
n@814	1984 title.textContent = "Pre test Survey";
n@814	1985 preTest.appendChild(title);
n@814	1986 var div = document.createElement("div");
n@814	1987 div.name = "attributes";
n@814	1988 for (var j=0; j<specificationNode.preTest.options.length; j++)
n@814	1989 {
n@814	1990 var node = PPSurveyToHTML(specificationNode.preTest.options[j]);
n@814	1991 node.className = "SecondLevel";
n@814	1992 node.id = preTest.id+"-"+j;
n@814	1993 preTest.appendChild(node);
n@814	1994 }
n@814	1995 setupNode.appendChild(preTest);
n@814	1996
n@814	1997 // Test Session Post Test
n@814	1998 var postTest = document.createElement("div");
n@814	1999 postTest.id = "postTest";
n@814	2000 postTest.className = "SecondLevel";
n@814	2001 var title = document.createElement("h3");
n@814	2002 title.textContent = "Post test Survey";
n@814	2003 postTest.appendChild(title);
n@814	2004 var div = document.createElement("div");
n@814	2005 div.name = "attributes";
n@814	2006
n@814	2007 for (var j=0; j<specificationNode.postTest.options.length; j++)
n@814	2008 {
n@814	2009 var node = PPSurveyToHTML(specificationNode.postTest.options[j]);
n@814	2010 node.className = "SecondLevel";
n@814	2011 node.id = postTest.id+"-"+j;
n@814	2012 postTest.appendChild(node);
n@814	2013 }
n@814	2014
n@814	2015 setupNode.appendChild(postTest);
n@814	2016
n@814	2017 destination.appendChild(setupNode);
n@814	2018
n@814	2019 // Now we step through the AudioHolders
n@814	2020 for (var i=0; i<specificationNode.audioHolders.length; i++)
n@814	2021 {
n@814	2022 var aH = specificationNode.audioHolders[i];
n@814	2023 var aHTML = document.createElement("div");
n@814	2024 aHTML.name = "audioHolder";
n@814	2025 aHTML.id = "audioHolder-"+aH.id;
n@814	2026 aHTML.className = "topLevel";
n@814	2027 destination.appendChild(aHTML);
n@814	2028 var title = document.createElement("h2");
n@814	2029 title.textContent = "Audio Holder "+aH.id;
n@814	2030 aHTML.appendChild(title);
n@814	2031 var attributes = document.createElement("div");
n@814	2032 attributes.name = "attributes";
n@814	2033 aHTML.appendChild(attributes);
n@814	2034 var text = document.createElement("span");
n@814	2035 text.textContent = "ID: ";
n@814	2036 var input = document.createElement("input");
n@814	2037 input.id = aHTML.id+"-id";
n@814	2038 input.value = aH.id;
n@814	2039 input.onchange = function()
n@814	2040 {
n@814	2041 event.currentTarget.parentElement.parentElement.childNodes[0].textContent = "Audio Holder "+event.currentTarget.value;
n@814	2042 };
n@814	2043 text.style.margin = "5px";
n@814	2044 input.style.margin = "5px";
n@814	2045 attributes.appendChild(text);
n@814	2046 attributes.appendChild(input);
n@814	2047 text = document.createElement("span");
n@814	2048 text.textContent = "Host URL: ";
n@814	2049 input = document.createElement("input");
n@814	2050 input.id = aHTML.id+"-hostURL";
n@814	2051 input.value = aH.hostURL;
n@814	2052 text.style.margin = "5px";
n@814	2053 input.style.margin = "5px";
n@814	2054 attributes.appendChild(text);
n@814	2055 attributes.appendChild(input);
n@814	2056 text = document.createElement("span");
n@814	2057 text.textContent = "Loop Fragments: ";
n@814	2058 input = document.createElement("input");
n@814	2059 input.id = aHTML.id+"-loop";
n@814	2060 input.type = "checkbox";
n@814	2061 input.checked = aH.loop;
n@814	2062 text.style.margin = "5px";
n@814	2063 input.style.margin = "5px";
n@814	2064 attributes.appendChild(text);
n@814	2065 attributes.appendChild(input);
n@814	2066 text = document.createElement("span");
n@814	2067 text.textContent = "Randomise Order: ";
n@814	2068 input = document.createElement("input");
n@814	2069 input.id = aHTML.id+"-randomiseOrder";
n@814	2070 input.type = "checkbox";
n@814	2071 input.checked = aH.randomiseOrder;
n@814	2072 text.style.margin = "5px";
n@814	2073 input.style.margin = "5px";
n@814	2074 attributes.appendChild(text);
n@814	2075 attributes.appendChild(input);
n@814	2076 text = document.createElement("span");
n@814	2077 text.textContent = "Show Fragment Comments";
n@814	2078 input = document.createElement("input");
n@814	2079 input.id = aHTML.id+"-elementComments";
n@814	2080 input.type = "checkbox";
n@814	2081 input.checked = aH.elementComments;
n@814	2082 text.style.margin = "5px";
n@814	2083 input.style.margin = "5px";
n@814	2084 attributes.appendChild(text);
n@814	2085 attributes.appendChild(input);
n@814	2086
n@814	2087 // Test Session Pre Test
n@814	2088 var preTest = document.createElement("div");
n@814	2089 preTest.id = aHTML.id+"-pretest";
n@814	2090 preTest.className = "SecondLevel";
n@814	2091 var title = document.createElement("h3");
n@814	2092 title.textContent = "Pre test Survey";
n@814	2093 preTest.appendChild(title);
n@814	2094 var div = document.createElement("div");
n@814	2095 div.name = "attributes";
n@814	2096
n@814	2097 for (var j=0; j<aH.preTest.options.length; j++)
n@814	2098 {
n@814	2099 var node = PPSurveyToHTML(aH.preTest.options[j]);
n@814	2100 node.className = "SecondLevel";
n@814	2101 node.id = preTest.id+"-"+j;
n@814	2102 preTest.appendChild(node);
n@814	2103 }
n@814	2104
n@814	2105 aHTML.appendChild(preTest);
n@814	2106
n@814	2107 // Test Session Post Test
n@814	2108 var postTest = document.createElement("div");
n@814	2109 postTest.id = aHTML.id+"-postTest";
n@814	2110 postTest.className = "SecondLevel";
n@814	2111 var title = document.createElement("h3");
n@814	2112 title.textContent = "Post test Survey";
n@814	2113 postTest.appendChild(title);
n@814	2114 var div = document.createElement("div");
n@814	2115 div.name = "attributes";
n@814	2116
n@814	2117 for (var j=0; j<aH.postTest.options.length; j++)
n@814	2118 {
n@814	2119 var node = PPSurveyToHTML(aH.postTest.options[j]);
n@814	2120 node.className = "SecondLevel";
n@814	2121 node.id = postTest.id+"-"+j;
n@814	2122 postTest.appendChild(node);
n@814	2123 }
n@814	2124
n@814	2125 aHTML.appendChild(postTest);
n@814	2126
n@814	2127 //Audio Elements
n@814	2128 var audioElems = document.createElement("div");
n@814	2129 audioElems.id = aHTML.id+"-audioElements";
n@814	2130 audioElems.className = "SecondLevel";
n@814	2131 var title = document.createElement("h3");
n@814	2132 title.textContent = "Audio Elements";
n@814	2133 audioElems.appendChild(title);
n@814	2134 for (var i=0; i<aH.audioElements.length; i++)
n@814	2135 {
n@814	2136 var entry = document.createElement("div");
n@814	2137 entry.className = "SecondLevel";
n@814	2138 entry.id = audioElems.id+"-"+aH.audioElements[i].id;
n@814	2139 var text = document.createElement("span");
n@814	2140 text.textContent = "ID:";
n@814	2141 var input = document.createElement("input");
n@814	2142 input.id = entry.id+"-id";
n@814	2143 input.value = aH.audioElements[i].id;
n@814	2144 text.style.margin = "5px";
n@814	2145 input.style.margin = "5px";
n@814	2146 entry.appendChild(text);
n@814	2147 entry.appendChild(input);
n@814	2148 text = document.createElement("span");
n@814	2149 text.textContent = "URL:";
n@814	2150 input = document.createElement("input");
n@814	2151 input.id = entry.id+"-URL";
n@814	2152 input.value = aH.audioElements[i].url;
n@814	2153 text.style.margin = "5px";
n@814	2154 input.style.margin = "5px";
n@814	2155 entry.appendChild(text);
n@814	2156 entry.appendChild(input);
n@814	2157 audioElems.appendChild(entry);
n@814	2158 }
n@814	2159
n@814	2160 aHTML.appendChild(audioElems);
n@814	2161 }
n@814	2162
n@814	2163 function PPSurveyToHTML(node)
n@814	2164 {
n@814	2165 var holder = document.createElement("div");
n@814	2166 var title = document.createElement("h4");
n@814	2167 holder.appendChild(title);
n@814	2168 var attributes = document.createElement("div");
n@814	2169 holder.appendChild(attributes);
n@814	2170 switch(node.type)
n@814	2171 {
n@814	2172 case "statement":
n@814	2173 title.textContent = "Statement";
n@814	2174 var tA = document.createElement("textarea");
n@814	2175 attributes.style.height = "150px";
n@814	2176 tA.style.width = "500px";
n@814	2177 tA.style.height = "100px";
n@814	2178 tA.value = node.statement;
n@814	2179 attributes.appendChild(tA);
n@814	2180 break;
n@814	2181 case "question":
n@814	2182 title.textContent = "Question";
n@814	2183 var text = document.createElement("span");
n@814	2184 text.textContent = "ID :";
n@814	2185 var input = document.createElement("input");
n@814	2186 input.name = "id";
n@814	2187 input.value = node.id;
n@814	2188 text.style.margin = "5px";
n@814	2189 input.style.margin = "5px";
n@814	2190 attributes.appendChild(text);
n@814	2191 attributes.appendChild(input);
n@814	2192 text = document.createElement("span");
n@814	2193 text.textContent = "Question";
n@814	2194 input = document.createElement("input");
n@814	2195 input.name = "question";
n@814	2196 input.style.width = "400px";
n@814	2197 input.value = node.question;
n@814	2198 text.style.margin = "5px";
n@814	2199 input.style.margin = "5px";
n@814	2200 attributes.appendChild(text);
n@814	2201 attributes.appendChild(input);
n@814	2202 text = document.createElement("span");
n@814	2203 text.textContent = "Mandatory";
n@814	2204 input = document.createElement("input");
n@814	2205 input.name = "mandatory";
n@814	2206 input.type = "checkbox";
n@814	2207 input.checked = node.mandatory;
n@814	2208 text.style.margin = "5px";
n@814	2209 input.style.margin = "5px";
n@814	2210 attributes.appendChild(text);
n@814	2211 attributes.appendChild(input);
n@814	2212 text = document.createElement("span");
n@814	2213 text.textContent = "Reply box size";
n@814	2214 input = document.createElement("select");
n@814	2215 input.name = "boxsize";
n@814	2216 var option = document.createElement("option");
n@814	2217 option.textContent = "Normal";
n@814	2218 option.value = "normal";
n@814	2219 input.appendChild(option);
n@814	2220 option = document.createElement("option");
n@814	2221 option.textContent = "Large";
n@814	2222 option.value = "large";
n@814	2223 input.appendChild(option);
n@814	2224 option = document.createElement("option");
n@814	2225 option.textContent = "Small";
n@814	2226 option.value = "small";
n@814	2227 input.appendChild(option);
n@814	2228 option = document.createElement("option");
n@814	2229 option.textContent = "Huge";
n@814	2230 option.value = "huge";
n@814	2231 input.appendChild(option);
n@814	2232 text.style.margin = "5px";
n@814	2233 input.style.margin = "5px";
n@814	2234 attributes.appendChild(text);
n@814	2235 attributes.appendChild(input);
n@814	2236 input.value = node.boxsize;
n@814	2237 break;
n@814	2238 }
n@814	2239 return holder;
n@814	2240 }
n@814	2241 }
n@814	2242 </script>
n@814	2243 <style>
n@814	2244 div.popup {
n@814	2245 width: 500px;
n@814	2246 position: absolute;
n@814	2247 height: 400px;
n@814	2248 background-color: #fff;
n@814	2249 border-radius: 10px;
n@814	2250 box-shadow: 0px 0px 50px #000;
n@814	2251 z-index: 2;
n@814	2252 }
n@814	2253
n@814	2254 button.popupButton {
n@814	2255 /* Button for popup window
n@814	2256 */
n@814	2257 min-width: 50px;
n@814	2258 height: 25px;
n@814	2259 position: relative;
n@814	2260 border-radius: 5px;
n@814	2261 border: #444;
n@814	2262 border-width: 1px;
n@814	2263 border-style: solid;
n@814	2264 background-color: #fff;
n@814	2265 }
n@814	2266
n@814	2267 div.dragndrop {
n@814	2268 margin-top: 10px;
n@814	2269 border:#000000;
n@814	2270 border-style: dashed;
n@814	2271 border-width: 2px;
n@814	2272 }
n@814	2273 div.dndheaderelement {
n@814	2274 float: left;
n@814	2275 height: 100%;
n@814	2276 border-right: #DDDDDD;
n@814	2277 border-right-width: 1px;
n@814	2278 border-right-style: solid;
n@814	2279 }
n@814	2280 div.dndheaderelement span{
n@814	2281 padding-left: 5px;
n@814	2282 }
n@814	2283
n@814	2284 div.topLevel {
n@814	2285 border: #000;
n@814	2286 border-style: solid;
n@814	2287 border-width: 5px;
n@814	2288 padding: 10px;
n@814	2289 margin: 10px;
n@814	2290 }
n@814	2291
n@814	2292 div.SecondLevel {
n@814	2293 border: #000;
n@814	2294 border-style: solid;
n@814	2295 border-width: 1px;
n@814	2296 padding: 10px;
n@814	2297 margin: 10px;
n@814	2298 }
n@814	2299 </style>
n@814	2300 </head>
n@814	2301
n@814	2302 <body>
n@814	2303 <div id="content"></div>
n@814	2304 </body>
n@814	2305 </html>

Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 814:22ad83e232f7