nicholas@2: /** nicholas@2: * ape.js nicholas@2: * Create the APE interface nicholas@2: */ nicholas@2: n@662: // preTest - In preTest state n@662: // testRun-ID - In test running, test Id number at the end 'testRun-2' n@662: // testRunPost-ID - Post test of test ID n@662: // testRunPre-ID - Pre-test of test ID n@662: // postTest - End of test, final submission! n@662: n@656: nicholas@2: // Once this is loaded and parsed, begin execution n@911: loadInterface(); nicholas@2: n@911: function loadInterface() { nicholas@2: n@701: // Get the dimensions of the screen available to the page nicholas@2: var width = window.innerWidth; nicholas@2: var height = window.innerHeight; nicholas@2: nicholas@2: // The injection point into the HTML page n@912: interfaceContext.insertPoint = document.getElementById("topLevelBody"); n@706: var testContent = document.createElement('div'); nicholas@934: n@706: testContent.id = 'testContent'; n@906: n@658: n@676: // Create APE specific metric functions n@676: audioEngineContext.metric.initialiseTest = function() n@676: { n@676: }; n@676: n@676: audioEngineContext.metric.sliderMoved = function() n@676: { n@913: n@676: var id = this.data; n@676: this.data = -1; n@676: var position = convSliderPosToRate(id); BrechtDeMan@936: console.log('slider ' + id + ': '+ position + ' (' + time + ')'); // DEBUG/SAFETY: show position and slider id n@676: if (audioEngineContext.timer.testStarted) n@676: { n@676: audioEngineContext.audioObjects[id].metric.moved(time,position); n@676: } n@676: }; n@676: n@676: audioEngineContext.metric.sliderPlayed = function(id) n@676: { n@676: var time = audioEngineContext.timer.getTestTime(); n@676: if (audioEngineContext.timer.testStarted) n@676: { n@676: if (this.lastClicked >= 0) n@676: { n@676: audioEngineContext.audioObjects[this.lastClicked].metric.listening(time); n@676: } n@676: this.lastClicked = id; n@676: audioEngineContext.audioObjects[id].metric.listening(time); n@676: } BrechtDeMan@936: console.log('slider ' + id + ' played (' + time + ')'); // DEBUG/SAFETY: show played slider id n@676: }; n@676: nicholas@887: // Bindings for interfaceContext nicholas@887: Interface.prototype.checkAllPlayed = function() nicholas@887: { nicholas@887: hasBeenPlayed = audioEngineContext.checkAllPlayed(); nicholas@887: if (hasBeenPlayed.length > 0) // if a fragment has not been played yet nicholas@887: { nicholas@887: str = ""; nicholas@887: if (hasBeenPlayed.length > 1) { nicholas@887: for (var i=0; i 1) { nicholas@887: var str = ""; nicholas@887: for (var i=0; i 1) { nicholas@887: var str = ""; nicholas@887: for (var i=0; i'; n@913: this.trackSliderObj.draggable = true; n@913: this.trackSliderObj.ondragend = dragEnd; n@913: n@913: // Onclick, switch playback to that track n@913: this.trackSliderObj.onclick = function() { n@913: // Start the test on first click, that way timings are more accurate. n@913: audioEngineContext.play(); n@913: if (audioEngineContext.audioObjectsReady) { n@913: // Cannot continue to issue play command until audioObjects reported as ready! n@913: // Get the track ID from the object ID nicholas@899: var element; nicholas@899: if (event.srcElement.nodeName == "SPAN") { nicholas@899: element = event.srcElement.parentNode; nicholas@899: } else { nicholas@899: element = event.srcElement; nicholas@899: } nicholas@899: var id = Number(element.attributes['trackIndex'].value); n@913: //audioEngineContext.metric.sliderPlayed(id); n@895: audioEngineContext.play(id); n@913: // Currently playing track red, rest green n@913: n@913: //document.getElementById('track-slider-'+index).style.backgroundColor = "#FF0000"; n@913: $('.track-slider').removeClass('track-slider-playing'); nicholas@899: $(element).addClass('track-slider-playing'); n@913: $('.comment-div').removeClass('comment-box-playing'); n@913: $('#comment-div-'+id).addClass('comment-box-playing'); n@913: } n@913: }; n@913: nicholas@891: this.exportXMLDOM = function(audioObject) { n@913: // Called by the audioObject holding this element. Must be present n@913: var node = document.createElement('value'); n@913: node.textContent = convSliderPosToRate(this.trackSliderObj); n@913: return node; n@913: }; nicholas@891: this.getValue = function() { nicholas@891: return convSliderPosToRate(this.trackSliderObj); nicholas@892: }; n@913: } nicholas@5: nicholas@5: function dragEnd(ev) { nicholas@5: // Function call when a div has been dropped n@657: var slider = document.getElementById('slider'); n@963: var marginSize = Number(slider.attributes['marginsize'].value); n@675: var w = slider.style.width; n@675: w = Number(w.substr(0,w.length-2)); n@675: var x = ev.x; n@963: if (x >= marginSize && x < w+marginSize) { n@675: this.style.left = (x)+'px'; nicholas@5: } else { n@963: if (x audioObjs[anchorId].specification.marker) nicholas@891: { nicholas@891: // Anchor is not set below nicholas@891: console.log('Anchor node not below marker value'); nicholas@891: alert('Please keep listening'); nicholas@891: return; nicholas@891: } nicholas@891: } else { nicholas@891: // No marker value given, ensure it is the minimum value nicholas@891: var anchorVal = audioObjs[anchorId].interfaceDOM.getValue(); nicholas@891: for (var i=0; i audioObjs[i].interfaceDOM.getValue()) { nicholas@891: // Anchor not the minimum nicholas@891: console.log('No marker set, anchor node not the minimum'); nicholas@891: alert('Please keep listening'); nicholas@891: return; nicholas@891: } nicholas@891: } nicholas@891: } nicholas@891: } nicholas@891: } nicholas@891: if (referenceId != null) { nicholas@891: if (audioObjs[referenceId].specification.marker != null) { nicholas@891: if (audioObjs[referenceId].interfaceDOM.getValue() < audioObjs[referenceId].specification.marker) nicholas@891: { nicholas@891: // Anchor is not set below nicholas@891: console.log('Reference node not above marker value'); nicholas@891: alert('Please keep listening'); nicholas@891: return; nicholas@891: } nicholas@891: } else { nicholas@891: // No marker value given, ensure it is the minimum value nicholas@891: var referenceVal = audioObjs[referenceId].interfaceDOM.getValue(); nicholas@891: for (var i=0; i audioObjs[i].interfaceDOM.getValue()) { nicholas@891: // Anchor not the minimum nicholas@891: console.log('No marker set, reference node not the maximum'); nicholas@891: alert('Please keep listening'); nicholas@891: return; nicholas@891: } nicholas@891: } nicholas@891: } nicholas@891: } nicholas@891: } nicholas@891: nicholas@887: for (var i=0; i