Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 755:c73996a0fb21

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