Merge pull request #273 from neoflex/webserver-remote-control

webinterface.default: add remote control section

4 files changed, 238 insertions, 5 deletions

diff --git a/addons/webinterface.default/css/core.css b/addons/webinterface.default/css/core.css
index a549bebf10..5a85857dd5 100755
--- a/addons/webinterface.default/css/core.css
+++ b/addons/webinterface.default/css/core.css
@@ -11,7 +11,18 @@ body {
 	z-index: 200;
 	background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVIAAAAxCAYAAACIwiGvAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjZCRDgxQTQzQkFDMDExREY4ODlGRUQyRUNBMzRDRUJBIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjZCRDgxQTQ0QkFDMDExREY4ODlGRUQyRUNBMzRDRUJBIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NkJEODFBNDFCQUMwMTFERjg4OUZFRDJFQ0EzNENFQkEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NkJEODFBNDJCQUMwMTFERjg4OUZFRDJFQ0EzNENFQkEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6eCPqDAAAey0lEQVR42uxdC7hfw7Wf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%3D')	1px 1px no-repeat #fff;
 	}
-
+#remoteContainer {
+	background:url("../images/remote.jpg") no-repeat;
+	width: 659px;
+	height: 213px;
+	position: relative;
+	margin: auto;
+	margin-top: 50px;
+}
+.remote_key {
+	cursor:pointer;
+	position:absolute;
+}
 #navigation {
 	float: right;
 	}
diff --git a/addons/webinterface.default/images/remote.jpg b/addons/webinterface.default/images/remote.jpg
new file mode 100755
index 0000000000..f915659681
--- /dev/null
+++ b/addons/webinterface.default/images/remote.jpg
diff --git a/addons/webinterface.default/index.html b/addons/webinterface.default/index.html
index 89fae65a40..a06a3fa6fb 100755
--- a/addons/webinterface.default/index.html
+++ b/addons/webinterface.default/index.html
@@ -19,7 +19,7 @@
 			<div id="commsErrorPanel" style="display: none;"></div>
 			<div id="navigation">
 				<ul>
-					<!-- <li id="remoteControl">Remote</li> -->
+					<li id="remoteControl">Remote</li>
 					<li id="movieLibrary">Movies</li>
 					<li id="tvshowLibrary">TV Shows</li>
 					<li id="musicLibrary">Music</li>
@@ -77,4 +77,4 @@
 			applyDeviceFixes();
 		</script>
 	</body>
-</html>
\ No newline at end of file
+</html>
diff --git a/addons/webinterface.default/js/MediaLibrary.js b/addons/webinterface.default/js/MediaLibrary.js
index 7ef8a6aceb..d1732571a5 100755
--- a/addons/webinterface.default/js/MediaLibrary.js
+++ b/addons/webinterface.default/js/MediaLibrary.js
@@ -35,6 +35,7 @@ MediaLibrary.prototype = {
 			$('#movieLibrary').click(jQuery.proxy(this.movieLibraryOpen, this));
 			$('#tvshowLibrary').click(jQuery.proxy(this.tvshowLibraryOpen, this));
 			$('#pictureLibrary').click(jQuery.proxy(this.pictureLibraryOpen, this));
+			$('#remoteControl').click(jQuery.proxy(this.remoteControlOpen, this));
 			$('#overlay').click(jQuery.proxy(this.hideOverlay, this));
 			$(window).resize(jQuery.proxy(this.updatePlayButtonLocation, this));
 		},
@@ -42,6 +43,7 @@ MediaLibrary.prototype = {
 			$('#musicLibrary').removeClass('selected');
 			$('#movieLibrary').removeClass('selected');
 			$('#tvshowLibrary').removeClass('selected');
+			$('#remoteControl').removeClass('selected');
 			$('#pictureLibrary').removeClass('selected');
 			this.hideOverlay();
 		},
@@ -61,6 +63,228 @@ MediaLibrary.prototype = {
 			
 			return result;
 		},
+
+		remoteControlOpen: function(event) {
+			this.resetPage();
+			$('#remoteControl').addClass('selected');
+			$('.contentContainer').hide();
+			var libraryContainer = $('#remoteContainer');
+			if (!libraryContainer || libraryContainer.length == 0) {
+				$('#spinner').show();
+				libraryContainer = $('<div>');
+				libraryContainer.attr('id', 'remoteContainer')
+								.addClass('contentContainer');
+				$('#content').append(libraryContainer);
+				var keys=[
+						{name:'up',width:'40px',height:'30px',top:'28px',left:'58px'}
+						,{name:'down',width:'40px',height:'30px',top:'122px',left:'58px'}
+						,{name:'left',width:'40px',height:'30px',top:'74px',left:'15px'}
+						,{name:'right',width:'40px',height:'30px',top:'74px',left:'104px'}
+						,{name:'ok',width:'40px',height:'30px',top:'74px',left:'58px'}
+						,{name:'back',width:'40px',height:'30px',top:'13px',left:'161px'}
+						,{name:'home',width:'40px',height:'30px',top:'154px',left:'8px'}
+						,{name:'mute',width:'40px',height:'30px',top:'107px',left:'391px'}
+						,{name:'power',width:'30px',height:'30px',top:'-3px',left:'13px'}
+						,{name:'volumeup',width:'30px',height:'30px',top:'49px',left:'422px'}
+						,{name:'volumedown',width:'30px',height:'30px',top:'49px',left:'367px'}
+						,{name:'playpause',width:'32px',height:'23px',top:'62px',left:'260px'}
+						,{name:'stop',width:'32px',height:'23px',top:'62px',left:'211px'}
+						,{name:'next',width:'38px',height:'25px',top:'102px',left:'304px'}
+						,{name:'previous',width:'38px',height:'25px',top:'101px',left:'160px'}
+						,{name:'forward',width:'32px',height:'23px',top:'102px',left:'259px'}
+						,{name:'rewind',width:'32px',height:'23px',top:'101px',left:'211px'}
+						,{name:'cleanlib_a',width:'46px',height:'26px',top:'47px',left:'553px'}
+						,{name:'updatelib_a',width:'46px',height:'26px',top:'47px',left:'492px'}
+						,{name:'cleanlib_v',width:'46px',height:'26px',top:'111px',left:'553px'}
+						,{name:'updatelib_v',width:'46px',height:'26px',top:'111px',left:'492px'}
+					 ];
+				for (var akey in keys) {
+					var aremotekey=$('<p>').attr('id',keys[akey]['name']);
+					aremotekey.addClass('remote_key')
+						.css('height',keys[akey]['height'])
+						.css('width',keys[akey]['width'])
+						.css('top',keys[akey]['top'])
+						.css('left',keys[akey]['left'])
+						//.css('border','1px solid black')
+						.bind('click',{key: keys[akey]['name']},jQuery.proxy(this.pressRemoteKey,this));
+						libraryContainer.append(aremotekey);
+				}
+				
+	
+			} else {
+				libraryContainer.show();
+				libraryContainer.trigger('scroll');
+			}
+
+			$('#spinner').hide();
+		},
+
+		pressRemoteKey: function(event) {
+			var keyPressed=event.data.key;
+			$('#spinner').show();
+			var player='other';
+			if($('#videoDescription').is(':visible'))
+			{
+			  player='video'	
+			}
+			else if($('#audioDescription').is(':visible'))
+			{
+			  player='audio'	
+			}
+			//common part
+			switch(keyPressed) {
+				case 'cleanlib_a':
+					jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "AudioLibrary.Clean", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+					return;	
+				case 'updatelib_a':
+					jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "AudioLibrary.Scan", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+					return;	
+				case 'cleanlib_v':
+					jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "VideoLibrary.Clean", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+					return;	
+				case 'updatelib_v':
+					jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "VideoLibrary.Scan", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+					return;	
+				case 'back':
+					jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "Input.Back", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+					return;	
+				case 'home':
+					jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "Input.Home", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+					return;
+				case 'mute':
+					jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "XBMC.ToggleMute", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+					return;
+				case 'power':
+					jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "System.Shutdown", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+					return;
+				case 'volumeup':
+					jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "XBMC.GetVolume", "id": 1}', function(data){
+						var volume=data.result + 1;
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "XBMC.SetVolume", "params": {"value": '+volume+'},"id": 1}', function(data){
+					
+						$('#spinner').hide();
+			  			 }, 'json');
+			   }, 'json');
+					return;
+				case 'volumedown':
+					jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "XBMC.GetVolume", "id": 1}', function(data){
+						var volume=data.result - 1;
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "XBMC.SetVolume", "params": {"value": '+volume+'},"id": 1}', function(data){
+					
+						$('#spinner').hide();
+			  			 }, 'json');
+			   }, 'json');
+					return;
+			}
+			//menus or other sections
+			if(player=='other')
+			{	
+				switch(keyPressed) {
+					
+					case 'up':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "Input.Up", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'down':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "Input.Down", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+	
+					case 'left':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "Input.Left", "id": 1}', function(data){$('#spinner').hide();}, 'json');	
+						return;
+	
+					case 'right':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "Input.Right", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+	
+					case 'ok':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "Input.Select", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;				
+				}
+			}
+			//videoplaying
+			if(player=='video')
+			{
+				switch(keyPressed) {
+	
+					
+					case 'up':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "VideoPlayer.BigSkipForward", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'down':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "VideoPlayer.BigSkipBackward", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+	
+					case 'left':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "VideoPlayer.SmallSkipBackward", "id": 1}', function(data){$('#spinner').hide();}, 'json');	
+						return;
+	
+					case 'right':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "VideoPlayer.SmallSkipForward", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'playpause':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "VideoPlayer.PlayPause", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'stop':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "VideoPlayer.Stop", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'next':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "VideoPlayer.SkipNext", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'previous':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "VideoPlayer.SkipPrevious", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'forward':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "VideoPlayer.Forward", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'rewind':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "VideoPlayer.Rewind", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+						
+				}			
+			}
+			if(player=='audio')
+			{
+				switch(keyPressed) {
+	
+					
+					case 'up':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "AudioPlayer.BigSkipForward", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'down':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "AudioPlayer.BigSkipBackward", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+	
+					case 'left':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "AudioPlayer.SmallSkipBackward", "id": 1}', function(data){$('#spinner').hide();}, 'json');	
+						return;
+	
+					case 'right':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "AudioPlayer.SmallSkipForward", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'playpause':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "AudioPlayer.PlayPause", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'stop':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "AudioPlayer.Stop", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'next':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "AudioPlayer.SkipNext", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'previous':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "AudioPlayer.SkipPrevious", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'forward':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "AudioPlayer.Forward", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+					case 'rewind':
+						jQuery.post(JSON_RPC + '?SendRemoteKey', '{"jsonrpc": "2.0", "method": "AudioPlayer.Rewind", "id": 1}', function(data){$('#spinner').hide();}, 'json');
+						return;
+						
+				}			
+			}
+
+		},
+
 		musicLibraryOpen: function(event) {
 			this.resetPage();
 			$('#musicLibrary').addClass('selected');
@@ -294,7 +518,6 @@ MediaLibrary.prototype = {
 										  .addClass('contentContainer')
 										  .addClass('tvshowContainer');
 					var showThumb = this.generateThumb('tvshowseason', event.data.tvshow.thumbnail, event.data.tvshow.title);
-					
 					if (data && data.result && data.result.seasons && data.result.seasons.length > 0) {
 						var showDetails = $('<div>').addClass('showDetails');
 						showDetails.append(toggle);
@@ -450,7 +673,6 @@ MediaLibrary.prototype = {
 		},
 		playMovie: function(event) {
 			var file = this.replaceAll(event.data.movie.file, "\\", "\\\\");
-			alert(file);
 			jQuery.post(JSON_RPC + '?PlayMovie', '{"jsonrpc": "2.0", "method": "XBMC.Play", "params": { "file": "' + file + '" }, "id": 1}', jQuery.proxy(function(data) {
 				this.hideOverlay();
 			}, this), 'json');