random player link ok

sites/all/modules/figli/edlp_corpus/assets/scripts/corpus.js

@@ -190,7 +190,8 @@
         _playlist.push({
           'id':i,
           'nid':nodes[i].nid,
-          'audio_url':nodes[i].audio_url
+          'audio_url':nodes[i].audio_url,
+          'document_url':nodes[i].document_url,
         });
       }
     };

sites/all/themes/custom/edlptheme/assets/scripts/main.js

@@ -56,6 +56,11 @@
       // initEvents();
     };
 
+
+    //  __  __     _    _ _
+    // |  \/  |___| |__(_) |___
+    // | |\/| / _ \ '_ \ | / -_)
+    // |_|  |_\___/_.__/_|_\___|
     function initHomeMobile(){
       $('.field--name-field-notice, .index', '.entrees .taxonomy-term.vocabulary-entrees')
         .addClass('closed');
@@ -64,19 +69,16 @@
       $('.index>.field__label', '.entrees .taxonomy-term.vocabulary-entrees')
         .on('click', onClickHomeMobileIndex);
     };
-
     function onClickHomeMobileNotice(e){
       // console.log('onClickHomeMobileNotice');
       // var $part = $(this).parent();//parents('.taxonomy-term');
       toggleEntreeOpening($(this).parent(), 'notice');
     };
-
     function onClickHomeMobileIndex(e){
       // console.log('onClickHomeMobileIndex');
       // var $part = $(this).parent();//parents('.taxonomy-term');
       toggleEntreeOpening($(this).parent(), 'index');
     };
-
     function toggleEntreeOpening($e, part){
       $e.toggleClass('closed')
         .parents('.taxonomy-term.vocabulary-entrees.home_mobile').toggleClass(part+'-opened');
@@ -521,6 +523,7 @@
     };
     function initFirstLoad(){
       console.log('theme : initFirstLoad()');
+      console.log('window.location', window.location);
 
       // var origin_sys_path = window.localStorage.getItem('edlp_origin_path');
       var edlp_origin = JSON.parse(window.localStorage.getItem('edlp_origin'));
@@ -529,81 +532,87 @@
       if(edlp_origin != null && edlp_origin.sys_path){
         // hash is used as viewmode for taxonomy term entrees load (index or notice)
         // and for audio contents (article|transcript)
-        var view_mode = edlp_origin.hash.replace('#', '');
-
-        // create history state
-        var state = getSysPathState(edlp_origin.sys_path, view_mode);
-
-        // open entree tray in case of entree index|notice
-        // (index or notice will be opened with ajaxLoadContent)
-        // refactorized with new infos from edlp_origin
-        // if(view_mode){
-        if(edlp_origin.entity_type == "taxonomy_term"
-            && edlp_origin.entity_bundle == "entrees"
-            && view_mode){
-          // var $link = $('[href="'+edlp_origin.url+'"][viewmode="'+view_mode+'"]');
-          // var selector = $link.attr('selector') || null;
-
-          // record the selector in the state for actions after ajaxContentLoaded
-          state.selector = 'entree-'+view_mode+'-link-'+edlp_origin.entity_id; // entree-index-link-125
-          // if(selector){
-            // in case of entree link (actualy, selector is used only for entries links)
-            // TODO: use a promise
-            // TODO: but what if corpus ready before onAjaxLoaded >> use a promise !!
-            if(_corpus_ready){
-              _$corpus_canvas.trigger({
-                type:'open-entree',
-                // tid:$link.attr('tid')
-                tid:edlp_origin.entity_id
-              });
+        var hash = edlp_origin.hash.replace('#', '');
+
+        // if hash is random, RandomPlayer will be started when playlist sent by corpus.js
+        if(hash != "random"){
+          // create history state
+          var state = getSysPathState(edlp_origin.sys_path, hash);
+
+          // open entree tray in case of entree index|notice
+          // (index or notice will be opened with ajaxLoadContent)
+          // refactorized with new infos from edlp_origin
+          // if(hash){
+          if(edlp_origin.entity_type == "taxonomy_term"
+              && edlp_origin.entity_bundle == "entrees"
+              && hash){
+            // var $link = $('[href="'+edlp_origin.url+'"][viewmode="'+hash+'"]');
+            // var selector = $link.attr('selector') || null;
+
+            // record the selector in the state for actions after ajaxContentLoaded
+            state.selector = 'entree-'+hash+'-link-'+edlp_origin.entity_id; // entree-index-link-125
+            // if(selector){
+              // in case of entree link (actualy, selector is used only for entries links)
+              // TODO: use a promise
+              // TODO: but what if corpus ready before onAjaxLoaded >> use a promise !!
+              if(_corpus_ready){
+                _$corpus_canvas.trigger({
+                  type:'open-entree',
+                  // tid:$link.attr('tid')
+                  tid:edlp_origin.entity_id
+                });
+              }else{
+                // else : EdlpCorpus will check when ready if entry item (notice or index) is already .is-active
+                // .is-active class is added by onAjaxLoaded() (when content is loaded)
+                // $('li.entree[tid="'+$link.attr('tid')+'"] a.term-link').addClass('is-active');
+                $('li.entree[tid="'+edlp_origin.entity_id+'"] a.term-link').addClass('is-active');
+              }
+            // }
+          }
+
+          // check if audio link
+          // only if not random link
+          if(edlp_origin.audio_url){
+            var node = {
+              nid:edlp_origin.entity_id,
+              audio_url:edlp_origin.audio_url
+            };
+            _audioPlayer.openDocument(node, 'history_first_load');
+            if(hash == ""){
+              // if audio only record in state
+              state.audio = true;
+              state.node = node;
+              // we don't laod ajax content so we boot the home
+              _$body.attr('booted', 'booted');
             }else{
-              // else : EdlpCorpus will check when ready if entry item (notice or index) is already .is-active
-              // .is-active class is added by onAjaxLoaded() (when content is loaded)
-              // $('li.entree[tid="'+$link.attr('tid')+'"] a.term-link').addClass('is-active');
-              $('li.entree[tid="'+edlp_origin.entity_id+'"] a.term-link').addClass('is-active');
+              // ajax load content for audio only if article or transcript
+              ajaxLoadContent(state);
             }
-          // }
-        }
-
-        // check if audio link
-        if(edlp_origin.audio_url){
-          var node = {
-            nid:edlp_origin.entity_id,
-            audio_url:edlp_origin.audio_url
-          };
-          _audioPlayer.openDocument(node, 'history_first_load');
-          if(view_mode == ""){
-            // if audio only record in state
-            state.audio = true;
-            state.node = node;
-            // we don't laod ajax content so we boot the home
-            _$body.attr('booted', 'booted');
-          }else{
-            // ajax load content for audio only if article or transcript
+          }
+          // only if not entree path
+          // only if not audio (without article or transcript) path
+          else if(state.ajax_path){
+            // load content through ajax
+            // ajaxLoadContent(null, state.sys_path, state.ajax_path, selector);
             ajaxLoadContent(state);
           }
-        }
-        // only if not entree path
-        // only if not audio (without article or transcript) path
-        else if(state.ajax_path){
-          // load content through ajax
-          // ajaxLoadContent(null, state.sys_path, state.ajax_path, selector);
-          ajaxLoadContent(state);
-        }
 
-        if(state.entree_tid){
-          openEntree(state.entree_tid);
+          if(state.entree_tid){
+            openEntree(state.entree_tid);
+          }
+          // record history state
+          history.replaceState(state, null, edlp_origin.url+edlp_origin.hash);
         }
 
-        // record history state
-        history.replaceState(state, null, edlp_origin.url+edlp_origin.hash);
-
         // reset the storage
         window.localStorage.removeItem("edlp_origin");
         // window.localStorage.removeItem("edlp_origin_url");
 
       }else{
-        history.replaceState({home:true}, null, window.location.pathname);
+        // if(window.location.hash == "#random"){
+        //
+        // }
+        history.replaceState({home:true}, null, window.location.pathname+window.location.hash);
         // initHome();
         initGrid();
         _$body.attr('booted', 'booted');
@@ -893,11 +902,10 @@
         this.$next.on('click', this.playNext.bind(this));
       },
       openDocument(node, caller, historic_index){
-        // console.log('AudioPlayer openDocument', node);
+        console.log('AudioPlayer openDocument', node, caller);
         if(typeof node == 'undefined'
           || typeof node.nid ==  'undefined'
-          || typeof node.audio_url == 'undfined'
-          || typeof node.document_url == 'undfined'){
+          || typeof node.audio_url == 'undefined'){
           console.warn('AudioPlayer openDocument() node is malformed', node);
           return false;
         }
@@ -910,18 +918,23 @@
 
           // add the document opening to history to be able to share and play audio from any where
           if(caller != "history_first_load"){
-            var state = {
-              audio:true,
-              node:{
-                nid:node.nid,
-                audio_url:node.audio_url,
-                document_url:node.document_url,
-                title:node.title || null,
-              },
-              historic_index : this.currentHistoricIndex,
-            };
-
-            history.pushState(state, null, node.document_url);
+            if(typeof node.document_url == 'undefined'){
+              console.warn("AudioPlayer openDocument missing document_url, can't push state to history", caller, node);
+            }else{
+              var state = {
+                audio:true,
+                node:{
+                  nid:node.nid,
+                  audio_url:node.audio_url,
+                  document_url:node.document_url,
+                  title:node.title || null,
+                },
+                historic_index : this.currentHistoricIndex,
+              };
+              // console.log('AudioPlayer pushstate', state);
+              var url = node.document_url + (caller == 'random' ? '#random' : '');
+              history.pushState(state, null, url);
+            }
           }
         }else{
           // if the call commes from popstate, we update the current position of index
@@ -1043,12 +1056,14 @@
         if(this.currentHistoricIndex > 0){
           this.currentHistoricIndex -= 1;
           this.launch();
+          // TODO: update history state
         }
       },
       playNext(){
         if(this.currentHistoricIndex < this.historic.length-1){
           this.currentHistoricIndex += 1;
           this.launch();
+          // TODO: update history state
         }else{
           this.emmit('audio-play-next');
         }
@@ -1167,6 +1182,10 @@
           console.info('AudioPlayer hide() : _$corpus_canvas does not exists');
         }
       },
+      deActivateRandom(){
+        this.shuffle_is_active = false;
+        this.showHideNextBtn();
+      },
       // object events
       on(event_name, handler){
         if(typeof this.event_handlers[event_name] == 'undefined'){
@@ -1202,7 +1221,8 @@
     function RandomPlayer(playlist){
       this.active = false;
       this.playlist = playlist;
-      this.$btn = $('<a>').html('Shuffle').addClass('random-player-btn');
+      this.path =  drupalSettings.path.baseUrl+drupalSettings.path.pathPrefix+'#random'
+      this.$btn = $('<a>').html('Shuffle').attr('href',this.path).addClass('random-player-btn');
       this.init();
     };
     RandomPlayer.prototype = {
@@ -1229,6 +1249,12 @@
 
         _$corpus_canvas
           .on('update-random-playlist', this.updatePlaylist.bind(this));
+
+        // provide a link to auto start random player
+        if(window.location.hash == '#random'){
+          this.start();
+          // window.location.hash = '';
+        }
       },
       updatePlaylist(e){
         // debugger;
@@ -1248,11 +1274,13 @@
         //console.log('RandomPlayer, this.shuffledPlaylist', this.shuffledPlaylist);
       },
       toggleActive(e){
+        e.preventDefault();
         if (this.active) {
           this.stop();
         }else{
           this.start();
         }
+        return false;
       },
       start(){
         this.active = _audioPlayer.shuffle_is_active = true;
@@ -1266,10 +1294,14 @@
         }
       },
       stop(){
-        this.active = _audioPlayer.shuffle_is_active = false;
+        this.active = false;
         this.$btn.removeClass('is-active');
         // stop audio player
         // _audioPlayer.stop();
+        // remove hash
+        history.replaceState(history.state, null, window.location.pathname);
+        // tell to AudioPlayer to deactivate netx btn
+        _audioPlayer.deActivateRandom();
         if(typeof _paq !== 'undefined'){
           // trackEvent(category, action, [name], [value])
           _paq.push(['trackEvent', 'RandomPlayer', 'stop']);
@@ -1278,7 +1310,7 @@
       next(){
         console.log('RandomPlayer next', this.active, this.shuffledPlaylist.length);
         if(this.active && this.shuffledPlaylist.length > 0)
-          _audioPlayer.openDocument(this.shuffledPlaylist.splice(0,1)[0]);
+          _audioPlayer.openDocument(this.shuffledPlaylist.splice(0,1)[0], 'random');
       },
       onAudioPlayNext(){
         console.log('RandomPlayer : onAudioPlayNext()');
@@ -1576,7 +1608,7 @@
     };
 
     function checkGridBlockHeight(){
-      console.log('checkGridBlockHeight');
+      // console.log('checkGridBlockHeight');
       var $r_h = _$row.height();
       var $this;
       // console.log($r_h);
@@ -1596,14 +1628,14 @@
     };
 
     function checkGridBlockVisible(){
-      console.log('checkGridBlockVisible');
+      // console.log('checkGridBlockVisible');
       var $r_h = _$row.height();
       var $this,pos;
       $('.grid .col', _$row).each(function(i,e){
         // $(this).on('load',function(event){
           $this = $(this);
           pos = $this.position();
-          console.log(pos.top, $this.height(), pos.top+$this.height(), $r_h, $this);
+          // console.log(pos.top, $this.height(), pos.top+$this.height(), $r_h, $this);
           if(pos.top+$this.height() <= $r_h){
             $this.removeClass('offfield');
           }else{

sites/all/themes/custom/edlptheme/assets/scripts/redirect.js

@@ -40,18 +40,13 @@ if(typeof edlp_mobile != "undefined"){
 if(edlp.redirect && !device_redirect && !device_is_mobile){
   console.log('redirect', edlp);
   console.log('window.location', window.location);
-  // window.localStorage.setItem('edlp_origin_path', edlp.sys_path.replace(/^\//, ''));
-  edlp.sys_path = edlp.sys_path.replace(/^\//, '');
 
-  // window.localStorage.setItem('edlp_origin_url', window.location.pathname);
+  edlp.sys_path = edlp.sys_path.replace(/^\//, '');
   edlp.url = window.location.pathname;
-
-  // window.localStorage.setItem('edlp_origin_hash', window.location.hash);
   edlp.hash = window.location.hash;
-
   window.localStorage.setItem('edlp_origin', JSON.stringify(edlp));
   // redirect to home
-  window.location.replace(window.location.origin+'/'+edlp.lang_code);
+  window.location.replace(window.location.origin+'/'+edlp.lang_code+edlp.hash);
 }else{
   console.log('history do not redirect');
 }