fix persistent playlist for media player

6 files changed, 61 insertions, 22 deletions

diff --git a/apps/media/css/player.css b/apps/media/css/player.css
new file mode 100644
index 00000000000..265b305eaed
--- /dev/null
+++ b/apps/media/css/player.css
@@ -0,0 +1,19 @@
+#playercontrols{
+	display:inline;
+	width:7em;
+	height:1em;
+	position:fixed;
+	top:auto;
+	left:auto;
+	background:transparent;
+	box-shadow:none;
+	-webkit-box-shadow:none;
+}
+#playercontrols li{
+	float:left;
+}
+#playercontrols a, #playercontrols li{
+	margin:0px;
+	padding:0;
+	left:0;
+}
\ No newline at end of file
diff --git a/apps/media/js/loader.js b/apps/media/js/loader.js
index c6c834d3a31..dff4163897f 100644
--- a/apps/media/js/loader.js
+++ b/apps/media/js/loader.js
@@ -22,16 +22,17 @@ function addAudio(filename){
 
 function loadPlayer(type,ready){
 	if(!loadPlayer.done){
+		loadPlayer.done=true;
+		OC.addStyle('media','player');
 		OC.addScript('media','jquery.jplayer.min',function(){
 			OC.addScript('media','player',function(){
-				$('body').append($('<div id="playerPlaceholder"/>'))
-				$('#playerPlaceholder').append($('<div/>')).load(OC.filePath('media','templates','player.php'),function(){
-					loadPlayer.done=true;
+				var navItem=$('#apps a[href="'+OC.linkTo('media','index.php')+'"]');
+				navItem.height(navItem.height());
+				navItem.load(OC.filePath('media','templates','player.php'),function(){
 					PlayList.init(type,ready);
 				});
 			});
 		});
-		OC.addStyle('media','player');
 	}else{
 		ready();
 	}
diff --git a/apps/media/js/player.js b/apps/media/js/player.js
index 693bf2d70bf..b3eb5278705 100644
--- a/apps/media/js/player.js
+++ b/apps/media/js/player.js
@@ -28,18 +28,19 @@ var PlayList={
 		if(index==null){
 			index=PlayList.current;
 		}
+		PlayList.save();
 		if(index>-1 && index<items.length){
 			PlayList.current=index;
 			if(PlayList.player){
 				if(PlayList.player.data('jPlayer').options.supplied!=items[index].type){//the the audio type changes we need to reinitialize jplayer
 					PlayList.player.jPlayer("play",time);
-                    localStorage.setItem(oc_current_user+'oc_playlist_time',time);
+					localStorage.setItem(oc_current_user+'oc_playlist_time',time);
 					PlayList.player.jPlayer("destroy");
-                    PlayList.save(); // so that the init don't lose the playlist
+// 					PlayList.save(); // so that the init don't lose the playlist
 					PlayList.init(items[index].type,null); // init calls load that calls play
 				}else{
 					PlayList.player.jPlayer("setMedia", items[PlayList.current]);
-                                        $(".jp-current-song").text(items[PlayList.current].name);
+					$(".jp-current-song").text(items[PlayList.current].name);
 					items[index].playcount++;
 					PlayList.player.jPlayer("play",time);
 					if(index>0){
@@ -57,6 +58,7 @@ var PlayList={
 					if (typeof Collection !== 'undefined') {
 						Collection.registerPlay();
 					}
+					PlayList.render();
 					if(ready){
 						ready();
 					}
@@ -64,12 +66,12 @@ var PlayList={
 			}else{
 				localStorage.setItem(oc_current_user+'oc_playlist_time',time);
 				localStorage.setItem(oc_current_user+'oc_playlist_playing','true');
-                PlayList.save(); // so that the init don't lose the playlist
+//                 PlayList.save(); // so that the init don't lose the playlist
 				PlayList.init(items[index].type,null); // init calls load that calls play
 			}
 		}
-                $(".song").removeClass("collection_playing");
-                $(".jp-playlist-" + index).addClass("collection_playing");
+		$(".song").removeClass("collection_playing");
+		$(".jp-playlist-" + index).addClass("collection_playing");
 	},
 	init:function(type,ready){
 		if(!PlayList.player){
@@ -85,7 +87,7 @@ var PlayList={
 				PlayList.render();
 				return false;
 			});
-			PlayList.player=$('#controls div.player');
+			PlayList.player=$('#jp-player');
 		}
 		$(PlayList.player).jPlayer({
 			ended:PlayList.next,
@@ -103,7 +105,7 @@ var PlayList={
 				}
 			},
 			volume:PlayList.volume,
-			cssSelectorAncestor:'#controls',
+			cssSelectorAncestor:'.player-controls',
 			swfPath:OC.linkTo('media','js'),
 		});
 	},
@@ -130,7 +132,7 @@ var PlayList={
 			var type=musicTypeFromFile(song.path);
 			var item={name:song.name,type:type,artist:song.artist,album:song.album,length:song.length,playcount:song.playCount};
 			item[type]=PlayList.urlBase+encodeURIComponent(song.path);
-            PlayList.items.push(item);
+			PlayList.items.push(item);
 		}
 	},
 	addFile:function(path){
@@ -160,14 +162,14 @@ var PlayList={
 		if(typeof localStorage !== 'undefined' && localStorage){
 			localStorage.setItem(oc_current_user+'oc_playlist_items',JSON.stringify(PlayList.items));
 			localStorage.setItem(oc_current_user+'oc_playlist_current',PlayList.current);
-            if(PlayList.player) {
-                if(PlayList.player.data('jPlayer')) {
-                    var time=Math.round(PlayList.player.data('jPlayer').status.currentTime);
-                    localStorage.setItem(oc_current_user+'oc_playlist_time',time);
-                    var volume=PlayList.player.data('jPlayer').options.volume*100;
-                    localStorage.setItem(oc_current_user+'oc_playlist_volume',volume);
-                }
-            }
+			if(PlayList.player) {
+				if(PlayList.player.data('jPlayer')) {
+					var time=Math.round(PlayList.player.data('jPlayer').status.currentTime);
+					localStorage.setItem(oc_current_user+'oc_playlist_time',time);
+					var volume=PlayList.player.data('jPlayer').options.volume*100;
+					localStorage.setItem(oc_current_user+'oc_playlist_volume',volume);
+				}
+			}
 			if(PlayList.active){
 				localStorage.setItem(oc_current_user+'oc_playlist_active','false');
 			}
diff --git a/apps/media/js/playlist.js b/apps/media/js/playlist.js
index c6dc3db2dd4..57180b3be7b 100644
--- a/apps/media/js/playlist.js
+++ b/apps/media/js/playlist.js
@@ -30,6 +30,7 @@ PlayList.hide=function(){
 
 $(document).ready(function(){
 	PlayList.parent=$('#leftcontent');
+	PlayList.init();
 	$('#selectAll').click(function(){
 		if($(this).attr('checked')){
 			// Check all
diff --git a/apps/media/templates/music.php b/apps/media/templates/music.php
index 2af18fb03c9..7764a315a8f 100644
--- a/apps/media/templates/music.php
+++ b/apps/media/templates/music.php
@@ -1,4 +1,4 @@
-<div id="controls">
+<div class='player-controls' id="controls">
 	<ul class="jp-controls">
 		<li><a href="#" class="jp-play action"><img class="svg" alt="<?php echo $l->t('Play');?>" src="<?php echo image_path('core', 'actions/play-big.svg'); ?>" /></a></li>
 		<li><a href="#" class="jp-pause action"><img class="svg" alt="<?php echo $l->t('Pause');?>" src="<?php echo image_path('core', 'actions/pause-big.svg'); ?>" /></a></li>
diff --git a/apps/media/templates/player.php b/apps/media/templates/player.php
new file mode 100644
index 00000000000..342efb804e1
--- /dev/null
+++ b/apps/media/templates/player.php
@@ -0,0 +1,16 @@
+<?php
+if(!isset($_)){//allow the template to be loaded standalone
+	require_once '../../../lib/base.php';
+	$tmpl = new OC_Template( 'media', 'player');
+	$tmpl->printPage();
+	exit;
+}
+?>
+<div class='player-controls' id="playercontrols">
+	<div class="player" id="jp-player"></div>
+	<ul class="jp-controls">
+		<li><a href="#" class="jp-play action"><img class="svg" alt="<?php echo $l->t('Play');?>" src="<?php echo image_path('core', 'actions/play.svg'); ?>" /></a></li>
+		<li><a href="#" class="jp-pause action"><img class="svg" alt="<?php echo $l->t('Pause');?>" src="<?php echo image_path('core', 'actions/pause.svg'); ?>" /></a></li>
+		<li><a href="#" class="jp-next action"><img class="svg" alt="<?php echo $l->t('Next');?>" src="<?php echo image_path('core', 'actions/play-next.svg'); ?>" /></a></li>
+	</ul>
+</div>
\ No newline at end of file