Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 920:d897f129ad4e

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