webaudioevaluationtool: test_create/test

annotate test_create/test_create.html @ 765:e66434e0f573

Updated demo project, with some added explanations, and no enforced sampling rate. Shows bugs though, at least in this branch.

author	Brecht De Man <BrechtDeMan@users.noreply.github.com>
date	Tue, 08 Dec 2015 12:18:06 +0100
parents
children	3123565e0c49

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

Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 765:e66434e0f573