Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 369:fe049caed3ae Dev_main

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