Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 1453:04e8a9c07c7e

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Updating test create using questions
author Nicholas Jillings <nickjillings@users.noreply.github.com>
date Wed, 23 Sep 2015 11:42:11 +0100
parents
children bc6c35b0a49d
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@1453 17 var MUSHRAInterfaceOptions = [[],[]];
nickjillings@1453 18 var MUSHRAInterfaceChecks = [["fragmentPlayed","fragmentMoved","fragmentComments"],["All Fragments Played","All sliders moved","All fragments have comments"]];
nickjillings@1453 19 var popupInstance;
nickjillings@1453 20 var specificationNode;
nickjillings@1453 21 var audioContext;
nickjillings@1453 22 window.onload = function()
nickjillings@1453 23 {
nickjillings@1453 24 var AudioContext = window.AudioContext || window.webkitAudioContext;
nickjillings@1453 25 audioContext = new AudioContext;
nickjillings@1453 26 popupInstance = new popup();
nickjillings@1453 27 popupInstance.advanceState();
nickjillings@1453 28 specificationNode = new Specification();
nickjillings@1453 29 };
nickjillings@1453 30
nickjillings@1453 31 function popup()
nickjillings@1453 32 {
nickjillings@1453 33 var x = window.innerWidth;
nickjillings@1453 34 var y = window.innerHeight;
nickjillings@1453 35 this.popupHolder = document.createElement('div');
nickjillings@1453 36 this.popupHolder.style.visibility = 'hidden';
nickjillings@1453 37 this.popupContent = document.createElement('div');
nickjillings@1453 38 this.popupTitle = document.createElement('div');
nickjillings@1453 39 this.popupBody = document.createElement('div');
nickjillings@1453 40 this.popupFooter = document.createElement('div');
nickjillings@1453 41 this.popupTitleText = document.createElement('span');
nickjillings@1453 42 this.popupTitle.appendChild(this.popupTitleText);
nickjillings@1453 43
nickjillings@1453 44 this.popupHolder.className = "popup";
nickjillings@1453 45 this.popupHolder.style.left = (x-500)/2 +'px';
nickjillings@1453 46 this.popupHolder.style.top = (y-400)/2 + 'px';
nickjillings@1453 47 this.popupContent.style.padding = "20px";
nickjillings@1453 48 this.popupHolder.appendChild(this.popupContent);
nickjillings@1453 49
nickjillings@1453 50 this.popupTitle.style.width = "100%";
nickjillings@1453 51 this.popupTitle.style.height = "50px";
nickjillings@1453 52 this.popupTitle.style.fontSize = "xx-large";
nickjillings@1453 53 this.popupContent.appendChild(this.popupTitle);
nickjillings@1453 54
nickjillings@1453 55 this.popupBody.style.width = "100%";
nickjillings@1453 56 this.popupBody.style.height = "280px";
nickjillings@1453 57 this.popupContent.appendChild(this.popupBody);
nickjillings@1453 58
nickjillings@1453 59 this.popupFooter.style.width = "100%";
nickjillings@1453 60 this.popupFooter.style.height = "30px";
nickjillings@1453 61 this.popupContent.appendChild(this.popupFooter);
nickjillings@1453 62 var body = document.getElementsByTagName('body')[0];
nickjillings@1453 63 body.appendChild(this.popupHolder);
nickjillings@1453 64
nickjillings@1453 65 this.pageBlank = document.createElement('div');
nickjillings@1453 66 body.appendChild(this.pageBlank);
nickjillings@1453 67 this.pageBlank.style.width = "100%";
nickjillings@1453 68 this.pageBlank.style.height = "100%";
nickjillings@1453 69 this.pageBlank.style.position = "absolute";
nickjillings@1453 70 this.pageBlank.style.left = "0px";
nickjillings@1453 71 this.pageBlank.style.top = "0px";
nickjillings@1453 72 this.pageBlank.style.backgroundColor = "rgba(0,0,0,0.5)";
nickjillings@1453 73 this.pageBlank.style.visibility = 'hidden';
nickjillings@1453 74
nickjillings@1453 75 this.state = 0;
nickjillings@1453 76
nickjillings@1453 77 this.showPopup = function()
nickjillings@1453 78 {
nickjillings@1453 79 this.popupHolder.style.visibility = 'visible';
nickjillings@1453 80 this.popupHolder.style.zIndex = "3";
nickjillings@1453 81 this.pageBlank.style.visibility = 'visible';
nickjillings@1453 82 this.pageBlank.style.zIndex = "2";
nickjillings@1453 83 };
nickjillings@1453 84
nickjillings@1453 85 this.hidePopup = function()
nickjillings@1453 86 {
nickjillings@1453 87 this.popupHolder.style.visibility = 'hidden';
nickjillings@1453 88 this.popupHolder.style.zIndex = "-1";
nickjillings@1453 89 this.pageBlank.style.visibility = 'hidden';
nickjillings@1453 90 this.pageBlank.style.zIndex = "-2";
nickjillings@1453 91 };
nickjillings@1453 92
nickjillings@1453 93 this.init = function()
nickjillings@1453 94 {
nickjillings@1453 95 this.popupTitleText.textContent = "Welcome";
nickjillings@1453 96 var text = document.createElement('span');
nickjillings@1453 97 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 98 var dnd = document.createElement('div');
nickjillings@1453 99 dnd.style.width = "100%";
nickjillings@1453 100 dnd.style.height = "50px";
nickjillings@1453 101 dnd.className = "dragndrop";
nickjillings@1453 102 this.popupBody.appendChild(text);
nickjillings@1453 103 this.popupBody.appendChild(dnd);
nickjillings@1453 104 this.showPopup();
nickjillings@1453 105
nickjillings@1453 106 var button = document.createElement('button');
nickjillings@1453 107 button.className = "popupButton";
nickjillings@1453 108 button.textContent = "New File";
nickjillings@1453 109 button.onclick = function(event) {
nickjillings@1453 110 popupInstance.advanceState();
nickjillings@1453 111 };
nickjillings@1453 112 this.popupFooter.appendChild(button);
nickjillings@1453 113 };
nickjillings@1453 114
nickjillings@1453 115 this.advanceState = function()
nickjillings@1453 116 {
nickjillings@1453 117 this.popupBody.innerHTML = null;
nickjillings@1453 118 this.popupFooter.innerHTML = null;
nickjillings@1453 119 this.popupTitleText.textContent = null;
nickjillings@1453 120 switch(this.state)
nickjillings@1453 121 {
nickjillings@1453 122 case 0:
nickjillings@1453 123 this.init();
nickjillings@1453 124 break;
nickjillings@1453 125 case 1:
nickjillings@1453 126 this.popupTitleText.textContent = "Test Type";
nickjillings@1453 127 var text = document.createElement("span");
nickjillings@1453 128 text.textContent = "What type of test would you like to use. Currently APE (Audio Perceptual Evaluation) and MUSHRA style interfaces are available";
nickjillings@1453 129 this.popupBody.appendChild(text);
nickjillings@1453 130 var select = document.createElement("select");
nickjillings@1453 131 select.id="interface-select";
nickjillings@1453 132 var opt1 = document.createElement("option");
nickjillings@1453 133 opt1.value = "APE";
nickjillings@1453 134 opt1.textContent = "APE";
nickjillings@1453 135 select.appendChild(opt1);
nickjillings@1453 136 var opt2 = document.createElement("option");
nickjillings@1453 137 opt2.value = "MUSHRA";
nickjillings@1453 138 opt2.textContent = "MUSHRA";
nickjillings@1453 139 select.appendChild(opt2);
nickjillings@1453 140 this.popupBody.appendChild(select);
nickjillings@1453 141
nickjillings@1453 142 var button = document.createElement('button');
nickjillings@1453 143 button.className = "popupButton";
nickjillings@1453 144 button.textContent = "Submit";
nickjillings@1453 145 button.onclick = function(event) {
nickjillings@1453 146 var select = document.getElementById("interface-select");
nickjillings@1453 147 specificationNode.interfaceType = select.value;
nickjillings@1453 148 specificationNode.collectMetrics = true;
nickjillings@1453 149 popupInstance.advanceState();
nickjillings@1453 150 };
nickjillings@1453 151 this.popupFooter.appendChild(button);
nickjillings@1453 152 break;
nickjillings@1453 153 case 2:
nickjillings@1453 154 this.popupTitleText.textContent = "Test Options";
nickjillings@1453 155 var holder = document.createElement('div');
nickjillings@1453 156 holder.style.margin = "5px";
nickjillings@1453 157 var checkbox = document.createElement('input');
nickjillings@1453 158 checkbox.type = 'checkbox';
nickjillings@1453 159 checkbox.id = "Randomise-Page";
nickjillings@1453 160 var text = document.createElement('span');
nickjillings@1453 161 text.textContent = "Randomise Page Order";
nickjillings@1453 162 holder.appendChild(checkbox);
nickjillings@1453 163 holder.appendChild(text);
nickjillings@1453 164 this.popupBody.appendChild(holder);
nickjillings@1453 165 switch(specificationNode.interfaceType)
nickjillings@1453 166 {
nickjillings@1453 167 case "APE":
nickjillings@1453 168 for (var i=0; i<APEInterfaceOptions[0].length; i++)
nickjillings@1453 169 {
nickjillings@1453 170 holder = document.createElement('div');
nickjillings@1453 171 holder.style.margin = "5px";
nickjillings@1453 172 checkbox = document.createElement('input');
nickjillings@1453 173 checkbox.type = 'checkbox';
nickjillings@1453 174 checkbox.setAttribute("name","option");
nickjillings@1453 175 checkbox.id = APEInterfaceOptions[0][i];
nickjillings@1453 176 text = document.createElement('span');
nickjillings@1453 177 text.textContent = APEInterfaceOptions[1][i];
nickjillings@1453 178 holder.appendChild(checkbox);
nickjillings@1453 179 holder.appendChild(text);
nickjillings@1453 180 this.popupBody.appendChild(holder);
nickjillings@1453 181 }
nickjillings@1453 182 for (var i=0; i<APEInterfaceChecks[0].length; i++)
nickjillings@1453 183 {
nickjillings@1453 184 holder = document.createElement('div');
nickjillings@1453 185 holder.style.margin = "5px";
nickjillings@1453 186 checkbox = document.createElement('input');
nickjillings@1453 187 checkbox.type = 'checkbox';
nickjillings@1453 188 checkbox.setAttribute("name","check");
nickjillings@1453 189 checkbox.id = APEInterfaceChecks[0][i];
nickjillings@1453 190 text = document.createElement('span');
nickjillings@1453 191 text.textContent = APEInterfaceChecks[1][i];
nickjillings@1453 192 holder.appendChild(checkbox);
nickjillings@1453 193 holder.appendChild(text);
nickjillings@1453 194 this.popupBody.appendChild(holder);
nickjillings@1453 195 }
nickjillings@1453 196 break;
nickjillings@1453 197 case "MUSHRA":
nickjillings@1453 198 for (var i=0; i<MUSHRAInterfaceOptions[0].length; i++)
nickjillings@1453 199 {
nickjillings@1453 200 holder = document.createElement('div');
nickjillings@1453 201 holder.style.margin = "5px";
nickjillings@1453 202 checkbox = document.createElement('input');
nickjillings@1453 203 checkbox.type = 'checkbox';
nickjillings@1453 204 checkbox.setAttribute("name","option");
nickjillings@1453 205 checkbox.id = MUSHRAInterfaceOptions[0][i];
nickjillings@1453 206 text = document.createElement('span');
nickjillings@1453 207 text.textContent = MUSHRAInterfaceOptions[1][i];
nickjillings@1453 208 holder.appendChild(checkbox);
nickjillings@1453 209 holder.appendChild(text);
nickjillings@1453 210 this.popupBody.appendChild(holder);
nickjillings@1453 211 }
nickjillings@1453 212 for (var i=0; i<MUSHRAInterfaceChecks[0].length; i++)
nickjillings@1453 213 {
nickjillings@1453 214 holder = document.createElement('div');
nickjillings@1453 215 holder.style.margin = "5px";
nickjillings@1453 216 checkbox = document.createElement('input');
nickjillings@1453 217 checkbox.type = 'checkbox';
nickjillings@1453 218 checkbox.setAttribute("name","check");
nickjillings@1453 219 checkbox.id = MUSHRAInterfaceChecks[0][i];
nickjillings@1453 220 text = document.createElement('span');
nickjillings@1453 221 text.textContent = MUSHRAInterfaceChecks[1][i];
nickjillings@1453 222 holder.appendChild(checkbox);
nickjillings@1453 223 holder.appendChild(text);
nickjillings@1453 224 this.popupBody.appendChild(holder);
nickjillings@1453 225 }
nickjillings@1453 226 }
nickjillings@1453 227 var button = document.createElement('button');
nickjillings@1453 228 button.className = "popupButton";
nickjillings@1453 229 button.textContent = "Submit";
nickjillings@1453 230 button.onclick = function(event) {
nickjillings@1453 231 var optHold = popupInstance.popupBody;
nickjillings@1453 232 var opt = optHold.firstChild;
nickjillings@1453 233 var input = opt.getElementsByTagName('input')[0];
nickjillings@1453 234 specificationNode.randomiseOrder = input.checked;
nickjillings@1453 235 while(opt.nextSibling != null)
nickjillings@1453 236 {
nickjillings@1453 237 opt = opt.nextSibling;
nickjillings@1453 238 input = opt.getElementsByTagName('input')[0];
nickjillings@1453 239 if (input.checked)
nickjillings@1453 240 {
nickjillings@1453 241 specificationNode.commonInterface.options.push(new specificationNode.commonInterface.optionNode(input));
nickjillings@1453 242 }
nickjillings@1453 243
nickjillings@1453 244 }
nickjillings@1453 245 popupInstance.advanceState();
nickjillings@1453 246 };
nickjillings@1453 247 this.popupFooter.appendChild(button);
nickjillings@1453 248 break;
nickjillings@1453 249 case 3:
nickjillings@1453 250 this.popupTitleText.textContent = "Test Page";
nickjillings@1453 251 var span = document.createElement('span');
nickjillings@1453 252 span.textContent = "Drag and drop your audio files into the box below to add them to a test page";
nickjillings@1453 253 this.popupBody.appendChild(span);
nickjillings@1453 254 var dnd = document.createElement('div');
nickjillings@1453 255 dnd.id = "audio-holder-drop";
nickjillings@1453 256 dnd.style.width = "100%";
nickjillings@1453 257 dnd.style.minHeight = "50px";
nickjillings@1453 258 dnd.style.maxHeight = "220px";
nickjillings@1453 259 dnd.style.overflow = 'auto';
nickjillings@1453 260 dnd.className = "dragndrop";
nickjillings@1453 261 dnd.ondragover = function(e) {
nickjillings@1453 262 if(e.preventDefault) {e.preventDefault();}
nickjillings@1453 263 return false;
nickjillings@1453 264 };
nickjillings@1453 265 dnd.ondragenter = function(e) {
nickjillings@1453 266 if(e.preventDefault) {e.preventDefault();}
nickjillings@1453 267 return false;
nickjillings@1453 268 };
nickjillings@1453 269 dnd.ondrop = function(e) {
nickjillings@1453 270 if(e.preventDefault) {e.preventDefault();}
nickjillings@1453 271 var dt = e.dataTransfer;
nickjillings@1453 272 var body = document.getElementById("audio-holder-drop");
nickjillings@1453 273 var files = dt.files;
nickjillings@1453 274 for (var i = 0, f; f = files[i]; i++)
nickjillings@1453 275 {
nickjillings@1453 276 var dndHeader = document.createElement('div');
nickjillings@1453 277 dndHeader.style.width = "100%";
nickjillings@1453 278 dndHeader.style.height = "20px";
nickjillings@1453 279 dndHeader.style.borderBottom = "#DDD";
nickjillings@1453 280 dndHeader.style.borderBottomWidth = "1px";
nickjillings@1453 281 dndHeader.style.borderBottomStyle = "solid";
nickjillings@1453 282 var dndHInclude = document.createElement('div');
nickjillings@1453 283 dndHInclude.style.width = "30px";
nickjillings@1453 284 dndHInclude.className = "dndheaderelement";
nickjillings@1453 285 var includeCheck = document.createElement('input');
nickjillings@1453 286 includeCheck.type = "checkbox";
nickjillings@1453 287 includeCheck.name = "include-check";
nickjillings@1453 288 includeCheck.checked = true;
nickjillings@1453 289 dndHInclude.appendChild(includeCheck);
nickjillings@1453 290 dndHeader.appendChild(dndHInclude);
nickjillings@1453 291 var dndHTitle = document.createElement('div');
nickjillings@1453 292 dndHTitle.style.width = "180px";
nickjillings@1453 293 dndHTitle.className = "dndheaderelement";
nickjillings@1453 294 var text = document.createElement('span');
nickjillings@1453 295 text.textContent = f.name;
nickjillings@1453 296 dndHTitle.appendChild(text);
nickjillings@1453 297 dndHeader.appendChild(dndHTitle);
nickjillings@1453 298 var dndHID = document.createElement('div');
nickjillings@1453 299 dndHID.style.width = "100px";
nickjillings@1453 300 dndHID.className = "dndheaderelement";
nickjillings@1453 301 var IDInput = document.createElement('input');
nickjillings@1453 302 IDInput.name = "ID";
nickjillings@1453 303 IDInput.value = f.name.split('.')[0];
nickjillings@1453 304 IDInput.style.width = "96px";
nickjillings@1453 305 // TODO: Automatic checking for common ID;
nickjillings@1453 306 dndHID.appendChild(IDInput);
nickjillings@1453 307 dndHeader.appendChild(dndHID);
nickjillings@1453 308 var dndHPlay = document.createElement('div');
nickjillings@1453 309 dndHPlay.style.width = "100px";
nickjillings@1453 310 dndHPlay.className = "dndheaderelement";
nickjillings@1453 311 var audio = document.createElement('audio');
nickjillings@1453 312 dndHPlay.appendChild(audio);
nickjillings@1453 313 dndHeader.appendChild(dndHPlay);
nickjillings@1453 314 dnd.appendChild(dndHeader);
nickjillings@1453 315 }
nickjillings@1453 316 };
nickjillings@1453 317 var dndHeader = document.createElement('div');
nickjillings@1453 318 dndHeader.style.width = "100%";
nickjillings@1453 319 dndHeader.style.height = "15px";
nickjillings@1453 320 dndHeader.style.borderBottom = "#DDD";
nickjillings@1453 321 dndHeader.style.borderBottomWidth = "1px";
nickjillings@1453 322 dndHeader.style.borderBottomStyle = "solid";
nickjillings@1453 323 var dndHInclude = document.createElement('div');
nickjillings@1453 324 dndHInclude.style.width = "30px";
nickjillings@1453 325 dndHInclude.className = "dndheaderelement";
nickjillings@1453 326 var text = document.createElement('span');
nickjillings@1453 327 text.textContent = "Inc.";
nickjillings@1453 328 dndHInclude.appendChild(text);
nickjillings@1453 329 dndHeader.appendChild(dndHInclude);
nickjillings@1453 330 var dndHTitle = document.createElement('div');
nickjillings@1453 331 dndHTitle.style.width = "180px";
nickjillings@1453 332 dndHTitle.className = "dndheaderelement";
nickjillings@1453 333 text = document.createElement('span');
nickjillings@1453 334 text.textContent = "File Name";
nickjillings@1453 335 dndHTitle.appendChild(text);
nickjillings@1453 336 dndHeader.appendChild(dndHTitle);
nickjillings@1453 337 var dndHID = document.createElement('div');
nickjillings@1453 338 dndHID.style.width = "100px";
nickjillings@1453 339 dndHID.className = "dndheaderelement";
nickjillings@1453 340 text = document.createElement('span');
nickjillings@1453 341 text.textContent = "ID";
nickjillings@1453 342 dndHID.appendChild(text);
nickjillings@1453 343 dndHeader.appendChild(dndHID);
nickjillings@1453 344 var dndHPlay = document.createElement('div');
nickjillings@1453 345 dndHPlay.style.width = "100px";
nickjillings@1453 346 dndHPlay.className = "dndheaderelement";
nickjillings@1453 347 text = document.createElement('span');
nickjillings@1453 348 text.textContent = "Sample";
nickjillings@1453 349 dndHPlay.appendChild(text);
nickjillings@1453 350 dndHeader.appendChild(dndHPlay);
nickjillings@1453 351 dnd.appendChild(dndHeader);
nickjillings@1453 352 this.popupBody.appendChild(dnd);
nickjillings@1453 353 var button = document.createElement('button');
nickjillings@1453 354 button.className = "popupButton";
nickjillings@1453 355 button.textContent = "Submit";
nickjillings@1453 356 button.onclick = function(event)
nickjillings@1453 357 {
nickjillings@1453 358
nickjillings@1453 359 };
nickjillings@1453 360 this.popupFooter.appendChild(button);
nickjillings@1453 361 }
nickjillings@1453 362 this.state++;
nickjillings@1453 363 };
nickjillings@1453 364 };
nickjillings@1453 365
nickjillings@1453 366 function Specification() {
nickjillings@1453 367 // Handles the decoding of the project specification XML into a simple JavaScript Object.
nickjillings@1453 368
nickjillings@1453 369 this.interfaceType = null;
nickjillings@1453 370 this.commonInterface = new function()
nickjillings@1453 371 {
nickjillings@1453 372 this.options = [];
nickjillings@1453 373 this.optionNode = function(input)
nickjillings@1453 374 {
nickjillings@1453 375 var name = input.getAttribute('name');
nickjillings@1453 376 this.type = name;
nickjillings@1453 377 if(this.type == "option")
nickjillings@1453 378 {
nickjillings@1453 379 this.name = input.id;
nickjillings@1453 380 } else if (this.type == "check")
nickjillings@1453 381 {
nickjillings@1453 382 this.check = input.id;
nickjillings@1453 383 }
nickjillings@1453 384 };
nickjillings@1453 385 };
nickjillings@1453 386 this.projectReturn = null;
nickjillings@1453 387 this.randomiseOrder = null;
nickjillings@1453 388 this.collectMetrics = null;
nickjillings@1453 389 this.testPages = null;
nickjillings@1453 390 this.preTest = null;
nickjillings@1453 391 this.postTest = null;
nickjillings@1453 392 this.audioHolders = [];
nickjillings@1453 393
nickjillings@1453 394 this.decode = function() {
nickjillings@1453 395 // projectXML - DOM Parsed document
nickjillings@1453 396 this.projectXML = projectXML.childNodes[0];
nickjillings@1453 397 var setupNode = projectXML.getElementsByTagName('setup')[0];
nickjillings@1453 398 this.interfaceType = setupNode.getAttribute('interface');
nickjillings@1453 399 this.projectReturn = setupNode.getAttribute('projectReturn');
nickjillings@1453 400 this.testPages = setupNode.getAttribute('testPages');
nickjillings@1453 401 if (setupNode.getAttribute('randomiseOrder') == "true") {
nickjillings@1453 402 this.randomiseOrder = true;
nickjillings@1453 403 } else {this.randomiseOrder = false;}
nickjillings@1453 404 if (setupNode.getAttribute('collectMetrics') == "true") {
nickjillings@1453 405 this.collectMetrics = true;
nickjillings@1453 406 } else {this.collectMetrics = false;}
nickjillings@1453 407 if (isNaN(Number(this.testPages)) || this.testPages == undefined)
nickjillings@1453 408 {
nickjillings@1453 409 this.testPages = null;
nickjillings@1453 410 } else {
nickjillings@1453 411 this.testPages = Number(this.testPages);
nickjillings@1453 412 if (this.testPages == 0) {this.testPages = null;}
nickjillings@1453 413 }
nickjillings@1453 414 var metricCollection = setupNode.getElementsByTagName('Metric');
nickjillings@1453 415
nickjillings@1453 416 this.preTest = new this.prepostNode('pretest',setupNode.getElementsByTagName('PreTest'));
nickjillings@1453 417 this.postTest = new this.prepostNode('posttest',setupNode.getElementsByTagName('PostTest'));
nickjillings@1453 418
nickjillings@1453 419 if (metricCollection.length > 0) {
nickjillings@1453 420 metricCollection = metricCollection[0].getElementsByTagName('metricEnable');
nickjillings@1453 421 for (var i=0; i<metricCollection.length; i++) {
nickjillings@1453 422 this.metrics.push(new this.metricNode(metricCollection[i].textContent));
nickjillings@1453 423 }
nickjillings@1453 424 }
nickjillings@1453 425
nickjillings@1453 426 var commonInterfaceNode = setupNode.getElementsByTagName('interface');
nickjillings@1453 427 if (commonInterfaceNode.length > 0) {
nickjillings@1453 428 commonInterfaceNode = commonInterfaceNode[0];
nickjillings@1453 429 } else {
nickjillings@1453 430 commonInterfaceNode = undefined;
nickjillings@1453 431 }
nickjillings@1453 432
nickjillings@1453 433 this.commonInterface = new function() {
nickjillings@1453 434 this.OptionNode = function(child) {
nickjillings@1453 435 this.type = child.nodeName;
nickjillings@1453 436 if (this.type == 'option')
nickjillings@1453 437 {
nickjillings@1453 438 this.name = child.getAttribute('name');
nickjillings@1453 439 }
nickjillings@1453 440 else if (this.type == 'check') {
nickjillings@1453 441 this.check = child.getAttribute('name');
nickjillings@1453 442 if (this.check == 'scalerange') {
nickjillings@1453 443 this.min = child.getAttribute('min');
nickjillings@1453 444 this.max = child.getAttribute('max');
nickjillings@1453 445 if (this.min == null) {this.min = 1;}
nickjillings@1453 446 else if (Number(this.min) > 1 && this.min != null) {
nickjillings@1453 447 this.min = Number(this.min)/100;
nickjillings@1453 448 } else {
nickjillings@1453 449 this.min = Number(this.min);
nickjillings@1453 450 }
nickjillings@1453 451 if (this.max == null) {this.max = 0;}
nickjillings@1453 452 else if (Number(this.max) > 1 && this.max != null) {
nickjillings@1453 453 this.max = Number(this.max)/100;
nickjillings@1453 454 } else {
nickjillings@1453 455 this.max = Number(this.max);
nickjillings@1453 456 }
nickjillings@1453 457 }
nickjillings@1453 458 } else if (this.type == 'anchor' || this.type == 'reference') {
nickjillings@1453 459 this.value = Number(child.textContent);
nickjillings@1453 460 this.enforce = child.getAttribute('enforce');
nickjillings@1453 461 if (this.enforce == 'true') {this.enforce = true;}
nickjillings@1453 462 else {this.enforce = false;}
nickjillings@1453 463 }
nickjillings@1453 464 };
nickjillings@1453 465 this.options = [];
nickjillings@1453 466 if (commonInterfaceNode != undefined) {
nickjillings@1453 467 var child = commonInterfaceNode.firstElementChild;
nickjillings@1453 468 while (child != undefined) {
nickjillings@1453 469 this.options.push(new this.OptionNode(child));
nickjillings@1453 470 child = child.nextElementSibling;
nickjillings@1453 471 }
nickjillings@1453 472 }
nickjillings@1453 473 };
nickjillings@1453 474
nickjillings@1453 475 var audioHolders = projectXML.getElementsByTagName('audioHolder');
nickjillings@1453 476 for (var i=0; i<audioHolders.length; i++) {
nickjillings@1453 477 this.audioHolders.push(new this.audioHolderNode(this,audioHolders[i]));
nickjillings@1453 478 }
nickjillings@1453 479
nickjillings@1453 480 // New check if we need to randomise the test order
nickjillings@1453 481 if (this.randomiseOrder)
nickjillings@1453 482 {
nickjillings@1453 483 this.audioHolders = randomiseOrder(this.audioHolders);
nickjillings@1453 484 for (var i=0; i<this.audioHolders.length; i++)
nickjillings@1453 485 {
nickjillings@1453 486 this.audioHolders[i].presentedId = i;
nickjillings@1453 487 }
nickjillings@1453 488 }
nickjillings@1453 489
nickjillings@1453 490 if (this.testPages != null || this.testPages != undefined)
nickjillings@1453 491 {
nickjillings@1453 492 if (this.testPages > audioHolders.length)
nickjillings@1453 493 {
nickjillings@1453 494 console.log('Warning: You have specified '+audioHolders.length+' tests but requested '+this.testPages+' be completed!');
nickjillings@1453 495 this.testPages = audioHolders.length;
nickjillings@1453 496 }
nickjillings@1453 497 var aH = this.audioHolders;
nickjillings@1453 498 this.audioHolders = [];
nickjillings@1453 499 for (var i=0; i<this.testPages; i++)
nickjillings@1453 500 {
nickjillings@1453 501 this.audioHolders.push(aH[i]);
nickjillings@1453 502 }
nickjillings@1453 503 }
nickjillings@1453 504 };
nickjillings@1453 505
nickjillings@1453 506 this.prepostNode = function(type,Collection) {
nickjillings@1453 507 this.type = type;
nickjillings@1453 508 this.options = [];
nickjillings@1453 509
nickjillings@1453 510 this.OptionNode = function(child) {
nickjillings@1453 511
nickjillings@1453 512 this.childOption = function(element) {
nickjillings@1453 513 this.type = 'option';
nickjillings@1453 514 this.id = element.id;
nickjillings@1453 515 this.name = element.getAttribute('name');
nickjillings@1453 516 this.text = element.textContent;
nickjillings@1453 517 };
nickjillings@1453 518
nickjillings@1453 519 this.type = child.nodeName;
nickjillings@1453 520 if (child.nodeName == "question") {
nickjillings@1453 521 this.id = child.id;
nickjillings@1453 522 this.mandatory;
nickjillings@1453 523 if (child.getAttribute('mandatory') == "true") {this.mandatory = true;}
nickjillings@1453 524 else {this.mandatory = false;}
nickjillings@1453 525 this.question = child.textContent;
nickjillings@1453 526 if (child.getAttribute('boxsize') == null) {
nickjillings@1453 527 this.boxsize = 'normal';
nickjillings@1453 528 } else {
nickjillings@1453 529 this.boxsize = child.getAttribute('boxsize');
nickjillings@1453 530 }
nickjillings@1453 531 } else if (child.nodeName == "statement") {
nickjillings@1453 532 this.statement = child.textContent;
nickjillings@1453 533 } else if (child.nodeName == "checkbox" || child.nodeName == "radio") {
nickjillings@1453 534 var element = child.firstElementChild;
nickjillings@1453 535 this.id = child.id;
nickjillings@1453 536 if (element == null) {
nickjillings@1453 537 console.log('Malformed' +child.nodeName+ 'entry');
nickjillings@1453 538 this.statement = 'Malformed' +child.nodeName+ 'entry';
nickjillings@1453 539 this.type = 'statement';
nickjillings@1453 540 } else {
nickjillings@1453 541 this.options = [];
nickjillings@1453 542 while (element != null) {
nickjillings@1453 543 if (element.nodeName == 'statement' && this.statement == undefined){
nickjillings@1453 544 this.statement = element.textContent;
nickjillings@1453 545 } else if (element.nodeName == 'option') {
nickjillings@1453 546 this.options.push(new this.childOption(element));
nickjillings@1453 547 }
nickjillings@1453 548 element = element.nextElementSibling;
nickjillings@1453 549 }
nickjillings@1453 550 }
nickjillings@1453 551 } else if (child.nodeName == "number") {
nickjillings@1453 552 this.statement = child.textContent;
nickjillings@1453 553 this.id = child.id;
nickjillings@1453 554 this.min = child.getAttribute('min');
nickjillings@1453 555 this.max = child.getAttribute('max');
nickjillings@1453 556 this.step = child.getAttribute('step');
nickjillings@1453 557 }
nickjillings@1453 558 };
nickjillings@1453 559
nickjillings@1453 560 // On construction:
nickjillings@1453 561 if (Collection.length != 0) {
nickjillings@1453 562 Collection = Collection[0];
nickjillings@1453 563 if (Collection.childElementCount != 0) {
nickjillings@1453 564 var child = Collection.firstElementChild;
nickjillings@1453 565 this.options.push(new this.OptionNode(child));
nickjillings@1453 566 while (child.nextElementSibling != null) {
nickjillings@1453 567 child = child.nextElementSibling;
nickjillings@1453 568 this.options.push(new this.OptionNode(child));
nickjillings@1453 569 }
nickjillings@1453 570 }
nickjillings@1453 571 }
nickjillings@1453 572 };
nickjillings@1453 573
nickjillings@1453 574 this.metricNode = function(name) {
nickjillings@1453 575 this.enabled = name;
nickjillings@1453 576 };
nickjillings@1453 577
nickjillings@1453 578 this.audioHolderNode = function(parent,xml) {
nickjillings@1453 579 this.type = 'audioHolder';
nickjillings@1453 580 this.presentedId = parent.audioHolders.length;
nickjillings@1453 581 this.interfaceNode = function(DOM) {
nickjillings@1453 582 var title = DOM.getElementsByTagName('title');
nickjillings@1453 583 if (title.length == 0) {this.title = null;}
nickjillings@1453 584 else {this.title = title[0].textContent;}
nickjillings@1453 585 this.options = parent.commonInterface.options;
nickjillings@1453 586 var scale = DOM.getElementsByTagName('scale');
nickjillings@1453 587 this.scale = [];
nickjillings@1453 588 for (var i=0; i<scale.length; i++) {
nickjillings@1453 589 var arr = [null, null];
nickjillings@1453 590 arr[0] = scale[i].getAttribute('position');
nickjillings@1453 591 arr[1] = scale[i].textContent;
nickjillings@1453 592 this.scale.push(arr);
nickjillings@1453 593 }
nickjillings@1453 594 };
nickjillings@1453 595
nickjillings@1453 596 this.audioElementNode = function(parent,xml) {
nickjillings@1453 597 this.url = xml.getAttribute('url');
nickjillings@1453 598 this.id = xml.id;
nickjillings@1453 599 this.parent = parent;
nickjillings@1453 600 this.type = xml.getAttribute('type');
nickjillings@1453 601 if (this.type == null) {this.type = "normal";}
nickjillings@1453 602 if (this.type == 'anchor') {this.anchor = true;}
nickjillings@1453 603 else {this.anchor = false;}
nickjillings@1453 604 if (this.type == 'reference') {this.reference = true;}
nickjillings@1453 605 else {this.reference = false;}
nickjillings@1453 606
nickjillings@1453 607 this.marker = xml.getAttribute('marker');
nickjillings@1453 608 if (this.marker == null) {this.marker = undefined;}
nickjillings@1453 609
nickjillings@1453 610 if (this.anchor == true) {
nickjillings@1453 611 if (this.marker != undefined) {this.enforce = true;}
nickjillings@1453 612 else {this.enforce = enforceAnchor;}
nickjillings@1453 613 this.marker = anchor;
nickjillings@1453 614 }
nickjillings@1453 615 else if (this.reference == true) {
nickjillings@1453 616 if (this.marker != undefined) {this.enforce = true;}
nickjillings@1453 617 else {this.enforce = enforceReference;}
nickjillings@1453 618 this.marker = reference;
nickjillings@1453 619 }
nickjillings@1453 620
nickjillings@1453 621 if (this.marker != undefined) {
nickjillings@1453 622 this.marker = Number(this.marker);
nickjillings@1453 623 if (this.marker > 1) {this.marker /= 100;}
nickjillings@1453 624 }
nickjillings@1453 625 };
nickjillings@1453 626
nickjillings@1453 627 this.commentQuestionNode = function(xml) {
nickjillings@1453 628 this.childOption = function(element) {
nickjillings@1453 629 this.type = 'option';
nickjillings@1453 630 this.name = element.getAttribute('name');
nickjillings@1453 631 this.text = element.textContent;
nickjillings@1453 632 };
nickjillings@1453 633 this.id = xml.id;
nickjillings@1453 634 if (xml.getAttribute('mandatory') == 'true') {this.mandatory = true;}
nickjillings@1453 635 else {this.mandatory = false;}
nickjillings@1453 636 this.type = xml.getAttribute('type');
nickjillings@1453 637 if (this.type == undefined) {this.type = 'text';}
nickjillings@1453 638 switch (this.type) {
nickjillings@1453 639 case 'text':
nickjillings@1453 640 this.question = xml.textContent;
nickjillings@1453 641 break;
nickjillings@1453 642 case 'radio':
nickjillings@1453 643 var child = xml.firstElementChild;
nickjillings@1453 644 this.options = [];
nickjillings@1453 645 while (child != undefined) {
nickjillings@1453 646 if (child.nodeName == 'statement' && this.statement == undefined) {
nickjillings@1453 647 this.statement = child.textContent;
nickjillings@1453 648 } else if (child.nodeName == 'option') {
nickjillings@1453 649 this.options.push(new this.childOption(child));
nickjillings@1453 650 }
nickjillings@1453 651 child = child.nextElementSibling;
nickjillings@1453 652 }
nickjillings@1453 653 break;
nickjillings@1453 654 case 'checkbox':
nickjillings@1453 655 var child = xml.firstElementChild;
nickjillings@1453 656 this.options = [];
nickjillings@1453 657 while (child != undefined) {
nickjillings@1453 658 if (child.nodeName == 'statement' && this.statement == undefined) {
nickjillings@1453 659 this.statement = child.textContent;
nickjillings@1453 660 } else if (child.nodeName == 'option') {
nickjillings@1453 661 this.options.push(new this.childOption(child));
nickjillings@1453 662 }
nickjillings@1453 663 child = child.nextElementSibling;
nickjillings@1453 664 }
nickjillings@1453 665 break;
nickjillings@1453 666 }
nickjillings@1453 667 };
nickjillings@1453 668
nickjillings@1453 669 this.id = xml.id;
nickjillings@1453 670 this.hostURL = xml.getAttribute('hostURL');
nickjillings@1453 671 this.sampleRate = xml.getAttribute('sampleRate');
nickjillings@1453 672 if (xml.getAttribute('randomiseOrder') == "true") {this.randomiseOrder = true;}
nickjillings@1453 673 else {this.randomiseOrder = false;}
nickjillings@1453 674 this.repeatCount = xml.getAttribute('repeatCount');
nickjillings@1453 675 if (xml.getAttribute('loop') == 'true') {this.loop = true;}
nickjillings@1453 676 else {this.loop == false;}
nickjillings@1453 677 if (xml.getAttribute('elementComments') == "true") {this.elementComments = true;}
nickjillings@1453 678 else {this.elementComments = false;}
nickjillings@1453 679
nickjillings@1453 680 var anchor = xml.getElementsByTagName('anchor');
nickjillings@1453 681 var enforceAnchor = false;
nickjillings@1453 682 if (anchor.length == 0) {
nickjillings@1453 683 // Find anchor in commonInterface;
nickjillings@1453 684 for (var i=0; i<parent.commonInterface.options.length; i++) {
nickjillings@1453 685 if(parent.commonInterface.options[i].type == 'anchor') {
nickjillings@1453 686 anchor = parent.commonInterface.options[i].value;
nickjillings@1453 687 enforceAnchor = parent.commonInterface.options[i].enforce;
nickjillings@1453 688 break;
nickjillings@1453 689 }
nickjillings@1453 690 }
nickjillings@1453 691 if (typeof(anchor) == "object") {
nickjillings@1453 692 anchor = null;
nickjillings@1453 693 }
nickjillings@1453 694 } else {
nickjillings@1453 695 anchor = anchor[0].textContent;
nickjillings@1453 696 }
nickjillings@1453 697
nickjillings@1453 698 var reference = xml.getElementsByTagName('anchor');
nickjillings@1453 699 var enforceReference = false;
nickjillings@1453 700 if (reference.length == 0) {
nickjillings@1453 701 // Find anchor in commonInterface;
nickjillings@1453 702 for (var i=0; i<parent.commonInterface.options.length; i++) {
nickjillings@1453 703 if(parent.commonInterface.options[i].type == 'reference') {
nickjillings@1453 704 reference = parent.commonInterface.options[i].value;
nickjillings@1453 705 enforceReference = parent.commonInterface.options[i].enforce;
nickjillings@1453 706 break;
nickjillings@1453 707 }
nickjillings@1453 708 }
nickjillings@1453 709 if (typeof(reference) == "object") {
nickjillings@1453 710 reference = null;
nickjillings@1453 711 }
nickjillings@1453 712 } else {
nickjillings@1453 713 reference = reference[0].textContent;
nickjillings@1453 714 }
nickjillings@1453 715
nickjillings@1453 716 if (typeof(anchor) == 'number') {
nickjillings@1453 717 if (anchor > 1 && anchor < 100) {anchor /= 100.0;}
nickjillings@1453 718 }
nickjillings@1453 719
nickjillings@1453 720 if (typeof(reference) == 'number') {
nickjillings@1453 721 if (reference > 1 && reference < 100) {reference /= 100.0;}
nickjillings@1453 722 }
nickjillings@1453 723
nickjillings@1453 724 this.preTest = new parent.prepostNode('pretest',xml.getElementsByTagName('PreTest'));
nickjillings@1453 725 this.postTest = new parent.prepostNode('posttest',xml.getElementsByTagName('PostTest'));
nickjillings@1453 726
nickjillings@1453 727 this.interfaces = [];
nickjillings@1453 728 var interfaceDOM = xml.getElementsByTagName('interface');
nickjillings@1453 729 for (var i=0; i<interfaceDOM.length; i++) {
nickjillings@1453 730 this.interfaces.push(new this.interfaceNode(interfaceDOM[i]));
nickjillings@1453 731 }
nickjillings@1453 732
nickjillings@1453 733 this.commentBoxPrefix = xml.getElementsByTagName('commentBoxPrefix');
nickjillings@1453 734 if (this.commentBoxPrefix.length != 0) {
nickjillings@1453 735 this.commentBoxPrefix = this.commentBoxPrefix[0].textContent;
nickjillings@1453 736 } else {
nickjillings@1453 737 this.commentBoxPrefix = "Comment on track";
nickjillings@1453 738 }
nickjillings@1453 739
nickjillings@1453 740 this.audioElements =[];
nickjillings@1453 741 var audioElementsDOM = xml.getElementsByTagName('audioElements');
nickjillings@1453 742 this.outsideReference = null;
nickjillings@1453 743 for (var i=0; i<audioElementsDOM.length; i++) {
nickjillings@1453 744 if (audioElementsDOM[i].getAttribute('type') == 'outsidereference') {
nickjillings@1453 745 if (this.outsideReference == null) {
nickjillings@1453 746 this.outsideReference = new this.audioElementNode(this,audioElementsDOM[i]);
nickjillings@1453 747 } else {
nickjillings@1453 748 console.log('Error only one audioelement can be of type outsidereference per audioholder');
nickjillings@1453 749 this.audioElements.push(new this.audioElementNode(this,audioElementsDOM[i]));
nickjillings@1453 750 console.log('Element id '+audioElementsDOM[i].id+' made into normal node');
nickjillings@1453 751 }
nickjillings@1453 752 } else {
nickjillings@1453 753 this.audioElements.push(new this.audioElementNode(this,audioElementsDOM[i]));
nickjillings@1453 754 }
nickjillings@1453 755 }
nickjillings@1453 756
nickjillings@1453 757 if (this.randomiseOrder) {
nickjillings@1453 758 this.audioElements = randomiseOrder(this.audioElements);
nickjillings@1453 759 }
nickjillings@1453 760
nickjillings@1453 761 // Check only one anchor and one reference per audioNode
nickjillings@1453 762 var anchor = [];
nickjillings@1453 763 var reference = [];
nickjillings@1453 764 this.anchorId = null;
nickjillings@1453 765 this.referenceId = null;
nickjillings@1453 766 for (var i=0; i<this.audioElements.length; i++)
nickjillings@1453 767 {
nickjillings@1453 768 if (this.audioElements[i].anchor == true) {anchor.push(i);}
nickjillings@1453 769 if (this.audioElements[i].reference == true) {reference.push(i);}
nickjillings@1453 770 }
nickjillings@1453 771
nickjillings@1453 772 if (anchor.length > 1) {
nickjillings@1453 773 console.log('Error - cannot have more than one anchor!');
nickjillings@1453 774 console.log('Each anchor node will be a normal mode to continue the test');
nickjillings@1453 775 for (var i=0; i<anchor.length; i++)
nickjillings@1453 776 {
nickjillings@1453 777 this.audioElements[anchor[i]].anchor = false;
nickjillings@1453 778 this.audioElements[anchor[i]].value = undefined;
nickjillings@1453 779 }
nickjillings@1453 780 } else {this.anchorId = anchor[0];}
nickjillings@1453 781 if (reference.length > 1) {
nickjillings@1453 782 console.log('Error - cannot have more than one anchor!');
nickjillings@1453 783 console.log('Each anchor node will be a normal mode to continue the test');
nickjillings@1453 784 for (var i=0; i<reference.length; i++)
nickjillings@1453 785 {
nickjillings@1453 786 this.audioElements[reference[i]].reference = false;
nickjillings@1453 787 this.audioElements[reference[i]].value = undefined;
nickjillings@1453 788 }
nickjillings@1453 789 } else {this.referenceId = reference[0];}
nickjillings@1453 790
nickjillings@1453 791 this.commentQuestions = [];
nickjillings@1453 792 var commentQuestionsDOM = xml.getElementsByTagName('CommentQuestion');
nickjillings@1453 793 for (var i=0; i<commentQuestionsDOM.length; i++) {
nickjillings@1453 794 this.commentQuestions.push(new this.commentQuestionNode(commentQuestionsDOM[i]));
nickjillings@1453 795 }
nickjillings@1453 796 };
nickjillings@1453 797 }
nickjillings@1453 798 </script>
nickjillings@1453 799 <style>
nickjillings@1453 800 div.popup {
nickjillings@1453 801 width: 500px;
nickjillings@1453 802 position: absolute;
nickjillings@1453 803 height: 400px;
nickjillings@1453 804 background-color: #fff;
nickjillings@1453 805 border-radius: 10px;
nickjillings@1453 806 box-shadow: 0px 0px 50px #000;
nickjillings@1453 807 z-index: 2;
nickjillings@1453 808 }
nickjillings@1453 809
nickjillings@1453 810 button.popupButton {
nickjillings@1453 811 /* Button for popup window
nickjillings@1453 812 */
nickjillings@1453 813 min-width: 50px;
nickjillings@1453 814 height: 25px;
nickjillings@1453 815 position: relative;
nickjillings@1453 816 border-radius: 5px;
nickjillings@1453 817 border: #444;
nickjillings@1453 818 border-width: 1px;
nickjillings@1453 819 border-style: solid;
nickjillings@1453 820 background-color: #fff;
nickjillings@1453 821 }
nickjillings@1453 822
nickjillings@1453 823 div.dragndrop {
nickjillings@1453 824 margin-top: 10px;
nickjillings@1453 825 border:#000000;
nickjillings@1453 826 border-style: dashed;
nickjillings@1453 827 border-width: 2px;
nickjillings@1453 828 }
nickjillings@1453 829 div.dndheaderelement {
nickjillings@1453 830 float: left;
nickjillings@1453 831 height: 100%;
nickjillings@1453 832 border-right: #DDDDDD;
nickjillings@1453 833 border-right-width: 1px;
nickjillings@1453 834 border-right-style: solid;
nickjillings@1453 835 }
nickjillings@1453 836 div.dndheaderelement span{
nickjillings@1453 837 padding-left: 5px;
nickjillings@1453 838 }
nickjillings@1453 839 </style>
nickjillings@1453 840 </head>
nickjillings@1453 841
nickjillings@1453 842 <body>
nickjillings@1453 843 <div id="content"></div>
nickjillings@1453 844 </body>
nickjillings@1453 845 </html>