play2.js gestion de base du jamendo (refact restante)

src/Muzich/CoreBundle/Resources/public/js/play.js

@@ -524,11 +524,12 @@ $(document).ready(function(){
    * @param {string} title Nom du morceau qui sera affiché dans la liste de lecture
    * @param {string} mp3 adresse du flux sonore
    */
-  function GenericSong(title, mp3)
-  {
-    this.title = title;
-    this.mp3   = mp3;
-  }
+   // EN COMMENTAIRE CAR CODE COPIE VERS play2.js
+  //function GenericSong(title, mp3)
+  //{
+  //  this.title = title;
+  //  this.mp3   = mp3;
+  //}
   
   /**
    * Fonction de lecture d'un élèment avec le lecteur générique

src/Muzich/CoreBundle/Resources/public/js/play2.js

@@ -23,6 +23,11 @@ function DynamicPlayer()
     {
       return new SoundCloudPlayer(ref_id, object_for_player);
     }
+    if (player_type == 'jamendo.com')
+    {
+      return new JamendoPlayer(element_id, object_for_player);
+    }
+    
     return new GenericPlayer(element_id, object_for_player);
   }
   
@@ -191,6 +196,94 @@ function SoundCloudPlayer(ref_id, object_for_player)
   }
 }
 
+function GenericSong(title, mp3)
+{
+  this.title = title;
+  this.mp3   = mp3;
+}
+
+function JamendoPlayer(ref_id, object_for_player)
+{
+  var _ref_id = ref_id;
+  var _object_for_player = object_for_player;
+  var _playlist = new Array();
+  
+  this.play = function()
+  {
+    create_player();
+  }
+  
+  var create_player = function()
+  {
+    // TODO efactoriser dans un objet lecteur generique
+    var jplayer_player  = $('#jquery_jplayer_1').clone();
+    var jplayer_content = $('#jp_container_1').clone();
+    
+    jplayer_player.attr ('id', 'jplayer_player_element_'+ref_id);
+    jplayer_content.attr('id', 'jplayer_content_element_'+ref_id);
+    
+    _object_for_player.html('');
+    _object_for_player.append(jplayer_player);
+    _object_for_player.append(jplayer_content);
+    
+    JQueryJson(url_element_get_stream_data+'/'+ref_id, {}, function(response){
+      if (response.status == 'success')
+      {
+        
+        for(var i = 0; i < response.data.length; i++)
+        {
+          var song = new GenericSong(response.data[i].name, response.data[i].url);
+          _playlist[i] = song;
+        }
+        
+        autoplay_generic_player_playlist = new jPlayerPlaylist
+        (
+          {
+            jPlayer: '#jplayer_player_element_'+ref_id,
+            cssSelectorAncestor: '#jplayer_content_element_'+ref_id
+          },
+          _playlist,
+          {
+            playlistOptions:
+            {
+              autoPlay: true,
+              enableRemoveControls: true
+            },
+            swfPath: "/jplayer/js",
+            supplied: "mp3",
+            wmode: "window"
+          }
+        );
+        
+        $('#jplayer_player_element_'+ref_id).bind($.jPlayer.event.play, event_play);
+        $('#jplayer_player_element_'+ref_id).bind($.jPlayer.event.ended, event_end);
+        $('#jplayer_player_element_'+ref_id).bind($.jPlayer.event.error, event_error);
+        
+      }
+    });
+  }
+  
+  var event_play = function(event)
+  {
+    
+  }
+  
+  var event_end = function(event)
+  {
+    
+  }
+  
+  var event_error = function(event)
+  {
+    
+  }
+  
+  this.stop = function()
+  {
+    
+  }
+}
+
 function PlayersManager()
 {
   var _players = new Array();

web/jplayer/skin/blue.monday/jplayer.blue.monday.css

@@ -153,17 +153,17 @@ a.jp-pause {
 }
 
 a.jp-play {
-	background: url("jplayer.blue.monday.jpg") 0 0 no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 0 no-repeat;
 }
 a.jp-play:hover {
-	background: url("jplayer.blue.monday.jpg") -41px 0 no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -41px 0 no-repeat;
 }
 a.jp-pause {
-	background: url("jplayer.blue.monday.jpg") 0 -42px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 -42px no-repeat;
 	display: none;
 }
 a.jp-pause:hover {
-	background: url("jplayer.blue.monday.jpg") -41px -42px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -41px -42px no-repeat;
 }
 
 a.jp-stop, a.jp-previous, a.jp-next {
@@ -173,26 +173,26 @@ a.jp-stop, a.jp-previous, a.jp-next {
 }
 
 a.jp-stop {
-	background: url("jplayer.blue.monday.jpg") 0 -83px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 -83px no-repeat;
 	margin-left:10px;
 }
 
 a.jp-stop:hover {
-	background: url("jplayer.blue.monday.jpg") -29px -83px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -29px -83px no-repeat;
 }
 
 a.jp-previous {
-	background: url("jplayer.blue.monday.jpg") 0 -112px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 -112px no-repeat;
 }
 a.jp-previous:hover {
-	background: url("jplayer.blue.monday.jpg") -29px -112px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -29px -112px no-repeat;
 }
 
 a.jp-next {
-	background: url("jplayer.blue.monday.jpg") 0 -141px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 -141px no-repeat;
 }
 a.jp-next:hover {
-	background: url("jplayer.blue.monday.jpg") -29px -141px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -29px -141px no-repeat;
 }
 
 /* @end */
@@ -223,13 +223,13 @@ div.jp-video div.jp-progress {
 	height:10px;
 }
 div.jp-seek-bar {
-	background: url("jplayer.blue.monday.jpg") 0 -202px repeat-x;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 -202px repeat-x;
 	width:0px;
 	height:100%;
 	cursor: pointer;
 }
 div.jp-play-bar {
-	background: url("jplayer.blue.monday.jpg") 0 -218px repeat-x ;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 -218px repeat-x ;
 	width:0px;
 	height:100%;
 }
@@ -289,29 +289,29 @@ div.jp-video a.jp-volume-max {
 }
 
 a.jp-mute {
-	background: url("jplayer.blue.monday.jpg") 0 -170px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 -170px no-repeat;
 }
 a.jp-mute:hover {
-	background: url("jplayer.blue.monday.jpg") -19px -170px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -19px -170px no-repeat;
 }
 a.jp-unmute {
-	background: url("jplayer.blue.monday.jpg") -60px -170px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -60px -170px no-repeat;
 	display: none;
 }
 a.jp-unmute:hover {
-	background: url("jplayer.blue.monday.jpg") -79px -170px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -79px -170px no-repeat;
 }
 a.jp-volume-max {
-	background: url("jplayer.blue.monday.jpg") 0 -186px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 -186px no-repeat;
 }
 a.jp-volume-max:hover {
-	background: url("jplayer.blue.monday.jpg") -19px -186px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -19px -186px no-repeat;
 }
 
 div.jp-volume-bar {
 	position: absolute;
 	overflow:hidden;
-	background: url("jplayer.blue.monday.jpg") 0 -250px repeat-x;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 -250px repeat-x;
 	width:46px;
 	height:5px;
 	cursor: pointer;
@@ -329,7 +329,7 @@ div.jp-video div.jp-volume-bar {
 	left:72px;
 }
 div.jp-volume-bar-value {
-	background: url("jplayer.blue.monday.jpg") 0 -256px repeat-x;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 -256px repeat-x;
 	width:0px;
 	height:5px;
 }
@@ -561,55 +561,55 @@ ul.jp-toggles li a {
 }
 
 a.jp-full-screen {
-	background: url("jplayer.blue.monday.jpg") 0 -310px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 -310px no-repeat;
 	margin-left: 20px;
 }
 
 a.jp-full-screen:hover {
-	background: url("jplayer.blue.monday.jpg") -30px -310px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -30px -310px no-repeat;
 }
 
 a.jp-restore-screen {
-	background: url("jplayer.blue.monday.jpg") -60px -310px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -60px -310px no-repeat;
 	margin-left: 20px;
 }
 
 a.jp-restore-screen:hover {
-	background: url("jplayer.blue.monday.jpg") -90px -310px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -90px -310px no-repeat;
 }
 
 a.jp-repeat {
-	background: url("jplayer.blue.monday.jpg") 0 -290px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 -290px no-repeat;
 }
 
 a.jp-repeat:hover {
-	background: url("jplayer.blue.monday.jpg") -30px -290px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -30px -290px no-repeat;
 }
 
 a.jp-repeat-off {
-	background: url("jplayer.blue.monday.jpg") -60px -290px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -60px -290px no-repeat;
 }
 
 a.jp-repeat-off:hover {
-	background: url("jplayer.blue.monday.jpg") -90px -290px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -90px -290px no-repeat;
 }
 
 a.jp-shuffle {
-	background: url("jplayer.blue.monday.jpg") 0 -270px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") 0 -270px no-repeat;
 	margin-left: 5px;
 }
 
 a.jp-shuffle:hover {
-	background: url("jplayer.blue.monday.jpg") -30px -270px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -30px -270px no-repeat;
 }
 
 a.jp-shuffle-off {
-	background: url("jplayer.blue.monday.jpg") -60px -270px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -60px -270px no-repeat;
 	margin-left: 5px;
 }
 
 a.jp-shuffle-off:hover {
-	background: url("jplayer.blue.monday.jpg") -90px -270px no-repeat;
+	background: url("/jplayer/skin/blue.monday/jplayer.blue.monday.jpg") -90px -270px no-repeat;
 }