webaudioevaluationtool: test_create/test

annotate test_create/test_create.html @ 374:6139c53deba1 Dev_main

Specification Node is same across project.

author	Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
date	Mon, 07 Dec 2015 09:47:26 +0000
parents	5ca2b999be88
children	42cf69a134aa

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

Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 374:6139c53deba1 Dev_main