Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 1019:d3c76f362c0c

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
create_test: Now exports metric enables. Also fixed spelling mistake 'enableInitalPosition'
author Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
date Wed, 03 Jun 2015 15:06:02 +0100
parents 6372b01560cd
children 5aa3178a8646
rev   line source
n@1010 1 <!DOCTYPE html>
n@1010 2 <html lang="en">
n@1010 3 <head>
n@1010 4 <meta charset="utf-8">
n@1010 5
n@1010 6 <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
n@1010 7 Remove this if you use the .htaccess -->
n@1010 8 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
n@1010 9
n@1010 10 <title>WAET Create Test</title>
n@1010 11 <meta name="description" content="">
n@1010 12 <meta name="author" content="">
n@1010 13
n@1010 14 <meta name="viewport" content="width=device-width; initial-scale=1.0">
n@921 15
n@921 16 <script type="text/javascript">
n@921 17 // To aid 'one-page set-up' all scripts and CSS must be included directly in this file!
n@921 18 var topLevel;
n@921 19 window.onload = function() {
n@921 20 // Initialise page
n@921 21 topLevel = document.getElementById('topLevelBody');
n@921 22 var setup = document.createElement('div');
n@921 23 setup.id = 'setupTagDiv';
n@921 24
n@1017 25 // Setup drag/drop handles
n@1017 26 var dropBody = document.getElementById('dragFile');
n@1017 27 dropBody.addEventListener('dragover', handleDragOver, false);
n@1017 28 dropBody.addEventListener('dragenter',handleDragEnter,false);
n@1017 29 dropBody.addEventListener('dragleave',handleDragLeave,false);
n@1017 30 dropBody.addEventListener('drop', handleDrop,false);
n@921 31 };
n@921 32
n@924 33 function attributePair(string, type, mandatory){
n@921 34 var id = document.createElement("span");
n@921 35 id.textContent = string;
n@921 36 var input = document.createElement("input");
n@921 37 input.type = type;
n@924 38 if (type == 'text') {
n@924 39 if (mandatory == true) {
n@924 40 input.setAttribute('mandatory','true');
n@924 41 }
n@924 42 else {
n@924 43 input.setAttribute('mandatory','false');
n@924 44 }
n@924 45 }
n@921 46 return [id, input];
n@921 47 }
n@921 48
n@922 49 function removeNode(event) {
n@922 50 event.srcElement.parentElement.parentElement.removeChild(event.srcElement.parentElement);
n@922 51 }
n@922 52
n@924 53 function buttonClickedValidate() {
n@924 54 var ready = validate();
n@924 55 if (ready == false) {
n@924 56 var errMsg = document.getElementById('errorMessage');
n@925 57 errMsg.textContent = "There were some errors with your XML. Any input boxes highlighted in red are invalid because they are empty or because its ID matches another elements ID. Please fill these in correctly. Any boxes which are yellow are not-invalid but will use the default value.";
n@924 58 errMsg.style.visibility = 'visible';
n@924 59 document.getElementById('createXML').disabled = true;
n@924 60
n@924 61 } else {
n@924 62 var errMsg = document.getElementById('errorMessage');
n@924 63 errMsg.textContent = "";
n@924 64 errMsg.style.visiblity = 'hidden';
n@924 65 document.getElementById('createXML').disabled = false;
n@924 66 }
n@924 67 }
n@924 68
n@925 69 function buttonClickedSubmit() {
n@925 70 var ready = validate();
n@925 71 if (ready == true) {
n@1016 72 var xmlDoc = buildXML();
n@1016 73 var inject = document.getElementById('errorMessage');
n@1016 74 createProjectSave(xmlDoc, inject);
n@1016 75 }
n@1016 76 }
n@1016 77
n@1016 78 function createProjectSave(xmlDoc, injectPoint) {
n@1016 79 var parent = document.createElement("div");
n@1016 80 parent.appendChild(xmlDoc);
n@1016 81 var file = [parent.innerHTML];
n@1016 82 var bb = new Blob(file,{type : 'application/xml'});
n@1016 83 var dnlk = window.URL.createObjectURL(bb);
n@1016 84 var a = document.createElement("a");
n@1016 85 a.hidden = '';
n@1016 86 a.href = dnlk;
n@1016 87 a.download = "save.xml";
n@1016 88 a.textContent = "Save File";
n@1016 89 injectPoint.appendChild(a);
n@1016 90 }
n@1016 91
n@1016 92 function buildXML() {
n@1016 93 var xmlDoc = document.createElement('BrowserEvalProjectDocument');
n@1016 94 var setup = document.createElement('setup');
n@1016 95 setup.setAttribute('interface',document.getElementById('interface').value);
n@1016 96 if (document.getElementById('projectReturn').value == "") {
n@1016 97 setup.setAttribute('projectReturn',"null");
n@1016 98 } else {
n@1016 99 setup.setAttribute('projectReturn',document.getElementById('projectReturn').value);
n@1016 100 }
n@1016 101 setup.setAttribute('randomiseOrder',document.getElementById('randomisePageOrder').checked);
n@1016 102 setup.setAttribute('collectMetrics',document.getElementById('collectMetrics').checked);
n@1016 103
n@1016 104 var globalPreTest = document.createElement('preTest');
n@1016 105 var options = document.getElementById('globalPreTest').getElementsByClassName('head');
n@1016 106 constructPrePost(globalPreTest, options);
n@1016 107
n@1016 108 var globalPostTest = document.createElement('postTest');
n@1016 109 options = document.getElementById('globalPostTest').getElementsByClassName('head');
n@1016 110 constructPrePost(globalPostTest, options);
n@1016 111
n@1016 112 var globalMetrics = document.createElement('metric');
n@1016 113 options = document.getElementById('globalMetric').getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1016 114 for (var i=0; i<options.length; i++) {
n@1016 115 if (options[i].checked) {
n@1016 116 var metric = document.createElement('metricEnable');
n@1016 117 metric.textContent = options[i].id;
n@1016 118 globalMetrics.appendChild(metric);
n@925 119 }
n@1016 120 }
n@1016 121 setup.appendChild(globalPreTest);
n@1016 122 setup.appendChild(globalPostTest);
n@1016 123 setup.appendChild(globalMetrics);
n@1016 124 xmlDoc.appendChild(setup);
n@1016 125
n@1016 126 var audioHolders = document.getElementsByName('audio-holder');
n@1016 127 for (var i=0; i<audioHolders.length; i++) {
n@1016 128 var audioHolder = document.createElement('audioHolder');
n@1016 129 var audioHolderDOM = audioHolders[i];
n@1016 130 var attribs = audioHolderDOM.getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1016 131 audioHolder.id = attribs[0].value;
n@1016 132 if (attribs[1].value != "") {audioHolder.setAttribute('sampleRate',attribs[1].value);}
n@1016 133 if (attribs[2].value != "") {audioHolder.setAttribute('hostURL',attribs[2].value);}
n@1016 134 audioHolder.setAttribute('randomiseOrder',attribs[3].checked);
n@1016 135 audioHolder.setAttribute('repeatCount',attribs[4].checked);
n@1016 136 audioHolder.setAttribute('loop',attribs[5].checked);
n@1016 137 audioHolder.setAttribute('elementComments',attribs[6].checked);
n@925 138
n@1016 139 // Audio-Holder PreTests
n@1016 140 var audioHolderPreTest = document.createElement('preTest');
n@1016 141 var audioHolderPostTest = document.createElement('postTest');
n@1016 142 options = audioHolderDOM.childNodes[2].getElementsByClassName('head');
n@1016 143 constructPrePost(audioHolderPreTest, options);
n@1016 144 options = audioHolderDOM.childNodes[3].getElementsByClassName('head');
n@1016 145 constructPrePost(audioHolderPostTest, options);
n@925 146
n@1016 147 audioHolder.appendChild(audioHolderPreTest);
n@1016 148 audioHolder.appendChild(audioHolderPostTest);
n@925 149
n@1016 150 // audio-Elements
n@1016 151 var audioElementsDOM = [];
n@1016 152 var commentQuestionDOM = [];
n@1016 153 for (var j=0; j<audioHolderDOM.childElementCount; j++) {
n@1016 154 var child = audioHolderDOM.childNodes[j];
n@1016 155 var name = child.getAttribute('name');
n@1016 156 if (name == 'audio-element') {audioElementsDOM.push(child);}
n@1016 157 else if (name == 'comment-question') {commentQuestionDOM.push(child);}
n@925 158 }
n@925 159
n@1016 160 for (var j=0; j<audioElementsDOM.length; j++) {
n@1016 161 var audioElement = document.createElement('audioElement');
n@1016 162 attribs = audioElementsDOM[j].getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1016 163 audioElement.id = attribs[0].value;
n@1016 164 audioElement.setAttribute('url',attribs[1].value);
n@1016 165 audioHolder.appendChild(audioElement);
n@1015 166 }
n@1016 167
n@1016 168 for (var j=0; j<commentQuestionDOM.length; j++) {
n@1016 169 var commentQuestion = document.createElement('commentQuestion');
n@1016 170 attribs = commentQuestionDOM[j].getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1016 171 commentQuestion.id = attribs[0].value;
n@1016 172 commentQuestion.textContent = attribs[1].value;
n@1016 173 audioHolder.appendChild(commentQuestion);
n@1016 174 }
n@1016 175 xmlDoc.appendChild(audioHolder);
n@925 176 }
n@1016 177 return xmlDoc;
n@925 178 }
n@925 179
n@925 180 function constructPrePost(parent, options) {
n@925 181 for (var i=0; i<options.length; i++) {
n@925 182 var elem = options[i];
n@925 183 var attributes = elem.getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@925 184 if (elem.getAttribute('name') == 'question-node') {
n@925 185 var node = document.createElement('question');
n@925 186 node.setAttribute('id',attributes[0].value);
n@925 187 node.textContent = attributes[1].value;
n@1018 188 node.setAttribute('mandatory',attributes[2].checked);
n@925 189 } else if (elem.getAttribute('name') == 'statement-node') {
n@1018 190 var node = document.createElement('statement');
n@925 191 node.textContent = attributes[0].value;
n@925 192 }
n@925 193 parent.appendChild(node);
n@925 194 }
n@925 195 }
n@925 196
n@924 197 function validate() {
n@924 198 var canExport = true;
n@924 199 // Checks if the XML can be created from the given entries
n@924 200 var inputs = document.getElementsByTagName('input');
n@924 201 for (var i=0; i<inputs.length; i++) {
n@924 202 if (inputs[i].type == 'text') {
n@924 203 if (inputs[i].value == "") {
n@924 204 var mandatory = inputs[i].getAttribute('mandatory');
n@924 205 if (mandatory == "true") {
n@924 206 errorInput(inputs[i]);
n@924 207 canExport = false;
n@924 208 } else {
n@924 209 warningInput(inputs[i]);
n@924 210 }
n@924 211 } else {
n@924 212 goodInput(inputs[i]);
n@924 213 }
n@924 214 }
n@924 215 }
n@925 216
n@925 217 var audioHolders = document.getElementsByName('audio-holder');
n@925 218 for (var i=0; i<audioHolders.length; i++) {
n@925 219 var divs = audioHolders[i].getElementsByClassName('head');
n@925 220 var IDs = [];
n@925 221 for (var j=0; j<divs.length; j++) {
n@925 222 if (divs[j].getAttribute('name') == 'audio-element') {
n@925 223 var obj = divs[j].getElementsByClassName('attrib')[0].children[1];
n@925 224 var aeID = obj.value;
n@925 225 if (aeID != "") {
n@925 226 var unique = true;
n@925 227 for (var k=0; k<IDs.length; k++) {
n@925 228 if (aeID == IDs[k]) {
n@925 229 unique = false;
n@925 230 break;
n@925 231 }
n@925 232 }
n@925 233 if (unique == true) {
n@925 234 IDs.push(aeID);
n@925 235 } else {
n@925 236 errorInput(obj);
n@925 237 canExport = false;
n@925 238 }
n@925 239 }
n@925 240 }
n@925 241 }
n@925 242 }
n@924 243 return canExport;
n@924 244 };
n@924 245
n@924 246 function errorInput(node) {
n@924 247 node.style.backgroundColor = "#FF0000";
n@924 248 }
n@924 249
n@924 250 function warningInput(node) {
n@924 251 node.style.backgroundColor = "#FFFF00";
n@924 252 }
n@924 253
n@924 254 function goodInput(node) {
n@924 255 node.style.backgroundColor = "#FFFFFF";
n@924 256 }
n@924 257
n@921 258 function questionNode() {
n@921 259 var node = document.createElement("div");
n@921 260 node.setAttribute('class','head');
n@921 261 node.setAttribute('name','question-node');
n@921 262 var nodeTitle = document.createElement("span");
n@921 263 nodeTitle.textContent = "Question";
n@921 264 var attributes = document.createElement("div");
n@921 265 attributes.setAttribute('class','attrib');
n@924 266 var id = attributePair("ID:","text", true);
n@924 267 var question = attributePair("Question:","text", false);
n@1018 268 question[1].style.width = "500px";
n@1018 269 var mandatory = attributePair("Mandatory:","checkbox", false);
n@921 270 node.appendChild(nodeTitle);
n@921 271 id.forEach(function(item){attributes.appendChild(item);},false);
n@921 272 question.forEach(function(item){attributes.appendChild(item);},false);
n@1018 273 mandatory.forEach(function(item){attributes.appendChild(item);},false);
n@921 274 node.appendChild(attributes);
n@922 275
n@922 276 var removeButton = document.createElement("button");
n@922 277 removeButton.textContent = "Remove";
n@922 278 removeButton.onclick = removeNode;
n@922 279 node.appendChild(removeButton);
n@921 280 return node;
n@921 281 }
n@921 282
n@921 283 function statementNode() {
n@921 284 var node = document.createElement("div");
n@921 285 node.setAttribute('class','head');
n@924 286 node.setAttribute('name','statement-node');
n@921 287 var nodeTitle = document.createElement("span");
n@921 288 nodeTitle.textContent = "Statement";
n@921 289 var attributes = document.createElement("div");
n@921 290 attributes.setAttribute('class','attrib');
n@924 291 var statement = attributePair("Statement:","text",false);
n@1018 292 statement[1].style.width = "500px";
n@921 293 node.appendChild(nodeTitle);
n@921 294 statement.forEach(function(item){attributes.appendChild(item);},false);
n@921 295 node.appendChild(attributes);
n@922 296
n@922 297 var removeButton = document.createElement("button");
n@922 298 removeButton.textContent = "Remove";
n@922 299 removeButton.onclick = removeNode;
n@922 300 node.appendChild(removeButton);
n@921 301 return node;
n@921 302 }
n@921 303
n@921 304 function audioHolderNode() {
n@921 305 var audioHolderCounts = document.getElementsByName("audio-holder").length;
n@921 306 var node = document.createElement("div");
n@921 307 node.setAttribute("class","head");
n@921 308 node.setAttribute("name","audio-holder");
n@922 309 node.setAttribute("id","audio-holder-"+audioHolderCounts);
n@921 310 var nodeTitle = document.createElement("span");
n@922 311 nodeTitle.textContent = "Audio Holder "+(audioHolderCounts+1);
n@921 312
n@921 313 var attributes = document.createElement("div");
n@921 314 attributes.setAttribute('class','attrib');
n@924 315 var id = attributePair("ID:","text",true);
n@922 316 id[1].value=audioHolderCounts;
n@924 317 var hostURL = attributePair("Host URL:", "text",false);
n@924 318 var sampleRate = attributePair("Sample Rate:","text",false);
n@922 319 var randomiseOrder = attributePair("Randomise Element Order:","checkbox");
n@922 320 var repeatCount = attributePair("Repeat Page Count:","number");
n@922 321 repeatCount[1].value = 0;
n@922 322 var loop = attributePair("Loop Element Playback","checkbox");
n@922 323 var elementComments = attributePair("Enable Comment Boxes","checkbox");
n@922 324 id.forEach(function(item){attributes.appendChild(item);},false);
n@922 325 hostURL.forEach(function(item){attributes.appendChild(item);},false);
n@922 326 sampleRate.forEach(function(item){attributes.appendChild(item);},false);
n@922 327 hostURL.forEach(function(item){attributes.appendChild(item);},false);
n@922 328 randomiseOrder.forEach(function(item){attributes.appendChild(item);},false);
n@922 329 repeatCount.forEach(function(item){attributes.appendChild(item);},false);
n@922 330 loop.forEach(function(item){attributes.appendChild(item);},false);
n@922 331 elementComments.forEach(function(item){attributes.appendChild(item);},false);
n@922 332
n@922 333 node.appendChild(nodeTitle);
n@922 334 node.appendChild(attributes);
n@922 335
n@922 336 var pretest = document.createElement("div");
n@922 337 pretest.setAttribute('class','head');
n@922 338 pretest.setAttribute('name','pre-test');
n@922 339 var pretestTitle = document.createElement("h4");
n@922 340 pretestTitle.textContent = "Pre Test";
n@922 341 var buttonAddQ = document.createElement("button");
n@922 342 buttonAddQ.textContent = "Add Pre Test Question";
n@922 343 buttonAddQ.onclick = function(){event.srcElement.parentElement.appendChild(questionNode());};
n@922 344 var buttonAddS = document.createElement("button");
n@922 345 buttonAddS.textContent = "Add Pre Test Statement";
n@922 346 buttonAddS.onclick = function(){event.srcElement.parentElement.appendChild(statementNode());};
n@922 347 pretest.appendChild(pretestTitle);
n@922 348 pretest.appendChild(buttonAddQ);
n@922 349 pretest.appendChild(buttonAddS);
n@922 350
n@922 351 var posttest = document.createElement("div");
n@922 352 posttest.setAttribute('class','head');
n@922 353 posttest.setAttribute('name','post-test');
n@922 354 var posttestTitle = document.createElement("h4");
n@922 355 posttestTitle.textContent = "Post Test";
n@922 356 var buttonAddQ = document.createElement("button");
n@922 357 buttonAddQ.textContent = "Add Post Test Question";
n@922 358 buttonAddQ.onclick = function(){event.srcElement.parentElement.appendChild(questionNode());};
n@922 359 var buttonAddS = document.createElement("button");
n@922 360 buttonAddS.textContent = "Add Post Test Statement";
n@922 361 buttonAddS.onclick = function(){event.srcElement.parentElement.appendChild(statementNode());};
n@922 362 posttest.appendChild(posttestTitle);
n@922 363 posttest.appendChild(buttonAddQ);
n@922 364 posttest.appendChild(buttonAddS);
n@922 365
n@922 366 node.appendChild(pretest);
n@922 367 node.appendChild(posttest);
n@922 368
n@922 369 var newAudioElementButton = document.createElement("button");
n@922 370 newAudioElementButton.textContent = "Add audio element";
n@922 371 newAudioElementButton.onclick = function(){
n@922 372 event.srcElement.parentElement.appendChild(audioElementNode());
n@922 373 };
n@922 374 node.appendChild(newAudioElementButton);
n@922 375
n@922 376 var newCommentButton = document.createElement("button");
n@922 377 newCommentButton.textContent = "Add Comment Box";
n@922 378 newCommentButton.onclick = function() {
n@922 379 event.srcElement.parentElement.appendChild(commentBox());
n@922 380 };
n@922 381 node.appendChild(newCommentButton);
n@922 382
n@922 383 var removeButton = document.createElement("button");
n@922 384 removeButton.textContent = "Remove Audio Holder";
n@922 385 removeButton.onclick = removeNode;
n@922 386 node.appendChild(removeButton);
n@922 387 return node;
n@922 388 }
n@922 389
n@922 390 function audioElementNode() {
n@922 391 var node = document.createElement('div');
n@922 392 node.setAttribute('class','head');
n@922 393 node.setAttribute('name','audio-element');
n@922 394 var nodeTitle = document.createElement('span');
n@1018 395 nodeTitle.textContent = 'Audio Element';
n@922 396
n@922 397 var attributes = document.createElement("div");
n@922 398 attributes.setAttribute('class','attrib');
n@924 399 var id = attributePair("ID:","text",true);
n@924 400 var url = attributePair("URL:","text",true);
n@922 401 id.forEach(function(item){attributes.appendChild(item);},false);
n@922 402 url.forEach(function(item){attributes.appendChild(item);},false);
n@922 403
n@922 404 node.appendChild(nodeTitle);
n@922 405 node.appendChild(attributes);
n@922 406
n@922 407 var removeButton = document.createElement("button");
n@922 408 removeButton.textContent = "Remove Audio Element";
n@922 409 removeButton.onclick = removeNode;
n@922 410 node.appendChild(removeButton);
n@922 411 return node;
n@922 412 }
n@922 413
n@922 414 function commentBox() {
n@922 415 var node = document.createElement('div');
n@922 416 node.setAttribute('class','head');
n@922 417 node.setAttribute('name','comment-question');
n@922 418 var nodeTitle = document.createElement('h4');
n@922 419 nodeTitle.textContent = "Comment Box";
n@922 420
n@922 421 var attributes = document.createElement('div');
n@922 422 attributes.setAttribute('class','attrib');
n@924 423 var id = attributePair("ID:",'text',true);
n@924 424 var question = attributePair("Question:",'text',true);
n@1018 425 question[1].style.width = "500px";
n@922 426 id.forEach(function(item){attributes.appendChild(item);},false);
n@922 427 question.forEach(function(item){attributes.appendChild(item);},false);
n@922 428
n@922 429 var removeButton = document.createElement("button");
n@922 430 removeButton.textContent = "Remove Comment Box";
n@922 431 removeButton.onclick = removeNode;
n@922 432
n@922 433 node.appendChild(nodeTitle);
n@922 434 node.appendChild(attributes);
n@922 435 node.appendChild(removeButton);
n@922 436 return node;
n@921 437 }
n@1017 438
n@1017 439
n@1017 440 function handleDragOver(e) {
n@1017 441 e.stopPropagation();
n@1017 442 e.preventDefault();
n@1017 443 }
n@1017 444 function handleDragEnter(e) {
n@1017 445 e.stopPropagation();
n@1017 446 e.preventDefault();
n@1017 447 this.style.backgroundColor = '#AAFFAA';
n@1017 448 }
n@1017 449 function handleDragLeave(e) {
n@1017 450 e.stopPropagation();
n@1017 451 e.preventDefault();
n@1017 452 this.style.backgroundColor = "#FFFFFF";
n@1017 453 }
n@1017 454 function handleDrop(e) {
n@1017 455 e.stopPropagation();
n@1017 456 e.preventDefault();
n@1017 457
n@1017 458 var file = e.dataTransfer.files[0];
n@1017 459
n@1017 460 // Uses HTML5 FileAPI - https://w3c.github.io/FileAPI/#filereader-interface
n@1017 461 var reader = new FileReader();
n@1018 462 reader.onload = function() {
n@1018 463 var parse = new DOMParser();
n@1018 464 var xml = parse.parseFromString(reader.result,'text/xml');
n@1018 465 importXML(xml);
n@1018 466 };
n@1017 467 reader.readAsText(file);
n@1018 468
n@1017 469 }
n@1018 470 var g_XML;
n@1017 471
n@1017 472 function importXML(xml) {
n@1018 473 g_XML = xml;
n@1018 474
n@1018 475 var root = xml.getElementsByTagName('BrowserEvalProjectDocument')[0];
n@1018 476 var setup = xml.getElementsByTagName('setup')[0];
n@1018 477 document.getElementById('interface').value = setup.getAttribute('interface');
n@1018 478 document.getElementById('projectReturn').value = setup.getAttribute('projectReturn');
n@1018 479 document.getElementById('randomisePageOrder').checked = setup.getAttribute('randomiseOrder');
n@1018 480 document.getElementById('collectMetrics').checked = setup.getAttribute('collectMetrics');
n@1018 481
n@1018 482 var globalPreTest = setup.getElementsByTagName('PreTest')[0];
n@1018 483 var globalPostTest = setup.getElementsByTagName('PostTest')[0];
n@1018 484 for (var i=0; i<globalPreTest.childElementCount; i++) {
n@1018 485 var child = globalPreTest.children[i];
n@1018 486 var node;
n@1018 487 if (child.nodeName == "question") {
n@1018 488 node = questionNode();
n@1018 489 var attribs = node.getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1018 490 attribs[0].value = child.id;
n@1018 491 attribs[1].value = child.textContent;
n@1018 492 attribs[2].checked = child.getAttribute('mandatory');
n@1018 493 } else if (child.nodeName == "statement") {
n@1018 494 node = statementNode();
n@1018 495 var attribs = node.getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1018 496 attribs[0].value = child.textContent;
n@1018 497 }
n@1018 498 document.getElementById('globalPreTest').appendChild(node);
n@1018 499 }
n@1018 500
n@1018 501 for (var i=0; i<globalPostTest.childElementCount; i++) {
n@1018 502 var child = globalPostTest.children[i];
n@1018 503 var node;
n@1018 504 if (child.nodeName == "question") {
n@1018 505 node = questionNode();
n@1018 506 var attribs = node.getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1018 507 attribs[0].value = child.id;
n@1018 508 attribs[1].value = child.textContent;
n@1018 509 attribs[2].checked = child.getAttribute('mandatory');
n@1018 510 } else if (child.nodeName == "statement") {
n@1018 511 node = statementNode();
n@1018 512 var attribs = node.getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1018 513 attribs[0].value = child.textContent;
n@1018 514 }
n@1018 515 document.getElementById('globalPostTest').appendChild(node);
n@1018 516 }
n@1018 517
n@1019 518 // Metric Enable Flags
n@1019 519 var mEnable = setup.getElementsByTagName('Metric')[0].getElementsByTagName('metricEnable');
n@1019 520 for (var i=0; i<mEnable.length; i++) {
n@1019 521 var node = mEnable[i];
n@1019 522 var enabled = node.textContent;
n@1019 523 document.getElementById(enabled).checked = true;
n@1019 524 }
n@1019 525
n@1018 526 var audioHolders = root.getElementsByTagName('audioHolder');
n@1018 527 for (var i=0; i<audioHolders.length; i++) {
n@1018 528 var audioHolderDOM = audioHolderNode();
n@1018 529 var attribs = audioHolderDOM.getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1018 530 attribs[0].value = audioHolders[i].id;
n@1018 531 attribs[1].value = audioHolders[i].getAttribute('sampleRate');
n@1018 532 attribs[2].value = audioHolders[i].getAttribute('hostURL');
n@1018 533 attribs[3].checked = audioHolders[i].getAttribute('randomiseOrder');
n@1018 534 attribs[4].value = audioHolders[i].getAttribute('repeatCount');
n@1018 535 attribs[5].checked = audioHolders[i].getAttribute('loop');
n@1018 536 attribs[6].checked = audioHolders[i].getAttribute('elementComments');
n@1018 537
n@1018 538 var PreTest = audioHolders[i].getElementsByTagName('PreTest');
n@1018 539 var PostTest = audioHolders[i].getElementsByTagName('PostTest');
n@1018 540 if (PreTest.length != 0) {
n@1018 541 PreTest = PreTest[0];
n@1018 542 for (var j=0; j<PreTest.childElementCount; j++) {
n@1018 543 var child = PreTest.children[j];
n@1018 544 var node;
n@1018 545 if (child.nodeName == "question") {
n@1018 546 node = questionNode();
n@1018 547 var attribs = node.getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1018 548 attribs[0].value = child.id;
n@1018 549 attribs[1].value = child.textContent;
n@1018 550 attribs[2].checked = child.getAttribute('mandatory');
n@1018 551 } else if (child.nodeName == "statement") {
n@1018 552 node = statementNode();
n@1018 553 var attribs = node.getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1018 554 attribs[0].value = child.textContent;
n@1018 555 }
n@1018 556 audioHolderDOM.children[2].appendChild(node);
n@1018 557 }
n@1018 558 }
n@1018 559 if (PostTest.length != 0) {
n@1018 560 PostTest = PostTest[0];
n@1018 561 for (var j=0; j<PostTest.childElementCount; j++) {
n@1018 562 var child = PostTest.children[j];
n@1018 563 var node;
n@1018 564 if (child.nodeName == "question") {
n@1018 565 node = questionNode();
n@1018 566 var attribs = node.getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1018 567 attribs[0].value = child.id;
n@1018 568 attribs[1].value = child.textContent;
n@1018 569 attribs[2].checked = child.getAttribute('mandatory');
n@1018 570 } else if (child.nodeName == "statement") {
n@1018 571 node = statementNode();
n@1018 572 var attribs = node.getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1018 573 attribs[0].value = child.textContent;
n@1018 574 }
n@1018 575 audioHolderDOM.children[3].appendChild(node);
n@1018 576 }
n@1018 577 }
n@1018 578
n@1018 579 // Process audio-element
n@1018 580 var audioElements = audioHolders[i].getElementsByTagName('audioElements');
n@1018 581 for (var j=0; j<audioElements.length; j++) {
n@1018 582 var node = audioElementNode();
n@1018 583 var child = audioElements[j];
n@1018 584 var attribs = node.getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1018 585 attribs[0].value = child.id;
n@1018 586 attribs[1].value = child.getAttribute('url');
n@1018 587 audioHolderDOM.appendChild(node);
n@1018 588 }
n@1018 589
n@1018 590 // Process comment-question
n@1018 591 var commentQuestion = audioHolders[0].getElementsByTagName('CommentQuestion');
n@1018 592 for (var j=0; j<commentQuestion.length; j++) {
n@1018 593 var node = commentBox();
n@1018 594 var child = commentQuestion[j];
n@1018 595 var attribs = node.getElementsByClassName('attrib')[0].getElementsByTagName('input');
n@1018 596 attribs[0].value = child.id;
n@1018 597 attribs[1].value = child.textContent;
n@1018 598 audioHolderDOM.appendChild(node);
n@1018 599 }
n@1018 600
n@1018 601 document.getElementById('setup').appendChild(audioHolderDOM);
n@1018 602 }
n@1017 603 }
n@921 604 </script>
n@921 605 <style>
n@921 606 div {
n@921 607 padding: 2px;
n@921 608 margin-top: 2px;
n@921 609 margin-bottom: 2px;
n@921 610 }
n@921 611 div.head{
n@921 612 margin-left: 10px;
n@921 613 border: black;
n@921 614 border-width: 2px;
n@921 615 border-style: solid;
n@921 616 }
n@921 617 div.attrib{
n@921 618 margin-left:25px;
n@921 619 border: black;
n@921 620 border-width: 2px;
n@921 621 border-style: dashed;
n@921 622 margin-bottom: 10px;
n@921 623 }
n@1017 624 div#dragFile{
n@1017 625 height:100px;
n@1017 626 border-width: 2px;
n@1017 627 border-style: dashed;
n@1017 628 margin-bottom: 10px;
n@1017 629 }
n@921 630 </style>
n@921 631
n@1010 632 </head>
n@1010 633
n@1010 634 <body>
n@921 635 <h1>Create Test Setup XML</h1>
n@1017 636 <div id="dragFile">
n@1017 637 <span>Drag and Drop an XML specification file here to auto-load.</span>
n@1017 638 </div>
n@924 639 <button id="validateXML" onclick="buttonClickedValidate();">Validate</button>
n@1016 640 <button id="createXML" onclick="buttonClickedSubmit();" disabled>Submit</button>
n@924 641 <span id="errorMessage" visibility="hidden"></span>
n@921 642 <div id="topLevelBody" align="left">
n@1010 643 <!-- Interface goes here -->
n@921 644 <div name='test-setup'>
n@921 645 <div id="setup" class="head">
n@921 646 <h2>Setup Tag</h2>
n@921 647 <div id="setup-attribs" class="attrib">
n@921 648 <span>Interface</span>
n@921 649 <select id="interface">
n@921 650 <option value='APE'>APE</option>
n@921 651 </select>
n@921 652 <span>Project Return</span>
n@924 653 <input type="text" id="projectReturn" mandatory="false">
n@921 654 <span>Randomise Test Page Order</span>
n@921 655 <input id="randomisePageOrder" type="checkbox" value="false">
n@921 656 <span>Collect Session Metrics</span>
n@921 657 <input id="collectMetrics" type="checkbox">
n@921 658 </div>
n@921 659 <div id="globalPreTest" class="head">
n@921 660 <h3>Pre Test</h3>
n@921 661 <button id="addPreTestQ" onclick="event.srcElement.parentElement.appendChild(questionNode());">Add Pre Test Question</button>
n@921 662 <button id="addPreTestS" onclick="event.srcElement.parentElement.appendChild(statementNode());">Add Pre Test Statement</button>
n@921 663 </div>
n@921 664 <div id="globalPostTest" class="head">
n@921 665 <h3>Post Test</h3>
n@921 666 <button id="addPreTestQ" onclick="event.srcElement.parentElement.appendChild(questionNode());">Add Post Test Question</button>
n@921 667 <button id="addPreTestS" onclick="event.srcElement.parentElement.appendChild(statementNode());">Add Post Test Statement</button>
n@921 668 </div>
n@921 669 <div id="globalMetric" class="head">
n@921 670 <h3>Global Metrics</h3>
n@921 671 <div id="globalMetric-attrib" class="attrib">
n@921 672 <span>Test Timer</span>
n@921 673 <input type="checkbox" id="testTimer" />
n@921 674 <span>Element Playback Timer</span>
n@921 675 <input type="checkbox" id="elementTimer" />
n@921 676 <span>Element Initial Position</span>
n@921 677 <input type="checkbox" id="elementInitialPosition" />
n@921 678 <span>Element Tracker</span>
n@921 679 <input type="checkbox" id="elementTracker" />
n@1019 680 <span>Element Listen Tracker</span>
n@1019 681 <input type="checkbox" id="elementListenTracker" />
n@921 682 <span>Element Flag Listened To</span>
n@925 683 <input type="checkbox" id="elementFlagListenedTo" />
n@921 684 <span>Element Flag Moved</span>
n@921 685 <input type="checkbox" id="elementFlagMoved" />
n@921 686 </div>
n@921 687 </div>
n@922 688 <button id="addAudioHolder" onclick="event.srcElement.parentElement.appendChild(audioHolderNode());">Add AudioHolder / Test Page</button>
n@921 689 </div>
n@921 690 </div>
n@1010 691 </div>
n@1010 692 </body>
n@1010 693 </html>