Mercurial > hg > webaudioevaluationtool

annotate test_create/test_create_2.html @ 1316:279930a008ca

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
All interfaces support comment boxes. Comment box identification matches presented tag (for instance, AB will be Comment on fragment A, rather than 1). Tighter buffer loading protocol, audioObjects register with the buffer rather than checking for buffer existence (which can be buggy depending on the buffer state). Buffers now have a state to ensure exact location in loading chain (downloading, decoding, LUFS, ready).
author Nicholas Jillings <nickjillings@users.noreply.github.com>
date Fri, 29 Jan 2016 11:11:57 +0000
parents
children
rev   line source
nickjillings@1316 1 <!DOCTYPE html>
nickjillings@1316 2 <html lang="en">
nickjillings@1316 3 <head>
nickjillings@1316 4 <meta charset="utf-8">
nickjillings@1316 5
nickjillings@1316 6 <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
nickjillings@1316 7 Remove this if you use the .htaccess -->
nickjillings@1316 8 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
nickjillings@1316 9
nickjillings@1316 10 <title>test_create_2</title>
nickjillings@1316 11 <meta name="description" content="">
nickjillings@1316 12 <meta name="author" content="Nicholas">
nickjillings@1316 13
nickjillings@1316 14 <meta name="viewport" content="width=device-width; initial-scale=1.0">
nickjillings@1316 15
nickjillings@1316 16 <script type="text/javascript">
nickjillings@1316 17 window.onload = function() {
nickjillings@1316 18 var dropBody = document.getElementById('dragFile');
nickjillings@1316 19 dropBody.addEventListener('dragover', handleDragOver, false);
nickjillings@1316 20 dropBody.addEventListener('dragenter',handleDragEnter,false);
nickjillings@1316 21 dropBody.addEventListener('dragleave',handleDragLeave,false);
nickjillings@1316 22 dropBody.addEventListener('drop', handleDrop,false);
nickjillings@1316 23 };
nickjillings@1316 24
nickjillings@1316 25 function handleDragOver(e) {
nickjillings@1316 26 e.stopPropagation();
nickjillings@1316 27 e.preventDefault();
nickjillings@1316 28 }
nickjillings@1316 29 function handleDragEnter(e) {
nickjillings@1316 30 e.stopPropagation();
nickjillings@1316 31 e.preventDefault();
nickjillings@1316 32 this.style.backgroundColor = '#AAFFAA';
nickjillings@1316 33 }
nickjillings@1316 34 function handleDragLeave(e) {
nickjillings@1316 35 e.stopPropagation();
nickjillings@1316 36 e.preventDefault();
nickjillings@1316 37 this.style.backgroundColor = "#FFFFFF";
nickjillings@1316 38 }
nickjillings@1316 39 function handleDrop(e) {
nickjillings@1316 40 e.stopPropagation();
nickjillings@1316 41 e.preventDefault();
nickjillings@1316 42
nickjillings@1316 43 var file = e.dataTransfer.files[0];
nickjillings@1316 44
nickjillings@1316 45 // Uses HTML5 FileAPI - https://w3c.github.io/FileAPI/#filereader-interface
nickjillings@1316 46 var reader = new FileReader();
nickjillings@1316 47 reader.onload = function() {
nickjillings@1316 48 var parse = new DOMParser();
nickjillings@1316 49 var xml = parse.parseFromString(reader.result,'text/xml');
nickjillings@1316 50 importXML(xml);
nickjillings@1316 51 };
nickjillings@1316 52 reader.readAsText(file);
nickjillings@1316 53
nickjillings@1316 54 }
nickjillings@1316 55
nickjillings@1316 56 function removeNode(event) {
nickjillings@1316 57 event.srcElement.parentElement.parentElement.removeChild(event.srcElement.parentElement);
nickjillings@1316 58 }
nickjillings@1316 59
nickjillings@1316 60 function removeNodeButton()
nickjillings@1316 61 {
nickjillings@1316 62 var button = document.createElement('button');
nickjillings@1316 63 button.textContent = 'Remove';
nickjillings@1316 64 button.onclick = function(event){removeNode(event);};
nickjillings@1316 65 return button;
nickjillings@1316 66 }
nickjillings@1316 67
nickjillings@1316 68 function attributePair(type,text,name,mandatory)
nickjillings@1316 69 {
nickjillings@1316 70 var node = document.createElement('div');
nickjillings@1316 71 node.setAttribute('name','attribute');
nickjillings@1316 72 var span = document.createElement('span');
nickjillings@1316 73 span.textContent = text;
nickjillings@1316 74 var input = document.createElement('input');
nickjillings@1316 75 input.type = type;
nickjillings@1316 76 input.setAttribute('attrib-name',name);
nickjillings@1316 77 input.setAttribute('mandatory',mandatory);
nickjillings@1316 78 node.appendChild(span);
nickjillings@1316 79 node.appendChild(input);
nickjillings@1316 80 return node;
nickjillings@1316 81 }
nickjillings@1316 82
nickjillings@1316 83 function buttonClickedValidate()
nickjillings@1316 84 {
nickjillings@1316 85 var allInputs = document.getElementsByTagName('input');
nickjillings@1316 86 for (var i=0; i<allInputs.length; i++)
nickjillings@1316 87 {goodNode(allInputs[i]);}
nickjillings@1316 88 var errList = document.getElementById('errorMessage');
nickjillings@1316 89 errList.innerHTML = "";
nickjillings@1316 90 validate(document.getElementById('topLevelBody'));
nickjillings@1316 91 var submit = document.getElementById('createXML');
nickjillings@1316 92 if (errList.innerHTML == "")
nickjillings@1316 93 {submit.disabled = false;}
nickjillings@1316 94 else {submit.disabled = true;}
nickjillings@1316 95 }
nickjillings@1316 96
nickjillings@1316 97 function validate(node)
nickjillings@1316 98 {
nickjillings@1316 99 var name = node.getAttribute('name');
nickjillings@1316 100 if (name != 'attribute' && name != 'element') {
nickjillings@1316 101 var child = node.children;
nickjillings@1316 102 for (var i=0; i<node.childElementCount; i++)
nickjillings@1316 103 {
nickjillings@1316 104 if (child[i].nodeName == "DIV")
nickjillings@1316 105 {
nickjillings@1316 106 validate(child[i]);
nickjillings@1316 107 }
nickjillings@1316 108 }
nickjillings@1316 109 } else if (name == 'attribute')
nickjillings@1316 110 {
nickjillings@1316 111 var child = node.children;
nickjillings@1316 112 for (var i=0; i<node.childElementCount; i++)
nickjillings@1316 113 {
nickjillings@1316 114 if (child[i].nodeName == "INPUT")
nickjillings@1316 115 {
nickjillings@1316 116 var mandatory = child[i].getAttribute('mandatory');
nickjillings@1316 117 if (mandatory == 'true') {mandatory = true;}
nickjillings@1316 118 else {mandatory = false;}
nickjillings@1316 119 if (child[i].type =='text' || child[i].type =='number')
nickjillings@1316 120 {
nickjillings@1316 121 if (child[i].value.length == 0)
nickjillings@1316 122 {
nickjillings@1316 123 if (mandatory == true) {errorNode(child[i]);}
nickjillings@1316 124 else {warningNode(child[i]);}
nickjillings@1316 125 } else {goodNode(child[i]);}
nickjillings@1316 126 }
nickjillings@1316 127 }
nickjillings@1316 128 }
nickjillings@1316 129 } else if (name == 'element')
nickjillings@1316 130 {
nickjillings@1316 131 var child = node.children;
nickjillings@1316 132 for (var i=0; i<node.childElementCount; i++)
nickjillings@1316 133 {
nickjillings@1316 134 if (child[i].nodeName == "INPUT")
nickjillings@1316 135 {
nickjillings@1316 136 if (child[i].value.length == 0){warningNode(child[i]);}
nickjillings@1316 137 else {goodNode(child[i]);}
nickjillings@1316 138 }
nickjillings@1316 139 }
nickjillings@1316 140 }
nickjillings@1316 141 }
nickjillings@1316 142
nickjillings@1316 143 function buttonClickedSubmit()
nickjillings@1316 144 {
nickjillings@1316 145 var xml = document.createElement('BrowserEvalProjectDocument');
nickjillings@1316 146 var dom = document.getElementById('topLevelBody');
nickjillings@1316 147 xml = extractXML(xml,dom);
nickjillings@1316 148 var drop = document.getElementById('errorMessage');
nickjillings@1316 149 createProjectSave(xml,drop);
nickjillings@1316 150 }
nickjillings@1316 151
nickjillings@1316 152 function createProjectSave(xmlDoc, injectPoint) {
nickjillings@1316 153 var parent = document.createElement("div");
nickjillings@1316 154 parent.appendChild(xmlDoc);
nickjillings@1316 155 var file = [parent.innerHTML];
nickjillings@1316 156 var bb = new Blob(file,{type : 'application/xml'});
nickjillings@1316 157 var dnlk = window.URL.createObjectURL(bb);
nickjillings@1316 158 var a = document.createElement("a");
nickjillings@1316 159 a.hidden = '';
nickjillings@1316 160 a.href = dnlk;
nickjillings@1316 161 a.download = "save.xml";
nickjillings@1316 162 a.textContent = "Save File";
nickjillings@1316 163 injectPoint.appendChild(a);
nickjillings@1316 164 }
nickjillings@1316 165
nickjillings@1316 166 function extractXML(xml,node)
nickjillings@1316 167 {
nickjillings@1316 168 if(node.getAttribute('class')=='attrib')
nickjillings@1316 169 {
nickjillings@1316 170 var children = node.children;
nickjillings@1316 171 for (var i=0; i<children.length; i++)
nickjillings@1316 172 {
nickjillings@1316 173 if (children[i].getAttribute('name')=='attribute')
nickjillings@1316 174 {
nickjillings@1316 175 var input = children[i].children[1];
nickjillings@1316 176 if (input.type == 'checkbox')
nickjillings@1316 177 {
nickjillings@1316 178 xml.setAttribute(input.getAttribute('attrib-name'),input.checked);
nickjillings@1316 179 } else {
nickjillings@1316 180 xml.setAttribute(input.getAttribute('attrib-name'),input.value);
nickjillings@1316 181 }
nickjillings@1316 182 } else if (children[i].getAttribute('name') == 'element')
nickjillings@1316 183 {
nickjillings@1316 184 var input = children[i].children[1];
nickjillings@1316 185 xml.textContent = input.value;
nickjillings@1316 186 }
nickjillings@1316 187 }
nickjillings@1316 188 return xml;
nickjillings@1316 189 } else if (node.getAttribute('node-name') != undefined)
nickjillings@1316 190 {
nickjillings@1316 191 var xmlDom = document.createElement(node.getAttribute('node-name'));
nickjillings@1316 192 xml.appendChild(xmlDom);
nickjillings@1316 193 var children = node.children;
nickjillings@1316 194 for (var i=0; i<children.length; i++)
nickjillings@1316 195 {
nickjillings@1316 196 if (children[i].nodeName == "DIV")
nickjillings@1316 197 {
nickjillings@1316 198 xmlDom = extractXML(xmlDom,children[i]);
nickjillings@1316 199 }
nickjillings@1316 200 }
nickjillings@1316 201 } else {
nickjillings@1316 202 var children = node.children;
nickjillings@1316 203 for (var i=0; i<children.length; i++)
nickjillings@1316 204 {
nickjillings@1316 205 if (children[i].nodeName == "DIV")
nickjillings@1316 206 {
nickjillings@1316 207 xml = extractXML(xml,children[i]);
nickjillings@1316 208 }
nickjillings@1316 209 }
nickjillings@1316 210 }
nickjillings@1316 211 return xml;
nickjillings@1316 212 }
nickjillings@1316 213
nickjillings@1316 214 function goodNode(node)
nickjillings@1316 215 {node.style.backgroundColor="#FFFFFF";}
nickjillings@1316 216
nickjillings@1316 217 function warningNode(node)
nickjillings@1316 218 {node.style.backgroundColor="#FFFF88";}
nickjillings@1316 219
nickjillings@1316 220 function errorNode(node)
nickjillings@1316 221 {
nickjillings@1316 222 var errLog = document.getElementById('errorMessage');
nickjillings@1316 223 var div = document.createElement('div');
nickjillings@1316 224 var span = document.createElement('span');
nickjillings@1316 225 span.textContent = 'Invalid Data: ';
nickjillings@1316 226 var list = [node.getAttribute('attrib-name')];
nickjillings@1316 227 var pNode = node;
nickjillings@1316 228 while (pNode.id != 'topLevelBody')
nickjillings@1316 229 {
nickjillings@1316 230 if (pNode.getAttribute('node-name') != undefined)
nickjillings@1316 231 {list.push(pNode.getAttribute('node-name'));}
nickjillings@1316 232 pNode = pNode.parentElement;
nickjillings@1316 233 }
nickjillings@1316 234 for (var i=list.length-1; i>=0; i--)
nickjillings@1316 235 {
nickjillings@1316 236 span.textContent = span.textContent +' ->'+ list[i];
nickjillings@1316 237 }
nickjillings@1316 238 div.appendChild(span);
nickjillings@1316 239 errLog.appendChild(div);
nickjillings@1316 240 errLog.style.visibility = 'visible';
nickjillings@1316 241 node.style.backgroundColor="#FF0000";
nickjillings@1316 242 }
nickjillings@1316 243
nickjillings@1316 244 function importXML(xml)
nickjillings@1316 245 {
nickjillings@1316 246 xml = xml.children[0];
nickjillings@1316 247 var setup = xml.getElementsByTagName('setup')[0];
nickjillings@1316 248 var DOM = document.getElementById('setup');
nickjillings@1316 249 // Insert any setup node attributes
nickjillings@1316 250 setAttributes(DOM,setup);
nickjillings@1316 251
nickjillings@1316 252 for (var i=0; i<setup.childElementCount; i++)
nickjillings@1316 253 {
nickjillings@1316 254 var node = DOM.getElementsByClassName(setup.children[i].nodeName);
nickjillings@1316 255 if (node.length != 0)
nickjillings@1316 256 {
nickjillings@1316 257 node = node[0];
nickjillings@1316 258 setAttributes(node,setup.children[i]);
nickjillings@1316 259 buildNode(node,setup.children[i]);
nickjillings@1316 260 }
nickjillings@1316 261 }
nickjillings@1316 262
nickjillings@1316 263 var holders = xml.getElementsByTagName('audioHolder');
nickjillings@1316 264 for (var i=0; i<holders.length; i++)
nickjillings@1316 265 {
nickjillings@1316 266 var node = addAudioHolder();
nickjillings@1316 267 document.getElementById('topLevelBody').appendChild(node);
nickjillings@1316 268 setAttributes(node,holders[i]);
nickjillings@1316 269 buildNode(node,holders[i]);
nickjillings@1316 270 }
nickjillings@1316 271 }
nickjillings@1316 272
nickjillings@1316 273 function setAttributes(node,xml)
nickjillings@1316 274 {
nickjillings@1316 275 var attribs = node.getElementsByClassName('attrib');
nickjillings@1316 276 if (attribs.length != 0){
nickjillings@1316 277 attribs = attribs[0];
nickjillings@1316 278 for (var i=0; i < attribs.children.length; i++)
nickjillings@1316 279 {
nickjillings@1316 280 if(attribs.children[i].getAttribute('name')=='attribute'){
nickjillings@1316 281 var input = attribs.children[i].children[1];
nickjillings@1316 282 var value = xml.attributes.getNamedItem(input.getAttribute('attrib-name'));
nickjillings@1316 283 if (value != undefined) {value = value.value;}
nickjillings@1316 284 if (input.type == 'checkbox')
nickjillings@1316 285 {input.checked = value;}
nickjillings@1316 286 else
nickjillings@1316 287 {input.value = value;}
nickjillings@1316 288 } else if(attribs.children[i].getAttribute('name')=='element'){
nickjillings@1316 289 var input = attribs.children[i].children[1];
nickjillings@1316 290 input.value = xml.textContent;
nickjillings@1316 291 }
nickjillings@1316 292 }
nickjillings@1316 293 }
nickjillings@1316 294 }
nickjillings@1316 295
nickjillings@1316 296 function buildNode(parent,xml)
nickjillings@1316 297 {
nickjillings@1316 298 for (var i=0; i<xml.childElementCount; i++)
nickjillings@1316 299 {
nickjillings@1316 300 var child = xml.children[i];
nickjillings@1316 301 var name = child.nodeName;
nickjillings@1316 302 var node = null;
nickjillings@1316 303 if (name == 'statement'){node = addPPStatement();}
nickjillings@1316 304 else if (name == 'question' || name == 'number'){node = addPPQuestion();}
nickjillings@1316 305 else if (name == 'checkbox'){node = addPPCheckbox();}
nickjillings@1316 306 else if (name == 'radio'){node = addPPRadio();}
nickjillings@1316 307 else if (name == 'metricEnable'){node = addMetricEnable();}
nickjillings@1316 308 else if (name == 'check'){node = addInterfaceCheck();}
nickjillings@1316 309 else if (name == 'option'){node = addInterfaceOption();}
nickjillings@1316 310 else if (name == 'scale'){node = addScaleMarker();}
nickjillings@1316 311 else if (name == 'audioHolder'){node = addAudioHolder();}
nickjillings@1316 312 else if (name == 'audioElements'){node = addAudioElement();}
nickjillings@1316 313 else if (name == 'commentQuestion'){node = addExtraComment();}
nickjillings@1316 314 else if (name == 'interface'){node = parent.getElementsByClassName('interface')[0];}
nickjillings@1316 315 else if (name == 'preTest' || name == 'PreTest')
nickjillings@1316 316 {
nickjillings@1316 317 node = parent.getElementsByClassName('preTest')[0];
nickjillings@1316 318 }
nickjillings@1316 319 else if (name == 'postTest' || name == 'PostTest')
nickjillings@1316 320 {
nickjillings@1316 321 node = parent.getElementsByClassName('postTest')[0];
nickjillings@1316 322 }
nickjillings@1316 323 else if (name == 'title' || name == 'commentBoxPrefix')
nickjillings@1316 324 {
nickjillings@1316 325 node = parent.getElementsByClassName(name)[0];
nickjillings@1316 326 }
nickjillings@1316 327 if (node != null) {
nickjillings@1316 328 if (name == 'radio' || name == 'checkbox')
nickjillings@1316 329 {
nickjillings@1316 330 buildRadio(node,xml.children[i]);
nickjillings@1316 331 parent.appendChild(node);
nickjillings@1316 332 } else
nickjillings@1316 333 {
nickjillings@1316 334 setAttributes(node,child);
nickjillings@1316 335 parent.appendChild(node);
nickjillings@1316 336 buildNode(node,child);
nickjillings@1316 337 }
nickjillings@1316 338 } else {
nickjillings@1316 339 var node = createHead(name,name,'h3');
nickjillings@1316 340
nickjillings@1316 341 var attrib = document.createElement('div');
nickjillings@1316 342 attrib.className = 'attrib';
nickjillings@1316 343 for (var j=0; j<child.attributes.length; j++)
nickjillings@1316 344 {
nickjillings@1316 345 attrib.appendChild(attributePair('text',child.attributes[j].name,child.attributes[j].name,false));
nickjillings@1316 346 }
nickjillings@1316 347
nickjillings@1316 348 node.appendChild(attrib);
nickjillings@1316 349 parent.appendChild(node);
nickjillings@1316 350 setAttributes(node,child);
nickjillings@1316 351 /*
nickjillings@1316 352 buildNode(node,child);
nickjillings@1316 353 */
nickjillings@1316 354 }
nickjillings@1316 355 }
nickjillings@1316 356 }
nickjillings@1316 357
nickjillings@1316 358 function buildRadio(node,xml)
nickjillings@1316 359 {
nickjillings@1316 360 setAttributes(node,xml);
nickjillings@1316 361 setAttributes(node.getElementsByClassName('statement')[0],xml.getElementsByTagName('statement')[0]);
nickjillings@1316 362 var options = xml.getElementsByTagName('option');
nickjillings@1316 363 var addOptionButton = node.getElementsByTagName('button')[2];
nickjillings@1316 364 for (var i=0; i<options.length; i++)
nickjillings@1316 365 {
nickjillings@1316 366 addOptionButton.click();
nickjillings@1316 367 setAttributes(node.getElementsByClassName('option')[i],options[i]);
nickjillings@1316 368 }
nickjillings@1316 369 }
nickjillings@1316 370
nickjillings@1316 371 function createHead(name,title,size)
nickjillings@1316 372 {
nickjillings@1316 373 var node = document.createElement('div');
nickjillings@1316 374 node.setAttribute('class','head '+name);
nickjillings@1316 375 node.setAttribute('node-name',name);
nickjillings@1316 376 if (size == undefined)
nickjillings@1316 377 {var node_T = document.createElement('h3');}
nickjillings@1316 378 else{var node_T = document.createElement(size);}
nickjillings@1316 379 node_T.textContent = title;
nickjillings@1316 380 node.appendChild(node_T);
nickjillings@1316 381 node.appendChild(removeNodeButton());
nickjillings@1316 382 return node;
nickjillings@1316 383 }
nickjillings@1316 384
nickjillings@1316 385 function addPretestNode()
nickjillings@1316 386 {
nickjillings@1316 387 var node = createHead('preTest', 'Pre Test','h3');
nickjillings@1316 388 var addStatement = document.createElement('button');
nickjillings@1316 389 addStatement.textContent = 'Add Statement';
nickjillings@1316 390 addStatement.onclick = function(){event.srcElement.parentElement.appendChild(addPPStatement());};
nickjillings@1316 391 node.appendChild(addStatement);
nickjillings@1316 392 var addQuestion = document.createElement('button');
nickjillings@1316 393 addQuestion.textContent = 'Add Question';
nickjillings@1316 394 addQuestion.onclick = function(){event.srcElement.parentElement.appendChild(addPPQuestion());};
nickjillings@1316 395 node.appendChild(addQuestion);
nickjillings@1316 396 var addCheckbox = document.createElement('button');
nickjillings@1316 397 addCheckbox.textContent = 'Add Checkbox';
nickjillings@1316 398 addCheckbox.onclick = function(){event.srcElement.parentElement.appendChild(addPPCheckbox());};
nickjillings@1316 399 node.appendChild(addCheckbox);
nickjillings@1316 400 var addRadio = document.createElement('button');
nickjillings@1316 401 addRadio.textContent = 'Add Checkbox';
nickjillings@1316 402 addRadio.onclick = function(){event.srcElement.parentElement.appendChild(addPPRadio());};
nickjillings@1316 403 node.appendChild(addRadio);
nickjillings@1316 404 return node;
nickjillings@1316 405 };
nickjillings@1316 406
nickjillings@1316 407 function addPosttestNode()
nickjillings@1316 408 {
nickjillings@1316 409 var node = createHead('postTest', 'Post Test','h3');
nickjillings@1316 410 var addStatement = document.createElement('button');
nickjillings@1316 411 addStatement.textContent = 'Add Statement';
nickjillings@1316 412 addStatement.onclick = function(){event.srcElement.parentElement.appendChild(addPPStatement());};
nickjillings@1316 413 node.appendChild(addStatement);
nickjillings@1316 414 var addQuestion = document.createElement('button');
nickjillings@1316 415 addQuestion.textContent = 'Add Question';
nickjillings@1316 416 addQuestion.onclick = function(){event.srcElement.parentElement.appendChild(addPPQuestion());};
nickjillings@1316 417 node.appendChild(addQuestion);
nickjillings@1316 418 var addCheckbox = document.createElement('button');
nickjillings@1316 419 addCheckbox.textContent = 'Add Checkbox';
nickjillings@1316 420 addCheckbox.onclick = function(){event.srcElement.parentElement.appendChild(addPPCheckbox());};
nickjillings@1316 421 node.appendChild(addCheckbox);
nickjillings@1316 422 var addRadio = document.createElement('button');
nickjillings@1316 423 addRadio.textContent = 'Add Checkbox';
nickjillings@1316 424 addRadio.onclick = function(){event.srcElement.parentElement.appendChild(addPPRadio());};
nickjillings@1316 425 node.appendChild(addRadio);
nickjillings@1316 426 return node;
nickjillings@1316 427 };
nickjillings@1316 428
nickjillings@1316 429 function addPPStatement()
nickjillings@1316 430 {
nickjillings@1316 431 var node = createHead('statement', 'Statement','h4');
nickjillings@1316 432 var attrib = document.createElement('div');
nickjillings@1316 433 attrib.className = "attrib";
nickjillings@1316 434 var element = document.createElement('div');
nickjillings@1316 435 element.setAttribute('name','element');
nickjillings@1316 436 var span = document.createElement('span');
nickjillings@1316 437 span.textContent = "Enter statement: ";
nickjillings@1316 438 element.appendChild(span);
nickjillings@1316 439 var input = document.createElement('input');
nickjillings@1316 440 input.type = "text";
nickjillings@1316 441 input.style.width = "500px";
nickjillings@1316 442 element.appendChild(input);
nickjillings@1316 443 attrib.appendChild(element);
nickjillings@1316 444 node.appendChild(attrib);
nickjillings@1316 445 return node;
nickjillings@1316 446 };
nickjillings@1316 447 function addPPQuestion()
nickjillings@1316 448 {
nickjillings@1316 449 var node = createHead('question', 'Question','h4');
nickjillings@1316 450 var attrib = document.createElement('div');
nickjillings@1316 451 attrib.className = "attrib";
nickjillings@1316 452 attrib.appendChild(attributePair('text','ID: ','id',true));
nickjillings@1316 453 attrib.appendChild(attributePair('checkbox','Mandatory: ','mandatory',false));
nickjillings@1316 454 attrib.appendChild(attributePair('text','Box size: ','boxsize',false));
nickjillings@1316 455 var element = document.createElement('div');
nickjillings@1316 456 element.setAttribute('name','element');
nickjillings@1316 457 var span = document.createElement('span');
nickjillings@1316 458 span.textContent = "Enter Question: ";
nickjillings@1316 459 element.appendChild(span);
nickjillings@1316 460 var input = document.createElement('input');
nickjillings@1316 461 input.type = "text";
nickjillings@1316 462 input.style.width = "500px";
nickjillings@1316 463 element.appendChild(input);
nickjillings@1316 464 attrib.appendChild(element);
nickjillings@1316 465 node.appendChild(attrib);
nickjillings@1316 466 return node;
nickjillings@1316 467 };
nickjillings@1316 468 function addPPCheckbox()
nickjillings@1316 469 {
nickjillings@1316 470 var node = createHead('checkbox', 'Checkbox','h4');
nickjillings@1316 471 var attrib = document.createElement('div');
nickjillings@1316 472 attrib.className = "attrib";
nickjillings@1316 473 attrib.appendChild(attributePair('text','ID: ','id',true));
nickjillings@1316 474 attrib.appendChild(attributePair('checkbox','Mandatory: ','mandatory',false));
nickjillings@1316 475 node.appendChild(attrib);
nickjillings@1316 476 node.appendChild(addPPStatement());
nickjillings@1316 477 var addOption = document.createElement('button');
nickjillings@1316 478 addOption.textContent = 'Add Checkbox';
nickjillings@1316 479 addOption.onclick = function() {
nickjillings@1316 480 var node = createHead('option', 'Option','h4');
nickjillings@1316 481 var attrib = document.createElement('div');
nickjillings@1316 482 attrib.className = "attrib";
nickjillings@1316 483 attrib.appendChild(attributePair('text','ID: ','id',true));
nickjillings@1316 484 var element = document.createElement('div');
nickjillings@1316 485 element.setAttribute('name','element');
nickjillings@1316 486 var span = document.createElement('span');
nickjillings@1316 487 span.textContent = "Enter Text: ";
nickjillings@1316 488 var input = document.createElement('input');
nickjillings@1316 489 input.type = 'text';
nickjillings@1316 490 element.appendChild(span);
nickjillings@1316 491 element.appendChild(input);
nickjillings@1316 492 attrib.appendChild(element);
nickjillings@1316 493 node.appendChild(attrib);
nickjillings@1316 494 event.srcElement.parentElement.appendChild(node);
nickjillings@1316 495 };
nickjillings@1316 496 node.appendChild(addOption);
nickjillings@1316 497 return node;
nickjillings@1316 498 };
nickjillings@1316 499
nickjillings@1316 500 function addPPRadio()
nickjillings@1316 501 {
nickjillings@1316 502 var node = createHead('radio', 'Radio','h4');
nickjillings@1316 503 var attrib = document.createElement('div');
nickjillings@1316 504 attrib.className = "attrib";
nickjillings@1316 505 attrib.appendChild(attributePair('text','ID: ','id',true));
nickjillings@1316 506 attrib.appendChild(attributePair('checkbox','Mandatory: ','mandatory',false));
nickjillings@1316 507 node.appendChild(attrib);
nickjillings@1316 508 node.appendChild(addPPStatement());
nickjillings@1316 509 var addOption = document.createElement('button');
nickjillings@1316 510 addOption.textContent = 'Add Radio';
nickjillings@1316 511 addOption.onclick = function() {
nickjillings@1316 512 var node = createHead('option', 'Option','h4');
nickjillings@1316 513 var attrib = document.createElement('div');
nickjillings@1316 514 attrib.className = "attrib";
nickjillings@1316 515 attrib.appendChild(attributePair('text','Name: ','name',true));
nickjillings@1316 516 var element = document.createElement('div');
nickjillings@1316 517 element.setAttribute('name','element');
nickjillings@1316 518 var span = document.createElement('span');
nickjillings@1316 519 span.textContent = "Enter Text: ";
nickjillings@1316 520 var input = document.createElement('input');
nickjillings@1316 521 input.type = 'text';
nickjillings@1316 522 element.appendChild(span);
nickjillings@1316 523 element.appendChild(input);
nickjillings@1316 524 attrib.appendChild(element);
nickjillings@1316 525 node.appendChild(attrib);
nickjillings@1316 526 event.srcElement.parentElement.appendChild(node);
nickjillings@1316 527 };
nickjillings@1316 528 node.appendChild(addOption);
nickjillings@1316 529 return node;
nickjillings@1316 530 };
nickjillings@1316 531
nickjillings@1316 532 function addMetricEnable()
nickjillings@1316 533 {
nickjillings@1316 534 var node = createHead('metricEnable', '','h4');
nickjillings@1316 535 var attrib = document.createElement('div');
nickjillings@1316 536 attrib.className = "attrib";
nickjillings@1316 537 var element = document.createElement('div');
nickjillings@1316 538 element.setAttribute('name','element');
nickjillings@1316 539 var span = document.createElement('span');
nickjillings@1316 540 span.textContent = "Enter Metric Name: ";
nickjillings@1316 541 element.appendChild(span);
nickjillings@1316 542 var input = document.createElement('input');
nickjillings@1316 543 input.type = "text";
nickjillings@1316 544 input.style.width = "500px";
nickjillings@1316 545 element.appendChild(input);
nickjillings@1316 546 attrib.appendChild(element);
nickjillings@1316 547 node.appendChild(attrib);
nickjillings@1316 548 return node;
nickjillings@1316 549 };
nickjillings@1316 550
nickjillings@1316 551 function addInterfaceCheck()
nickjillings@1316 552 {
nickjillings@1316 553 var node = createHead('check', 'Check','h4');
nickjillings@1316 554 var attrib = document.createElement('div');
nickjillings@1316 555 attrib.className = "attrib";
nickjillings@1316 556 attrib.appendChild(attributePair('text','Name','name',true));
nickjillings@1316 557 node.appendChild(attrib);
nickjillings@1316 558 return node;
nickjillings@1316 559 }
nickjillings@1316 560 function addInterfaceOption()
nickjillings@1316 561 {
nickjillings@1316 562 var node = createHead('option', 'Option','h4');
nickjillings@1316 563 var attrib = document.createElement('div');
nickjillings@1316 564 attrib.className = "attrib";
nickjillings@1316 565 attrib.appendChild(attributePair('text','Name','name',true));
nickjillings@1316 566 node.appendChild(attrib);
nickjillings@1316 567 return node;
nickjillings@1316 568 }
nickjillings@1316 569
nickjillings@1316 570
nickjillings@1316 571 function addAudioHolder()
nickjillings@1316 572 {
nickjillings@1316 573 var node = createHead('audioHolder','Audio Holder / Test Page','h2');
nickjillings@1316 574 var attrib = document.createElement('div');
nickjillings@1316 575 attrib.className = "attrib";
nickjillings@1316 576 node.appendChild(attrib);
nickjillings@1316 577
nickjillings@1316 578 attrib.appendChild(attributePair('text','ID: ','id',true));
nickjillings@1316 579 attrib.appendChild(attributePair('url','Host URL: ','hostURL',false));
nickjillings@1316 580 attrib.appendChild(attributePair('number','Sample Rate: ','sampleRate',false));
nickjillings@1316 581 attrib.appendChild(attributePair('checkbox','Randomise Fragment Order: ','randomiseOrder',false));
nickjillings@1316 582 attrib.appendChild(attributePair('number','Repeat Count: ','repeatCount',false));
nickjillings@1316 583 attrib.appendChild(attributePair('checkbox','Loop Fragments: ','loop',false));
nickjillings@1316 584 attrib.appendChild(attributePair('checkbox','Fragment Comment Boxes: ','enableComments',false));
nickjillings@1316 585
nickjillings@1316 586 node.appendChild(addPretestNode());
nickjillings@1316 587
nickjillings@1316 588 node.appendChild(addPosttestNode());
nickjillings@1316 589
nickjillings@1316 590 var interfaceNode = createHead('interface','Interface','h3');
nickjillings@1316 591 var addOption = document.createElement('button');
nickjillings@1316 592 addOption.textContent = 'Add Option';
nickjillings@1316 593 addOption.onclick = function(){event.srcElement.parentElement.appendChild(addInterfaceOption());};
nickjillings@1316 594 interfaceNode.appendChild(addOption);
nickjillings@1316 595 var scale = document.createElement('button');
nickjillings@1316 596 scale.textContent = 'Add scale';
nickjillings@1316 597 scale.onclick = function(){event.srcElement.parentElement.appendChild(addScaleMarker());};
nickjillings@1316 598 interfaceNode.appendChild(scale);
nickjillings@1316 599
nickjillings@1316 600 var PageTitle = createHead('title','Page Title','h4');
nickjillings@1316 601 var attrib = document.createElement('div');
nickjillings@1316 602 attrib.className='attrib';
nickjillings@1316 603 var element = document.createElement('div');
nickjillings@1316 604 element.setAttribute('name','element');
nickjillings@1316 605 var span = document.createElement('span');
nickjillings@1316 606 span.textContent = 'Page Title: ';
nickjillings@1316 607 element.appendChild(span);
nickjillings@1316 608 var input = document.createElement('input');
nickjillings@1316 609 input.type = 'text';
nickjillings@1316 610 input.style.width = "500px";
nickjillings@1316 611 element.appendChild(input);
nickjillings@1316 612 attrib.appendChild(element);
nickjillings@1316 613 PageTitle.appendChild(attrib);
nickjillings@1316 614 interfaceNode.appendChild(PageTitle);
nickjillings@1316 615
nickjillings@1316 616 var commentBoxPrefix = createHead('commentBoxPrefix','Comment Box Prefix','h4');
nickjillings@1316 617 var attrib = document.createElement('div');
nickjillings@1316 618 attrib.className='attrib';
nickjillings@1316 619 var element = document.createElement('div');
nickjillings@1316 620 element.setAttribute('name','element');
nickjillings@1316 621 var span = document.createElement('span');
nickjillings@1316 622 span.textContent = 'Prefix: ';
nickjillings@1316 623 element.appendChild(span);
nickjillings@1316 624 var input = document.createElement('input');
nickjillings@1316 625 input.type = 'text';
nickjillings@1316 626 input.style.width = "500px";
nickjillings@1316 627 element.appendChild(input);
nickjillings@1316 628 attrib.appendChild(element);
nickjillings@1316 629 commentBoxPrefix.appendChild(attrib);
nickjillings@1316 630 interfaceNode.appendChild(commentBoxPrefix);
nickjillings@1316 631
nickjillings@1316 632 node.appendChild(interfaceNode);
nickjillings@1316 633
nickjillings@1316 634 var addElement = document.createElement('button');
nickjillings@1316 635 addElement.textContent = 'Add Audio Element';
nickjillings@1316 636 addElement.onclick = function(){event.srcElement.parentElement.appendChild(addAudioElement());};
nickjillings@1316 637 node.appendChild(addElement);
nickjillings@1316 638
nickjillings@1316 639 var addCQ = document.createElement('button');
nickjillings@1316 640 addCQ.textContent = 'Add Comment Box';
nickjillings@1316 641 addCQ.onclick = function(){event.srcElement.parentElement.appendChild(addExtraComment());};
nickjillings@1316 642 node.appendChild(addCQ);
nickjillings@1316 643
nickjillings@1316 644 return node;
nickjillings@1316 645 };
nickjillings@1316 646
nickjillings@1316 647 function addScaleMarker(){
nickjillings@1316 648 var node = createHead('scale','Scale','h4');
nickjillings@1316 649 var attrib = document.createElement('div');
nickjillings@1316 650 attrib.className = "attrib";
nickjillings@1316 651 node.appendChild(attrib);
nickjillings@1316 652 attrib.appendChild(attributePair('number','Position','position',true));
nickjillings@1316 653 var element = document.createElement('div');
nickjillings@1316 654 element.setAttribute('name','element');
nickjillings@1316 655 var span = document.createElement('span');
nickjillings@1316 656 span.textContent = 'Marker Text (Optional): ';
nickjillings@1316 657 element.appendChild(span);
nickjillings@1316 658 var input = document.createElement('input');
nickjillings@1316 659 input.type = 'text';
nickjillings@1316 660 element.appendChild(input);
nickjillings@1316 661 attrib.appendChild(element);
nickjillings@1316 662 return node;
nickjillings@1316 663 };
nickjillings@1316 664
nickjillings@1316 665 function addAudioElement()
nickjillings@1316 666 {
nickjillings@1316 667 var node = createHead('audioElements','Audio Element');
nickjillings@1316 668 var attrib = document.createElement('div');
nickjillings@1316 669 attrib.className = "attrib";
nickjillings@1316 670 node.appendChild(attrib);
nickjillings@1316 671
nickjillings@1316 672 attrib.appendChild(attributePair('text','ID: ','id',true));
nickjillings@1316 673 attrib.appendChild(attributePair('text','URL: ','url',true));
nickjillings@1316 674 attrib.appendChild(attributePair('text','Type: ','type',false));
nickjillings@1316 675
nickjillings@1316 676 return node;
nickjillings@1316 677 };
nickjillings@1316 678
nickjillings@1316 679 function addExtraComment()
nickjillings@1316 680 {
nickjillings@1316 681 var node = createHead('CommentQuestion','Comment');
nickjillings@1316 682 var attrib = document.createElement('div');
nickjillings@1316 683 attrib.className = "attrib";
nickjillings@1316 684 node.appendChild(attrib);
nickjillings@1316 685 attrib.appendChild(attributePair('text','ID: ','id',true));
nickjillings@1316 686
nickjillings@1316 687 var element = document.createElement('div');
nickjillings@1316 688 element.setAttribute('name','element');
nickjillings@1316 689 var span = document.createElement('span');
nickjillings@1316 690 span.textContent = 'Question: ';
nickjillings@1316 691 element.appendChild(span);
nickjillings@1316 692 var input = document.createElement('input');
nickjillings@1316 693 input.type = 'text';
nickjillings@1316 694 input.style.width = "500px";
nickjillings@1316 695 element.appendChild(input);
nickjillings@1316 696 attrib.appendChild(element);
nickjillings@1316 697 return node;
nickjillings@1316 698 }
nickjillings@1316 699 </script>
nickjillings@1316 700
nickjillings@1316 701 <style>
nickjillings@1316 702 h4 {margin: 0px;}
nickjillings@1316 703 div {
nickjillings@1316 704 padding: 2px;
nickjillings@1316 705 margin-top: 2px;
nickjillings@1316 706 margin-bottom: 2px;
nickjillings@1316 707 }
nickjillings@1316 708 div.head{
nickjillings@1316 709 margin-left: 10px;
nickjillings@1316 710 border: black;
nickjillings@1316 711 border-width: 2px;
nickjillings@1316 712 border-style: solid;
nickjillings@1316 713 }
nickjillings@1316 714 div.attrib{
nickjillings@1316 715 margin-left:25px;
nickjillings@1316 716 border: black;
nickjillings@1316 717 border-width: 2px;
nickjillings@1316 718 border-style: dashed;
nickjillings@1316 719 margin-bottom: 10px;
nickjillings@1316 720 display: table;
nickjillings@1316 721 background-color: rgb(200,255,255);
nickjillings@1316 722 }
nickjillings@1316 723 div.attrib div {
nickjillings@1316 724 width: auto;
nickjillings@1316 725 position: relative;
nickjillings@1316 726 display: table-cell;
nickjillings@1316 727 }
nickjillings@1316 728 div#dragFile{
nickjillings@1316 729 height:100px;
nickjillings@1316 730 border-width: 2px;
nickjillings@1316 731 border-style: dashed;
nickjillings@1316 732 margin-bottom: 10px;
nickjillings@1316 733 }
nickjillings@1316 734 </style>
nickjillings@1316 735 </head>
nickjillings@1316 736
nickjillings@1316 737 <body>
nickjillings@1316 738 <h1>Create Test Setup XML</h1>
nickjillings@1316 739 <div id="dragFile">
nickjillings@1316 740 <span>Drag and Drop an XML specification file here to auto-load.</span>
nickjillings@1316 741 </div>
nickjillings@1316 742 <button id="validateXML" onclick="buttonClickedValidate();">Validate</button>
nickjillings@1316 743 <button id="createXML" onclick="buttonClickedSubmit();" disabled>Submit</button>
nickjillings@1316 744 <div id="errorMessage" visibility="hidden"></div>
nickjillings@1316 745 <div id="topLevelBody" align="left">
nickjillings@1316 746 <div id='setup' class="head setup" node-name='setup'>
nickjillings@1316 747 <h2>Setup Node</h2>
nickjillings@1316 748 <div class="attrib">
nickjillings@1316 749 <div name="attribute">
nickjillings@1316 750 <span>Interface: </span>
nickjillings@1316 751 <input type="text" attrib-name='interface' mandatory='true'/>
nickjillings@1316 752 </div>
nickjillings@1316 753 <div name="attribute">
nickjillings@1316 754 <span>Project Return: </span>
nickjillings@1316 755 <input type="url" attrib-name='projectReturn'/>
nickjillings@1316 756 </div>
nickjillings@1316 757 <div name="attribute">
nickjillings@1316 758 <span>Randomise Page Order: </span>
nickjillings@1316 759 <input type="checkbox" attrib-name='randomiseOrder'/>
nickjillings@1316 760 </div>
nickjillings@1316 761 <div name="attribute">
nickjillings@1316 762 <span>Collect Metrics: </span>
nickjillings@1316 763 <input type="checkbox" attrib-name='collectMetrics'/>
nickjillings@1316 764 </div>
nickjillings@1316 765 </div>
nickjillings@1316 766 <div class="head PreTest" node-name="preTest">
nickjillings@1316 767 <h3>Pre Test</h3>
nickjillings@1316 768 <button onclick="event.srcElement.parentElement.appendChild(addPPStatement());">Add Statement</button>
nickjillings@1316 769 <button onclick="event.srcElement.parentElement.appendChild(addPPQuestion());">Add Question</button>
nickjillings@1316 770 <button onclick="event.srcElement.parentElement.appendChild(addPPCheckbox());">Add Checkbox</button>
nickjillings@1316 771 <button onclick="event.srcElement.parentElement.appendChild(addPPRadio());">Add Radio</button>
nickjillings@1316 772 </div>
nickjillings@1316 773 <div class="head PostTest" node-name="postTest">
nickjillings@1316 774 <h3>Post Test</h3>
nickjillings@1316 775 <button onclick="event.srcElement.parentElement.appendChild(addPPStatement());">Add Statement</button>
nickjillings@1316 776 <button onclick="event.srcElement.parentElement.appendChild(addPPQuestion());">Add Question</button>
nickjillings@1316 777 <button onclick="event.srcElement.parentElement.appendChild(addPPCheckbox());">Add Checkbox</button>
nickjillings@1316 778 <button onclick="event.srcElement.parentElement.appendChild(addPPRadio());">Add Radio</button>
nickjillings@1316 779 </div>
nickjillings@1316 780 <div class="head Metric" node-name="metrics">
nickjillings@1316 781 <h3>Metrics</h3>
nickjillings@1316 782 <button onclick="event.srcElement.parentElement.appendChild(addMetricEnable());">Add Metric Enable</button>
nickjillings@1316 783 </div>
nickjillings@1316 784 <div class="head interface" node-name="interface">
nickjillings@1316 785 <h3>Interface</h3>
nickjillings@1316 786 <button onclick="event.srcElement.parentElement.appendChild(addInterfaceCheck());">Add Check</button>
nickjillings@1316 787 <button onclick="event.srcElement.parentElement.appendChild(addInterfaceOption());">Add Option</button>
nickjillings@1316 788 </div>
nickjillings@1316 789 </div>
nickjillings@1316 790 <button onclick="event.srcElement.parentElement.appendChild(addAudioHolder());">Add Audio Holder</button>
nickjillings@1316 791 </div>
nickjillings@1316 792 </body>
nickjillings@1316 793 </html>