b@1608: /** b@1608: * core.js b@1608: * b@1608: * Main script to run, calls all other core functions and manages loading/store to backend. b@1608: * Also contains all global variables. b@1608: */ b@1608: b@1608: /* create the web audio API context and store in audioContext*/ b@1608: var audioContext; // Hold the browser web audio API b@1608: var projectXML; // Hold the parsed setup XML nickjillings@1622: var popup; // Hold the interfacePopup object nickjillings@1622: var currentState; // Keep track of the current state (pre/post test, which test, final test? first test?) b@1608: var testXMLSetups = []; // Hold the parsed test instances b@1608: var testResultsHolders =[]; // Hold the results from each test for publishing to XML b@1608: var currentTrackOrder = []; // Hold the current XML tracks in their (randomised) order b@1608: var currentTestHolder; // Hold any intermediate results during test - metrics b@1608: var audioEngineContext; // The custome AudioEngine object b@1608: var projectReturn; // Hold the URL for the return b@1608: var preTestQuestions = document.createElement('PreTest'); // Store any pre-test question response b@1608: var postTestQuestions = document.createElement('PostTest'); // Store any post-test question response b@1608: b@1608: // Add a prototype to the bufferSourceNode to reference to the audioObject holding it b@1608: AudioBufferSourceNode.prototype.owner = undefined; b@1608: b@1608: window.onload = function() { b@1608: // Function called once the browser has loaded all files. b@1608: // This should perform any initial commands such as structure / loading documents b@1608: b@1608: // Create a web audio API context b@1608: // Fixed for cross-browser support b@1608: var AudioContext = window.AudioContext || window.webkitAudioContext; b@1608: audioContext = new AudioContext; b@1608: b@1608: // Create the audio engine object b@1608: audioEngineContext = new AudioEngine(); nickjillings@1622: nickjillings@1622: // Create the popup interface object nickjillings@1622: popup = new interfacePopup(); b@1608: }; b@1608: nickjillings@1622: function interfacePopup() { nickjillings@1622: // Creates an object to manage the popup nickjillings@1622: this.popup = null; nickjillings@1622: this.popupContent = null; nickjillings@1622: this.popupButton = null; nickjillings@1622: this.popupOptions = null; nickjillings@1622: this.currentIndex = null; nickjillings@1622: this.responses = null; nickjillings@1622: this.createPopup = function(){ nickjillings@1622: // Create popup window interface nickjillings@1622: var insertPoint = document.getElementById("topLevelBody"); nickjillings@1622: var blank = document.createElement('div'); nickjillings@1622: blank.className = 'testHalt'; nickjillings@1622: nickjillings@1622: this.popup = document.createElement('div'); nickjillings@1622: this.popup.id = 'popupHolder'; nickjillings@1622: this.popup.className = 'popupHolder'; nickjillings@1622: this.popup.style.position = 'absolute'; nickjillings@1622: this.popup.style.left = (window.innerWidth/2)-250 + 'px'; nickjillings@1622: this.popup.style.top = (window.innerHeight/2)-125 + 'px'; nickjillings@1622: nickjillings@1622: this.popupContent = document.createElement('div'); nickjillings@1622: this.popupContent.id = 'popupContent'; nickjillings@1622: this.popupContent.style.marginTop = '25px'; nickjillings@1622: this.popupContent.align = 'center'; nickjillings@1622: this.popup.appendChild(this.popupContent); nickjillings@1622: nickjillings@1622: this.popupButton = document.createElement('button'); nickjillings@1622: this.popupButton.className = 'popupButton'; nickjillings@1622: this.popupButton.innerHTML = 'Next'; nickjillings@1622: this.popupButton.onclick = function(){popup.buttonClicked();}; nickjillings@1622: insertPoint.appendChild(this.popup); nickjillings@1622: insertPoint.appendChild(blank); nickjillings@1622: }; nickjillings@1621: nickjillings@1622: this.showPopup = function(){ nickjillings@1622: if (this.popup == null || this.popup == undefined) { nickjillings@1622: this.createPopup(); nickjillings@1622: } nickjillings@1622: this.popup.style.zIndex = 3; nickjillings@1622: this.popup.style.visibility = 'visible'; nickjillings@1622: var blank = document.getElementsByClassName('testHalt')[0]; nickjillings@1622: blank.style.zIndex = 2; nickjillings@1622: blank.style.visibility = 'visible'; nickjillings@1622: }; nickjillings@1622: nickjillings@1622: this.hidePopup = function(){ nickjillings@1622: this.popup.style.zIndex = -1; nickjillings@1622: this.popup.style.visibility = 'hidden'; nickjillings@1622: var blank = document.getElementsByClassName('testHalt')[0]; nickjillings@1622: blank.style.zIndex = -2; nickjillings@1622: blank.style.visibility = 'hidden'; nickjillings@1622: }; nickjillings@1622: nickjillings@1622: this.postNode = function() { nickjillings@1622: // This will take the node from the popupOptions and display it nickjillings@1622: var node = this.popupOptions[this.currentIndex]; nickjillings@1622: this.popupContent.innerHTML = null; nickjillings@1622: if (node.nodeName == 'statement') { nickjillings@1622: var span = document.createElement('span'); nickjillings@1622: span.textContent = node.textContent; nickjillings@1622: this.popupContent.appendChild(span); nickjillings@1622: } else if (node.nodeName == 'question') { nickjillings@1622: var span = document.createElement('span'); nickjillings@1622: span.textContent = node.textContent; nickjillings@1622: var textArea = document.createElement('textarea'); nickjillings@1622: var br = document.createElement('br'); nickjillings@1622: this.popupContent.appendChild(span); nickjillings@1622: this.popupContent.appendChild(br); nickjillings@1622: this.popupContent.appendChild(textArea); nickjillings@1622: } nickjillings@1622: this.popupContent.appendChild(this.popupButton); nickjillings@1622: } nickjillings@1622: nickjillings@1622: this.initState = function(node) { nickjillings@1622: //Call this with your preTest and postTest nodes when needed to nickjillings@1622: // initialise the popup procedure. nickjillings@1622: this.popupOptions = $(node).children(); nickjillings@1622: if (this.popupOptions.length > 0) { nickjillings@1622: if (node.nodeName == 'preTest' || node.nodeName == 'PreTest') { nickjillings@1622: this.responses = document.createElement('PreTest'); nickjillings@1622: } else if (node.nodeName == 'postTest' || node.nodeName == 'PostTest') { nickjillings@1622: this.responses = document.createElement('PostTest'); nickjillings@1622: } else { nickjillings@1622: console.log ('WARNING - popup node neither pre or post!'); nickjillings@1622: this.responses = document.createElement('responses'); nickjillings@1622: } nickjillings@1622: this.currentIndex = 0; nickjillings@1622: this.showPopup(); nickjillings@1622: this.postNode(); nickjillings@1622: } nickjillings@1622: } nickjillings@1622: nickjillings@1622: this.buttonClicked = function() { nickjillings@1622: // Each time the popup button is clicked! nickjillings@1622: var node = this.popupOptions[this.currentIndex]; nickjillings@1622: if (node.nodeName == 'question') { nickjillings@1622: // Must extract the question data nickjillings@1622: var mandatory = node.attributes['mandatory']; nickjillings@1622: if (mandatory == undefined) { nickjillings@1622: mandatory = false; nickjillings@1622: } else { nickjillings@1622: if (mandatory.value == 'true'){mandatory = true;} nickjillings@1622: else {mandatory = false;} nickjillings@1622: } nickjillings@1622: var textArea = $(popup.popupContent).find('textarea')[0]; nickjillings@1622: if (mandatory == true && textArea.value.length == 0) { nickjillings@1622: alert('This question is mandatory'); nickjillings@1622: return; nickjillings@1622: } else { nickjillings@1622: // Save the text content nickjillings@1622: var hold = document.createElement('comment'); nickjillings@1622: hold.id = node.attributes['id'].value; nickjillings@1622: hold.innerHTML = textArea.value; nickjillings@1623: console.log("Question: "+ node.textContent); nickjillings@1623: console.log("Question Response: "+ textArea.value); nickjillings@1622: this.responses.appendChild(hold); nickjillings@1622: } nickjillings@1622: } nickjillings@1622: this.currentIndex++; nickjillings@1622: if (this.currentIndex < this.popupOptions.length) { nickjillings@1622: this.postNode(); nickjillings@1622: } else { nickjillings@1622: // Reached the end of the popupOptions nickjillings@1622: this.hidePopup(); nickjillings@1622: advanceState(); nickjillings@1622: } nickjillings@1622: } nickjillings@1621: } nickjillings@1621: nickjillings@1622: function advanceState() nickjillings@1621: { nickjillings@1622: console.log(currentState); nickjillings@1622: if (currentState == 'preTest') nickjillings@1622: { nickjillings@1622: // End of pre-test, begin the test nickjillings@1622: preTestQuestions = popup.responses; nickjillings@1622: loadTest(0); nickjillings@1622: } else if (currentState == 'postTest') { nickjillings@1622: postTestQuestions = popup.responses; nickjillings@1624: console.log('ALL COLLECTED!'); nickjillings@1624: createProjectSave(projectReturn); nickjillings@1622: }else if (currentState.substr(0,10) == 'testRunPre') nickjillings@1622: { nickjillings@1622: // Start the test nickjillings@1622: var testId = currentState.substr(11,currentState.length-10); nickjillings@1622: currentState = 'testRun-'+testId; nickjillings@1622: currentTestHolder.appendChild(popup.responses); nickjillings@1622: //audioEngineContext.timer.startTest(); nickjillings@1622: //audioEngineContext.play(); nickjillings@1622: } else if (currentState.substr(0,11) == 'testRunPost') nickjillings@1622: { nickjillings@1622: var testId = currentState.substr(12,currentState.length-11); nickjillings@1622: currentTestHolder.appendChild(popup.responses); nickjillings@1622: testEnded(testId); nickjillings@1622: } else if (currentState.substr(0,7) == 'testRun') nickjillings@1622: { nickjillings@1622: var testId = currentState.substr(8,currentState.length-7); nickjillings@1622: // Check if we have any post tests to perform nickjillings@1622: var postXML = $(testXMLSetups[testId]).find('PostTest')[0]; nickjillings@1622: if (postXML == undefined || postXML.childElementCount == 0) { nickjillings@1622: testEnded(testId); nickjillings@1622: } nickjillings@1622: else if (postXML.childElementCount > 0) nickjillings@1622: { nickjillings@1622: currentState = 'testRunPost-'+testId; nickjillings@1622: popup.initState(postXML); nickjillings@1622: } nickjillings@1621: } nickjillings@1622: console.log(currentState); nickjillings@1621: } nickjillings@1621: nickjillings@1622: function testEnded(testId) nickjillings@1621: { nickjillings@1622: pageXMLSave(testId); nickjillings@1622: if (testXMLSetups.length-1 > testId) nickjillings@1622: { nickjillings@1622: // Yes we have another test to perform nickjillings@1622: testId = (Number(testId)+1); nickjillings@1622: currentState = 'testRun-'+testId; nickjillings@1622: loadTest(testId); nickjillings@1622: } else { nickjillings@1622: console.log('Testing Completed!'); nickjillings@1622: currentState = 'postTest'; nickjillings@1622: // Check for any post tests nickjillings@1622: var xmlSetup = projectXML.find('setup'); nickjillings@1622: var postTest = xmlSetup.find('PostTest')[0]; nickjillings@1622: popup.initState(postTest); nickjillings@1622: } nickjillings@1621: } nickjillings@1621: b@1608: function loadProjectSpec(url) { b@1608: // Load the project document from the given URL, decode the XML and instruct audioEngine to get audio data b@1608: // If url is null, request client to upload project XML document b@1608: var r = new XMLHttpRequest(); b@1608: r.open('GET',url,true); b@1608: r.onload = function() { b@1608: loadProjectSpecCallback(r.response); b@1608: }; b@1608: r.send(); b@1608: }; b@1608: b@1608: function loadProjectSpecCallback(response) { b@1608: // Function called after asynchronous download of XML project specification b@1608: var decode = $.parseXML(response); b@1608: projectXML = $(decode); b@1608: b@1608: // Now extract the setup tag b@1608: var xmlSetup = projectXML.find('setup'); b@1608: // Detect the interface to use and load the relevant javascripts. b@1608: var interfaceType = xmlSetup[0].attributes['interface']; b@1608: var interfaceJS = document.createElement('script'); b@1608: interfaceJS.setAttribute("type","text/javascript"); b@1608: if (interfaceType.value == 'APE') { b@1608: interfaceJS.setAttribute("src","ape.js"); b@1608: b@1608: // APE comes with a css file b@1608: var css = document.createElement('link'); b@1608: css.rel = 'stylesheet'; b@1608: css.type = 'text/css'; b@1608: css.href = 'ape.css'; b@1608: b@1608: document.getElementsByTagName("head")[0].appendChild(css); b@1608: } b@1608: document.getElementsByTagName("head")[0].appendChild(interfaceJS); nickjillings@1633: nickjillings@1633: // Define window callbacks for interface nickjillings@1633: window.onresize = function(event){resizeWindow(event);}; b@1608: } b@1608: b@1608: function createProjectSave(destURL) { b@1608: // Save the data from interface into XML and send to destURL b@1608: // If destURL is null then download XML in client b@1608: // Now time to render file locally b@1608: var xmlDoc = interfaceXMLSave(); nickjillings@1628: var parent = document.createElement("div"); nickjillings@1628: parent.appendChild(xmlDoc); nickjillings@1628: var file = [parent.innerHTML]; b@1608: if (destURL == "null" || destURL == undefined) { b@1608: var bb = new Blob(file,{type : 'application/xml'}); b@1608: var dnlk = window.URL.createObjectURL(bb); b@1608: var a = document.createElement("a"); b@1608: a.hidden = ''; b@1608: a.href = dnlk; b@1608: a.download = "save.xml"; b@1608: a.textContent = "Save File"; b@1608: b@1608: var submitDiv = document.getElementById('download-point'); b@1608: submitDiv.appendChild(a); nickjillings@1624: popup.showPopup(); nickjillings@1624: popup.popupContent.innerHTML = null; nickjillings@1624: popup.popupContent.appendChild(submitDiv) nickjillings@1628: } else { nickjillings@1628: var xmlhttp = new XMLHttpRequest; nickjillings@1628: xmlhttp.open("POST",destURL,true); nickjillings@1628: xmlhttp.setRequestHeader('Content-Type', 'text/xml'); nickjillings@1629: xmlhttp.onerror = function(){ nickjillings@1629: console.log('Error saving file to server! Presenting download locally'); nickjillings@1629: createProjectSave(null); nickjillings@1629: }; nickjillings@1628: xmlhttp.send(file); b@1608: } b@1608: return submitDiv; b@1608: } b@1608: b@1608: function AudioEngine() { b@1608: b@1608: // Create two output paths, the main outputGain and fooGain. b@1608: // Output gain is default to 1 and any items for playback route here b@1608: // Foo gain is used for analysis to ensure paths get processed, but are not heard b@1608: // because web audio will optimise and any route which does not go to the destination gets ignored. b@1608: this.outputGain = audioContext.createGain(); b@1608: this.fooGain = audioContext.createGain(); b@1608: this.fooGain.gain = 0; b@1608: b@1608: // Use this to detect playback state: 0 - stopped, 1 - playing b@1608: this.status = 0; nickjillings@1620: this.audioObjectsReady = false; b@1608: b@1608: // Connect both gains to output b@1608: this.outputGain.connect(audioContext.destination); b@1608: this.fooGain.connect(audioContext.destination); b@1608: b@1608: // Create the timer Object b@1608: this.timer = new timer(); b@1608: // Create session metrics b@1608: this.metric = new sessionMetrics(this); b@1608: b@1608: this.loopPlayback = false; b@1608: b@1608: // Create store for new audioObjects b@1608: this.audioObjects = []; b@1608: nickjillings@1620: this.play = function() { nickjillings@1620: // Start the timer and set the audioEngine state to playing (1) nickjillings@1620: if (this.status == 0) { nickjillings@1620: // Check if all audioObjects are ready nickjillings@1620: if (this.audioObjectsReady == false) { nickjillings@1620: this.audioObjectsReady = this.checkAllReady(); nickjillings@1620: } nickjillings@1620: if (this.audioObjectsReady == true) { nickjillings@1620: this.timer.startTest(); nickjillings@1620: this.status = 1; nickjillings@1620: } nickjillings@1620: } nickjillings@1620: }; b@1608: nickjillings@1620: this.stop = function() { nickjillings@1620: // Send stop and reset command to all playback buffers and set audioEngine state to stopped (1) nickjillings@1620: if (this.status == 1) { nickjillings@1620: for (var i=0; i nickjillings@1631: // DD/MM/YY nickjillings@1631: // nickjillings@1631: // nickjillings@1631: var dateTime = new Date(); nickjillings@1631: var year = document.createAttribute('year'); nickjillings@1631: var month = document.createAttribute('month'); nickjillings@1631: var day = document.createAttribute('day'); nickjillings@1631: var hour = document.createAttribute('hour'); nickjillings@1631: var minute = document.createAttribute('minute'); nickjillings@1631: var secs = document.createAttribute('secs'); nickjillings@1631: nickjillings@1631: year.nodeValue = dateTime.getFullYear(); nickjillings@1631: month.nodeValue = dateTime.getMonth()+1; nickjillings@1631: day.nodeValue = dateTime.getDate(); nickjillings@1631: hour.nodeValue = dateTime.getHours(); nickjillings@1631: minute.nodeValue = dateTime.getMinutes(); nickjillings@1631: secs.nodeValue = dateTime.getSeconds(); nickjillings@1631: nickjillings@1631: var hold = document.createElement("datetime"); nickjillings@1631: var date = document.createElement("date"); nickjillings@1631: date.textContent = year.nodeValue+'/'+month.nodeValue+'/'+day.nodeValue; nickjillings@1631: var time = document.createElement("time"); nickjillings@1631: time.textContent = hour.nodeValue+':'+minute.nodeValue+':'+secs.nodeValue; nickjillings@1631: nickjillings@1631: date.setAttributeNode(year); nickjillings@1631: date.setAttributeNode(month); nickjillings@1631: date.setAttributeNode(day); nickjillings@1631: time.setAttributeNode(hour); nickjillings@1631: time.setAttributeNode(minute); nickjillings@1631: time.setAttributeNode(secs); nickjillings@1631: nickjillings@1631: hold.appendChild(date); nickjillings@1631: hold.appendChild(time); nickjillings@1631: return hold nickjillings@1631: nickjillings@1631: }