changeset 701:c76205be5fc1

Added comments. Variable name changes to match specification document during ape.js loading.

--- a/ape.js	Tue Apr 07 10:33:02 2015 +0100
+++ b/ape.js	Tue Apr 07 11:32:46 2015 +0100
@@ -8,6 +8,7 @@
 
 function loadInterface(xmlDoc) {
 	
+	// Get the dimensions of the screen available to the page
 	var width = window.innerWidth;
 	var height = window.innerHeight;
 	
@@ -54,6 +55,8 @@
 	// Create playback start/stop points
 	var playback = document.createElement("button");
 	playback.innerText = 'Start';
+	// 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 == 0) {
 			audioEngineContext.play();
@@ -62,47 +65,52 @@
 			audioEngineContext.stop();
 			this.innerText = 'Start';
 		}
-	}
+	};
 	// Create Submit (save) button
 	var submit = document.createElement("button");
 	submit.innerText = 'Submit';
 	submit.onclick = function() {
 		// TODO: Update this for postTest tags
 		createProjectSave(projectReturn)
-	}
-	
+	};
+	// Append the interface buttons into the interfaceButtons object.
 	interfaceButtons.appendChild(playback);
 	interfaceButtons.appendChild(submit);
 	interfaceButtons.appendChild(downloadPoint);
 	
 	// Now create the slider and HTML5 canvas boxes
 	
+	// Create the div box to center align
 	var sliderBox = document.createElement('div');
 	sliderBox.className = 'sliderCanvasDiv';
-	sliderBox.id = 'sliderCanvasHolder'; // create an id so we can easily link to it later
+	sliderBox.id = 'sliderCanvasHolder';
 	sliderBox.align = 'center';
 	
+	// Create the slider box to hold the slider elements
 	var canvas = document.createElement('div');
 	canvas.id = 'slider';
+	// Must have a known EXACT width, as this is used later to determine the ratings
 	canvas.style.width = width - 100 +"px";
 	canvas.style.height = 150 + "px";
-	canvas.style.marginBottom = "25px"
+	canvas.style.marginBottom = "25px";
 	canvas.style.backgroundColor = '#eee';
 	canvas.align = "left";
 	sliderBox.appendChild(canvas);
-
+	
+	// Global parent for the comment boxes on the page
 	var feedbackHolder = document.createElement('div');
-	
-	var tracks = xmlDoc.find('audioHolder');
-	tracks = tracks[0];
-	var hostURL = tracks.attributes['hostURL'];
+	// Find the parent audioHolder object.
+	var audioHolder = xmlDoc.find('audioHolder');
+	audioHolder = audioHolder[0]; // Remove from one field array
+	// Extract the hostURL attribute. If not set, create an empty string.
+	var hostURL = audioHolder.attributes['hostURL'];
 	if (hostURL == undefined) {
 		hostURL = "";
 	} else {
 		hostURL = hostURL.value;
 	}
-	
-	var hostFs = tracks.attributes['sampleRate'];
+	// Extract the sampleRate. If set, convert the string to a Number.
+	var hostFs = audioHolder.attributes['sampleRate'];
 	if (hostFs != undefined) {
 		hostFs = Number(hostFs.value);
 	}
@@ -115,24 +123,31 @@
 			return;
 		}
 	}
-	
-	var tracksXML = xmlDoc.find('audioElements');
-	tracksXML.each(function(index,element){
+	// Find all the audioElements from the audioHolder
+	var audioElements = $(audioHolder).find('audioElements');
+	audioElements.each(function(index,element){
 		// Find URL of track
+		// In this jQuery loop, variable 'this' holds the current audioElement.
+		
+		// Now load each audio sample. First create the new track by passing the full URL
 		var trackURL = hostURL + this.attributes['url'].value;
-		// Now load each track in
 		audioEngineContext.newTrack(trackURL);
-		var trackObj = document.createElement('div');
-		var trackTitle = document.createElement('span');
-		trackTitle.innerText = 'Comment on track '+index;
-		var trackComment = document.createElement('textarea');
-		trackComment.rows = '4';
-		trackComment.cols = '100';
-		trackComment.name = 'trackComment'+index;
-		trackComment.className = 'trackComment';
-		trackObj.appendChild(trackTitle);
-		trackObj.appendChild(trackComment);
-		feedbackHolder.appendChild(trackObj);
+		// Create document objects to hold the comment boxes
+		var trackComment = document.createElement('div');
+		// Create a string next to each comment asking for a comment
+		var trackString = document.createElement('span');
+		trackString.innerText = 'Comment on track '+index;
+		// Create the HTML5 comment box 'textarea'
+		var trackCommentBox = document.createElement('textarea');
+		trackCommentBox.rows = '4';
+		trackCommentBox.cols = '100';
+		trackCommentBox.name = 'trackComment'+index;
+		trackCommentBox.className = 'trackComment';
+		// Add to the holder.
+		trackComment.appendChild(trackString);
+		trackComment.appendChild(trackCommentBox);
+		feedbackHolder.appendChild(trackComment);
+		
 		// Create a slider per track
 		
 		var trackSliderObj = document.createElement('div');

--- a/core.js	Tue Apr 07 10:33:02 2015 +0100
+++ b/core.js	Tue Apr 07 11:32:46 2015 +0100
@@ -21,7 +21,7 @@
 	
 	// Create the audio engine object
 	audioEngineContext = new AudioEngine();
-}
+};
 
 function loadProjectSpec(url) {
 	// Load the project document from the given URL, decode the XML and instruct audioEngine to get audio data
@@ -30,9 +30,9 @@
 	r.open('GET',url,true);
 	r.onload = function() {
 		loadProjectSpecCallback(r.response);
-	}
+	};
 	r.send();
-}
+};
 
 function loadProjectSpecCallback(response) {
 	// Function called after asynchronous download of XML project specification
@@ -41,6 +41,7 @@
 	
 	// Now extract the setup tag
 	var xmlSetup = projectXML.find('setup');
+	// Detect the interface to use and load the relevant javascripts.
 	var interfaceType = xmlSetup[0].attributes['interface'];
 	var interfaceJS = document.createElement('script');
 	interfaceJS.setAttribute("type","text/javascript");
@@ -108,7 +109,7 @@
 			}
 			this.status = 1;
 		}
-	}
+	};
 	
 	this.stop = function() {
 		// Send stop and reset command to all playback buffers
@@ -119,7 +120,7 @@
 			}
 			this.status = 0;
 		}
-	}
+	};
 	
 	this.selectedTrack = function(id) {
 		for (var i=0; i<this.audioObjects.length; i++)
@@ -130,7 +131,7 @@
 				this.audioObjects[i].outputGain.gain.value = 0.0;
 			}
 		}
-	}
+	};
 	
 	
 	this.newTrack = function(url) {
@@ -143,7 +144,7 @@
 
 		// AudioObject will get track itself.
 		this.audioObjects[audioObjectId].constructTrack(url);
-	}
+	};
 	
 }
 
@@ -170,7 +171,7 @@
 	
 	this.play = function(startTime) {
 		this.bufferNode.start(startTime);
-	}
+	};
 	
 	this.stop = function() {
 		this.bufferNode.stop(0);
@@ -178,7 +179,7 @@
 		this.bufferNode.connect(this.outputGain);
 		this.bufferNode.buffer = this.buffer;
 		this.bufferNode.loop = true;
-	}
+	};
 
 	this.constructTrack = function(url) {
 		var request = new XMLHttpRequest();
@@ -202,8 +203,8 @@
 					console.log('FATAL - Error loading buffer on '+audioObj.id);
 				}
 			});
-		}
+		};
 		request.send();
-	}
+	};
 	
 }
\ No newline at end of file