Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create.html @ 170:3ee7219b1700 Dev_main

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