# HG changeset patch
# User Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk>
# Date 1452623395 0
# Node ID d39d243e66011748b1357616a3a65d6a647915c4
# Parent  44f7a5013b9400c3db7557b828ee58c65daeb10f
Outside references now have an interfaceDOM. All interfaceDOM objects must respond to canMove() for determining if fixed or not.

diff -r 44f7a5013b94 -r d39d243e6601 AB.js
--- a/AB.js	Tue Jan 12 17:26:40 2016 +0000
+++ b/AB.js	Tue Jan 12 18:29:55 2016 +0000
@@ -204,9 +204,13 @@
 			return this.value;	
 		};
 		this.getPresentedId = function()
-	{
-		return this.selector.children[0].textContent;
-	};
+		{
+			return this.selector.children[0].textContent;
+		};
+		this.canMove = function()
+		{
+			return false;
+		};
 	};
 	
 	this.boxHolders = document.getElementById('box-holders');
diff -r 44f7a5013b94 -r d39d243e6601 ape.js
--- a/ape.js	Tue Jan 12 17:26:40 2016 +0000
+++ b/ape.js	Tue Jan 12 18:29:55 2016 +0000
@@ -335,40 +335,14 @@
 	$(audioHolderObject.audioElements).each(function(index,element){
 		// Find URL of track
 		// In this jQuery loop, variable 'this' holds the current audioElement.
-		
+		var audioObject = audioEngineContext.newTrack(element);
 		// Check if an outside reference
 		if (element.type == 'outside-reference')
 		{
 			// Construct outside reference;
-			var outsideReferenceHolder = document.createElement('div');
-			outsideReferenceHolder.id = 'outside-reference';
-			outsideReferenceHolder.className = 'outside-reference';
-			outsideReferenceHolderspan = document.createElement('span');
-			outsideReferenceHolderspan.textContent = 'Reference';
-			outsideReferenceHolder.appendChild(outsideReferenceHolderspan);
-			outsideReferenceHolder.setAttribute('track-id',index);
-			
-			var audioObject = audioEngineContext.newTrack(element);
-			
-			outsideReferenceHolder.onclick = function(event)
-			{
-				audioEngineContext.play(event.currentTarget.getAttribute('track-id'));
-				$('.track-slider').removeClass('track-slider-playing');
-	            $('.comment-div').removeClass('comment-box-playing');
-	            if (event.currentTarget.nodeName == 'DIV') {
-	            	$(event.currentTarget).addClass('track-slider-playing');
-	            } else {
-	            	$(event.currentTarget.parentElement).addClass('track-slider-playing');
-	            }
-			};
-			
-			document.getElementById('interface-buttons').appendChild(outsideReferenceHolder);
+			var orNode = new outsideReferenceDOM(audioObject,index,document.getElementById('interface-buttons'));
+			audioObject.bindInterface(orNode);
 		} else {
-		
-			// Now load each audio sample. First create the new track by passing the full URL
-			var trackURL = audioHolderObject.hostURL + element.url;
-			var audioObject = audioEngineContext.newTrack(element);
-			
 			var node = interfaceContext.createCommentBox(audioObject);
 			// Create a slider per track
 			var sliderNode = new sliderObject(audioObject,interfaceObj);
@@ -652,6 +626,69 @@
 	{
 		return this.trackSliderObjects[0].children[0].textContent;
 	};
+	this.canMove = function()
+	{
+		return true;
+	};
+}
+
+function outsideReferenceDOM(audioObject,index,inject)
+{
+	this.parent = audioObject;
+	this.outsideReferenceHolder = document.createElement('div');
+	this.outsideReferenceHolder.id = 'outside-reference';
+	this.outsideReferenceHolder.className = 'outside-reference track-slider-disabled';
+	var outsideReferenceHolderspan = document.createElement('span');
+	outsideReferenceHolderspan.textContent = 'Reference';
+	this.outsideReferenceHolder.appendChild(outsideReferenceHolderspan);
+	this.outsideReferenceHolder.setAttribute('track-id',index);
+	
+	this.outsideReferenceHolder.onclick = function(event)
+	{
+		audioEngineContext.play(event.currentTarget.getAttribute('track-id'));
+		$('.track-slider').removeClass('track-slider-playing');
+        $('.comment-div').removeClass('comment-box-playing');
+        if (event.currentTarget.nodeName == 'DIV') {
+        	$(event.currentTarget).addClass('track-slider-playing');
+        } else {
+        	$(event.currentTarget.parentElement).addClass('track-slider-playing');
+        }
+	};
+	inject.appendChild(this.outsideReferenceHolder);
+	this.enable = function()
+	{
+		if (this.parent.state == 1)
+		{
+			$(this.outsideReferenceHolder).removeClass('track-slider-disabled');
+		}
+	};
+	this.updateLoading = function(progress)
+	{
+		if (progress != 100)
+		{
+			progress = String(progress);
+			progress = progress.split('.')[0];
+			this.outsideReferenceHolder[0].children[0].textContent = progress+'%';
+		} else {
+			this.outsideReferenceHolder[0].children[0].textContent = "Play Reference";
+		}
+	};
+	this.exportXMLDOM = function(audioObject)
+	{
+		return null;
+	};
+	this.getValue = function()
+	{
+		return 0;
+	};
+	this.getPresentedId = function()
+	{
+		return 'reference';
+	};
+	this.canMove = function()
+	{
+		return false;
+	};
 }
 
 function buttonSubmitClick()
diff -r 44f7a5013b94 -r d39d243e6601 core.js
--- a/core.js	Tue Jan 12 17:26:40 2016 +0000
+++ b/core.js	Tue Jan 12 18:29:55 2016 +0000
@@ -1238,12 +1238,15 @@
 		this.storeDOM.appendChild(file);
 		if (this.specification.type != 'outside-reference') {
 			var interfaceXML = this.interfaceDOM.exportXMLDOM(this);
-			if (interfaceXML.length == undefined) {
-				this.storeDOM.appendChild(interfaceXML);
-			} else {
-				for (var i=0; i<interfaceXML.length; i++)
-				{
-					this.storeDOM.appendChild(interfaceXML[i]);
+			if (interfaceXML != null)
+			{
+				if (interfaceXML.length == undefined) {
+					this.storeDOM.appendChild(interfaceXML);
+				} else {
+					for (var i=0; i<interfaceXML.length; i++)
+					{
+						this.storeDOM.appendChild(interfaceXML[i]);
+					}
 				}
 			}
 			if (this.commentDOM != null) {
@@ -2730,8 +2733,8 @@
 			if (passed == false)
 			{
 				check_pass = false;
-				console.log("Continue listening to track-"+i);
-				error_obj.push(i);
+				console.log("Continue listening to track-"+audioEngineContext.audioObjects.interfaceDOM.getPresentedId());
+				error_obj.push(audioEngineContext.audioObjects.interfaceDOM.getPresentedId());
 			}
 		}
 		if (check_pass == false)
@@ -2754,11 +2757,11 @@
 	{
 		var str = "You have not moved ";
 		var failed = [];
-		for (var i in audioEngineContext.audioObjects)
+		for (var ao of audioEngineContext.audioObjects)
 		{
-			if(audioEngineContext.audioObjects[i].metric.wasMoved == false && audioEngineContext.audioObjects[i].specification.type != 'outsidereference')
+			if(ao.metric.wasMoved == false && ao.interfaceDOM.canMove() == true)
 			{
-				failed.push(audioEngineContext.audioObjects[i].id);
+				failed.push(ao.interfaceDOM.getPresentedId());
 			}
 		}
 		if (failed.length == 0)
@@ -2784,11 +2787,11 @@
 	{
 		var str = "You have not played ";
 		var failed = [];
-		for (var i in audioEngineContext.audioObjects)
+		for (var ao of audioEngineContext.audioObjects)
 		{
-			if(audioEngineContext.audioObjects[i].metric.wasListenedTo == false)
+			if(ao.metric.wasListenedTo == false)
 			{
-				failed.push(audioEngineContext.audioObjects[i].id);
+				failed.push(ao.interfaceDOM.getPresentedId());
 			}
 		}
 		if (failed.length == 0)
diff -r 44f7a5013b94 -r d39d243e6601 mushra.js
--- a/mushra.js	Tue Jan 12 17:26:40 2016 +0000
+++ b/mushra.js	Tue Jan 12 18:29:55 2016 +0000
@@ -159,23 +159,9 @@
 		var audioObject = audioEngineContext.newTrack(element);
 		if (element.type == 'outside-reference')
 		{
-			var outsideReferenceHolder = document.createElement('button');
-			outsideReferenceHolder.id = 'outside-reference';
-			outsideReferenceHolder.className = 'outside-reference';
-			outsideReferenceHolder.setAttribute('track-id',index);
-			outsideReferenceHolder.textContent = "Play Reference";
-			
-			var audioObject = audioEngineContext.newTrack(element);
-			
-			outsideReferenceHolder.onclick = function(event)
-			{
-				audioEngineContext.play(event.currentTarget.getAttribute('track-id'));
-				$('.track-slider').removeClass('track-slider-playing');
-	            $('.comment-div').removeClass('comment-box-playing');
-	            $(event.currentTarget).addClass('track-slider-playing');
-			};
-			
-			document.getElementById('interface-buttons').appendChild(outsideReferenceHolder);
+			// Construct outside reference;
+			var orNode = new outsideReferenceDOM(audioObject,index,document.getElementById('interface-buttons'));
+			audioObject.bindInterface(orNode);
 		} else {
 			var node = interfaceContext.createCommentBox(audioObject);
 		
@@ -296,6 +282,64 @@
 	{
 		return this.title.textContent;
 	};
+	this.canMove = function()
+	{
+		return true;
+	};
+}
+
+function outsideReferenceDOM(audioObject,index,inject)
+{
+	this.parent = audioObject;
+	this.outsideReferenceHolder = document.createElement('button');
+	this.outsideReferenceHolder.id = 'outside-reference';
+	this.outsideReferenceHolder.className = 'outside-reference';
+	this.outsideReferenceHolder.setAttribute('track-id',index);
+	this.outsideReferenceHolder.textContent = "Play Reference";
+	this.outsideReferenceHolder.disabled = true;
+	
+	this.outsideReferenceHolder.onclick = function(event)
+	{
+		audioEngineContext.play(event.currentTarget.getAttribute('track-id'));
+		$('.track-slider').removeClass('track-slider-playing');
+        $('.comment-div').removeClass('comment-box-playing');
+        $(event.currentTarget).addClass('track-slider-playing');
+	};
+	inject.appendChild(this.outsideReferenceHolder);
+	this.enable = function()
+	{
+		if (this.parent.state == 1)
+		{
+			this.outsideReferenceHolder.disabled = false;
+		}
+	};
+	this.updateLoading = function(progress)
+	{
+		if (progress != 100)
+		{
+			progress = String(progress);
+			progress = progress.split('.')[0];
+			this.outsideReferenceHolder[0].children[0].textContent = progress+'%';
+		} else {
+			this.outsideReferenceHolder[0].children[0].textContent = "Play Reference";
+		}
+	};
+	this.exportXMLDOM = function(audioObject)
+	{
+		return null;
+	};
+	this.getValue = function()
+	{
+		return 0;
+	};
+	this.getPresentedId = function()
+	{
+		return 'reference';
+	};
+	this.canMove = function()
+	{
+		return false;
+	};
 }
 
 function resizeWindow(event)