# HG changeset patch # User Nicholas Jillings # Date 1452520590 0 # Node ID c1c696ccd6f996d3e3e8ec8c709ad1665fb5e1b9 # Parent 0e5b580e2fb7748f3a30310cd37066cb16e6ace0 Added AB interface. WIP. Stash diff -r 0e5b580e2fb7 -r c1c696ccd6f9 AB.css --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/AB.css Mon Jan 11 13:56:30 2016 +0000 @@ -0,0 +1,53 @@ +body { + /* Set the background colour (note US English spelling) to grey*/ + background-color: #fff +} + +div.pageTitle { + width: auto; + height: 20px; + margin-top: 20px; +} + +div.pageTitle span{ + font-size: 1.5em; +} + +div.testHalt { + /* Specify any colouring during the test halt for pre/post questions */ + background-color: rgba(0,0,0,0.5); + /* Don't mess with this bit */ + z-index: 2; + width: 100%; + height: 100%; + position: absolute; + left: 0px; + top: 0px; +} + +button { + /* Specify any button structure or style */ + min-width: 20px; + background-color: #ddd +} + +div.comparitor-holder { + width: 260px; + height: 300px; + border: black 1px solid; + position: absolute; +} + +div.comparitor-selector { + width: 250px; + height: 250px; + border: black 1px solid; + position: relative; +} + +div.comparitor-button { + width: 250px; + height: 50px; + position: relative; + background-color: #FF0000; +} diff -r 0e5b580e2fb7 -r c1c696ccd6f9 AB.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/AB.js Mon Jan 11 13:56:30 2016 +0000 @@ -0,0 +1,270 @@ +// Once this is loaded and parsed, begin execution +loadInterface(); + +function loadInterface() { + // Get the dimensions of the screen available to the page + var width = window.innerWidth; + var height = window.innerHeight; + interfaceContext.insertPoint.innerHTML = null; // Clear the current schema + + // Custom Comparitor Object + Interface.prototype.comparitor = null; + + // The injection point into the HTML page + interfaceContext.insertPoint = document.getElementById("topLevelBody"); + var testContent = document.createElement('div'); + testContent.id = 'testContent'; + + // Create the top div for the Title element + var titleAttr = specification.title; + var title = document.createElement('div'); + title.className = "title"; + title.align = "center"; + var titleSpan = document.createElement('span'); + + // Set title to that defined in XML, else set to default + if (titleAttr != undefined) { + titleSpan.textContent = titleAttr; + } else { + titleSpan.textContent = 'Listening test'; + } + // Insert the titleSpan element into the title div element. + title.appendChild(titleSpan); + + var pagetitle = document.createElement('div'); + pagetitle.className = "pageTitle"; + pagetitle.align = "center"; + var titleSpan = document.createElement('span'); + titleSpan.id = "pageTitle"; + pagetitle.appendChild(titleSpan); + + // Create Interface buttons! + var interfaceButtons = document.createElement('div'); + interfaceButtons.id = 'interface-buttons'; + interfaceButtons.style.height = '25px'; + + // Create playback start/stop points + var playback = document.createElement("button"); + playback.innerHTML = 'Stop'; + playback.id = 'playback-button'; + playback.style.float = 'left'; + // onclick function. Check if it is playing or not, call the correct function in the + // audioEngine, change the button text to reflect the next state. + playback.onclick = function() { + if (audioEngineContext.status == 1) { + audioEngineContext.stop(); + this.innerHTML = 'Stop'; + var time = audioEngineContext.timer.getTestTime(); + console.log('Stopped at ' + time); // DEBUG/SAFETY + } + }; + // Append the interface buttons into the interfaceButtons object. + interfaceButtons.appendChild(playback); + + // Global parent for the comment boxes on the page + var feedbackHolder = document.createElement('div'); + feedbackHolder.id = 'feedbackHolder'; + + // Inject into HTML + testContent.appendChild(title); // Insert the title + testContent.appendChild(pagetitle); + testContent.appendChild(interfaceButtons); + testContent.appendChild(feedbackHolder); + interfaceContext.insertPoint.appendChild(testContent); + + // Load the full interface + testState.initialise(); + testState.advanceState(); +} + +function loadTest(audioHolderObject) +{ + var feedbackHolder = document.getElementById('feedbackHolder'); + var interfaceObj = audioHolderObject.interfaces; + if (interfaceObj.length > 1) + { + console.log("WARNING - This interface only supports one node per page. Using first interface node"); + } + interfaceObj = interfaceObj[0]; + + if(interfaceObj.title != null) + { + document.getElementById("pageTitle").textContent = interfaceObj.title; + } + + // Populate the comparitor object + interfaceContext.comparitor = new Comparitor(audioHolderObject); +} + +function Comparitor(audioHolderObject) +{ + this.pairs = []; + this.listened = [false, false]; + this.selected = null; + this.index = 0; + this.feedbackHolder = document.getElementById('feedbackHolder'); + this.injectA = document.createElement('div'); + this.injectA.id = 'inject-A'; + this.injectB = document.createElement('div'); + this.injectB.id = 'inject-B'; + this.submitButton = document.createElement('button'); + this.progress = function() + { + if (this.index >= this.pairs.length) + { + buttonSubmitClick(); + return; + } + this.listened = [false, false]; + this.selected = null; + var pair = this.pairs[this.index]; + }; + + // First generate the Audio Objects for the Audio Engine + $(audioHolderObject.audioElements).each(function(index,element){ + if (index == audioHolderObject.outsideReference || element.type == 'outside-reference') + { + console.log("WARNING - AB cannot have fixed reference"); + } + var audioObject = audioEngineContext.newTrack(element); + audioObject.interfaceDOM = new comparitorElementObject(audioObject); + }); + + // Now generate the pairings + this.pairs = []; + var num_elems = audioEngineContext.audioObjects.length; + for (var i=0; i