Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 373:5ca2b999be88 Dev_main

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