annotate test_create/test_create.html @ 1475:6c775168e88b

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