n@501: var interfaceSpecs; n@501: var xmlHttp; n@501: var popupObject; n@501: var popupStateNodes; n@501: var specification; n@501: var convert; n@501: var attributeText; n@501: n@501: // Firefox does not have an XMLDocument.prototype.getElementsByName n@501: // and there is no searchAll style command, this custom function will n@501: // search all children recusrively for the name. Used for XSD where all n@501: // element nodes must have a name and therefore can pull the schema node n@501: XMLDocument.prototype.getAllElementsByName = function(name) n@501: { n@501: name = String(name); n@501: var selected = this.documentElement.getAllElementsByName(name); n@501: return selected; n@501: } n@501: n@501: Element.prototype.getAllElementsByName = function(name) n@501: { n@501: name = String(name); n@501: var selected = []; n@501: var node = this.firstElementChild; n@501: while(node != null) n@501: { n@501: if (node.getAttribute('name') == name) n@501: { n@501: selected.push(node); n@501: } n@501: if (node.childElementCount > 0) n@501: { n@501: selected = selected.concat(node.getAllElementsByName(name)); n@501: } n@501: node = node.nextElementSibling; n@501: } n@501: return selected; n@501: } n@501: n@501: XMLDocument.prototype.getAllElementsByTagName = function(name) n@501: { n@501: name = String(name); n@501: var selected = this.documentElement.getAllElementsByTagName(name); n@501: return selected; n@501: } n@501: n@501: Element.prototype.getAllElementsByTagName = function(name) n@501: { n@501: name = String(name); n@501: var selected = []; n@501: var node = this.firstElementChild; n@501: while(node != null) n@501: { n@501: if (node.nodeName == name) n@501: { n@501: selected.push(node); n@501: } n@501: if (node.childElementCount > 0) n@501: { n@501: selected = selected.concat(node.getAllElementsByTagName(name)); n@501: } n@501: node = node.nextElementSibling; n@501: } n@501: return selected; n@501: } n@501: n@501: // Firefox does not have an XMLDocument.prototype.getElementsByName n@501: if (typeof XMLDocument.prototype.getElementsByName != "function") { n@501: XMLDocument.prototype.getElementsByName = function(name) n@501: { n@501: name = String(name); n@501: var node = this.documentElement.firstElementChild; n@501: var selected = []; n@501: while(node != null) n@501: { n@501: if (node.getAttribute('name') == name) n@501: { n@501: selected.push(node); n@501: } n@501: node = node.nextElementSibling; n@501: } n@501: return selected; n@501: } n@501: } n@501: n@501: window.onload = function() n@501: { n@501: specification = new Specification(); n@501: convert = new SpecificationToHTML(); n@501: xmlHttp = new XMLHttpRequest(); n@501: xmlHttp.open("GET","./interface-specs.xml",true); n@501: xmlHttp.onload = function() n@501: { n@501: var parse = new DOMParser(); n@501: interfaceSpecs = parse.parseFromString(xmlHttp.response,'text/xml'); n@501: buildPage(); n@501: popupObject.postNode(popupStateNodes.state[0]) n@501: } n@501: xmlHttp.send(); n@501: n@501: var xsdGet = new XMLHttpRequest(); n@501: xsdGet.open("GET","../test-schema.xsd",true); n@501: xsdGet.onload = function() n@501: { n@501: var parse = new DOMParser(); n@501: specification.schema = parse.parseFromString(xsdGet.response,'text/xml');; n@501: } n@501: xsdGet.send(); n@501: n@501: var jsonAttribute = new XMLHttpRequest(); n@501: jsonAttribute.open("GET","./attributes.json",true); n@501: jsonAttribute.onload = function() n@501: { n@501: attributeText = JSON.parse(jsonAttribute.response) n@501: } n@501: jsonAttribute.send(); n@501: } n@501: n@501: function buildPage() n@501: { n@501: popupObject = new function() { n@501: this.object = document.getElementById("popupHolder"); n@501: this.blanket = document.getElementById("blanket"); n@501: n@501: this.popupTitle = document.createElement("div"); n@501: this.popupTitle.id = "popup-title-holder"; n@501: this.popupTitle.align = "center"; n@501: this.titleDOM = document.createElement("span"); n@501: this.titleDOM.id = "popup-title"; n@501: this.popupTitle.appendChild(this.titleDOM); n@501: this.object.appendChild(this.popupTitle); n@501: n@501: this.popupContent = document.createElement("div"); n@501: this.popupContent.id = "popup-content"; n@501: this.object.appendChild(this.popupContent); n@501: n@501: this.proceedButton = document.createElement("button"); n@501: this.proceedButton.id = "popup-proceed"; n@541: this.proceedButton.className = "popup-button"; n@501: this.proceedButton.textContent = "Next"; n@501: this.proceedButton.onclick = function() n@501: { n@501: popupObject.popupContent.innerHTML = null; n@543: if(typeof popupObject.shownObject.continue == "function") { n@543: popupObject.shownObject.continue(); n@543: } else { n@543: popupObject.hide(); n@543: } n@501: }; n@501: this.object.appendChild(this.proceedButton); n@501: n@541: this.backButton = document.createElement("button"); n@541: this.backButton.id = "popup-back"; n@541: this.backButton.className = "popup-button"; n@541: this.backButton.textContent = "Back"; n@541: this.backButton.onclick = function() n@541: { n@541: popupObject.popupContent.innerHTML = null; n@541: popupObject.shownObject.back(); n@541: }; n@541: this.object.appendChild(this.backButton); n@541: n@501: this.shownObject; n@501: n@501: this.resize = function() n@501: { n@501: var w = window.innerWidth; n@501: var h = window.innerHeight; n@501: this.object.style.left = Math.floor((w-750)/2) + 'px'; n@501: this.object.style.top = Math.floor((h-500)/2) + 'px'; n@501: } n@501: n@501: this.show = function() n@501: { n@501: this.object.style.visibility = "visible"; n@501: this.blanket.style.visibility = "visible"; n@541: if (typeof this.shownObject.back == "function") { n@541: this.backButton.style.visibility = "visible"; n@541: } else { n@541: this.backButton.style.visibility = "hidden"; n@541: } n@501: } n@501: n@501: this.hide = function() n@501: { n@501: this.object.style.visibility = "hidden"; n@501: this.blanket.style.visibility = "hidden"; n@541: this.backButton.style.visibility = "hidden"; n@501: } n@501: n@501: this.postNode = function(postObject) n@501: { n@501: //Passed object must have the following: n@501: // Title: text to show in the title n@501: // Content: HTML DOM to show on the page n@501: // On complete this HTML DOM is destroyed so make sure it is referenced elsewhere for processing n@501: this.titleDOM.textContent = postObject.title; n@501: this.popupContent.appendChild(postObject.content); n@501: this.shownObject = postObject; n@541: if (typeof this.shownObject.back == "function") { n@541: this.backButton.style.visibility = "visible"; n@541: } else { n@541: this.backButton.style.visibility = "hidden"; n@541: } n@543: if (typeof this.shownObject.continue == "function") { n@543: this.proceedButton.textContent = "Next"; n@543: } else { n@543: this.proceedButton.textContent = "Finish"; n@543: } n@541: this.show(); n@501: } n@501: n@501: this.resize(); n@501: this.hide(); n@501: }; n@501: n@501: popupStateNodes = new function() n@501: { n@501: // This defines the several popup states wanted n@501: this.state = []; n@501: this.state[0] = new function() n@501: { n@501: this.title = "Welcome"; n@501: this.content = document.createElement("div"); n@501: this.content.id = "state-0"; n@501: var span = document.createElement("span"); n@501: 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." n@501: this.content.appendChild(span); n@501: this.dragArea = document.createElement("div"); n@504: this.dragArea.className = "drag-area"; n@504: this.dragArea.id = "project-drop"; n@501: this.content.appendChild(this.dragArea); n@504: n@505: this.dragArea.addEventListener('dragover',function(e){ n@504: e.stopPropagation(); n@504: e.preventDefault(); n@504: e.dataTransfer.dropEffect = 'copy'; n@504: e.currentTarget.className = "drag-area drag-over"; n@504: }); n@504: n@504: this.dragArea.addEventListener('dragexit',function(e){ n@504: e.stopPropagation(); n@504: e.preventDefault(); n@504: e.dataTransfer.dropEffect = 'copy'; n@504: e.currentTarget.className = "drag-area"; n@504: }); n@504: n@504: this.dragArea.addEventListener('drop',function(e){ n@504: e.stopPropagation(); n@504: e.preventDefault(); n@504: e.currentTarget.className = "drag-area drag-dropped"; n@504: var files = e.dataTransfer.files[0]; n@505: var reader = new FileReader(); n@505: reader.onload = function(decoded) { n@505: var parse = new DOMParser(); n@505: specification.decode(parse.parseFromString(decoded.target.result,'text/xml')); n@505: popupObject.hide(); n@506: popupObject.popupContent.innerHTML = null; n@505: convert.convert(document.getElementById('content')); n@505: } n@505: reader.readAsText(files); n@504: }); n@504: n@501: n@501: this.continue = function() n@501: { n@501: popupObject.postNode(popupStateNodes.state[1]); n@501: } n@501: } n@501: this.state[1] = new function() n@501: { n@501: this.title = "Select your interface"; n@501: this.content = document.createElement("div"); n@501: this.content.id = "state-1"; n@501: var spnH = document.createElement('div'); n@501: var span = document.createElement("span"); n@501: 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."; n@501: spnH.appendChild(span); n@501: this.content.appendChild(spnH); n@501: this.select = document.createElement("select"); n@501: this.testsXML = interfaceSpecs.getElementsByTagName('tests')[0].children; n@501: for (var i=0; i 0) n@501: { n@501: testNode = this.testXML[0].getAllElementsByName(checkName); n@501: if(testNode.length != 0) {testNode = testNode[0];} n@501: else {testNode = undefined;} n@501: } else { n@501: testNode = undefined; n@501: } n@541: var obj = { n@541: root: document.createElement("div"), n@542: text: document.createElement("label"), n@541: input: document.createElement("input"), n@541: parent: this, n@541: name: checkName, n@541: handleEvent: function(event) { n@541: if (this.input.checked) { n@541: // Add to specification.interfaces.option n@541: var included = specification.interfaces.options.find(function(element,index,array){ n@541: if (element.name == this.name) {return true;} else {return false;} n@541: },this); n@541: if (included == null) { n@541: specification.interfaces.options.push({type:"check",name:this.name}); n@541: } n@541: } else { n@541: // Remove from specification.interfaces.option n@541: var position = specification.interfaces.options.findIndex(function(element,index,array){ n@541: if (element.name == this.name) {return true;} else {return false;} n@541: },this); n@541: if (position >= 0) { n@541: specification.interfaces.options.splice(position,1); n@541: } n@541: } n@541: } n@501: } n@541: n@541: obj.input.addEventListener("click",obj); n@541: obj.root.className = "popup-checkbox"; n@541: obj.input.type = "checkbox"; n@542: obj.input.setAttribute('id',checkName); n@542: obj.text.setAttribute("for",checkName); n@541: obj.text.textContent = this.checkText.getAllElementsByName(checkName)[0].textContent; n@541: obj.root.appendChild(obj.input); n@541: obj.root.appendChild(obj.text); n@501: if(testNode != undefined) n@501: { n@541: if (testNode.getAttribute('default') == 'on') n@501: { n@541: obj.input.checked = true; n@501: } n@501: if (testNode.getAttribute('support') == "none") n@501: { n@541: obj.input.disabled = true; n@541: obj.input.checked = false; n@541: obj.root.className = "popup-checkbox disabled"; n@501: }else if (interfaceNode.getAttribute('support') == "mandatory") n@501: { n@541: obj.input.disabled = true; n@541: obj.input.checked = true; n@541: obj.root.className = "popup-checkbox disabled"; n@541: } n@541: } else { n@541: if (interfaceNode.getAttribute('default') == 'on') n@541: { n@541: obj.input.checked = true; n@541: } n@541: if (interfaceNode.getAttribute('support') == "none") n@541: { n@541: obj.input.disabled = true; n@541: obj.input.checked = false; n@541: obj.root.className = "popup-checkbox disabled"; n@541: } else if (interfaceNode.getAttribute('support') == "mandatory") n@541: { n@541: obj.input.disabled = true; n@541: obj.input.checked = true; n@541: obj.root.className = "popup-checkbox disabled"; n@501: } n@501: } n@541: var included = specification.interfaces.options.find(function(element,index,array){ n@541: if (element.name == this.name) {return true;} else {return false;} n@541: },obj); n@541: if (included != undefined) { n@541: obj.input.checked = true; n@541: } n@541: obj.handleEvent(); n@541: this.options.push(obj); n@541: this.dynamicContent.appendChild(obj.root); n@501: } n@501: } n@501: this.continue = function() n@501: { n@501: popupStateNodes.state[3].generate(); n@501: popupObject.postNode(popupStateNodes.state[3]); n@501: } n@541: this.back = function() { n@541: popupObject.postNode(popupStateNodes.state[1]); n@541: } n@501: } n@501: this.state[3] = new function() n@501: { n@501: this.title = "Test Metrics"; n@501: this.content = document.createElement("div"); n@501: this.content.id = "state-1"; n@501: var spnH = document.createElement('div'); n@501: var span = document.createElement("span"); n@501: 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"; n@501: spnH.appendChild(span); n@501: this.content.appendChild(spnH); n@501: this.options = []; n@501: this.checkText; n@501: this.testXML; n@501: this.interfaceXML; n@541: this.dynamicContent = document.createElement("div"); n@541: this.content.appendChild(this.dynamicContent); n@501: this.generate = function() n@501: { n@541: this.options = []; n@541: this.dynamicContent.innerHTML = null; n@501: var interfaceName = popupStateNodes.state[1].select.value; n@501: this.checkText = interfaceSpecs.getElementsByTagName("global")[0].getAllElementsByTagName("metrics")[0]; n@501: this.testXML = interfaceSpecs.getElementsByTagName("tests")[0].getAllElementsByName(interfaceName)[0]; n@501: this.interfaceXML = interfaceSpecs.getAllElementsByTagName("interfaces")[0].getAllElementsByName(this.testXML.getAttribute("interface"))[0].getAllElementsByTagName("metrics")[0]; n@501: this.testXML = this.testXML.getAllElementsByTagName("metrics"); n@501: for (var i=0; i 0) n@501: { n@501: testNode = this.testXML[0].getAllElementsByName(checkName); n@501: if(testNode.length != 0) {testNode = testNode[0];} n@501: else {testNode = undefined;} n@501: } else { n@501: testNode = undefined; n@501: } n@541: var obj = { n@541: root: document.createElement("div"), n@542: text: document.createElement("label"), n@541: input: document.createElement("input"), n@541: parent: this, n@541: name: checkName, n@541: handleEvent: function(event) { n@541: if (this.input.checked) { n@541: // Add to specification.interfaces.option n@541: var included = specification.metrics.enabled.find(function(element,index,array){ n@541: if (element == this.name) {return true;} else {return false;} n@541: },this); n@541: if (included == null) { n@541: specification.metrics.enabled.push(this.name); n@541: } n@541: } else { n@541: // Remove from specification.interfaces.option n@541: var position = specification.metrics.enabled.findIndex(function(element,index,array){ n@541: if (element == this.name) {return true;} else {return false;} n@541: },this); n@541: if (position >= 0) { n@541: specification.metrics.enabled.splice(position,1); n@541: } n@541: } n@541: } n@501: } n@541: n@541: obj.input.addEventListener("click",obj); n@541: obj.root.className = "popup-checkbox"; n@541: obj.input.type = "checkbox"; n@542: obj.input.setAttribute('id',checkName); n@542: obj.text.setAttribute("for",checkName); n@541: obj.text.textContent = this.checkText.getAllElementsByName(checkName)[0].textContent; n@541: obj.root.appendChild(obj.input); n@541: obj.root.appendChild(obj.text); n@501: if(testNode != undefined) n@501: { n@541: if (testNode.getAttribute('default') == 'on') n@501: { n@541: obj.input.checked = true; n@501: } n@501: if (testNode.getAttribute('support') == "none") n@501: { n@541: obj.input.disabled = true; n@541: obj.input.checked = false; n@541: obj.root.className = "popup-checkbox disabled"; n@501: }else if (interfaceNode.getAttribute('support') == "mandatory") n@501: { n@541: obj.input.disabled = true; n@541: obj.input.checked = true; n@541: obj.root.className = "popup-checkbox disabled"; n@541: } n@541: } else { n@541: if (interfaceNode.getAttribute('default') == 'on') n@541: { n@541: obj.input.checked = true; n@541: } n@541: if (interfaceNode.getAttribute('support') == "none") n@541: { n@541: obj.input.disabled = true; n@541: obj.input.checked = false; n@541: obj.root.className = "popup-checkbox disabled"; n@541: } else if (interfaceNode.getAttribute('support') == "mandatory") n@541: { n@541: obj.input.disabled = true; n@541: obj.input.checked = true; n@541: obj.root.className = "popup-checkbox disabled"; n@501: } n@501: } n@541: var included = specification.metrics.enabled.find(function(element,index,array){ n@541: if (element == this.name) {return true;} else {return false;} n@541: },obj); n@541: obj.handleEvent(); n@541: if (included != undefined) { n@541: obj.input.checked = true; n@541: } n@541: this.options.push(obj); n@541: this.dynamicContent.appendChild(obj.root); n@501: } n@501: } n@501: this.continue = function() n@501: { n@501: popupStateNodes.state[4].generate(); n@501: popupObject.postNode(popupStateNodes.state[4]); n@501: } n@541: this.back = function() { n@541: popupObject.postNode(popupStateNodes.state[2]); n@541: } n@501: } n@501: this.state[4] = new function() n@501: { n@501: this.title = "Test Visuals"; n@501: this.content = document.createElement("div"); n@501: this.content.id = "state-1"; n@501: var spnH = document.createElement('div'); n@501: var span = document.createElement("span"); n@501: 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"; n@501: spnH.appendChild(span); n@501: this.content.appendChild(spnH); n@501: this.options = []; n@501: this.checkText; n@501: this.testXML; n@501: this.interfaceXML; n@541: this.dynamicContent = document.createElement("div"); n@541: this.content.appendChild(this.dynamicContent); n@501: this.generate = function() n@501: { n@541: this.options = []; n@541: this.dynamicContent.innerHTML = null; n@501: var interfaceName = popupStateNodes.state[1].select.value; n@501: this.checkText = interfaceSpecs.getElementsByTagName("global")[0].getAllElementsByTagName("show")[0]; n@501: this.testXML = interfaceSpecs.getElementsByTagName("tests")[0].getAllElementsByName(interfaceName)[0]; n@501: this.interfaceXML = interfaceSpecs.getAllElementsByTagName("interfaces")[0].getAllElementsByName(this.testXML.getAttribute("interface"))[0].getAllElementsByTagName("show")[0]; n@541: this.testXML = this.testXML.getAllElementsByTagName("show"); n@501: for (var i=0; i 0) n@501: { n@501: testNode = this.testXML[0].getAllElementsByName(checkName); n@501: if(testNode.length != 0) {testNode = testNode[0];} n@501: else {testNode = undefined;} n@501: } else { n@501: testNode = undefined; n@501: } n@541: var obj = { n@541: root: document.createElement("div"), n@542: text: document.createElement("label"), n@541: input: document.createElement("input"), n@541: parent: this, n@541: name: checkName, n@541: handleEvent: function(event) { n@541: if (this.input.checked) { n@541: // Add to specification.interfaces.option n@541: var included = specification.interfaces.options.find(function(element,index,array){ n@541: if (element.name == this.name) {return true;} else {return false;} n@541: },this); n@541: if (included == null) { n@541: specification.interfaces.options.push({type:"show",name:this.name}); n@541: } n@541: } else { n@541: // Remove from specification.interfaces.option n@541: var position = specification.interfaces.options.findIndex(function(element,index,array){ n@541: if (element.name == this.name) {return true;} else {return false;} n@541: },this); n@541: if (position >= 0) { n@541: specification.interfaces.options.splice(position,1); n@541: } n@541: } n@541: } n@501: } n@541: n@541: obj.input.addEventListener("click",obj); n@541: obj.root.className = "popup-checkbox"; n@541: obj.input.type = "checkbox"; n@542: obj.input.setAttribute('id',checkName); n@542: obj.text.setAttribute("for",checkName); n@541: obj.text.textContent = this.checkText.getAllElementsByName(checkName)[0].textContent; n@541: obj.root.appendChild(obj.input); n@541: obj.root.appendChild(obj.text); n@501: if(testNode != undefined) n@501: { n@541: if (testNode.getAttribute('default') == 'on') n@501: { n@541: obj.input.checked = true; n@501: } n@501: if (testNode.getAttribute('support') == "none") n@501: { n@541: obj.input.disabled = true; n@541: obj.input.checked = false; n@541: obj.root.className = "popup-checkbox disabled"; n@501: }else if (interfaceNode.getAttribute('support') == "mandatory") n@501: { n@541: obj.input.disabled = true; n@541: obj.input.checked = true; n@541: obj.root.className = "popup-checkbox disabled"; n@541: } n@541: } else { n@541: if (interfaceNode.getAttribute('default') == 'on') n@541: { n@541: obj.input.checked = true; n@541: } n@541: if (interfaceNode.getAttribute('support') == "none") n@541: { n@541: obj.input.disabled = true; n@541: obj.input.checked = false; n@541: obj.root.className = "popup-checkbox disabled"; n@541: } else if (interfaceNode.getAttribute('support') == "mandatory") n@541: { n@541: obj.input.disabled = true; n@541: obj.input.checked = true; n@541: obj.root.className = "popup-checkbox disabled"; n@501: } n@501: } n@541: var included = specification.interfaces.options.find(function(element,index,array){ n@541: if (element.name == this.name) {return true;} else {return false;} n@541: },obj); n@541: if (included != undefined) { n@541: obj.input.checked = true; n@541: } n@541: obj.handleEvent(); n@541: this.options.push(obj); n@541: this.dynamicContent.appendChild(obj.root); n@501: } n@501: } n@501: this.continue = function() n@501: { n@501: popupObject.hide(); n@501: convert.convert(document.getElementById('content')); n@501: } n@541: this.back = function() { n@541: popupObject.postNode(popupStateNodes.state[3]); n@541: } n@501: } n@501: this.state[5] = new function() { n@501: this.title = "Add/Edit Survey Element"; n@501: this.content = document.createElement("div"); n@501: this.content.id = "state-1"; n@501: var spnH = document.createElement('div'); n@501: var span = document.createElement("span"); n@501: span.textContent = "You can configure your survey element here. Press 'Continue' to complete your changes."; n@501: spnH.appendChild(span); n@501: this.content.appendChild(spnH); n@501: this.dynamic = document.createElement("div"); n@501: this.option = null; n@501: this.parent = null; n@506: this.optionLists = []; n@501: var select = document.createElement("select"); n@501: select.setAttribute("name","type"); n@501: select.addEventListener("change",this,false); n@501: this.content.appendChild(select); n@501: this.content.appendChild(this.dynamic); n@501: this.generate = function(option, parent) n@501: { n@501: this.option = option; n@501: this.parent = parent; n@501: var optionList = specification.schema.getAllElementsByName("survey")[0].getAllElementsByName("type")[0].getAllElementsByTagName("xs:enumeration"); n@501: for (var i=0; i= 0) { n@548: this.parent.parent.scaleRoot.scales.splice(index,1); n@548: } n@548: document.getElementById("popup-option-holder").removeChild(this.parent.root); n@548: } n@548: } n@548: this.deleteMarker.root.addEventListener("click",this.deleteMarker); n@548: this.deleteMarker.root.textContent = "Delete Marker" n@548: this.root.appendChild(this.deleteMarker.root); n@548: } n@516: } n@501: } n@501: } n@501: n@501: function SpecificationToHTML() n@501: { n@501: // This takes the specification node and converts it to an on-page HTML object n@501: // Each Specification Node is given its own JS object which listens to the XSD for instant verification n@501: // Once generated, it directly binds into the specification object to update with changes n@501: // Fixed DOM entries n@501: this.injectDOM; n@501: this.setupDOM; n@501: this.pages = []; n@501: n@501: // Self-contained generators n@501: this.createGeneralNodeDOM = function(name,id,parent) n@501: { n@506: this.type = name; n@501: var root = document.createElement('div'); n@501: root.id = id; n@501: root.className = "node"; n@501: n@501: var titleDiv = document.createElement('div'); n@501: titleDiv.className = "node-title"; n@501: var title = document.createElement('span'); n@501: title.className = "node-title"; n@501: title.textContent = name; n@501: titleDiv.appendChild(title); n@501: n@501: var attributeDiv = document.createElement('div'); n@501: attributeDiv.className = "node-attributes"; n@501: n@501: var childrenDiv = document.createElement('div'); n@501: childrenDiv.className = "node-children"; n@501: n@501: var buttonsDiv = document.createElement('div'); n@501: buttonsDiv.className = "node-buttons"; n@501: n@501: root.appendChild(titleDiv); n@501: root.appendChild(attributeDiv); n@501: root.appendChild(childrenDiv); n@501: root.appendChild(buttonsDiv); n@501: n@501: var obj = { n@501: rootDOM: root, n@501: titleDOM: title, n@501: attributeDOM: attributeDiv, n@501: attributes: [], n@501: childrenDOM: childrenDiv, n@501: children: [], n@501: buttonDOM: buttonsDiv, n@501: parent: parent n@501: } n@501: return obj; n@501: } n@501: n@501: this.convertAttributeToDOM = function(node,schema) n@501: { n@501: // This takes an attribute schema node and returns an object with the input node and any bindings n@501: if (schema.getAttribute('name') == undefined && schema.getAttribute('ref') != undefined) n@501: { n@501: schema = specification.schema.getAllElementsByName(schema.getAttribute('ref'))[0]; n@501: } n@501: var obj = new function() n@501: { n@501: this.input; n@501: this.name; n@501: this.owner; n@501: this.holder; n@501: n@501: this.name = schema.getAttribute('name'); n@501: this.default = schema.getAttribute('default'); n@501: this.dataType = schema.getAttribute('type'); n@501: if (typeof this.dataType == "string") { this.dataType = this.dataType.substr(3);} n@501: else {this.dataType = "string";} n@501: var minVar = undefined; n@501: var maxVar = undefined; n@501: switch(this.dataType) n@501: { n@501: case "negativeInteger": n@501: maxVar = -1; n@501: break; n@501: case "positiveInteger": n@501: minVar = 1; n@501: break; n@501: case "nonNegativeInteger": n@501: minVar = 0; n@501: break; n@501: case "nonPositiveInteger": n@501: maxVar = 0; n@501: break; n@501: case "byte": n@501: minVar = 0; n@501: maxVar = 256; n@501: break; n@501: case "short": n@501: minVar = 0; n@501: maxVar = 65536; n@501: break; n@501: default: n@501: break; n@501: } n@501: n@501: this.input = document.createElement('input'); n@501: switch(this.dataType) n@501: { n@501: case "boolean": n@501: this.input.type = "checkbox"; n@501: break; n@501: case "negativeInteger": n@501: case "positiveInteger": n@501: case "nonNegativeInteger": n@501: case "nonPositiveInteger": n@501: case "integer": n@501: case "short": n@501: case "byte": n@501: this.input.step = 1; n@501: case "decimal": n@501: this.input.type = "number"; n@501: this.input.min = minVar; n@501: this.input.max = maxVar; n@501: break; n@501: default: n@501: break; n@501: } n@501: var value; n@504: eval("value = node."+this.name) n@501: if (value != undefined) n@501: { n@501: this.input.value = value; n@501: } else if (this.default != undefined) n@501: { n@501: this.input.value = this.default; n@501: } n@501: this.handleEvent = function(event) n@501: { n@501: var value; n@501: switch(this.input.type) n@501: { n@501: case "checkbox": n@501: value = event.currentTarget.checked; n@501: break; n@501: case "number": n@501: value = Number(event.currentTarget.value); n@501: break; n@501: default: n@501: value = event.currentTarget.value; n@501: break; n@501: } n@501: eval("this.owner."+this.name+" = value"); n@501: } n@501: this.holder = document.createElement('div'); n@501: this.holder.className = "attribute"; n@501: this.holder.setAttribute('name',this.name); n@501: var text = document.createElement('span'); n@501: eval("text.textContent = attributeText."+this.name+"+': '"); n@501: this.holder.appendChild(text); n@501: this.holder.appendChild(this.input); n@501: this.owner = node; n@501: this.input.addEventListener("change",this,false); n@501: } n@501: if (obj.attribute != null) n@501: { n@501: obj.input.value = obj.attribute; n@501: } n@501: return obj; n@501: } n@501: n@501: this.convert = function(root) n@501: { n@501: //Performs the actual conversion using the given root DOM as the root n@501: this.injectDOM = root; n@501: n@504: // Build the export button n@504: var exportButton = document.createElement("button"); n@504: exportButton.textContent = "Export to XML"; n@504: exportButton.onclick = function() n@504: { n@504: var doc = specification.encode(); n@504: var obj = {}; n@504: obj.title = "Export"; n@504: obj.content = document.createElement("div"); n@504: obj.content.id = "finish"; n@504: var span = document.createElement("span"); n@504: 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." n@504: obj.content.appendChild(span); n@504: var link = document.createElement("div"); n@504: link.appendChild(doc.children[0]); n@504: var file = [link.innerHTML]; n@504: var bb = new Blob(file,{type : 'application/xml'}); n@504: var dnlk = window.URL.createObjectURL(bb); n@504: var a = document.createElement("a"); n@504: a.hidden = ''; n@504: a.href = dnlk; n@504: a.download = "project-specification.xml"; n@504: a.textContent = "Save File"; n@504: obj.content.appendChild(a); n@504: popupObject.show(); n@504: popupObject.postNode(obj); n@504: } n@504: this.injectDOM.appendChild(exportButton); n@504: n@501: // First perform the setupNode; n@501: var setupSchema = specification.schema.getAllElementsByName('setup')[0]; n@547: this.setupDOM = new this.createGeneralNodeDOM('Global Configuration','setup',null); n@501: this.injectDOM.appendChild(this.setupDOM.rootDOM); n@501: var setupAttributes = setupSchema.getAllElementsByTagName('xs:attribute'); n@501: for (var i=0; i= 0) { n@501: var aeList = this.parent.parent.specification.audioElements; n@501: if (i < aeList.length-1) { n@501: aeList = aeList.slice(0,i).concat(aeList.slice(i+1)); n@501: } else { n@501: aeList = aeList.slice(0,i); n@501: } n@501: } n@501: i = this.parent.parent.children.findIndex(function(element,index,array){ n@501: if (element == this.parent) n@501: return true; n@501: else n@501: return false; n@501: },this); n@501: if (i >= 0) { n@501: var childList = this.parent.children; n@501: if (i < aeList.length-1) { n@501: childList = childList.slice(0,i).concat(childList.slice(i+1)); n@501: } else { n@501: childList = childList.slice(0,i); n@501: } n@501: this.parent.parent.childrenDOM.removeChild(this.parent.rootDOM); n@501: } n@501: }, n@501: findNode: function(element,index,array){ n@501: if (element == this.parent.specification) n@501: return true; n@501: else n@501: return false; n@501: } n@501: } n@501: this.deleteNode.root.textContent = "Delete Entry"; n@501: this.deleteNode.root.addEventListener("click",this.deleteNode,false); n@501: this.buttonDOM.appendChild(this.deleteNode.root); n@501: } n@501: n@501: this.commentQuestionNode = function(parent,rootObject) n@501: { n@506: this.type = "commentQuestionNode"; n@501: this.rootDOM = document.createElement("div"); n@501: this.titleDOM = document.createElement("span"); n@501: this.attributeDOM = document.createElement("div"); n@501: this.attributes = []; n@501: this.childrenDOM = document.createElement("div"); n@501: this.children = []; n@501: this.buttonDOM = document.createElement("div"); n@501: this.parent = parent; n@501: this.specification = rootObject; n@501: this.schema = specification.schema.getAllElementsByName("page")[0]; n@501: this.rootDOM.className = "node"; n@501: n@501: var titleDiv = document.createElement('div'); n@501: titleDiv.className = "node-title"; n@501: this.titleDOM.className = "node-title"; n@501: this.titleDOM.textContent = "Test Page"; n@501: titleDiv.appendChild(this.titleDOM); n@501: n@501: this.attributeDOM.className = "node-attributes"; n@501: this.childrenDOM.className = "node-children"; n@501: this.buttonDOM.className = "node-buttons"; n@501: n@501: this.rootDOM.appendChild(titleDiv); n@501: this.rootDOM.appendChild(this.attributeDOM); n@501: this.rootDOM.appendChild(this.childrenDOM); n@501: this.rootDOM.appendChild(this.buttonDOM); n@501: n@501: } n@501: n@505: // Build the components n@525: if (this.specification.interfaces.length == 0) { n@525: this.specification.interfaces.push(new specification.interfaceNode()); n@525: } n@512: for (var interfaceObj of this.specification.interfaces) n@512: { n@512: var newInterface = new this.parent.interfaceNode(this.parent,interfaceObj); n@512: newInterface.build("Interface",""+this.specification.id+"-interface",this.childrenDOM); n@512: this.children.push(newInterface); n@512: this.interfaces.push(newInterface); n@512: } n@512: n@505: for (var elements of this.specification.audioElements) n@505: { n@505: var audioElementDOM = new this.audioElementNode(this,elements); n@505: this.children.push(audioElementDOM); n@505: this.childrenDOM.appendChild(audioElementDOM.rootDOM); n@505: } n@505: n@501: this.addInterface = { n@501: root: document.createElement("button"), n@501: parent: this, n@501: handleEvent: function() { n@501: var InterfaceObj = new specification.interfaceNode(); n@501: var newInterface = new this.parent.parent.interfaceNode(this.parent.parent,InterfaceObj); n@501: newInterface.build("Interface",""+this.parent.specification.id+"-interface",this.parent.childrenDOM); n@501: this.parent.children.push(newInterface); n@501: this.parent.specification.interfaces.push(InterfaceObj); n@501: this.parent.interfaces.push(newInterface); n@501: } n@501: } n@501: this.addInterface.root.textContent = "Add Interface"; n@501: this.addInterface.root.addEventListener("click",this.addInterface,false); n@501: this.buttonDOM.appendChild(this.addInterface.root); n@501: n@501: this.addAudioElement = { n@501: root: document.createElement("button"), n@501: parent: this, n@501: handleEvent: function() { n@501: var audioElementObject = new this.parent.specification.audioElementNode(); n@501: var audioElementDOM = new this.parent.audioElementNode(this.parent,audioElementObject); n@501: this.parent.specification.audioElements.push(audioElementObject); n@501: this.parent.children.push(audioElementDOM); n@501: this.parent.childrenDOM.appendChild(audioElementDOM.rootDOM); n@501: } n@501: } n@501: this.addAudioElement.root.textContent = "Add Audio Element"; n@501: this.addAudioElement.root.addEventListener("click",this.addAudioElement,false); n@501: this.buttonDOM.appendChild(this.addAudioElement.root); n@501: } n@501: }