Mercurial > hg > webaudioevaluationtool

comparison test_create/test_core.js @ 2851:d1cde8698cc6

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Starting on rewriting of test creator
author Nicholas Jillings <nicholas.jillings@mail.bcu.ac.uk>
date Wed, 26 Apr 2017 14:38:28 +0100
parents 13a0b65143a6
children f75db4482006
comparison
equal deleted inserted replaced
2850:6c41a874fd21 2851:d1cde8698cc6
1 var interfaceSpecs; 1 /* globals angular, window, Promise, XMLHttpRequest, Specification */
2 var xmlHttp; 2 function get(url) {
3 var popupObject; 3 // Return a new promise.
4 var popupStateNodes; 4 return new Promise(function (resolve, reject) {
5 var specification; 5 // Do the usual XHR stuff
6 var convert; 6 var req = new XMLHttpRequest();
7 var attributeText; 7 req.open('GET', url);
8 var page_lang = "en";
9 8
10 // Firefox does not have an XMLDocument.prototype.getElementsByName 9 req.onload = function () {
11 // and there is no searchAll style command, this custom function will 10 // This is called even on 404 etc
12 // search all children recusrively for the name. Used for XSD where all 11 // so check the status
13 // element nodes must have a name and therefore can pull the schema node 12 if (req.status == 200) {
14 XMLDocument.prototype.getAllElementsByName = function (name) { 13 // Resolve the promise with the response text
15 name = String(name); 14 resolve(req.response);
16 var selected = this.documentElement.getAllElementsByName(name); 15 } else {
17 return selected; 16 // Otherwise reject with the status text
17 // which will hopefully be a meaningful error
18 reject(Error(req.statusText));
19 }
20 };
21
22 // Handle network errors
23 req.onerror = function () {
24 reject(Error("Network Error"));
25 };
26
27 // Make the request
28 req.send();
29 });
18 } 30 }
19 31
20 Element.prototype.getAllElementsByName = function (name) { 32 var AngularInterface = angular.module("creator", []);
21 name = String(name);
22 var selected = [];
23 var node = this.firstElementChild;
24 while (node != null) {
25 if (node.getAttribute('name') == name) {
26 selected.push(node);
27 }
28 if (node.childElementCount > 0) {
29 selected = selected.concat(node.getAllElementsByName(name));
30 }
31 node = node.nextElementSibling;
32 }
33 return selected;
34 }
35 33
36 XMLDocument.prototype.getAllElementsByTagName = function (name) { 34 var specification = new Specification();
37 name = String(name);
38 var selected = this.documentElement.getAllElementsByTagName(name);
39 return selected;
40 }
41
42 Element.prototype.getAllElementsByTagName = function (name) {
43 name = String(name);
44 var selected = [];
45 var node = this.firstElementChild;
46 while (node != null) {
47 if (node.nodeName == name) {
48 selected.push(node);
49 }
50 if (node.childElementCount > 0) {
51 selected = selected.concat(node.getAllElementsByTagName(name));
52 }
53 node = node.nextElementSibling;
54 }
55 return selected;
56 }
57
58 // Firefox does not have an XMLDocument.prototype.getElementsByName
59 if (typeof XMLDocument.prototype.getElementsByName != "function") {
60 XMLDocument.prototype.getElementsByName = function (name) {
61 name = String(name);
62 var node = this.documentElement.firstElementChild;
63 var selected = [];
64 while (node != null) {
65 if (node.getAttribute('name') == name) {
66 selected.push(node);
67 }
68 node = node.nextElementSibling;
69 }
70 return selected;
71 }
72 }
73 35
74 window.onload = function () { 36 window.onload = function () {
75 specification = new Specification(); 37 // Get the test interface specifications
76 convert = new SpecificationToHTML();
77 xmlHttp = new XMLHttpRequest();
78 xmlHttp.open("GET", "test_create/interface-specs.xml", true);
79 xmlHttp.onload = function () {
80 var parse = new DOMParser();
81 interfaceSpecs = parse.parseFromString(xmlHttp.response, 'text/xml');
82 buildPage();
83 popupObject.postNode(popupStateNodes.state[0])
84 }
85 xmlHttp.send();
86 38
87 var xsdGet = new XMLHttpRequest(); 39 };
88 xsdGet.open("GET", "xml/test-schema.xsd", true);
89 xsdGet.onload = function () {
90 var parse = new DOMParser();
91 specification.schema = parse.parseFromString(xsdGet.response, 'text/xml');;
92 }
93 xsdGet.send();
94 40
95 var jsonAttribute = new XMLHttpRequest(); 41 AngularInterface.controller("view", ['$scope', '$element', '$window', function ($s, $e, $w) {
96 jsonAttribute.open("GET", "test_create/attributes.json", true); 42 $s.popupVisible = true;
97 jsonAttribute.onload = function () {
98 attributeText = JSON.parse(jsonAttribute.response)
99 }
100 jsonAttribute.send();
101 }
102 43
103 function buildPage() { 44 $s.showPopup = function () {
104 popupObject = new function () { 45 $s.popupVisible = true;
105 this.object = document.getElementById("popupHolder"); 46 };
106 this.blanket = document.getElementById("blanket"); 47 $s.hidePopup = function () {
48 $s.popupVisible = false;
49 };
50 $s.globalSchema = undefined;
51 get("xml/test-schema.xsd").then(function (text) {
52 specification.processSchema(text);
53 $s.globalSchema = specification.getSchema();
54 });
55 $s.specification = specification;
56 }]);
107 57
108 this.popupTitle = document.createElement("div"); 58 AngularInterface.controller("introduction", ['$scope', '$element', '$window', function ($s, $e, $w) {
109 this.popupTitle.id = "popup-title-holder"; 59 $s.state = 0;
110 this.popupTitle.align = "center"; 60 $s.next = function () {
111 this.titleDOM = document.createElement("span"); 61 $s.state++;
112 this.titleDOM.id = "popup-title"; 62 if ($s.state > 1) {
113 this.popupTitle.appendChild(this.titleDOM); 63 $s.hidePopup();
114 this.object.appendChild(this.popupTitle); 64 }
65 };
66 $s.back = function () {
67 $s.state--;
68 };
69 $s.mouseover = function (name) {
70 var obj = $s.interfaces.find(function (i) {
71 return i.name == name;
72 });
73 if (obj) {
74 $s.description = obj.description.en;
75 }
76 };
77 $s.initialise = function (name) {
78 var obj = $s.interfaces.find(function (i) {
79 return i.name == name;
80 });
81 specification.interface = obj.interface;
82 };
83 // Get the test interface specifications
84 $s.interfaces = {};
85 $s.description = "";
86 var interfaceCollection = new Promise(function (resolve, reject) {
87 var xml = new XMLHttpRequest();
88 xml.open("GET", "test_create/interfaces/specifications.json");
89 xml.onload = function () {
90 if (xml.status === 200) {
91 resolve(xml.responseText);
92 return;
93 }
94 reject(xml.status);
95 };
96 xml.onerror = function () {
97 reject(new Error("Network Error"));
98 };
99 xml.send();
100 }).then(JSON.parse).then(function (data) {
101 $s.interfaces = data.interfaces;
102 $s.$apply();
103 });
104 }]);
115 105
116 this.popupContent = document.createElement("div"); 106 AngularInterface.controller("setup", ['$scope', '$element', '$window', function ($s, $e, $w) {
117 this.popupContent.id = "popup-content"; 107 function initialise() {
118 this.object.appendChild(this.popupContent); 108 if ($s.globalSchema) {
119 109 $s.schema = $s.globalSchema.querySelector("[name=setup]");
120 this.proceedButton = document.createElement("button");
121 this.proceedButton.id = "popup-proceed";
122 this.proceedButton.className = "popup-button";
123 this.proceedButton.textContent = "Next";
124 this.proceedButton.onclick = function () {
125 popupObject.popupContent.innerHTML = null;
126 if (typeof popupObject.shownObject.continue == "function") {
127 popupObject.shownObject.continue();
128 } else {
129 popupObject.hide();
130 }
131 };
132 this.object.appendChild(this.proceedButton);
133
134 this.backButton = document.createElement("button");
135 this.backButton.id = "popup-back";
136 this.backButton.className = "popup-button";
137 this.backButton.textContent = "Back";
138 this.backButton.onclick = function () {
139 popupObject.popupContent.innerHTML = null;
140 popupObject.shownObject.back();
141 };
142 this.object.appendChild(this.backButton);
143
144 this.shownObject;
145
146 this.resize = function () {
147 var w = window.innerWidth;
148 var h = window.innerHeight;
149 this.object.style.left = Math.floor((w - 750) / 2) + 'px';
150 this.object.style.top = Math.floor((h - 500) / 2) + 'px';
151 }
152
153 this.show = function () {
154 this.object.style.visibility = "visible";
155 this.blanket.style.visibility = "visible";
156 if (typeof this.shownObject.back == "function") {
157 this.backButton.style.visibility = "visible";
158 } else {
159 this.backButton.style.visibility = "hidden";
160 }
161 }
162
163 this.hide = function () {
164 this.object.style.visibility = "hidden";
165 this.blanket.style.visibility = "hidden";
166 this.backButton.style.visibility = "hidden";
167 }
168
169 this.postNode = function (postObject) {
170 //Passed object must have the following:
171 // Title: text to show in the title
172 // Content: HTML DOM to show on the page
173 // On complete this HTML DOM is destroyed so make sure it is referenced elsewhere for processing
174 this.titleDOM.textContent = postObject.title;
175 this.popupContent.appendChild(postObject.content);
176 this.shownObject = postObject;
177 if (typeof this.shownObject.back == "function") {
178 this.backButton.style.visibility = "visible";
179 } else {
180 this.backButton.style.visibility = "hidden";
181 }
182 if (typeof this.shownObject.continue == "function") {
183 this.proceedButton.textContent = "Next";
184 } else {
185 this.proceedButton.textContent = "Finish";
186 }
187 this.show();
188 }
189
190 this.resize();
191 this.hide();
192 };
193
194 popupStateNodes = new function () {
195 // This defines the several popup states wanted
196 this.state = [];
197 this.state[0] = new function () {
198 this.title = "Welcome";
199 this.content = document.createElement("div");
200 this.content.id = "state-0";
201 var span = document.createElement("span");
202 span.textContent = "Welcome to the WAET test creator tool. This will allow you to create a new test from scratch to suit your testing needs. If you wish to update a test file, please drag and drop the XML document into the area below for processing, otherwise press 'Next' to start a new test. This tool generates files for the WAET 1.2.0 version."
203 this.content.appendChild(span);
204 this.dragArea = document.createElement("div");
205 this.dragArea.className = "drag-area";
206 this.dragArea.id = "project-drop";
207 this.content.appendChild(this.dragArea);
208
209 this.dragArea.addEventListener('dragover', function (e) {
210 e.stopPropagation();
211 e.preventDefault();
212 e.dataTransfer.dropEffect = 'copy';
213 e.currentTarget.className = "drag-area drag-over";
214 });
215
216 this.dragArea.addEventListener('dragexit', function (e) {
217 e.stopPropagation();
218 e.preventDefault();
219 e.dataTransfer.dropEffect = 'copy';
220 e.currentTarget.className = "drag-area";
221 });
222
223 this.dragArea.addEventListener('drop', function (e) {
224 e.stopPropagation();
225 e.preventDefault();
226 e.currentTarget.className = "drag-area drag-dropped";
227 var files = e.dataTransfer.files[0];
228 var reader = new FileReader();
229 reader.onload = function (decoded) {
230 var parse = new DOMParser();
231 specification.decode(parse.parseFromString(decoded.target.result, 'text/xml'));
232 popupObject.hide();
233 popupObject.popupContent.innerHTML = null;
234 convert.convert(document.getElementById('content'));
235 }
236 reader.readAsText(files);
237 });
238
239
240 this.continue = function () {
241 popupObject.postNode(popupStateNodes.state[1]);
242 }
243 }
244 this.state[1] = new function () {
245 this.title = "Select your interface";
246 this.content = document.createElement("div");
247 this.content.id = "state-1";
248 var spnH = document.createElement('div');
249 var span = document.createElement("span");
250 span.textContent = "Please select your interface from the list shown below. This will define the various options which are available. This can later be changed.";
251 spnH.appendChild(span);
252 this.content.appendChild(spnH);
253 this.select = document.createElement("select");
254 this.content.appendChild(this.select);
255 this.description = document.createElement("p");
256 this.content.appendChild(this.description);
257 this.testsXML = interfaceSpecs.getElementsByTagName('tests')[0].getElementsByTagName('test');
258 for (var i = 0; i < this.testsXML.length; i++) {
259 var option = document.createElement('option');
260 option.value = this.testsXML[i].getAttribute('name');
261 option.textContent = this.testsXML[i].getAttribute('name');
262 this.select.appendChild(option);
263 }
264 this.handleEvent = function (event) {
265 var testXML = interfaceSpecs.getElementsByTagName("tests")[0].getAllElementsByName(this.select.value)[0];
266 var descriptors = testXML.getAllElementsByTagName("description");
267 this.description.textContent = "";
268 for (var i = 0; i < descriptors.length; i++) {
269 if (descriptors[i].getAttribute("lang") == page_lang) {
270 this.description.textContent = descriptors[i].textContent;
271 }
272 }
273 }
274 this.select.addEventListener("change", this);
275 this.handleEvent();
276 this.continue = function () {
277 var testXML = interfaceSpecs.getElementsByTagName("tests")[0].getAllElementsByName(this.select.value)[0];
278 specification.interface = testXML.getAttribute("interface");
279 if (specification.interfaces == null) {
280 specification.interfaces = new specification.interfaceNode(specification);
281 }
282 if (specification.metrics == null) {
283 specification.metrics = new specification.metricNode();
284 }
285 popupStateNodes.state[2].generate();
286 popupObject.postNode(popupStateNodes.state[2]);
287 }
288 this.back = function () {
289 popupObject.postNode(popupStateNodes.state[0]);
290 }
291 }
292 this.state[2] = new function () {
293 this.title = "Test Checks & Restrictions";
294 this.content = document.createElement("div");
295 this.content.id = "state-1";
296 var spnH = document.createElement('div');
297 var span = document.createElement("span");
298 span.textContent = "Select your test checks and restrictions. Greyed out items are fixed by the test/interface and cannot be changed";
299 spnH.appendChild(span);
300 this.content.appendChild(spnH);
301 var holder = document.createElement("div");
302 this.options = [];
303 this.testXML = null;
304 this.interfaceXML = null;
305 this.dynamicContent = document.createElement("div");
306 this.content.appendChild(this.dynamicContent);
307 this.generate = function () {
308 this.options = [];
309 this.dynamicContent.innerHTML = null;
310 var interfaceName = popupStateNodes.state[1].select.value;
311 this.checkText = interfaceSpecs.getElementsByTagName("global")[0].getAllElementsByTagName("checks")[0];
312 this.testXML = interfaceSpecs.getElementsByTagName("tests")[0].getAllElementsByName(interfaceName)[0];
313 this.interfaceXML = interfaceSpecs.getAllElementsByTagName("interfaces")[0].getAllElementsByName(this.testXML.getAttribute("interface"))[0].getAllElementsByTagName("checks")[0];
314 this.testXML = this.testXML.getAllElementsByTagName("checks");
315 var interfaceXMLChildren = this.interfaceXML.getElementsByTagName('entry');
316 for (var i = 0; i < interfaceXMLChildren.length; i++) {
317 var interfaceNode = interfaceXMLChildren[i];
318 var checkName = interfaceNode.getAttribute('name');
319 var testNode
320 if (this.testXML.length > 0) {
321 testNode = this.testXML[0].getAllElementsByName(checkName);
322 if (testNode.length != 0) {
323 testNode = testNode[0];
324 } else {
325 testNode = undefined;
326 }
327 } else {
328 testNode = undefined;
329 }
330 var obj = {
331 root: document.createElement("div"),
332 text: document.createElement("label"),
333 input: document.createElement("input"),
334 parent: this,
335 name: checkName,
336 handleEvent: function (event) {
337 if (this.input.checked) {
338 // Add to specification.interfaces.option
339 var included = specification.interfaces.options.find(function (element, index, array) {
340 if (element.name == this.name) {
341 return true;
342 } else {
343 return false;
344 }
345 }, this);
346 if (included == null) {
347 specification.interfaces.options.push({
348 type: "check",
349 name: this.name
350 });
351 }
352 } else {
353 // Remove from specification.interfaces.option
354 var position = specification.interfaces.options.findIndex(function (element, index, array) {
355 if (element.name == this.name) {
356 return true;
357 } else {
358 return false;
359 }
360 }, this);
361 if (position >= 0) {
362 specification.interfaces.options.splice(position, 1);
363 }
364 }
365 }
366 }
367
368 obj.input.addEventListener("click", obj);
369 obj.root.className = "popup-checkbox";
370 obj.input.type = "checkbox";
371 obj.input.setAttribute('id', checkName);
372 obj.text.setAttribute("for", checkName);
373 obj.text.textContent = this.checkText.getAllElementsByName(checkName)[0].textContent;
374 obj.root.appendChild(obj.input);
375 obj.root.appendChild(obj.text);
376 if (testNode != undefined) {
377 if (testNode.getAttribute('default') == 'on') {
378 obj.input.checked = true;
379 }
380 if (testNode.getAttribute('support') == "none") {
381 obj.input.disabled = true;
382 obj.input.checked = false;
383 obj.root.className = "popup-checkbox disabled";
384 } else if (interfaceNode.getAttribute('support') == "mandatory") {
385 obj.input.disabled = true;
386 obj.input.checked = true;
387 obj.root.className = "popup-checkbox disabled";
388 }
389 } else {
390 if (interfaceNode.getAttribute('default') == 'on') {
391 obj.input.checked = true;
392 }
393 if (interfaceNode.getAttribute('support') == "none") {
394 obj.input.disabled = true;
395 obj.input.checked = false;
396 obj.root.className = "popup-checkbox disabled";
397 } else if (interfaceNode.getAttribute('support') == "mandatory") {
398 obj.input.disabled = true;
399 obj.input.checked = true;
400 obj.root.className = "popup-checkbox disabled";
401 }
402 }
403 var included = specification.interfaces.options.find(function (element, index, array) {
404 if (element.name == this.name) {
405 return true;
406 } else {
407 return false;
408 }
409 }, obj);
410 if (included != undefined) {
411 obj.input.checked = true;
412 }
413 obj.handleEvent();
414 this.options.push(obj);
415 this.dynamicContent.appendChild(obj.root);
416 }
417 }
418 this.continue = function () {
419 popupStateNodes.state[3].generate();
420 popupObject.postNode(popupStateNodes.state[3]);
421 }
422 this.back = function () {
423 popupObject.postNode(popupStateNodes.state[1]);
424 }
425 }
426 this.state[3] = new function () {
427 this.title = "Test Metrics";
428 this.content = document.createElement("div");
429 this.content.id = "state-1";
430 var spnH = document.createElement('div');
431 var span = document.createElement("span");
432 span.textContent = "Select which data points to include in the exported results XML. Some of this is required for certain post script analysis. See the documentation for further details";
433 spnH.appendChild(span);
434 this.content.appendChild(spnH);
435 this.options = [];
436 this.checkText;
437 this.testXML;
438 this.interfaceXML;
439 this.dynamicContent = document.createElement("div");
440 this.content.appendChild(this.dynamicContent);
441 this.generate = function () {
442 this.options = [];
443 this.dynamicContent.innerHTML = null;
444 var interfaceName = popupStateNodes.state[1].select.value;
445 this.checkText = interfaceSpecs.getElementsByTagName("global")[0].getAllElementsByTagName("metrics")[0];
446 this.testXML = interfaceSpecs.getElementsByTagName("tests")[0].getAllElementsByName(interfaceName)[0];
447 this.interfaceXML = interfaceSpecs.getAllElementsByTagName("interfaces")[0].getAllElementsByName(this.testXML.getAttribute("interface"))[0].getAllElementsByTagName("metrics")[0];
448 this.testXML = this.testXML.getAllElementsByTagName("metrics");
449 var interfaceXMLChildren = this.interfaceXML.getElementsByTagName('entry');
450 for (var i = 0; i < interfaceXMLChildren.length; i++) {
451 var interfaceNode = interfaceXMLChildren[i];
452 var checkName = interfaceNode.getAttribute('name');
453 var testNode
454 if (this.testXML.length > 0) {
455 testNode = this.testXML[0].getAllElementsByName(checkName);
456 if (testNode.length != 0) {
457 testNode = testNode[0];
458 } else {
459 testNode = undefined;
460 }
461 } else {
462 testNode = undefined;
463 }
464 var obj = {
465 root: document.createElement("div"),
466 text: document.createElement("label"),
467 input: document.createElement("input"),
468 parent: this,
469 name: checkName,
470 handleEvent: function (event) {
471 if (this.input.checked) {
472 // Add to specification.interfaces.option
473 var included = specification.metrics.enabled.find(function (element, index, array) {
474 if (element == this.name) {
475 return true;
476 } else {
477 return false;
478 }
479 }, this);
480 if (included == null) {
481 specification.metrics.enabled.push(this.name);
482 }
483 } else {
484 // Remove from specification.interfaces.option
485 var position = specification.metrics.enabled.findIndex(function (element, index, array) {
486 if (element == this.name) {
487 return true;
488 } else {
489 return false;
490 }
491 }, this);
492 if (position >= 0) {
493 specification.metrics.enabled.splice(position, 1);
494 }
495 }
496 }
497 }
498
499 obj.input.addEventListener("click", obj);
500 obj.root.className = "popup-checkbox";
501 obj.input.type = "checkbox";
502 obj.input.setAttribute('id', checkName);
503 obj.text.setAttribute("for", checkName);
504 obj.text.textContent = this.checkText.getAllElementsByName(checkName)[0].textContent;
505 obj.root.appendChild(obj.input);
506 obj.root.appendChild(obj.text);
507 if (testNode != undefined) {
508 if (testNode.getAttribute('default') == 'on') {
509 obj.input.checked = true;
510 }
511 if (testNode.getAttribute('support') == "none") {
512 obj.input.disabled = true;
513 obj.input.checked = false;
514 obj.root.className = "popup-checkbox disabled";
515 } else if (interfaceNode.getAttribute('support') == "mandatory") {
516 obj.input.disabled = true;
517 obj.input.checked = true;
518 obj.root.className = "popup-checkbox disabled";
519 }
520 } else {
521 if (interfaceNode.getAttribute('default') == 'on') {
522 obj.input.checked = true;
523 }
524 if (interfaceNode.getAttribute('support') == "none") {
525 obj.input.disabled = true;
526 obj.input.checked = false;
527 obj.root.className = "popup-checkbox disabled";
528 } else if (interfaceNode.getAttribute('support') == "mandatory") {
529 obj.input.disabled = true;
530 obj.input.checked = true;
531 obj.root.className = "popup-checkbox disabled";
532 }
533 }
534 var included = specification.metrics.enabled.find(function (element, index, array) {
535 if (element == this.name) {
536 return true;
537 } else {
538 return false;
539 }
540 }, obj);
541 obj.handleEvent();
542 if (included != undefined) {
543 obj.input.checked = true;
544 }
545 this.options.push(obj);
546 this.dynamicContent.appendChild(obj.root);
547 }
548 }
549 this.continue = function () {
550 popupStateNodes.state[4].generate();
551 popupObject.postNode(popupStateNodes.state[4]);
552 }
553 this.back = function () {
554 popupObject.postNode(popupStateNodes.state[2]);
555 }
556 }
557 this.state[4] = new function () {
558 this.title = "Test Visuals";
559 this.content = document.createElement("div");
560 this.content.id = "state-1";
561 var spnH = document.createElement('div');
562 var span = document.createElement("span");
563 span.textContent = "You can display extra visual content with your interface for the test user to interact with. Select from the available options below. Greyed out options are unavailable for your selected interface";
564 spnH.appendChild(span);
565 this.content.appendChild(spnH);
566 this.options = [];
567 this.checkText;
568 this.testXML;
569 this.interfaceXML;
570 this.dynamicContent = document.createElement("div");
571 this.content.appendChild(this.dynamicContent);
572 this.generate = function () {
573 this.options = [];
574 this.dynamicContent.innerHTML = null;
575 var interfaceName = popupStateNodes.state[1].select.value;
576 this.checkText = interfaceSpecs.getElementsByTagName("global")[0].getAllElementsByTagName("show")[0];
577 this.testXML = interfaceSpecs.getElementsByTagName("tests")[0].getAllElementsByName(interfaceName)[0];
578 this.interfaceXML = interfaceSpecs.getAllElementsByTagName("interfaces")[0].getAllElementsByName(this.testXML.getAttribute("interface"))[0].getAllElementsByTagName("show")[0];
579 this.testXML = this.testXML.getAllElementsByTagName("show");
580 var interfaceXMLChildren = this.interfaceXML.getElementsByTagName('entry');
581 for (var i = 0; i < interfaceXMLChildren.length; i++) {
582 var interfaceNode = interfaceXMLChildren[i];
583 var checkName = interfaceNode.getAttribute('name');
584 var testNode
585 if (this.testXML.length > 0) {
586 testNode = this.testXML[0].getAllElementsByName(checkName);
587 if (testNode.length != 0) {
588 testNode = testNode[0];
589 } else {
590 testNode = undefined;
591 }
592 } else {
593 testNode = undefined;
594 }
595 var obj = {
596 root: document.createElement("div"),
597 text: document.createElement("label"),
598 input: document.createElement("input"),
599 parent: this,
600 name: checkName,
601 handleEvent: function (event) {
602 if (this.input.checked) {
603 // Add to specification.interfaces.option
604 var included = specification.interfaces.options.find(function (element, index, array) {
605 if (element.name == this.name) {
606 return true;
607 } else {
608 return false;
609 }
610 }, this);
611 if (included == null) {
612 specification.interfaces.options.push({
613 type: "show",
614 name: this.name
615 });
616 }
617 } else {
618 // Remove from specification.interfaces.option
619 var position = specification.interfaces.options.findIndex(function (element, index, array) {
620 if (element.name == this.name) {
621 return true;
622 } else {
623 return false;
624 }
625 }, this);
626 if (position >= 0) {
627 specification.interfaces.options.splice(position, 1);
628 }
629 }
630 }
631 }
632
633 obj.input.addEventListener("click", obj);
634 obj.root.className = "popup-checkbox";
635 obj.input.type = "checkbox";
636 obj.input.setAttribute('id', checkName);
637 obj.text.setAttribute("for", checkName);
638 obj.text.textContent = this.checkText.getAllElementsByName(checkName)[0].textContent;
639 obj.root.appendChild(obj.input);
640 obj.root.appendChild(obj.text);
641 if (testNode != undefined) {
642 if (testNode.getAttribute('default') == 'on') {
643 obj.input.checked = true;
644 }
645 if (testNode.getAttribute('support') == "none") {
646 obj.input.disabled = true;
647 obj.input.checked = false;
648 obj.root.className = "popup-checkbox disabled";
649 } else if (interfaceNode.getAttribute('support') == "mandatory") {
650 obj.input.disabled = true;
651 obj.input.checked = true;
652 obj.root.className = "popup-checkbox disabled";
653 }
654 } else {
655 if (interfaceNode.getAttribute('default') == 'on') {
656 obj.input.checked = true;
657 }
658 if (interfaceNode.getAttribute('support') == "none") {
659 obj.input.disabled = true;
660 obj.input.checked = false;
661 obj.root.className = "popup-checkbox disabled";
662 } else if (interfaceNode.getAttribute('support') == "mandatory") {
663 obj.input.disabled = true;
664 obj.input.checked = true;
665 obj.root.className = "popup-checkbox disabled";
666 }
667 }
668 var included = specification.interfaces.options.find(function (element, index, array) {
669 if (element.name == this.name) {
670 return true;
671 } else {
672 return false;
673 }
674 }, obj);
675 if (included != undefined) {
676 obj.input.checked = true;
677 }
678 obj.handleEvent();
679 this.options.push(obj);
680 this.dynamicContent.appendChild(obj.root);
681 }
682 }
683 this.continue = function () {
684 popupObject.hide();
685 convert.convert(document.getElementById('content'));
686 }
687 this.back = function () {
688 popupObject.postNode(popupStateNodes.state[3]);
689 }
690 }
691 this.state[5] = new function () {
692 this.title = "Add/Edit Survey Element";
693 this.content = document.createElement("div");
694 this.content.id = "state-1";
695 var spnH = document.createElement('div');
696 var span = document.createElement("span");
697 span.textContent = "You can configure your survey element here. Press 'Continue' to complete your changes.";
698 spnH.appendChild(span);
699 this.content.appendChild(spnH);
700 this.dynamic = document.createElement("div");
701 this.option = null;
702 this.parent = null;
703 this.optionLists = [];
704 this.select = document.createElement("select");
705 this.select.setAttribute("name", "type");
706 this.select.addEventListener("change", this, false);
707 this.content.appendChild(this.select);
708 this.content.appendChild(this.dynamic);
709 this.generate = function (option, parent) {
710 this.option = option;
711 this.parent = parent;
712 if (this.select.childElementCount == 0) {
713 var optionList = specification.schema.getAllElementsByName("survey")[0].getAllElementsByName("type")[0].getAllElementsByTagName("xs:enumeration");
714 for (var i = 0; i < optionList.length; i++) {
715 var selectOption = document.createElement("option");
716 selectOption.value = optionList[i].getAttribute("value");
717 selectOption.textContent = selectOption.value;
718 this.select.appendChild(selectOption);
719 }
720 }
721 if (this.option.type != undefined) {
722 this.select.value = this.option.type
723 } else {
724 this.select.value = "statement";
725 this.option.type = "statement";
726 }
727
728 this.dynamic.innerHTML = null;
729 var statement = document.createElement("div");
730 var statementText = document.createElement("span");
731 var statementEntry = document.createElement("input");
732 statement.appendChild(statementText);
733 statement.appendChild(statementEntry);
734 statement.className = "survey-entry-attribute";
735 statementText.textContent = "Statement/Question";
736 statementEntry.style.width = "500px";
737 statementEntry.addEventListener("change", this, false);
738 statementEntry.setAttribute("name", "statement");
739 statementEntry.value = this.option.statement;
740 this.dynamic.appendChild(statement);
741
742 var id = document.createElement("div");
743 var idText = document.createElement("span");
744 var idEntry = document.createElement("input");
745 id.appendChild(idText);
746 id.appendChild(idEntry);
747 id.className = "survey-entry-attribute";
748 idText.textContent = "ID: ";
749 idEntry.addEventListener("change", this, false);
750 idEntry.setAttribute("name", "id");
751 idEntry.value = this.option.id;
752
753 this.dynamic.appendChild(id);
754
755 switch (this.option.type) {
756 case "statement":
757 break;
758 case "question":
759 var boxsizeSelect = document.createElement("select");
760 var optionList = specification.schema.getAllElementsByName("survey")[0].getAllElementsByName("boxsize")[0].getAllElementsByTagName("xs:enumeration");
761 for (var i = 0; i < optionList.length; i++) {
762 var selectOption = document.createElement("option");
763 selectOption.value = optionList[i].getAttribute("value");
764 selectOption.textContent = selectOption.value;
765 boxsizeSelect.appendChild(selectOption);
766 }
767 if (this.option.boxsize != undefined) {
768 boxsizeSelect.value = this.option.boxsize;
769 } else {
770 boxsizeSelect.value = "normal";
771 this.option.boxsize = "normal";
772 }
773 boxsizeSelect.setAttribute("name", "boxsize");
774 boxsizeSelect.addEventListener("change", this, false);
775 var boxsize = document.createElement("div");
776 var boxsizeText = document.createElement("span");
777 boxsizeText.textContent = "Entry Size: ";
778 boxsize.appendChild(boxsizeText);
779 boxsize.appendChild(boxsizeSelect);
780 boxsize.className = "survey-entry-attribute";
781 this.dynamic.appendChild(boxsize);
782
783 var mandatory = document.createElement("div");
784 var mandatoryInput = document.createElement("input");
785 var mandatoryText = document.createElement("span");
786 mandatoryText.textContent = "Mandatory: ";
787 mandatory.appendChild(mandatoryText);
788 mandatory.appendChild(mandatoryInput);
789 mandatory.className = "survey-entry-attribute";
790 mandatoryInput.type = "checkbox";
791 if (this.option.mandatory) {
792 mandatoryInput.checked = true;
793 } else {
794 mandatoryInput.checked = false;
795 }
796 mandatoryInput.setAttribute("name", "mandatory");
797 mandatoryInput.addEventListener("change", this, false);
798 this.dynamic.appendChild(mandatory);
799 break;
800 case "number":
801 this.dynamic.appendChild(id);
802
803 var mandatory = document.createElement("div");
804 var mandatoryInput = document.createElement("input");
805 var mandatoryText = document.createElement("span");
806 mandatoryText.textContent = "Mandatory: ";
807 mandatory.appendChild(mandatoryText);
808 mandatory.appendChild(mandatoryInput);
809 mandatory.className = "survey-entry-attribute";
810 mandatoryInput.type = "checkbox";
811 if (this.option.mandatory) {
812 mandatoryInput.checked = true;
813 } else {
814 mandatoryInput.checked = false;
815 }
816 mandatoryInput.setAttribute("name", "mandatory");
817 mandatoryInput.addEventListener("change", this, false);
818 this.dynamic.appendChild(mandatory);
819
820 var minimum = document.createElement("div");
821 var minimumEntry = document.createElement("input");
822 var minimumText = document.createElement("span");
823 minimumText.textContent = "Minimum: ";
824 minimum.appendChild(minimumText);
825 minimum.appendChild(minimumEntry);
826 minimum.className = "survey-entry-attribute";
827 minimumEntry.type = "number";
828 minimumEntry.setAttribute("name", "min");
829 minimumEntry.addEventListener("change", this, false);
830 minimumEntry.value = this.option.min;
831 this.dynamic.appendChild(minimum);
832
833 var maximum = document.createElement("div");
834 var maximumEntry = document.createElement("input");
835 var maximumText = document.createElement("span");
836 maximumText.textContent = "Maximum: ";
837 maximum.appendChild(maximumText);
838 maximum.appendChild(maximumEntry);
839 maximum.className = "survey-entry-attribute";
840 maximumEntry.type = "number";
841 maximumEntry.setAttribute("name", "max");
842 maximumEntry.addEventListener("change", this, false);
843 maximumEntry.value = this.option.max;
844 this.dynamic.appendChild(maximum);
845 break;
846 case "checkbox":
847 case "radio":
848 this.dynamic.appendChild(id);
849 var optionHolder = document.createElement("div");
850 optionHolder.className = 'node';
851 optionHolder.id = 'popup-option-holder';
852 var optionObject = function (parent, option) {
853 this.rootDOM = document.createElement("div");
854 this.rootDOM.className = "popup-option-entry";
855 this.inputName = document.createElement("input");
856 this.inputName.setAttribute("name", "name");
857 this.inputLabel = document.createElement("input");
858 this.inputLabel.setAttribute("name", "text");
859 this.specification = option;
860 this.parent = parent;
861 this.handleEvent = function () {
862 var target = event.currentTarget.getAttribute("name");
863 eval("this.specification." + target + " = event.currentTarget.value");
864 };
865
866 var nameText = document.createElement("span");
867 nameText.textContent = "Name: ";
868 var labelText = document.createElement("span");
869 labelText.textContent = "Label: ";
870 this.rootDOM.appendChild(nameText);
871 this.rootDOM.appendChild(this.inputName);
872 this.rootDOM.appendChild(labelText);
873 this.rootDOM.appendChild(this.inputLabel);
874 this.inputName.addEventListener("change", this, false);
875 this.inputLabel.addEventListener("change", this, false);
876 this.inputName.value = this.specification.name;
877 this.inputLabel.value = this.specification.text;
878 this.inputLabel.style.width = "350px";
879
880 this.deleteEntry = {
881 root: document.createElement("button"),
882 parent: this,
883 handleEvent: function () {
884 document.getElementById("popup-option-holder").removeChild(this.parent.rootDOM);
885 var index = this.parent.parent.option.options.findIndex(function (element, index, array) {
886 if (element == this.parent.specification)
887 return true;
888 else
889 return false;
890 }, this);
891 var optionList = this.parent.parent.option.options;
892 if (index == optionList.length - 1) {
893 optionList = optionList.slice(0, index);
894 } else {
895 optionList = optionList.slice(0, index).concat(optionList.slice(index + 1));
896 }
897 this.parent.parent.option.options = optionList;
898 }
899 };
900 this.deleteEntry.root.textContent = "Delete Option";
901 this.deleteEntry.root.addEventListener("click", this.deleteEntry, false);
902 this.rootDOM.appendChild(this.deleteEntry.root);
903 }
904 this.addEntry = {
905 parent: this,
906 root: document.createElement("button"),
907 handleEvent: function () {
908 var node = {
909 name: "name",
910 text: "text"
911 };
912 var optionsList = this.parent.option.options;
913 optionsList.push(node);
914 var obj = new optionObject(this.parent, optionsList[optionsList.length - 1]);
915 this.parent.optionLists.push(obj);
916 document.getElementById("popup-option-holder").appendChild(obj.rootDOM);
917 }
918 }
919 this.addEntry.root.textContent = "Add Option";
920 this.addEntry.root.addEventListener("click", this.addEntry);
921 this.dynamic.appendChild(this.addEntry.root);
922 for (var i = 0; i < this.option.options.length; i++) {
923 var obj = new optionObject(this, this.option.options[i]);
924 this.optionLists.push(obj);
925 optionHolder.appendChild(obj.rootDOM);
926 }
927 this.dynamic.appendChild(optionHolder);
928 }
929 }
930 this.handleEvent = function (event) {
931 var name = event.currentTarget.getAttribute("name");
932 var nodeName = event.currentTarget.nodeName;
933 if (name == "type" && nodeName == "SELECT") {
934 // If type has changed, we may need to rebuild the entire state node
935 if (event.currentTarget.value != this.option.name) {
936 this.option.type = event.currentTarget.value;
937 this.generate(this.option, this.parent);
938 }
939 return;
940 }
941 switch (event.currentTarget.getAttribute("type")) {
942 case "checkbox":
943 eval("this.option." + name + " = event.currentTarget.checked");
944 break;
945 default:
946 eval("this.option." + name + " = event.currentTarget.value");
947 break;
948 }
949 }
950 this.continue = function () {
951 if (this.parent.type == "surveyNode") {
952 var newNode = new this.parent.surveyEntryNode(this.parent, this.option);
953 this.parent.children.push(newNode);
954 this.parent.childrenDOM.appendChild(newNode.rootDOM);
955 } else if (this.parent.type == "surveyEntryNode") {
956 this.parent.build();
957 }
958 popupObject.hide();
959 }
960 }
961 this.state[6] = new function () {
962 this.title = "Edit Scale Markers";
963 this.content = document.createElement("div");
964 this.content.id = "state-6";
965 var spnH = document.createElement('div');
966 var span = document.createElement("span");
967 span.textContent = "You can edit your scale markers here for the selected interface.";
968 spnH.appendChild(span);
969 this.scaleRoot;
970 this.parent;
971 this.markerNodes = [];
972 this.preset = {
973 input: document.createElement("select"),
974 parent: this,
975 handleEvent: function (event) {
976 this.parent.scaleRoot.scales = [];
977 var protoScale = interfaceSpecs.getAllElementsByTagName('scaledefinitions')[0].getAllElementsByName(event.currentTarget.value)[0];
978 var protoMarkers = protoScale.getElementsByTagName("scalelabel");
979 for (var i = 0; i < protoMarkers.length; i++) {
980 var marker = {
981 position: protoMarkers[i].getAttribute("position"),
982 text: protoMarkers[i].textContent
983 }
984 this.parent.scaleRoot.scales.push(marker);
985 }
986 this.parent.buildMarkerList();
987 }
988 }
989 this.preset.input.addEventListener("change", this.preset);
990 this.content.appendChild(this.preset.input);
991 var optionHolder = document.createElement("div");
992 optionHolder.className = 'node';
993 optionHolder.id = 'popup-option-holder';
994 this.content.appendChild(optionHolder);
995 this.addMarker = {
996 root: document.createElement("button"),
997 parent: this,
998 handleEvent: function () {
999 var marker = {
1000 position: 0,
1001 text: "text"
1002 };
1003 this.parent.scaleRoot.scales.push(marker);
1004 var markerNode = new this.parent.buildMarkerNode(this.parent, marker);
1005 document.getElementById("popup-option-holder").appendChild(markerNode.root);
1006 this.parent.markerNodes.push(markerNode);
1007 }
1008 };
1009 this.addMarker.root.textContent = "Add Marker";
1010 this.addMarker.root.addEventListener("click", this.addMarker);
1011 this.generate = function (scaleRoot, parent) {
1012 this.scaleRoot = scaleRoot;
1013 this.parent = parent;
1014
1015 // Generate Pre-Set dropdown
1016 var protoScales = interfaceSpecs.getAllElementsByTagName('scaledefinitions')[0].getElementsByTagName("scale");
1017 this.preset.input.innerHTML = "";
1018
1019 for (var i = 0; i < protoScales.length; i++) {
1020 var selectOption = document.createElement("option");
1021 var scaleName = protoScales[i].getAttribute("name");
1022 selectOption.setAttribute("name", scaleName);
1023 selectOption.textContent = scaleName;
1024 this.preset.input.appendChild(selectOption);
1025 }
1026 this.content.appendChild(this.addMarker.root);
1027
1028 // Create Marker List
1029 this.buildMarkerList();
1030 }
1031 this.buildMarkerList = function () {
1032 var markerInject = document.getElementById("popup-option-holder");
1033 markerInject.innerHTML = "";
1034 this.markerNodes = [];
1035 for (var i = 0; i < this.scaleRoot.scales.length; i++) {
1036 var markerNode = new this.buildMarkerNode(this, this.scaleRoot.scales[i]);
1037 markerInject.appendChild(markerNode.root);
1038 this.markerNodes.push(markerNode);
1039
1040 }
1041 }
1042
1043 this.buildMarkerNode = function (parent, specification) {
1044 this.root = document.createElement("div");
1045 this.root.className = "popup-option-entry";
1046 this.positionInput = document.createElement("input");
1047 this.positionInput.min = 0;
1048 this.positionInput.max = 100;
1049 this.positionInput.value = specification.position;
1050 this.positionInput.setAttribute("name", "position");
1051 this.textInput = document.createElement("input");
1052 this.textInput.setAttribute("name", "text");
1053 this.textInput.style.width = "300px";
1054 this.textInput.value = specification.text;
1055 this.specification = specification;
1056 this.parent = parent;
1057 this.handleEvent = function (event) {
1058 switch (event.currentTarget.getAttribute("name")) {
1059 case "position":
1060 this.specification.position = Number(event.currentTarget.value);
1061 break;
1062 case "text":
1063 this.specification.text = event.currentTarget.value;
1064 break;
1065 }
1066 }
1067 this.positionInput.addEventListener("change", this, false);
1068 this.textInput.addEventListener("change", this, false);
1069
1070 var posText = document.createElement("span");
1071 posText.textContent = "Position: ";
1072 var textText = document.createElement("span");
1073 textText.textContent = "Text: ";
1074 this.root.appendChild(posText);
1075 this.root.appendChild(this.positionInput);
1076 this.root.appendChild(textText);
1077 this.root.appendChild(this.textInput);
1078
1079 this.deleteMarker = {
1080 root: document.createElement("button"),
1081 parent: this,
1082 handleEvent: function () {
1083 var index = this.parent.parent.scaleRoot.scales.findIndex(function (element, index, array) {
1084 if (element == this) {
1085 return true;
1086 } else {
1087 return false;
1088 }
1089 }, this.parent.specification)
1090 if (index >= 0) {
1091 this.parent.parent.scaleRoot.scales.splice(index, 1);
1092 }
1093 document.getElementById("popup-option-holder").removeChild(this.parent.root);
1094 }
1095 }
1096 this.deleteMarker.root.addEventListener("click", this.deleteMarker);
1097 this.deleteMarker.root.textContent = "Delete Marker"
1098 this.root.appendChild(this.deleteMarker.root);
1099 }
1100 } 110 }
1101 } 111 }
1102 } 112 $s.schema = undefined;
113 $s.attributes = [];
114 $s.model = specification;
1103 115
1104 function SpecificationToHTML() { 116 $s.$watch("globalSchema", initialise);
1105 // This takes the specification node and converts it to an on-page HTML object 117 }]);
1106 // Each Specification Node is given its own JS object which listens to the XSD for instant verification
1107 // Once generated, it directly binds into the specification object to update with changes
1108 // Fixed DOM entries
1109 this.injectDOM;
1110 this.setupDOM;
1111 this.pages = [];
1112
1113 // Self-contained generators
1114 this.createGeneralNodeDOM = function (name, id, parent) {
1115 this.type = name;
1116 var root = document.createElement('div');
1117 root.id = id;
1118 root.className = "node";
1119
1120 var titleDiv = document.createElement('div');
1121 titleDiv.className = "node-title";
1122 var title = document.createElement('span');
1123 title.className = "node-title";
1124 title.textContent = name;
1125 titleDiv.appendChild(title);
1126
1127 var attributeDiv = document.createElement('div');
1128 attributeDiv.className = "node-attributes";
1129
1130 var childrenDiv = document.createElement('div');
1131 childrenDiv.className = "node-children";
1132
1133 var buttonsDiv = document.createElement('div');
1134 buttonsDiv.className = "node-buttons";
1135
1136 root.appendChild(titleDiv);
1137 root.appendChild(attributeDiv);
1138 root.appendChild(childrenDiv);
1139 root.appendChild(buttonsDiv);
1140
1141 var obj = {
1142 rootDOM: root,
1143 titleDOM: title,
1144 attributeDOM: attributeDiv,
1145 attributes: [],
1146 childrenDOM: childrenDiv,
1147 children: [],
1148 buttonDOM: buttonsDiv,
1149 parent: parent
1150 }
1151 return obj;
1152 }
1153
1154 this.convertAttributeToDOM = function (node, schema) {
1155 // This takes an attribute schema node and returns an object with the input node and any bindings
1156 if (schema.getAttribute('name') == undefined && schema.getAttribute('ref') != undefined) {
1157 schema = specification.schema.getAllElementsByName(schema.getAttribute('ref'))[0];
1158 }
1159 var obj = new function () {
1160 this.input;
1161 this.name;
1162 this.owner;
1163 this.holder;
1164
1165 this.name = schema.getAttribute('name');
1166 this.default = schema.getAttribute('default');
1167 this.dataType = schema.getAttribute('type');
1168 if (this.dataType == undefined) {
1169 if (schema.childElementCount > 0) {
1170 if (schema.firstElementChild.nodeName == "xs:simpleType") {
1171 this.dataType = schema.getAllElementsByTagName("xs:restriction")[0].getAttribute("base");
1172 }
1173 }
1174 }
1175 if (typeof this.dataType == "string") {
1176 this.dataType = this.dataType.substr(3);
1177 } else {
1178 this.dataType = "string";
1179 }
1180 var minVar = undefined;
1181 var maxVar = undefined;
1182 switch (this.dataType) {
1183 case "negativeInteger":
1184 maxVar = -1;
1185 break;
1186 case "positiveInteger":
1187 minVar = 1;
1188 break;
1189 case "nonNegativeInteger":
1190 minVar = 0;
1191 break;
1192 case "nonPositiveInteger":
1193 maxVar = 0;
1194 break;
1195 case "byte":
1196 minVar = 0;
1197 maxVar = 256;
1198 break;
1199 case "short":
1200 minVar = 0;
1201 maxVar = 65536;
1202 break;
1203 default:
1204 break;
1205 }
1206
1207 this.enumeration = schema.getAllElementsByTagName("xs:enumeration");
1208 if (this.enumeration.length == 0) {
1209 this.input = document.createElement('input');
1210 switch (this.dataType) {
1211 case "boolean":
1212 this.input.type = "checkbox";
1213 break;
1214 case "negativeInteger":
1215 case "positiveInteger":
1216 case "nonNegativeInteger":
1217 case "nonPositiveInteger":
1218 case "integer":
1219 case "short":
1220 case "byte":
1221 this.input.step = 1;
1222 case "decimal":
1223 this.input.type = "number";
1224 this.input.min = minVar;
1225 this.input.max = maxVar;
1226 break;
1227 default:
1228 break;
1229 }
1230 } else {
1231 this.input = document.createElement("select");
1232 for (var i = 0; i < this.enumeration.length; i++) {
1233 var option = document.createElement("option");
1234 var value = this.enumeration[i].getAttribute("value");
1235 option.setAttribute("value", value);
1236 option.textContent = value;
1237 this.input.appendChild(option);
1238 }
1239 }
1240 var value;
1241 eval("value = node." + this.name)
1242 if (this.default != undefined && value == undefined) {
1243 value = this.default;
1244 }
1245 if (this.input.type == "checkbox") {
1246 if (value == "true" || value == "True") {
1247 this.input.checked = false;
1248 } else {
1249 this.input.checked = false;
1250 }
1251 } else {
1252 this.input.value = value;
1253 }
1254 this.handleEvent = function (event) {
1255 var value;
1256 if (this.input.nodeName == "INPUT") {
1257 switch (this.input.type) {
1258 case "checkbox":
1259 value = event.currentTarget.checked;
1260 break;
1261 case "number":
1262 if (event.currentTarget.value != "") {
1263 value = Number(event.currentTarget.value);
1264 } else {
1265 value = undefined;
1266 }
1267 break;
1268 default:
1269 if (event.currentTarget.value != "") {
1270 value = event.currentTarget.value;
1271 } else {
1272 value = undefined;
1273 }
1274 break;
1275 }
1276 } else if (this.input.nodeName == "SELECT") {
1277 value = event.currentTarget.value;
1278 }
1279 eval("this.owner." + this.name + " = value");
1280 }
1281 this.holder = document.createElement('div');
1282 this.holder.className = "attribute";
1283 this.holder.setAttribute('name', this.name);
1284 var text = document.createElement('span');
1285 eval("text.textContent = attributeText." + this.name + "+': '");
1286 this.holder.appendChild(text);
1287 this.holder.appendChild(this.input);
1288 this.owner = node;
1289 this.input.addEventListener("change", this, false);
1290 }
1291 if (obj.attribute != null) {
1292 obj.input.value = obj.attribute;
1293 }
1294 return obj;
1295 }
1296
1297 this.convert = function (root) {
1298 //Performs the actual conversion using the given root DOM as the root
1299 this.injectDOM = root;
1300
1301 // Build the export button
1302 var exportButton = document.createElement("button");
1303 exportButton.textContent = "Export to XML";
1304 exportButton.onclick = function () {
1305 var doc = specification.encode();
1306 var obj = {};
1307 obj.title = "Export";
1308 obj.content = document.createElement("div");
1309 obj.content.id = "finish";
1310 var span = document.createElement("span");
1311 span.textContent = "Your XML document is linked below. On most browsers, simply right click on the link and select 'Save As'. Or clicking on the link may download the file directly."
1312 obj.content.appendChild(span);
1313 span = document.createElement("p");
1314 span.textContent = "NOTE FOR SAFARI! You cannot right click on the below link and save it as a file, Safari does not like that at all. Instead click on it to open the XML, the Press Cmd+S to open the save dialogue. Make sure you have 'save as Page Source' selected on the bottom of the window. Currently Safari has no plans to support the HTML 'download' attribute which causes this problem";
1315 obj.content.appendChild(span);
1316 var link = document.createElement("div");
1317 link.appendChild(doc.firstChild);
1318 var file = [link.innerHTML];
1319 var bb = new Blob(file, {
1320 type: 'application/xml'
1321 });
1322 var dnlk = window.URL.createObjectURL(bb);
1323 var a = document.createElement("a");
1324 a.hidden = '';
1325 a.href = dnlk;
1326 a.download = "project-specification.xml";
1327 a.textContent = "Save File";
1328 obj.content.appendChild(a);
1329 popupObject.show();
1330 popupObject.postNode(obj);
1331 }
1332 this.injectDOM.appendChild(exportButton);
1333
1334 // First perform the setupNode;
1335 var setupSchema = specification.schema.getAllElementsByName('setup')[0];
1336 this.setupDOM = new this.createGeneralNodeDOM('Global Configuration', 'setup', null);
1337 this.injectDOM.appendChild(this.setupDOM.rootDOM);
1338 var setupAttributes = setupSchema.getAllElementsByTagName('xs:attribute');
1339 for (var i = 0; i < setupAttributes.length; i++) {
1340 var attributeName = setupAttributes[i].getAttribute('name');
1341 var attrObject = this.convertAttributeToDOM(specification, setupAttributes[i]);
1342 this.setupDOM.attributeDOM.appendChild(attrObject.holder);
1343 this.setupDOM.attributes.push(attrObject);
1344 }
1345
1346 // Build the exit Text node
1347 var exitText = new this.createGeneralNodeDOM("Exit Text", "exit-test", this.setupDOM);
1348 exitText.rootDOM.removeChild(exitText.attributeDOM);
1349 this.setupDOM.children.push(exitText);
1350 this.setupDOM.childrenDOM.appendChild(exitText.rootDOM);
1351 var obj = {
1352 rootDOM: document.createElement("div"),
1353 labelDOM: document.createElement("label"),
1354 inputDOM: document.createElement("textarea"),
1355 parent: exitText,
1356 specification: specification,
1357 handleEvent: function (event) {
1358 this.specification.exitText = this.inputDOM.value;
1359 }
1360 }
1361 var exitWarning = document.createElement("div");
1362 obj.rootDOM.appendChild(exitWarning);
1363 exitWarning.textContent = "Only visible when the above 'On complete redirect URL' field is empty.";
1364 obj.rootDOM.appendChild(obj.labelDOM);
1365 obj.rootDOM.appendChild(obj.inputDOM);
1366 obj.labelDOM.textContent = "Text: ";
1367 obj.inputDOM.value = obj.specification.exitText;
1368 obj.inputDOM.addEventListener("change", obj);
1369 exitText.children.push(obj);
1370 exitText.childrenDOM.appendChild(obj.rootDOM);
1371
1372 // Now we must build the interface Node
1373 this.interfaceDOM = new this.interfaceNode(this, specification.interfaces);
1374 this.interfaceDOM.build("Interface", "setup-interface", this.setupDOM.rootDOM);
1375
1376 // Now build the Metrics selection node
1377 var metric = this.createGeneralNodeDOM("Session Metrics", "setup-metric", this.setupDOM);
1378 metric.rootDOM.removeChild(metric.attributeDOM);
1379 this.setupDOM.children.push(metric);
1380 this.setupDOM.childrenDOM.appendChild(metric.rootDOM);
1381 var interfaceName = popupStateNodes.state[1].select.value;
1382 var checkText = interfaceSpecs.getElementsByTagName("global")[0].getAllElementsByTagName("metrics")[0];
1383 var testXML = interfaceSpecs.getElementsByTagName("tests")[0].getAllElementsByName(interfaceName)[0];
1384 var interfaceXML = interfaceSpecs.getAllElementsByTagName("interfaces")[0].getAllElementsByName(testXML.getAttribute("interface"))[0].getAllElementsByTagName("metrics")[0];
1385 testXML = testXML.getAllElementsByTagName("metrics");
1386 var interfaceXMLChild = interfaceXML.firstElementChild;
1387 while (interfaceXMLChild) {
1388 var obj = {
1389 input: document.createElement('input'),
1390 root: document.createElement('div'),
1391 text: document.createElement('span'),
1392 specification: specification.metrics.enabled,
1393 name: interfaceXMLChild.getAttribute("name"),
1394 handleEvent: function () {
1395 for (var i = 0; i < this.specification.length; i++) {
1396 if (this.specification[i] == this.name) {
1397 var options = this.specification;
1398 if (this.input.checked == false) {
1399 if (i == options.length) {
1400 options = options.slice(0, i);
1401 } else {
1402 options = options.slice(0, i).concat(options.slice(i + 1));
1403 }
1404 } else {
1405 return;
1406 }
1407 this.specification = options;
1408 break;
1409 }
1410 }
1411 if (this.input.checked) {
1412 this.specification.push(this.name);
1413 }
1414 }
1415 };
1416 obj.root.className = "attribute";
1417 obj.input.type = "checkbox";
1418 obj.root.appendChild(obj.text);
1419 obj.root.appendChild(obj.input);
1420 obj.text.textContent = checkText.getAllElementsByName(interfaceXMLChild.getAttribute("name"))[0].textContent;
1421 metric.children.push(obj);
1422 metric.childrenDOM.appendChild(obj.root);
1423 for (var j = 0; j < specification.metrics.enabled.length; j++) {
1424 if (specification.metrics.enabled[j] == obj.name) {
1425 obj.input.checked = true;
1426 break;
1427 }
1428 }
1429 interfaceXMLChild = interfaceXMLChild.nextElementSibling;
1430 }
1431
1432 // Now both before and after surveys
1433 if (specification.preTest == undefined) {
1434 specification.preTest = new specification.surveyNode(specification);
1435 specification.preTest.location = "pre";
1436 }
1437 if (specification.postTest == undefined) {
1438 specification.postTest = new specification.surveyNode(specification);
1439 specification.postTest.location = "post";
1440 }
1441 var surveyBefore = new this.surveyNode(this, specification.preTest, "Pre");
1442 var surveyAfter = new this.surveyNode(this, specification.postTest, "Post");
1443 this.setupDOM.children.push(surveyBefore);
1444 this.setupDOM.children.push(surveyAfter);
1445 this.setupDOM.childrenDOM.appendChild(surveyBefore.rootDOM);
1446 this.setupDOM.childrenDOM.appendChild(surveyAfter.rootDOM);
1447
1448 // Add in the page creator button
1449 this.addPage = {
1450 root: document.createElement("button"),
1451 parent: this,
1452 handleEvent: function () {
1453 var pageObj = new specification.page(specification);
1454 specification.pages.push(pageObj);
1455 var newPage = new this.parent.pageNode(this.parent, pageObj);
1456 document.getElementById("page-holder").appendChild(newPage.rootDOM);
1457 this.parent.pages.push(newPage);
1458 }
1459 }
1460 this.addPage.root.textContent = "Add Page";
1461 this.addPage.root.id = "new-page-button";
1462 this.addPage.root.style.float = "left";
1463 this.addPage.root.addEventListener("click", this.addPage, false);
1464
1465 var pageHolder = document.createElement("div");
1466 pageHolder.id = "page-holder";
1467 this.injectDOM.appendChild(pageHolder);
1468
1469 // Build each page
1470 for (var page of specification.pages) {
1471 var newPage = new this.pageNode(this, page);
1472 pageHolder.appendChild(newPage.rootDOM);
1473 this.pages.push(newPage);
1474 }
1475
1476 this.injectDOM.appendChild(this.addPage.root);
1477 }
1478
1479 this.interfaceNode = function (parent, rootObject) {
1480 this.type = "interfaceNode";
1481 this.rootDOM;
1482 this.titleDOM;
1483 this.attributeDOM;
1484 this.attributes = [];
1485 this.childrenDOM;
1486 this.children = [];
1487 this.buttonDOM;
1488 this.parent = parent;
1489 this.HTMLPoint;
1490 this.specification = rootObject;
1491 this.schema = specification.schema.getAllElementsByName("interface")[1];
1492
1493 this.createIOasAttr = function (name, specification, parent, type) {
1494 this.root = document.createElement('div');
1495 this.input = document.createElement("input");
1496 this.name = name;
1497 this.type = type;
1498 this.parent = parent;
1499 this.specification = specification;
1500 this.handleEvent = function (event) {
1501 for (var i = 0; i < this.specification.options.length; i++) {
1502 if (this.specification.options[i].name == this.name) {
1503 var options = this.specification.options;
1504 if (this.input.checked == false) {
1505 if (i == options.length) {
1506 options = options.slice(0, i);
1507 } else {
1508 options = options.slice(0, i).concat(options.slice(i + 1));
1509 }
1510 } else {
1511 return;
1512 }
1513 this.specification.options = options;
1514 break;
1515 }
1516 }
1517 if (this.input.checked) {
1518 var obj = {
1519 name: this.name,
1520 type: this.type
1521 };
1522 this.specification.options.push(obj);
1523 }
1524 if (this.parent.HTMLPoint.id == "setup") {
1525 // We've changed a global setting, must update all child 'interfaces' and disable them
1526 for (pages of convert.pages) {
1527 for (interface of pages.interfaces) {
1528 if (this.type == "check") {
1529 for (node of interface.children[0].attributes) {
1530 if (node.name == this.name) {
1531 if (this.input.checked) {
1532 node.input.disabled = true;
1533 node.input.checked = false;
1534 } else {
1535 node.input.disabled = false;
1536 }
1537 break;
1538 }
1539 }
1540 } else if (this.type == "show") {
1541 for (node of interface.children[1].attributes) {
1542 if (node.name == this.name) {
1543 if (this.input.checked) {
1544 node.input.disabled = true;
1545 } else {
1546 node.input.disabled = false;
1547 }
1548 break;
1549 }
1550 }
1551 }
1552 }
1553 }
1554 }
1555 };
1556 this.findIndex = function (element, index, array) {
1557 if (element.name == this.name)
1558 return true;
1559 else
1560 return false;
1561 };
1562 this.findNode = function (element, index, array) {
1563 if (element.name == this.name)
1564 return true;
1565 else
1566 return false;
1567 };
1568 this.input.type = "checkbox";
1569 this.input.setAttribute("name", name);
1570 this.input.addEventListener("change", this, false);
1571 this.root.appendChild(this.input);
1572 this.root.className = "attribute";
1573 return this;
1574 }
1575
1576 this.build = function (name, id, parent) {
1577 var obj = this.parent.createGeneralNodeDOM(name, id, parent);
1578
1579 this.rootDOM = obj.rootDOM;
1580 this.titleDOM = obj.titleDOM;
1581 this.attributeDOM = obj.attributeDOM;
1582 this.childrenDOM = obj.childrenDOM;
1583 this.buttonDOM = obj.buttonsDOM;
1584 this.HTMLPoint = parent;
1585 this.rootDOM.removeChild(this.attributeDOM);
1586 if (parent.id != "setup") {
1587 // Put in the <title> node:
1588 this.titleNode = {
1589 root: document.createElement("div"),
1590 label: document.createElement("span"),
1591 input: document.createElement("input"),
1592 parent: this,
1593 handleEvent: function (event) {
1594 this.parent.specification.title = event.currentTarget.value;
1595 }
1596 }
1597 this.titleNode.label.textContent = "Presented Axis Title:";
1598 this.titleNode.root.className = "node-children";
1599 this.titleNode.root.appendChild(this.titleNode.label);
1600 this.titleNode.root.appendChild(this.titleNode.input);
1601 this.titleNode.input.addEventListener("change", this.titleNode, false);
1602 this.titleNode.input.value = this.specification.title;
1603 this.children.push(this.titleNode);
1604 this.childrenDOM.appendChild(this.titleNode.root);
1605 // Set the interface-name attribute
1606 this.axisName = {
1607 root: document.createElement("div"),
1608 label: document.createElement("span"),
1609 input: document.createElement("input"),
1610 parent: this,
1611 handleEvent: function (event) {
1612 this.parent.specification.name = event.currentTarget.value;
1613 }
1614 }
1615 this.axisName.label.textContent = "Saved Axis Name (no spaces):";
1616 this.axisName.root.className = "node-children";
1617 this.axisName.root.appendChild(this.axisName.label);
1618 this.axisName.root.appendChild(this.axisName.input);
1619 this.axisName.input.addEventListener("change", this.axisName, false);
1620 this.axisName.input.value = this.specification.name;
1621 this.children.push(this.axisName);
1622 this.childrenDOM.appendChild(this.axisName.root);
1623 }
1624
1625 // Put in the check / show options as individual children
1626 var checks = this.parent.createGeneralNodeDOM("Checks", "setup-interface-checks", this);
1627
1628 var interfaceName = popupStateNodes.state[1].select.value;
1629 var checkText = interfaceSpecs.getElementsByTagName("global")[0].getAllElementsByTagName("checks")[0];
1630 var testXML = interfaceSpecs.getElementsByTagName("tests")[0].getAllElementsByName(interfaceName)[0];
1631 var interfaceXML = interfaceSpecs.getAllElementsByTagName("interfaces")[0].getAllElementsByName(testXML.getAttribute("interface"))[0].getAllElementsByTagName("checks")[0];
1632 testXML = testXML.getAllElementsByTagName("checks");
1633 var interfaceXMLChild = interfaceXML.firstElementChild;
1634 while (interfaceXMLChild) {
1635 var obj = new this.createIOasAttr(interfaceXMLChild.getAttribute("name"), this.specification, this, "check");
1636 for (var option of this.specification.options) {
1637 if (option.name == obj.name) {
1638 obj.input.checked = true;
1639 break;
1640 }
1641 }
1642 if (parent.id != "setup") {
1643 var node = convert.interfaceDOM.children[0].attributes.find(obj.findNode, obj);
1644 if (node != undefined) {
1645 if (node.input.checked) {
1646 obj.input.checked = false;
1647 obj.input.disabled = true;
1648 }
1649 }
1650 }
1651 var text = document.createElement('span');
1652 text.textContent = checkText.getAllElementsByName(interfaceXMLChild.getAttribute("name"))[0].textContent;
1653 obj.root.appendChild(text);
1654 checks.attributeDOM.appendChild(obj.root);
1655 checks.attributes.push(obj);
1656 interfaceXMLChild = interfaceXMLChild.nextElementSibling;
1657 }
1658 this.children.push(checks);
1659 this.childrenDOM.appendChild(checks.rootDOM);
1660
1661 var show = this.parent.createGeneralNodeDOM("Show", "setup-interface-show", this);
1662 interfaceName = popupStateNodes.state[1].select.value;
1663 checkText = interfaceSpecs.getElementsByTagName("global")[0].getAllElementsByTagName("show")[0];
1664 testXML = interfaceSpecs.getElementsByTagName("tests")[0].getAllElementsByName(interfaceName)[0];
1665 interfaceXML = interfaceSpecs.getAllElementsByTagName("interfaces")[0].getAllElementsByName(testXML.getAttribute("interface"))[0].getAllElementsByTagName("show")[0];
1666 testXML = testXML.getAllElementsByTagName("show");
1667 interfaceXMLChild = interfaceXML.firstElementChild;
1668 while (interfaceXMLChild) {
1669 var obj = new this.createIOasAttr(interfaceXMLChild.getAttribute("name"), this.specification, this, "show");
1670 for (var option of this.specification.options) {
1671 if (option.name == obj.name) {
1672 obj.input.checked = true;
1673 break;
1674 }
1675 }
1676 if (parent.id != "setup") {
1677 var node = convert.interfaceDOM.children[0].attributes.find(obj.findNode, obj);
1678 if (node != undefined) {
1679 if (node.input.checked) {
1680 obj.input.checked = false;
1681 obj.input.disabled = true;
1682 }
1683 }
1684 }
1685 var text = document.createElement('span');
1686 text.textContent = checkText.getAllElementsByName(interfaceXMLChild.getAttribute("name"))[0].textContent;
1687 obj.root.appendChild(text);
1688 show.attributeDOM.appendChild(obj.root);
1689 show.attributes.push(obj);
1690 interfaceXMLChild = interfaceXMLChild.nextElementSibling;
1691 }
1692 this.children.push(show);
1693 this.childrenDOM.appendChild(show.rootDOM);
1694
1695 if (parent.id == "setup") {} else {
1696 var nameAttr = this.parent.convertAttributeToDOM(this, specification.schema.getAllElementsByName("name")[0]);
1697 this.attributeDOM.appendChild(nameAttr.holder);
1698 this.attributes.push(nameAttr);
1699 var scales = new this.scalesNode(this, this.specification);
1700 this.children.push(scales);
1701 this.childrenDOM.appendChild(scales.rootDOM);
1702 }
1703 if (parent != undefined) {
1704 parent.appendChild(this.rootDOM);
1705 }
1706 }
1707
1708 this.scalesNode = function (parent, rootObject) {
1709 this.type = "scalesNode";
1710 this.rootDOM = document.createElement("div");
1711 this.titleDOM = document.createElement("span");
1712 this.attributeDOM = document.createElement("div");
1713 this.attributes = [];
1714 this.childrenDOM = document.createElement("div");
1715 this.children = [];
1716 this.buttonDOM = document.createElement("div");
1717 this.parent = parent;
1718 this.specification = rootObject;
1719 this.schema = specification.schema.getAllElementsByName("page")[0];
1720 this.rootDOM.className = "node";
1721
1722 var titleDiv = document.createElement('div');
1723 titleDiv.className = "node-title";
1724 this.titleDOM.className = "node-title";
1725 this.titleDOM.textContent = "Interface Scales";
1726 titleDiv.appendChild(this.titleDOM);
1727
1728 this.attributeDOM.className = "node-attributes";
1729 this.childrenDOM.className = "node-children";
1730 this.buttonDOM.className = "node-buttons";
1731
1732 this.rootDOM.appendChild(titleDiv);
1733 this.rootDOM.appendChild(this.attributeDOM);
1734 this.rootDOM.appendChild(this.childrenDOM);
1735 this.rootDOM.appendChild(this.buttonDOM);
1736
1737 this.editButton = {
1738 button: document.createElement("button"),
1739 parent: this,
1740 handleEvent: function (event) {
1741 popupObject.show();
1742 popupObject.postNode(popupStateNodes.state[6]);
1743 popupStateNodes.state[6].generate(this.parent.specification, this.parent);
1744 }
1745 };
1746 this.editButton.button.textContent = "Edit Scales/Markers";
1747 this.editButton.button.addEventListener("click", this.editButton, false);
1748 this.buttonDOM.appendChild(this.editButton.button);
1749 }
1750 }
1751
1752 this.surveyNode = function (parent, rootObject, location) {
1753 this.type = "surveyNode";
1754 this.rootDOM = document.createElement("div");
1755 this.titleDOM = document.createElement("span");
1756 this.attributeDOM = document.createElement("div");
1757 this.attributes = [];
1758 this.childrenDOM = document.createElement("div");
1759 this.children = [];
1760 this.buttonDOM = document.createElement("div");
1761 this.parent = parent;
1762 this.specification = rootObject;
1763 this.schema = specification.schema.getAllElementsByName("survey")[1];
1764 this.rootDOM.className = "node";
1765
1766 var titleDiv = document.createElement('div');
1767 titleDiv.className = "node-title";
1768 this.titleDOM.className = "node-title";
1769 this.titleDOM.textContent = "Survey";
1770 titleDiv.appendChild(this.titleDOM);
1771
1772 this.attributeDOM.className = "node-attributes";
1773 var locationAttr = document.createElement("span");
1774 this.attributeDOM.appendChild(locationAttr);
1775 if (location == "Pre" || location == "pre") {
1776 locationAttr.textContent = "Location: Before";
1777 } else {
1778 locationAttr.textContent = "Location: After";
1779 }
1780 this.childrenDOM.className = "node-children";
1781 this.buttonDOM.className = "node-buttons";
1782
1783 this.rootDOM.appendChild(titleDiv);
1784 this.rootDOM.appendChild(this.attributeDOM);
1785 this.rootDOM.appendChild(this.childrenDOM);
1786 this.rootDOM.appendChild(this.buttonDOM);
1787
1788 this.surveyEntryNode = function (parent, rootObject) {
1789 this.type = "surveyEntryNode";
1790 this.rootDOM = document.createElement("div");
1791 this.titleDOM = document.createElement("span");
1792 this.attributeDOM = document.createElement("div");
1793 this.attributes = [];
1794 this.childrenDOM = document.createElement("div");
1795 this.children = [];
1796 this.buttonDOM = document.createElement("div");
1797 this.parent = parent;
1798 this.specification = rootObject;
1799 this.schema = specification.schema.getAllElementsByName("surveyentry")[1];
1800
1801 this.rootDOM.className = "node";
1802 this.rootDOM.style.minWidth = "50%";
1803
1804 var titleDiv = document.createElement('div');
1805 titleDiv.className = "node-title";
1806 this.titleDOM.className = "node-title";
1807 titleDiv.appendChild(this.titleDOM);
1808
1809 this.attributeDOM.className = "node-attributes";
1810 this.childrenDOM.className = "node-children";
1811 this.buttonDOM.className = "node-buttons";
1812
1813 this.rootDOM.appendChild(titleDiv);
1814 this.rootDOM.appendChild(this.attributeDOM);
1815 this.rootDOM.appendChild(this.childrenDOM);
1816 this.rootDOM.appendChild(this.buttonDOM);
1817
1818 this.build = function () {
1819 this.attributeDOM.innerHTML = null;
1820 this.childrenDOM.innerHTML = null;
1821 var statementRoot = document.createElement("div");
1822 var statement = document.createElement("span");
1823 statement.textContent = "Statement / Question: " + this.specification.statement;
1824 statementRoot.appendChild(statement);
1825 this.children.push(statementRoot);
1826 this.childrenDOM.appendChild(statementRoot);
1827 switch (this.specification.type) {
1828 case "statement":
1829 this.titleDOM.textContent = "Statement";
1830 break;
1831 case "question":
1832 this.titleDOM.textContent = "Question";
1833 var id = convert.convertAttributeToDOM(this.specification, specification.schema.getAllElementsByName("id")[0]);
1834 var mandatory = convert.convertAttributeToDOM(this.specification, specification.schema.getAllElementsByName("mandatory")[0]);
1835 var boxsize = convert.convertAttributeToDOM(this.specification, specification.schema.getAllElementsByName("boxsize")[0]);
1836 this.attributeDOM.appendChild(id.holder);
1837 this.attributes.push(id);
1838 this.attributeDOM.appendChild(mandatory.holder);
1839 this.attributes.push(mandatory);
1840 this.attributeDOM.appendChild(boxsize.holder);
1841 this.attributes.push(boxsize);
1842 break;
1843 case "number":
1844 this.titleDOM.textContent = "Number";
1845 var id = convert.convertAttributeToDOM(this.specification, specification.schema.getAllElementsByName("id")[0]);
1846 var mandatory = convert.convertAttributeToDOM(this.specification, specification.schema.getAllElementsByName("mandatory")[0]);
1847 var min = convert.convertAttributeToDOM(this.specification, specification.schema.getAllElementsByName("min")[0]);
1848 var max = convert.convertAttributeToDOM(this.specification, specification.schema.getAllElementsByName("max")[0]);
1849 this.attributeDOM.appendChild(id.holder);
1850 this.attributes.push(id);
1851 this.attributeDOM.appendChild(min.holder);
1852 this.attributes.push(min);
1853 this.attributeDOM.appendChild(max.holder);
1854 this.attributes.push(max);
1855 break;
1856 case "checkbox":
1857 this.titleDOM.textContent = "Checkbox";
1858 var id = convert.convertAttributeToDOM(this.specification, specification.schema.getAllElementsByName("id")[0]);
1859 this.attributeDOM.appendChild(id.holder);
1860 this.attributes.push(id);
1861 break;
1862 case "radio":
1863 this.titleDOM.textContent = "Radio";
1864 var id = convert.convertAttributeToDOM(this.specification, specification.schema.getAllElementsByName("id")[0]);
1865 this.attributeDOM.appendChild(id.holder);
1866 this.attributes.push(id);
1867 break;
1868 }
1869 }
1870 this.build();
1871
1872 this.editNode = {
1873 root: document.createElement("button"),
1874 parent: this,
1875 handleEvent: function () {
1876 popupObject.show();
1877 popupStateNodes.state[5].generate(this.parent.specification, this.parent);
1878 popupObject.postNode(popupStateNodes.state[5]);
1879 }
1880 }
1881 this.editNode.root.textContent = "Edit Entry";
1882 this.editNode.root.addEventListener("click", this.editNode, false);
1883 this.buttonDOM.appendChild(this.editNode.root);
1884
1885 this.deleteNode = {
1886 root: document.createElement("button"),
1887 parent: this,
1888 handleEvent: function () {
1889 var optionList = this.parent.parent.specification.options;
1890 var childList = this.parent.parent.children;
1891 for (var i = 0; i < this.parent.parent.specification.options.length; i++) {
1892 var option = this.parent.parent.specification.options[i];
1893 if (option == this.parent.specification) {
1894 this.parent.parent.childrenDOM.removeChild(this.parent.rootDOM);
1895 if (i == this.parent.parent.specification.options.length - 1) {
1896 optionList = optionList.slice(0, i);
1897 childList = childList.slice(0, i);
1898 } else {
1899 optionList = optionList.slice(0, i).concat(optionList.slice(i + 1));
1900 childList = childList.slice(0, i).concat(childList.slice(i + 1));
1901 }
1902 this.parent.parent.specification.options = optionList;
1903 this.parent.parent.children = childList;
1904 }
1905 }
1906 }
1907 }
1908 this.deleteNode.root.textContent = "Delete Entry";
1909 this.deleteNode.root.addEventListener("click", this.deleteNode, false);
1910 this.buttonDOM.appendChild(this.deleteNode.root);
1911
1912 this.moveToPosition = function (new_index) {
1913 new_index = Math.min(new_index, this.parent.children.length);
1914 var curr_index = this.parent.children.findIndex(function (elem) {
1915 if (elem == this) {
1916 return true;
1917 } else {
1918 return false;
1919 }
1920 }, this);
1921 // Split at the current location to remove the node and shift all the children up
1922 var tail = this.parent.children.splice(curr_index + 1);
1923 this.parent.children.pop();
1924 this.parent.children = this.parent.children.concat(tail);
1925
1926 //Split at the new location and insert the node
1927 tail = this.parent.children.splice(new_index);
1928 this.parent.children.push(this);
1929 this.parent.children = this.parent.children.concat(tail);
1930
1931 // Re-build the specification
1932 this.parent.specification.options = [];
1933 this.parent.childrenDOM.innerHTML = "";
1934 for (var obj of this.parent.children) {
1935 this.parent.specification.options.push(obj.specification);
1936 this.parent.childrenDOM.appendChild(obj.rootDOM);
1937 }
1938 this.parent.children.forEach(function (obj, index) {
1939 obj.moveButtons.disable(index);
1940 });
1941 }
1942
1943 this.moveButtons = {
1944 root_up: document.createElement("button"),
1945 root_down: document.createElement("button"),
1946 parent: this,
1947 handleEvent: function (event) {
1948 var index = this.parent.parent.children.indexOf(this.parent);
1949 if (event.currentTarget.getAttribute("direction") == "up") {
1950 index = Math.max(index - 1, 0);
1951 } else if (event.currentTarget.getAttribute("direction") == "down") {
1952 index = Math.min(index + 1, this.parent.parent.children.length - 1);
1953 }
1954 this.parent.moveToPosition(index);
1955 this.disable(index);
1956 },
1957 disable: function (index) {
1958 if (index == 0) {
1959 this.root_up.disabled = true;
1960 } else {
1961 this.root_up.disabled = false;
1962 }
1963 if (index == this.parent.parent.children.length - 1) {
1964 this.root_down.disabled = true;
1965 } else {
1966 this.root_down.disabled = false;
1967 }
1968 }
1969 }
1970 this.moveButtons.root_up.setAttribute("direction", "up");
1971 this.moveButtons.root_down.setAttribute("direction", "down");
1972 this.moveButtons.root_up.addEventListener("click", this.moveButtons, false);
1973 this.moveButtons.root_down.addEventListener("click", this.moveButtons, false);
1974 this.moveButtons.root_up.textContent = "Move Up";
1975 this.moveButtons.root_down.textContent = "Move Down";
1976 this.buttonDOM.appendChild(this.moveButtons.root_up);
1977 this.buttonDOM.appendChild(this.moveButtons.root_down);
1978 }
1979 this.addNode = {
1980 root: document.createElement("button"),
1981 parent: this,
1982 handleEvent: function () {
1983 var newNode = new this.parent.specification.OptionNode(this.parent.specification);
1984 this.parent.specification.options.push(newNode);
1985 popupObject.show();
1986 popupStateNodes.state[5].generate(newNode, this.parent);
1987 popupObject.postNode(popupStateNodes.state[5]);
1988 }
1989 }
1990 this.addNode.root.textContent = "Add Survey Entry";
1991 this.addNode.root.addEventListener("click", this.addNode, false);
1992 this.buttonDOM.appendChild(this.addNode.root);
1993
1994 for (var option of this.specification.options) {
1995 var newNode = new this.surveyEntryNode(this, option);
1996 this.children.push(newNode);
1997 this.childrenDOM.appendChild(newNode.rootDOM);
1998 }
1999
2000 this.children.forEach(function (obj, index) {
2001 obj.moveButtons.disable(index);
2002 });
2003 }
2004
2005 this.pageNode = function (parent, rootObject) {
2006 this.type = "pageNode";
2007 this.rootDOM = document.createElement("div");
2008 this.titleDOM = document.createElement("span");
2009 this.attributeDOM = document.createElement("div");
2010 this.attributes = [];
2011 this.childrenDOM = document.createElement("div");
2012 this.children = [];
2013 this.buttonDOM = document.createElement("div");
2014 this.parent = parent;
2015 this.specification = rootObject;
2016 this.schema = specification.schema.getAllElementsByName("page")[0];
2017 this.rootDOM.className = "node";
2018
2019 var titleDiv = document.createElement('div');
2020 titleDiv.className = "node-title";
2021 this.titleDOM.className = "node-title";
2022 this.titleDOM.textContent = "Test Page";
2023 titleDiv.appendChild(this.titleDOM);
2024
2025 this.attributeDOM.className = "node-attributes";
2026 this.childrenDOM.className = "node-children";
2027 this.buttonDOM.className = "node-buttons";
2028
2029 this.rootDOM.appendChild(titleDiv);
2030 this.rootDOM.appendChild(this.attributeDOM);
2031 this.rootDOM.appendChild(this.childrenDOM);
2032 this.rootDOM.appendChild(this.buttonDOM);
2033
2034 // Do the comment prefix node
2035 var cpn = this.parent.createGeneralNodeDOM("Comment Prefix", "" + this.specification.id + "-commentprefix", this.parent);
2036 cpn.rootDOM.removeChild(cpn.attributeDOM);
2037 var obj = {
2038 root: document.createElement("div"),
2039 input: document.createElement("input"),
2040 parent: this,
2041 handleEvent: function () {
2042 this.parent.specification.commentBoxPrefix = event.currentTarget.value;
2043 }
2044 }
2045 cpn.children.push(obj);
2046 cpn.childrenDOM.appendChild(obj.root);
2047 obj.root.appendChild(obj.input);
2048 obj.input.addEventListener("change", obj, false);
2049 obj.input.value = this.specification.commentBoxPrefix;
2050 this.childrenDOM.appendChild(cpn.rootDOM);
2051 this.children.push(cpn);
2052
2053 // Now both before and after surveys
2054 if (this.specification.preTest == undefined) {
2055 this.specification.preTest = new specification.surveyNode(specification);
2056 this.specification.preTest.location = "pre";
2057 }
2058 if (this.specification.postTest == undefined) {
2059 this.specification.postTest = new specification.surveyNode(specification);
2060 this.specification.postTest.location = "post";
2061 }
2062 var surveyBefore = new this.parent.surveyNode(this, this.specification.preTest, "Pre");
2063 var surveyAfter = new this.parent.surveyNode(this, this.specification.postTest, "Post");
2064 this.children.push(surveyBefore);
2065 this.children.push(surveyAfter);
2066 this.childrenDOM.appendChild(surveyBefore.rootDOM);
2067 this.childrenDOM.appendChild(surveyAfter.rootDOM);
2068
2069 // Build the attributes
2070 var attributeList = this.schema.getAllElementsByTagName("xs:attribute");
2071 for (var i = 0; i < attributeList.length; i++) {
2072 var attributeName = attributeList[i].getAttribute('name');
2073 var attrObject = this.parent.convertAttributeToDOM(rootObject, attributeList[i]);
2074 this.attributeDOM.appendChild(attrObject.holder);
2075 this.attributes.push(attrObject);
2076 }
2077
2078 this.interfaces = [];
2079
2080 this.getAudioElements = function () {
2081 var array = [];
2082 for (var i = 0; i < this.children.length; i++) {
2083 if (this.children[i].type == "audioElementNode") {
2084 array[array.length] = this.children[i];
2085 }
2086 }
2087 return array;
2088 }
2089
2090 this.redrawChildren = function () {
2091 this.childrenDOM.innerHTML = "";
2092 for (var child of this.children) {
2093 this.childrenDOM.appendChild(child.rootDOM);
2094 }
2095 }
2096
2097 this.audioElementNode = function (parent, rootObject) {
2098 this.type = "audioElementNode";
2099 this.rootDOM = document.createElement("div");
2100 this.titleDOM = document.createElement("span");
2101 this.attributeDOM = document.createElement("div");
2102 this.attributes = [];
2103 this.childrenDOM = document.createElement("div");
2104 this.children = [];
2105 this.buttonDOM = document.createElement("div");
2106 this.parent = parent;
2107 this.specification = rootObject;
2108 this.schema = specification.schema.getAllElementsByName("audioelement")[0];
2109 this.rootDOM.className = "node";
2110
2111 var titleDiv = document.createElement('div');
2112 titleDiv.className = "node-title";
2113 this.titleDOM.className = "node-title";
2114 this.titleDOM.textContent = "Audio Element";
2115 titleDiv.appendChild(this.titleDOM);
2116
2117 this.attributeDOM.className = "node-attributes";
2118 this.childrenDOM.className = "node-children";
2119 this.buttonDOM.className = "node-buttons";
2120
2121 this.rootDOM.appendChild(titleDiv);
2122 this.rootDOM.appendChild(this.attributeDOM);
2123 this.rootDOM.appendChild(this.childrenDOM);
2124 this.rootDOM.appendChild(this.buttonDOM);
2125
2126 // Build the attributes
2127 var attributeList = this.schema.getAllElementsByTagName("xs:attribute");
2128 for (var i = 0; i < attributeList.length; i++) {
2129 var attributeName = attributeList[i].getAttribute('name');
2130 var attrObject = this.parent.parent.convertAttributeToDOM(rootObject, attributeList[i]);
2131 this.attributeDOM.appendChild(attrObject.holder);
2132 this.attributes.push(attrObject);
2133 }
2134
2135 this.deleteNode = {
2136 root: document.createElement("button"),
2137 parent: this,
2138 handleEvent: function () {
2139 var i = this.parent.parent.specification.audioElements.findIndex(this.findNode, this);
2140 if (i >= 0) {
2141 var aeList = this.parent.parent.specification.audioElements;
2142 if (i < aeList.length - 1) {
2143 aeList = aeList.slice(0, i).concat(aeList.slice(i + 1));
2144 } else {
2145 aeList = aeList.slice(0, i);
2146 }
2147 }
2148 i = this.parent.parent.children.findIndex(function (element, index, array) {
2149 if (element == this.parent)
2150 return true;
2151 else
2152 return false;
2153 }, this);
2154 if (i >= 0) {
2155 var childList = this.parent.children;
2156 if (i < aeList.length - 1) {
2157 childList = childList.slice(0, i).concat(childList.slice(i + 1));
2158 } else {
2159 childList = childList.slice(0, i);
2160 }
2161 this.parent.parent.childrenDOM.removeChild(this.parent.rootDOM);
2162 }
2163 },
2164 findNode: function (element, index, array) {
2165 if (element == this.parent.specification)
2166 return true;
2167 else
2168 return false;
2169 }
2170 }
2171 this.deleteNode.root.textContent = "Delete Entry";
2172 this.deleteNode.root.addEventListener("click", this.deleteNode, false);
2173 this.buttonDOM.appendChild(this.deleteNode.root);
2174
2175 this.moveButtons = {
2176 root_up: document.createElement("button"),
2177 root_down: document.createElement("button"),
2178 parent: this,
2179 handleEvent: function (event) {
2180 var index = this.parent.parent.getAudioElements().indexOf(this.parent);
2181 if (event.currentTarget.getAttribute("direction") == "up") {
2182 index = Math.max(index - 1, 0);
2183 } else if (event.currentTarget.getAttribute("direction") == "down") {
2184 index = Math.min(index + 1, this.parent.parent.getAudioElements().length - 1);
2185 }
2186 this.parent.moveToPosition(index);
2187 this.disable(index);
2188 },
2189 disable: function (index) {
2190 if (index == 0) {
2191 this.root_up.disabled = true;
2192 } else {
2193 this.root_up.disabled = false;
2194 }
2195 if (index == this.parent.parent.getAudioElements().length - 1) {
2196 this.root_down.disabled = true;
2197 } else {
2198 this.root_down.disabled = false;
2199 }
2200 }
2201 }
2202 this.moveButtons.root_up.setAttribute("direction", "up");
2203 this.moveButtons.root_down.setAttribute("direction", "down");
2204 this.moveButtons.root_up.addEventListener("click", this.moveButtons, false);
2205 this.moveButtons.root_down.addEventListener("click", this.moveButtons, false);
2206 this.moveButtons.root_up.textContent = "Move Up";
2207 this.moveButtons.root_down.textContent = "Move Down";
2208 this.buttonDOM.appendChild(this.moveButtons.root_up);
2209 this.buttonDOM.appendChild(this.moveButtons.root_down);
2210
2211 this.moveToPosition = function (new_index) {
2212
2213 // Get the zero-th Object
2214 var zero_object = this.parent.getAudioElements()[0];
2215 var parent_children_root_index = this.parent.children.indexOf(zero_object);
2216 // splice out the array for processing
2217 var process_array = this.parent.children.splice(parent_children_root_index);
2218
2219
2220 new_index = Math.min(new_index, process_array.length);
2221 var curr_index = process_array.findIndex(function (elem) {
2222 if (elem == this) {
2223 return true;
2224 } else {
2225 return false;
2226 }
2227 }, this);
2228
2229 // Split at the current location to remove the node and shift all the children up
2230 var tail = process_array.splice(curr_index + 1);
2231 process_array.pop();
2232 process_array = process_array.concat(tail);
2233
2234 //Split at the new location and insert the node
2235 tail = process_array.splice(new_index);
2236 process_array.push(this);
2237 process_array = process_array.concat(tail);
2238
2239 // Re-attach to the parent.children
2240 this.parent.children = this.parent.children.concat(process_array);
2241
2242 // Re-build the specification
2243 this.parent.specification.audioElements = [];
2244 for (var obj of process_array) {
2245 this.parent.specification.audioElements.push(obj.specification);
2246 }
2247 this.parent.redrawChildren();
2248
2249 process_array.forEach(function (obj, index) {
2250 obj.moveButtons.disable(index);
2251 });
2252
2253 }
2254 }
2255
2256 this.commentQuestionNode = function (parent, rootObject) {
2257 this.type = "commentQuestionNode";
2258 this.rootDOM = document.createElement("div");
2259 this.titleDOM = document.createElement("span");
2260 this.attributeDOM = document.createElement("div");
2261 this.attributes = [];
2262 this.childrenDOM = document.createElement("div");
2263 this.children = [];
2264 this.buttonDOM = document.createElement("div");
2265 this.parent = parent;
2266 this.specification = rootObject;
2267 this.schema = specification.schema.getAllElementsByName("page")[0];
2268 this.rootDOM.className = "node audio-element";
2269
2270 var titleDiv = document.createElement('div');
2271 titleDiv.className = "node-title";
2272 this.titleDOM.className = "node-title";
2273 this.titleDOM.textContent = "Test Page";
2274 titleDiv.appendChild(this.titleDOM);
2275
2276 this.attributeDOM.className = "node-attributes";
2277 this.childrenDOM.className = "node-children";
2278 this.buttonDOM.className = "node-buttons";
2279
2280 this.rootDOM.appendChild(titleDiv);
2281 this.rootDOM.appendChild(this.attributeDOM);
2282 this.rootDOM.appendChild(this.childrenDOM);
2283 this.rootDOM.appendChild(this.buttonDOM);
2284
2285 }
2286
2287 // Build the components
2288 if (this.specification.interfaces.length == 0) {
2289 this.specification.interfaces.push(new specification.interfaceNode(specification));
2290 }
2291 for (var interfaceObj of this.specification.interfaces) {
2292 var newInterface = new this.parent.interfaceNode(this.parent, interfaceObj);
2293 newInterface.build("Interface", "" + this.specification.id + "-interface", this.childrenDOM);
2294 this.children.push(newInterface);
2295 this.interfaces.push(newInterface);
2296 }
2297
2298 for (var elements of this.specification.audioElements) {
2299 var audioElementDOM = new this.audioElementNode(this, elements);
2300 this.children.push(audioElementDOM);
2301 this.childrenDOM.appendChild(audioElementDOM.rootDOM);
2302 }
2303
2304 this.getAudioElements().forEach(function (elem) {
2305 elem.moveButtons.disable();
2306 });
2307
2308 this.addInterface = {
2309 root: document.createElement("button"),
2310 parent: this,
2311 handleEvent: function () {
2312 var InterfaceObj = new specification.interfaceNode(specification);
2313 var newInterface = new this.parent.parent.interfaceNode(this.parent.parent, InterfaceObj);
2314 newInterface.build("Interface", "" + this.parent.specification.id + "-interface", this.parent.childrenDOM);
2315 this.parent.children.push(newInterface);
2316 this.parent.specification.interfaces.push(InterfaceObj);
2317 this.parent.interfaces.push(newInterface);
2318 }
2319 }
2320 this.addInterface.root.textContent = "Add Interface";
2321 this.addInterface.root.addEventListener("click", this.addInterface, false);
2322 this.buttonDOM.appendChild(this.addInterface.root);
2323
2324 this.addAudioElement = {
2325 root: document.createElement("button"),
2326 parent: this,
2327 handleEvent: function () {
2328 var audioElementObject = new this.parent.specification.audioElementNode(specification);
2329 var audioElementDOM = new this.parent.audioElementNode(this.parent, audioElementObject);
2330 this.parent.specification.audioElements.push(audioElementObject);
2331 this.parent.children.push(audioElementDOM);
2332 this.parent.childrenDOM.appendChild(audioElementDOM.rootDOM);
2333 }
2334 }
2335 this.addAudioElement.root.textContent = "Add Audio Element";
2336 this.addAudioElement.root.addEventListener("click", this.addAudioElement, false);
2337 this.buttonDOM.appendChild(this.addAudioElement.root);
2338 }
2339 }