Evolution #196: Liste de lecture

src/Muzich/CoreBundle/Entity/Element.php

@@ -28,6 +28,12 @@ class Element
    * @var string 
    */
   const DATA_REF_ID         = "data_ref_id";
+  
+  /**
+   * Identifiant de l'objet externe
+   * @var string 
+   */
+  const DATA_NORMALIZED_URL = "data_normalized_url";
   /**
    * Adresse HTTP(S) de la jaquette
    * @var string 

src/Muzich/CoreBundle/Factory/Elements/Soundcloudcom.php

@@ -154,6 +154,11 @@ class Soundcloudcom extends ElementFactory
         {
           $this->element->setData(Element::DATA_REF_ID, $result['id']);
         }
+        
+        if (array_key_exists('uri', $result) )
+        {
+          $this->element->setData(Element::DATA_NORMALIZED_URL, $result['uri']);
+        }
 
         if (array_key_exists('artwork_url', $result) )
         {
@@ -214,6 +219,12 @@ class Soundcloudcom extends ElementFactory
           .'width="100%" name="embed_'.$embed_id.'"></embed>
         </object>'
       );
+//      $this->element->setEmbed(
+//        '<iframe id="sc-widget_'.$this->element->getData(Element::DATA_REF_ID).
+//          '" src="http://w.soundcloud.com/player/?url='.
+//          $ref_id.'" width="100%" '.
+//          'height="'.$height.'" scrolling="no" frameborder="no"></iframe>'
+//      );
     }
   }
   

src/Muzich/CoreBundle/Resources/views/layout.html.twig

@@ -25,6 +25,10 @@
 	<script src="{{ asset('bundles/muzichcore/js/muzich.js') }}" type="text/javascript"></script>
 	
   <script type="text/javascript" src="{{ asset('js/swfobject.js') }}"></script> 
+  
+       <script src="http://connect.soundcloud.com/sdk.js"></script>
+       <script src="http://w.soundcloud.com/player/api.js"></script>
+       
   <script src="{{ asset('bundles/muzichcore/js/autoplay.js') }}" type="text/javascript"></script>
   
   <script src="{{ asset('js/tags/jquery.autoGrowInput.js') }}" type="text/javascript"></script>
@@ -97,6 +101,7 @@
     <div id="autoplay_player_container">
       <div id="autoplay_player"></div>
     </div>
+    <div id="autoplay_player_soundcloud"></div>
     <img id="autoplay_loader" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loader" />
     <p id="autoplay_noelements_text" style="display: none;">{{ 'elements.autoplay.noelements.text'|trans({}, 'elements') }}</p>
   </div>

src/Muzich/CoreBundle/lib/AutoplayManager.php

@@ -52,7 +52,9 @@ class AutoplayManager
         'element_ref_id'   => $ref_id,
         'element_type'     => $element->getType(),
         'element_id'       => $element->getId(),
-        'element_name'     => $element->getName()
+        'element_name'     => $element->getName(),
+        'element_url'      => $element->getUrl(),
+        'element_normalized_url' => $element->getData(Element::DATA_NORMALIZED_URL)
       );
     }
     

web/bundles/muzichcore/js/autoplay.js

@@ -9,6 +9,8 @@ $(document).ready(function(){
   var autoplay_list = new Array;
   // object player
   var autoplay_player = null;
+  // Ritournelle pour le lecteur soundcloud (une seule variable sinon bug)
+  var autoplay_player_soundcloud = null;
   // identifiant de la division du lecteur
   var autoplay_player_div_id = "autoplay_player";
   // identifiant du lecteur
@@ -33,7 +35,6 @@ $(document).ready(function(){
       {
         // On récupère la liste d'élèments
         autoplay_list = response.data;
-        console.debug(autoplay_list);
         autoplay_run(0);
       }
       
@@ -51,6 +52,14 @@ $(document).ready(function(){
     $('li#autoplay_element_container').html('');
     $('img#autoplay_loader').show();
     
+    
+    ////// TMP to check
+    if (autoplay_player_soundcloud)
+    {
+      autoplay_player_soundcloud.pause();
+    }
+    $('div#autoplay_player_soundcloud').hide();
+    
     if (autoplay_list.length)
     {
     
@@ -63,7 +72,7 @@ $(document).ready(function(){
           {
             $(location).attr('href', url_index);
           }
-
+          
           if (response.status == 'success')
           {
             // On récupère la liste d'élèments
@@ -75,6 +84,10 @@ $(document).ready(function(){
               youtube_create_player(autoplay_list[step].element_ref_id);
             }
             
+            if (autoplay_list[step].element_type == 'soundcloud.com')
+            {
+              soundcloud_create_player(autoplay_list[step].element_ref_id, autoplay_list[step].element_normalized_url);
+            }
           }
 
         });
@@ -95,6 +108,11 @@ $(document).ready(function(){
     $('li#autoplay_element_container').html('');
     $('#autoplay_noelements_text').show();
     $('img#autoplay_loader').hide();
+    if (autoplay_player_soundcloud)
+    {
+      $('div#autoplay_player_soundcloud').hide();
+      autoplay_player_soundcloud.pause();
+    }
   }
   
   // Avancer d'un élelement dans la liste
@@ -128,9 +146,9 @@ $(document).ready(function(){
   }
   
   // bouton précedent
-  $('a#autoplay_previous').click(function(){ autoplay_previous(); });
+  $('a#autoplay_previous').click(function(){autoplay_previous();});
   // bouton suivant
-  $('a#autoplay_next').click(function(){ autoplay_next(); });
+  $('a#autoplay_next').click(function(){autoplay_next();});
   // Fermeture de la lecture auto
   $('a#autoplay_close').click(function(){
     // Fond gris
@@ -143,15 +161,21 @@ $(document).ready(function(){
    
   
   /*
+   *
+   *
+   *
    * Fonction youtube.com et youtu.be
+   * 
+   * 
+   * 
    */
     
   // Création du lecteur FLASH youtube
   function youtube_create_player(ref_id)
   {
     var playerapiid = "ytplayerapiid";
-    var params = { allowScriptAccess: "always" };
-    var atts = { id: autoplay_player_id };
+    var params = {allowScriptAccess: "always"};
+    var atts = {id: autoplay_player_id};
     swfobject.embedSWF(
       "http://www.youtube.com/v/"+ref_id+"?enablejsapi=1&playerapiid="+playerapiid+"&version=3",
       autoplay_player_div_id,
@@ -193,4 +217,97 @@ $(document).ready(function(){
     }
   }
   
-});
+  /*
+   * 
+   * 
+   * Fonctions soundcloud
+   * 
+   * 
+   * 
+   */
+  
+  function soundcloud_create_player(ref_id, ref_url)
+  {
+    
+    // Variable dans lequelle on met l'index dela track lu précedamment
+    var index_track_previous = 0;
+     
+    if (!$('iframe#soundcloud_iframe_player').length)
+    {
+      $('div#autoplay_player_soundcloud').show();
+
+        // TODO: on garde ?
+        SC.initialize({
+          client_id: '39946ea18e3d78d64c0ac95a025794e1'
+        });
+
+      // Aucun lecteur soundcloud n'a été ouvert pour le moment
+      $('#autoplay_player_soundcloud').html(
+        '<iframe id="soundcloud_iframe_player" src="http://w.soundcloud.com/player/?url='
+          +ref_url+'&show_artwork=false&auto_play=true" width="100%" '
+          +'height="370" scrolling="no" frameborder="no"></iframe>'
+      );
+
+      //console.debug(document.getElementById('sc-widget_'+ref_id));
+      var widgetIframe = document.getElementById('soundcloud_iframe_player');
+      autoplay_player_soundcloud = SC.Widget(widgetIframe);
+
+      // Lorsque le lecteur est prêt on lance la lecture
+      autoplay_player_soundcloud.bind(SC.Widget.Events.READY, function ()
+      {
+        autoplay_player_soundcloud.play();
+        $('img#autoplay_loader').hide();
+
+      });
+
+      autoplay_player_soundcloud.bind(SC.Widget.Events.PLAY, function ()
+      {
+        // Lorsque le lecteur commence une lecture
+        // On garde en mémoire l'index de la lecture en cours
+        autoplay_player_soundcloud.getCurrentSoundIndex(function(value){
+            index_track_previous = value;
+        });
+      });
+
+      // Lorsque le lecteur a terminé sa lecture, on passe au suivant
+      autoplay_player_soundcloud.bind(SC.Widget.Events.FINISH, function ()
+      {
+
+        // Cette variable contient le nombre de pistes dans la liste de lecture
+        var track_count = 1;
+        autoplay_player_soundcloud.getSounds(function(value){
+          // On récupère le nomre de pistes
+          track_count = value.length;
+        });
+
+        autoplay_player_soundcloud.getCurrentSoundIndex(function(value){
+
+          // Si la index_track_previous est la même maintenant que la piste
+          // est terminé, c'est que l'on est arrivé en fin de liste.
+          // Cependant, si c'est une liste avec une piste unique, on passe 
+          // tout de suite a la suite
+          if (value == index_track_previous || track_count == 1)
+          {
+            autoplay_next();
+          }
+
+          // Sinon on prend al nouvelle valeur
+          index_track_previous = value;
+
+        });
+
+      });
+
+    }
+    else
+    {
+      // Le lecteur iframe existait déjà
+    $('div#autoplay_player_soundcloud').show();
+      autoplay_player_soundcloud.load(ref_url+'&show_artwork=false&auto_play=true');
+      //autoplay_player_soundcloud.play();
+    $('img#autoplay_loader').hide();
+    }
+         
+  }
+  
+});