Mercurial > hg > webaudioevaluationtool

changeset 2385:ef2e0f925be9

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Merge branch 'master' of https://github.com/BrechtDeMan/WebAudioEvaluationTool
author www-data <www-data@sucuk.dcs.qmul.ac.uk>
date Fri, 20 May 2016 14:20:56 +0100
parents 0cbff12b2eec (current diff) 2ddc68898dff (diff)
children 7d1466f35a7b
files
diffstat 13 files changed, 136 insertions(+), 55 deletions(-) [+]
line wrap: on
line diff
--- a/index.html	Thu May 19 13:21:03 2016 +0100
+++ b/index.html	Fri May 20 14:20:56 2016 +0100
@@ -17,11 +17,7 @@
 		<!-- Use jQuery hosted from Google CDN -->
 		<!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>-->
 		<script type="text/javascript" src="js/jquery-2.1.4.js"></script>
-        <script type="text/javascript" src='js/specification.js'></script>
-		<script type="text/javascript" src='js/core.js'></script>
-		<script type="text/javascript" src='js/loudness.js'></script>
-		<script type="text/javascript" src='js/xmllint.js'></script>
-        <script type="text/javascript" src='js/WAVE.js'></script>
+        <script type="text/javascript" src="js/loader.js"></script>
 	</head>
 
 	<body>
--- a/interfaces/AB.js	Thu May 19 13:21:03 2016 +0100
+++ b/interfaces/AB.js	Fri May 20 14:20:56 2016 +0100
@@ -5,7 +5,7 @@
 	// 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
+	interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
 	
 	// Custom comparator Object
 	Interface.prototype.comparator = null;
@@ -325,7 +325,7 @@
 	};
 	
 	this.boxHolders = document.getElementById('box-holders');
-	this.boxHolders.innerHTML = null;
+	this.boxHolders.innerHTML = "";
 	this.comparators = [];
 	this.selected = null;
 	
--- a/interfaces/ABX.js	Thu May 19 13:21:03 2016 +0100
+++ b/interfaces/ABX.js	Fri May 20 14:20:56 2016 +0100
@@ -10,7 +10,7 @@
 	// Use this to do any one-time page / element construction. For instance, placing any stationary text objects,
 	// holding div's, or setting up any nodes which are present for the entire test sequence
     
-    interfaceContext.insertPoint.innerHTML = null; // Clear the current schema
+    interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
     
     Interface.prototype.checkScaleRange = function(min, max) {
         var page = testState.getCurrentTestPage();
@@ -126,7 +126,7 @@
 function loadTest(page)
 {
 	// Called each time a new test page is to be build. The page specification node is the only item passed in
-    document.getElementById('box-holders').innerHTML = null;
+    document.getElementById('box-holders').innerHTML = "";
     
     var interfaceObj = page.interfaces;
 	if (interfaceObj.length > 1)
--- a/interfaces/ape.js	Thu May 19 13:21:03 2016 +0100
+++ b/interfaces/ape.js	Fri May 20 14:20:56 2016 +0100
@@ -266,7 +266,7 @@
 	feedbackHolder.id = 'feedbackHolder';
 	
 	testContent.style.zIndex = 1;
-	interfaceContext.insertPoint.innerHTML = null; // Clear the current schema
+	interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
 	
 	// Inject into HTML
 	testContent.appendChild(title); // Insert the title
@@ -291,8 +291,8 @@
 	
 	var feedbackHolder = document.getElementById('feedbackHolder');
 	var sliderHolder = document.getElementById('slider-holder');
-	feedbackHolder.innerHTML = null;
-	sliderHolder.innerHTML = null;
+	feedbackHolder.innerHTML = "";
+	sliderHolder.innerHTML = "";
 	
 	// Delete outside reference
 	var outsideReferenceHolder = document.getElementById('outside-reference');
--- a/interfaces/discrete.js	Thu May 19 13:21:03 2016 +0100
+++ b/interfaces/discrete.js	Fri May 20 14:20:56 2016 +0100
@@ -92,7 +92,7 @@
 	feedbackHolder.id = 'feedbackHolder';
 	
 	testContent.style.zIndex = 1;
-	interfaceContext.insertPoint.innerHTML = null; // Clear the current schema
+	interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
 	
 	// Inject into HTML
 	testContent.appendChild(title); // Insert the title
@@ -113,7 +113,7 @@
 	var id = page.id;
 	
 	var feedbackHolder = document.getElementById('feedbackHolder');
-    feedbackHolder.innerHTML = null;
+    feedbackHolder.innerHTML = "";
 	var interfaceObj = page.interfaces;
 	if (interfaceObj.length > 1)
 	{
@@ -170,7 +170,7 @@
 	}
 	
 	var sliderBox = document.getElementById('slider-holder');
-	sliderBox.innerHTML = null;
+	sliderBox.innerHTML = "";
 	
 	var commentBoxPrefix = "Comment on track";
 	if (interfaceObj.commentBoxPrefix != undefined) {
@@ -405,9 +405,15 @@
 	var numObj = document.getElementsByClassName('track-slider').length;
 	var totalHeight = (numObj * 66)-30;
 	document.getElementById('scale-holder').style.width = window.innerWidth-220 + 'px';
+	// Cheers edge for making me delete a canvas every resize.
 	var canvas = document.getElementById('scale-canvas');
-	canvas.width = window.innerWidth-520;
-	canvas.height = totalHeight;
+    var new_canvas = document.createElement("canvas");
+    new_canvas.id = 'scale-canvas';
+    new_canvas.style.marginLeft = "150px";
+    canvas.parentElement.appendChild(new_canvas);
+    canvas.parentElement.removeChild(canvas);
+	new_canvas.width = window.innerWidth-520;
+	new_canvas.height = totalHeight;
 	for (var i in audioEngineContext.audioObjects)
 	{
 		if (audioEngineContext.audioObjects[i].specification.type != 'outside-reference'){
@@ -431,7 +437,7 @@
 	var height = canvas.height;
 	var width = canvas.width;
 	var textHolder = document.getElementById('scale-text-holder');
-	textHolder.innerHTML = null;
+	textHolder.innerHTML = "";
 	ctx.fillStyle = "#000000";
 	ctx.setLineDash([1,4]);
 	for (var scale of scales)
--- a/interfaces/horizontal-sliders.js	Thu May 19 13:21:03 2016 +0100
+++ b/interfaces/horizontal-sliders.js	Fri May 20 14:20:56 2016 +0100
@@ -92,7 +92,7 @@
 	feedbackHolder.id = 'feedbackHolder';
 	
 	testContent.style.zIndex = 1;
-	interfaceContext.insertPoint.innerHTML = null; // Clear the current schema
+	interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
 	
 	// Inject into HTML
 	testContent.appendChild(title); // Insert the title
@@ -113,7 +113,7 @@
 	var id = page.id;
 	
 	var feedbackHolder = document.getElementById('feedbackHolder');
-    feedbackHolder.innerHTML = null;
+    feedbackHolder.innerHTML = "";
     
 	var interfaceObj = page.interfaces;
 	if (interfaceObj.length > 1)
@@ -171,7 +171,7 @@
 	}
 	
 	var sliderBox = document.getElementById('slider-holder');
-	sliderBox.innerHTML = null;
+	sliderBox.innerHTML = "";
 	
 	var commentBoxPrefix = "Comment on track";
 	if (interfaceObj.commentBoxPrefix != undefined) {
@@ -359,9 +359,15 @@
 	var numObj = document.getElementsByClassName('track-slider').length;
 	var totalHeight = (numObj * 125)-25;
 	document.getElementById('scale-holder').style.width = window.innerWidth-220 + 'px';
+	// Cheers edge for making me delete a canvas every resize.
 	var canvas = document.getElementById('scale-canvas');
-	canvas.width = window.innerWidth-420;
-	canvas.height = totalHeight;
+    var new_canvas = document.createElement("canvas");
+    new_canvas.id = 'scale-canvas';
+    new_canvas.style.marginLeft = "100px";
+    canvas.parentElement.appendChild(new_canvas);
+    canvas.parentElement.removeChild(canvas);
+	new_canvas.width = window.innerWidth-420;
+	new_canvas.height = totalHeight;
 	for (var i in audioEngineContext.audioObjects)
 	{
 		if (audioEngineContext.audioObjects[i].specification.type != 'outside-reference'){
@@ -384,7 +390,7 @@
 	var height = canvas.height;
 	var width = canvas.width;
 	var textHolder = document.getElementById('scale-text-holder');
-	textHolder.innerHTML = null;
+	textHolder.innerHTML = "";
 	ctx.fillStyle = "#000000";
 	ctx.setLineDash([1,4]);
 	for (var scale of scales)
--- a/interfaces/mushra.css	Thu May 19 13:21:03 2016 +0100
+++ b/interfaces/mushra.css	Fri May 20 14:20:56 2016 +0100
@@ -101,6 +101,13 @@
 	border: 1px solid #000;
 }
 
+input[type=range]::-ms-track {
+	cursor: pointer;
+	background: #fff;
+	border-radius: 4px;
+	border: 1px solid #000;
+}
+
 input.track-slider-not-moved[type=range]::-webkit-slider-runnable-track {
 	background: #aaa;
 }
@@ -123,6 +130,16 @@
 	margin-left: -4px;
 }
 
+input[type=range]::-ms-thumb {
+	cursor: pointer;
+	margin-top: -1px;
+	margin-left: -4px;
+}
+
+input[type=range]::-ms-tooltip {
+	visibility:hidden;
+}
+
 div#page-count {
     float: left;
     margin: 0px 5px;
--- a/interfaces/mushra.js	Thu May 19 13:21:03 2016 +0100
+++ b/interfaces/mushra.js	Fri May 20 14:20:56 2016 +0100
@@ -94,7 +94,7 @@
 	feedbackHolder.id = 'feedbackHolder';
 	
 	testContent.style.zIndex = 1;
-	interfaceContext.insertPoint.innerHTML = null; // Clear the current schema
+	interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
 	
 	// Inject into HTML
 	testContent.appendChild(title); // Insert the title
@@ -114,7 +114,7 @@
 	var id = audioHolderObject.id;
 	
 	var feedbackHolder = document.getElementById('feedbackHolder');
-    feedbackHolder.innerHTML = null;
+    feedbackHolder.innerHTML = "";
 	var interfaceObj = audioHolderObject.interfaces;
 	if (interfaceObj.length > 1)
 	{
@@ -170,7 +170,7 @@
 	}
 	
 	var sliderBox = document.getElementById('slider-holder');
-	sliderBox.innerHTML = null;
+	sliderBox.innerHTML = "";
 	
 	var commentBoxPrefix = "Comment on track";
 	if (interfaceObj.commentBoxPrefix != undefined) {
@@ -390,9 +390,14 @@
 	}
 	document.getElementById('scale-holder').style.marginLeft = (diff-100) + 'px';
 	document.getElementById('scale-text-holder').style.height = window.innerHeight-194 + 'px';
+    // Cheers edge for making me delete a canvas every resize.
 	var canvas = document.getElementById('scale-canvas');
-	canvas.width = totalWidth;
-	canvas.height = window.innerHeight-194;
+    var new_canvas = document.createElement("canvas");
+    new_canvas.id = 'scale-canvas';
+    canvas.parentElement.appendChild(new_canvas);
+    canvas.parentElement.removeChild(canvas);
+	new_canvas.width = totalWidth;
+	new_canvas.height = window.innerHeight-194;
 	drawScale();
 }
 
@@ -407,9 +412,10 @@
 	var ctx = canvas.getContext("2d");
 	var height = canvas.height;
 	var width = canvas.width;
+    ctx.clearRect(0,0,canvas.width,canvas.height);
 	var draw_heights = [24, height-34];
 	var textHolder = document.getElementById('scale-text-holder');
-	textHolder.innerHTML = null;
+	textHolder.innerHTML = "";
 	var lastHeight = 0;
 	for (var scale of scales)
 	{
--- a/js/core.js	Thu May 19 13:21:03 2016 +0100
+++ b/js/core.js	Fri May 20 14:20:56 2016 +0100
@@ -116,7 +116,7 @@
     }
 }
 
-window.onload = function() {
+var onload = function() {
 	// Function called once the browser has loaded all files.
 	// This should perform any initial commands such as structure / loading documents
 	
@@ -562,7 +562,13 @@
 }
 
 function randomString(length) {
-    return Math.round((Math.pow(36, length + 1) - Math.random() * Math.pow(36, length))).toString(36).slice(1);
+    var str = ""
+    for (var i=0; i<length; i+=2) {
+        var num = Math.floor(Math.random()*1295);
+        str += num.toString(36);
+    }
+    return str;
+    //return Math.round((Math.pow(36, length + 1) - Math.random() * Math.pow(36, length))).toString(36).slice(1);
 }
 
 function randomiseOrder(input)
@@ -673,7 +679,7 @@
 	this.postNode = function() {
 		// This will take the node from the popupOptions and display it
 		var node = this.popupOptions[this.currentIndex];
-		this.popupResponse.innerHTML = null;
+		this.popupResponse.innerHTML = "";
 		this.popupTitle.textContent = node.specification.statement;
 		if (node.specification.type == 'question') {
 			var textArea = document.createElement('textarea');
@@ -2995,7 +3001,7 @@
         if (existingStore == undefined) {
             // We need to get the sessionKey
             this.SessionKey.generateKey();
-            this.document = document.implementation.createDocument(null,"waetresult");
+            this.document = document.implementation.createDocument(null,"waetresult",null);
             this.root = this.document.childNodes[0];
             var projectDocument = specification.projectXML;
             projectDocument.setAttribute('file-name',url);
@@ -3020,8 +3026,12 @@
             var parse = new DOMParser();
             var xml = parse.parseFromString(this.request.response,"text/xml");
             var shouldGenerateKey = true;
-            if(xml.getAllElementsByTagName("state").length > 0){
-				if (xml.getAllElementsByTagName("state")[0].textContent == "OK") {
+            if (this.request.response.length == 0) {
+                console.log("Error: Server did not respond");
+                return;
+            }
+            if(xml.getElementsByTagName("state").length > 0){
+				if (xml.getElementsByTagName("state")[0].textContent == "OK") {
 					this.key = xml.getAllElementsByTagName("key")[0].textContent;
 					this.parent.root.setAttribute("key",this.key);
 					this.parent.root.setAttribute("state","empty");
@@ -3215,3 +3225,5 @@
 		return this.root;
 	};
 }
+
+onload();
\ No newline at end of file
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/js/loader.js	Fri May 20 14:20:56 2016 +0100
@@ -0,0 +1,29 @@
+// Script to load the relevant JS files if the system supports it
+
+window.onload = function() {
+    // First check if the Web Audio API is supported
+    if (window.AudioContext == undefined && window.webkitAudioContext == undefined) {
+        // Display unsuported error message
+        var body = document.getElementsByTagName("body")[0];
+        body.innerHTML = "<h1>Sorry! Your browser is not supported :(</h1><p>Your browser does not support the HTML5 Web Audio API. Please use one of the following supported browsers instead.<p>";
+        var table = document.createElement("table");
+        table.border = "0";
+        table.innerHTML = "<tr><td>Chrome</td><td>v10 or newer</td></tr>";
+        table.innerHTML += "<tr><td>Firefox</td><td>v25 or newer</td></tr><tr><td>Safari (OSX)</td><td> v6 or newer, OSX only</td></tr>";
+        table.innerHTML += "<tr><td>Safari (iOS)</td><td>iOS 6.1 or newer</td></tr>";
+        table.innerHTML += "<tr><td>Edge</td><td>12 or newer</td></tr>";
+        body.appendChild(table);
+    } else {
+        var head = document.getElementsByTagName("head")[0];
+        var src_list = ['js/specification.js', 'js/core.js', 'js/loudness.js', 'js/xmllint.js', 'js/WAVE.js'];
+        for (var i=0; i<src_list.length; i++) {
+            var src = src_list[i];
+            var script = document.createElement("script");
+            script.type = "text/javascript";
+            script.async = false;
+            script.defer = true;
+            script.src = src;
+            head.appendChild(script);
+        }
+    }
+}
\ No newline at end of file
--- a/js/specification.js	Thu May 19 13:21:03 2016 +0100
+++ b/js/specification.js	Fri May 20 14:20:56 2016 +0100
@@ -1,15 +1,25 @@
 function Specification() {
 	// Handles the decoding of the project specification XML into a simple JavaScript Object.
 	
+    // <setup> attributes
 	this.interface = null;
 	this.projectReturn = null;
     this.returnURL = null;
 	this.randomiseOrder = null;
-	this.testPages = null;
+	this.poolSize = null;
+    this.loudness = null;
+    this.sampleRate = null;
+    this.calibration = null;
+    this.crossFade = null;
+    this.preSilence = null;
+    this.postSilence = null;
+    
+    // nodes
+    this.metrics = null;
+    this.preTest = undefined;
+    this.postTest = undefined;
 	this.pages = [];
-	this.metrics = null;
 	this.interfaces = null;
-	this.loudness = null;
 	this.errors = [];
 	this.schema = null;
     this.exitText = "Thank you.";
@@ -75,9 +85,8 @@
 		var schemaSetup = this.schema.getAllElementsByName('setup')[0];
 		// First decode the attributes
 		var attributes = schemaSetup.getAllElementsByTagName('xs:attribute');
-		for (var i in attributes)
+		for (var i=0; i<attributes.length; i++)
 		{
-			if (isNaN(Number(i)) == true){break;}
 			var attributeName = attributes[i].getAttribute('name') || attributes[i].getAttribute('ref');
 			var projectAttr = setupNode.getAttribute(attributeName);
 			projectAttr = this.processAttribute(projectAttr,attributes[i],this.schema);
@@ -105,8 +114,7 @@
 		
 		// Now process the survey node options
 		var survey = setupNode.getElementsByTagName('survey');
-		for (var i in survey) {
-			if (isNaN(Number(i)) == true){break;}
+		for (var i=0; i<survey.length; i++){
 			var location = survey[i].getAttribute('location');
             switch(location)
             {
@@ -240,9 +248,8 @@
 						this.type = 'statement';
 					} else {
 						this.options = [];
-						for (var i in children)
+						for (var i=0; i<children.length; i++)
 						{
-							if (isNaN(Number(i))==true){break;}
 							this.options.push({
 								name: children[i].getAttribute('name'),
 								text: children[i].textContent
@@ -488,8 +495,7 @@
 			// Now process the survey node options
 			var survey = xml.getElementsByTagName('survey');
 			var surveySchema = parent.schema.getAllElementsByName('survey')[0];
-			for (var i in survey) {
-				if (isNaN(Number(i)) == true){break;}
+			for (var i=0; i<survey.length; i++){
 				var location = survey[i].getAttribute('location');
 				if (location == 'pre' || location == 'before')
 				{
--- a/python/pythonServer.py	Thu May 19 13:21:03 2016 +0100
+++ b/python/pythonServer.py	Fri May 20 14:20:56 2016 +0100
@@ -122,7 +122,10 @@
 	s.send_response(200)
 	s.send_header("Content-type", "application/xml")
 	s.end_headers()
-	s.wfile.write(reply)
+	if sys.version_info[0] == 2:
+		s.wfile.write(reply)
+	elif sys.version_info[0] == 3:
+		s.wfile.write(bytes(reply, "utf-8"))
 	file = open("../saves/save-"+key+".xml",'w')
 	file.write("<waetresult key="+key+"/>")
 	file.close();
@@ -136,7 +139,7 @@
     varLen = int(self.headers['Content-Length'])
     postVars = self.rfile.read(varLen)
     print("Saving file key "+key)
-    file = open('../saves/save-'+key+'.xml','w')
+    file = open('../saves/save-'+key+'.xml','wb')
     file.write(postVars)
     file.close()
     try:
@@ -149,7 +152,11 @@
     self.send_response(200)
     self.send_header("Content-type", "text/xml")
     self.end_headers()
-    self.wfile.write('<response state="OK"><message>OK</message><file bytes="'+str(wbytes)+'">"saves/'+curFileName+'"</file></response>')
+    reply = '<response state="OK"><message>OK</message><file bytes="'+str(wbytes)+'">"saves/'+curFileName+'"</file></response>'
+    if sys.version_info[0] == 2:
+        self.wfile.write(reply)
+    elif sys.version_info[0] == 3:
+        self.wfile.write(bytes(reply, "utf-8"))
     curSaveIndex += 1
     curFileName = 'test-'+str(curSaveIndex)+'.xml'
 
--- a/test.html	Thu May 19 13:21:03 2016 +0100
+++ b/test.html	Fri May 20 14:20:56 2016 +0100
@@ -17,11 +17,7 @@
 		<!-- Use jQuery hosted from Google CDN -->
 		<!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>-->
 		<script type="text/javascript" src="js/jquery-2.1.4.js"></script>
-        <script type="text/javascript" src='js/specification.js'></script>
-		<script type="text/javascript" src='js/core.js'></script>
-		<script type="text/javascript" src='js/loudness.js'></script>
-		<script type="text/javascript" src='js/xmllint.js'></script>
-        <script type="text/javascript" src='js/WAVE.js'></script>
+        <script type="text/javascript" src="js/loader.js"></script>
 	</head>
 
 	<body>