webaudioevaluationtool: test_create/test

annotate test_create/test_create.html @ 768:30d29aea590f

Minor fixes to test_create Specification before merge with core.js Specification

author	Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
date	Fri, 04 Dec 2015 18:51:58 +0000
parents	d7f2912bf487
children	30adbf6a6d50

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

Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 768:30d29aea590f