n@1141: // Once this is loaded and parsed, begin execution n@1141: loadInterface(); n@1141: n@1141: function loadInterface() { n@1141: // Get the dimensions of the screen available to the page n@1141: var width = window.innerWidth; n@1141: var height = window.innerHeight; n@1141: interfaceContext.insertPoint.innerHTML = null; // Clear the current schema n@1141: n@1141: // Custom Comparitor Object n@1141: Interface.prototype.comparitor = null; n@1141: n@1141: // The injection point into the HTML page n@1141: interfaceContext.insertPoint = document.getElementById("topLevelBody"); n@1141: var testContent = document.createElement('div'); n@1141: testContent.id = 'testContent'; n@1141: n@1141: // Create the top div for the Title element n@1141: var titleAttr = specification.title; n@1141: var title = document.createElement('div'); n@1141: title.className = "title"; n@1141: title.align = "center"; n@1141: var titleSpan = document.createElement('span'); n@1141: n@1141: // Set title to that defined in XML, else set to default n@1141: if (titleAttr != undefined) { n@1141: titleSpan.textContent = titleAttr; n@1141: } else { n@1141: titleSpan.textContent = 'Listening test'; n@1141: } n@1141: // Insert the titleSpan element into the title div element. n@1141: title.appendChild(titleSpan); n@1141: n@1141: var pagetitle = document.createElement('div'); n@1141: pagetitle.className = "pageTitle"; n@1141: pagetitle.align = "center"; n@1141: var titleSpan = document.createElement('span'); n@1141: titleSpan.id = "pageTitle"; n@1141: pagetitle.appendChild(titleSpan); n@1141: n@1141: // Create Interface buttons! n@1141: var interfaceButtons = document.createElement('div'); n@1141: interfaceButtons.id = 'interface-buttons'; n@1141: interfaceButtons.style.height = '25px'; n@1141: n@1141: // Create playback start/stop points n@1141: var playback = document.createElement("button"); n@1141: playback.innerHTML = 'Stop'; n@1141: playback.id = 'playback-button'; n@1141: playback.style.float = 'left'; n@1141: // onclick function. Check if it is playing or not, call the correct function in the n@1141: // audioEngine, change the button text to reflect the next state. n@1141: playback.onclick = function() { n@1141: if (audioEngineContext.status == 1) { n@1141: audioEngineContext.stop(); n@1141: this.innerHTML = 'Stop'; n@1141: var time = audioEngineContext.timer.getTestTime(); n@1141: console.log('Stopped at ' + time); // DEBUG/SAFETY n@1141: } n@1141: }; n@1141: // Append the interface buttons into the interfaceButtons object. n@1141: interfaceButtons.appendChild(playback); n@1141: n@1141: // Global parent for the comment boxes on the page n@1141: var feedbackHolder = document.createElement('div'); n@1141: feedbackHolder.id = 'feedbackHolder'; n@1141: n@1141: // Construct the AB Boxes n@1141: var boxes = document.createElement('div'); n@1141: boxes.align = "center"; n@1141: boxes.id = "box-holders"; n@1141: boxes.style.float = "left"; n@1141: n@1141: var submit = document.createElement('button'); n@1141: submit.id = "submit"; n@1141: submit.onclick = buttonSubmitClick; n@1141: submit.className = "big-button"; n@1141: submit.textContent = "submit"; n@1141: submit.style.position = "relative"; n@1141: submit.style.left = (window.innerWidth-250)/2 + 'px'; n@1141: n@1141: feedbackHolder.appendChild(boxes); n@1141: n@1141: // Inject into HTML n@1141: testContent.appendChild(title); // Insert the title n@1141: testContent.appendChild(pagetitle); n@1141: testContent.appendChild(interfaceButtons); n@1141: testContent.appendChild(feedbackHolder); n@1141: testContent.appendChild(submit); n@1141: interfaceContext.insertPoint.appendChild(testContent); n@1141: n@1141: // Load the full interface n@1141: testState.initialise(); n@1141: testState.advanceState(); n@1141: } n@1141: n@1141: function loadTest(audioHolderObject) n@1141: { n@1141: var feedbackHolder = document.getElementById('feedbackHolder'); n@1141: var interfaceObj = audioHolderObject.interfaces; n@1141: if (interfaceObj.length > 1) n@1141: { n@1141: console.log("WARNING - This interface only supports one node per page. Using first interface node"); n@1141: } n@1141: interfaceObj = interfaceObj[0]; n@1141: n@1141: if(interfaceObj.title != null) n@1141: { n@1141: document.getElementById("pageTitle").textContent = interfaceObj.title; n@1141: } n@1141: n@1141: // Populate the comparitor object n@1141: interfaceContext.comparitor = new Comparitor(audioHolderObject); n@1141: resizeWindow(null); n@1141: } n@1141: n@1141: function Comparitor(audioHolderObject) n@1141: { n@1141: this.comparitorBox = function(audioElement,id,text) n@1141: { n@1141: this.parent = audioElement; n@1141: this.id = id; n@1141: this.value = 0; n@1141: this.disabled = true; n@1141: this.box = document.createElement('div'); n@1141: this.box.className = 'comparitor-holder'; n@1141: this.box.setAttribute('track-id',audioElement.id); n@1141: this.box.id = 'comparitor-'+text; n@1141: this.selector = document.createElement('div'); n@1141: this.selector.className = 'comparitor-selector disabled'; n@1141: var selectorText = document.createElement('span'); n@1141: selectorText.textContent = text; n@1141: this.selector.appendChild(selectorText); n@1141: this.playback = document.createElement('button'); n@1141: this.playback.className = 'comparitor-button'; n@1141: this.playback.disabled = true; n@1141: this.playback.textContent = "Listen"; n@1141: this.box.appendChild(this.selector); n@1141: this.box.appendChild(this.playback); n@1141: this.selector.onclick = function() n@1141: { n@1141: var time = audioEngineContext.timer.getTestTime(); n@1141: if ($(event.currentTarget).hasClass('disabled')) n@1141: { n@1141: console.log("Please wait until sample has loaded"); n@1141: return; n@1141: } n@1141: if (audioEngineContext.status == 0) n@1141: { n@1141: alert("Please listen to the samples before making a selection"); n@1141: console.log("Please listen to the samples before making a selection"); n@1141: return; n@1141: } n@1141: $(".comparitor-selector").removeClass('selected'); n@1141: var id = event.currentTarget.parentElement.getAttribute('track-id'); n@1141: interfaceContext.comparitor.selected = id; n@1141: $(event.currentTarget).addClass('selected'); n@1141: for (var i=0; i saves n@1141: // Get the current information in store (remember to appendChild your data to it) n@1141: // pageSpecification is the current page node configuration n@1141: // To create new XML nodes, use storage.document.createElement(); n@1141: }