annotate test_create/test_create.html @ 1168:c0022a09c4f6

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