history nav is now ok

sites/all/modules/figli/edlp_ajax/edlp_ajax.module

@@ -5,6 +5,53 @@
 # @Filename: edlp_ajax.module
 # @License: GPL-V3
 
+use Drupal\Core\Url;
+
+
+/**
+ * Implements hook_page_attachments().
+ * @param array $attachments
+ */
+function edlp_ajax_page_attachments(array &$attachments) {
+  $url = Url::fromRoute('edlp_ajax.entityjson');
+  $attachments['#attached']['drupalSettings']['edlp_ajax']['entityjson_path'] = $url->getInternalPath();
+  // $url = Url::fromRoute('edlp_ajax.urljson');
+  // $attachments['#attached']['drupalSettings']['edlp_ajax']['urljson_path'] = $url->getInternalPath();
+  $redirect = false;
+
+  $current_path = \Drupal::service('path.current')->getPath();
+  $is_front = \Drupal::service('path.matcher')->isFrontPage();
+
+  // do not redirect if note node, term, or custom routing
+  if(preg_match('/^\/?node\/\d+/', $current_path)
+    || preg_match('/^\/?taxonomy\/term\/\d+/', $current_path)
+    || preg_match('/^\/?productions/', $current_path)
+    || preg_match('/^\/?agenda/', $current_path)
+    || preg_match('/^\/?studio/', $current_path)){
+      // TODO: search url
+      $redirect = true;
+    }
+
+  $js_str = "var edlp = {\n
+    sys_path:'".$current_path."',\n
+    is_front:".($is_front ? 'true':'false').",\n
+    redirect:".($redirect ? 'true':'false').",\n
+  };";
+
+  $attachments['#attached']['html_head'][] = [
+    [
+      '#type' => 'html_tag',
+      '#tag' => 'script',
+      '#value' => $js_str,
+      '#weight' => -999,
+      '#group' => 'edlp'
+    ],
+    // A key, to make it possible to recognize this HTML  element when altering.
+    'edlp',
+  ];
+}
+
+
 /**
  * Implements hook_theme().
  */

sites/all/modules/figli/edlp_ajax/edlp_ajax.routing.yml

@@ -6,20 +6,14 @@
 # @Last modified time: 20-12-2017
 # @License: GPL-V3
 
-edlp_ajax.node:
-  path: '/edlp/ajax/{entity_type}/{id}/{viewmode}'
-  defaults:
-    _controller: '\Drupal\edlp_ajax\Controller\EdlpAjaxController::entity'
-    _title: 'EdlpAjax'
-    viewmode: 'default'
-  requirements:
-    _permission: 'access content'
-
-edlp_ajax.ajaxnode:
-  path: '/edlp/ajax/json/{entity_type}/{id}/{viewmode}'
+edlp_ajax.entityjson:
+  path: '/edlp/ajax/entity/json/{entity_type}/{id}/{viewmode}'
   defaults:
     _controller: '\Drupal\edlp_ajax\Controller\EdlpAjaxController::entityjson'
     _title: 'EdlpAjaxJson'
+    entity_type : null
+    id: null
     viewmode: 'default'
   requirements:
     _permission: 'access content'
+    # id: \d+

sites/all/modules/figli/edlp_ajax/src/Controller/EdlpAjaxController.php

@@ -3,6 +3,9 @@
 namespace Drupal\edlp_ajax\Controller;
 
 use Drupal\Core\Controller\ControllerBase;
+use Symfony\Component\HttpFoundation\Request;
+use Drupal\Core\Url;
+use Drupal\menu_link_content\Entity\MenuLinkContent;
 use Symfony\Component\HttpFoundation\JsonResponse;
 
 
@@ -29,18 +32,6 @@ class EdlpAjaxController extends ControllerBase {
     }
   }
 
-  /**
-   * Display entity as a page.
-   *
-   * @return renderable array
-   */
-  public function entity($entity_type, $id, $viewmode) {
-    $this->entity_type = $entity_type;
-    $this->id = $id;
-    $this->viewmode = $viewmode;
-    return $this->toRenderable();
-  }
-
   /**
    * Get entity as json through ajax.
    *
@@ -50,6 +41,7 @@ class EdlpAjaxController extends ControllerBase {
     $this->entity_type = $entity_type;
     $this->id = $id;
     $this->viewmode = $viewmode;
+
     $renderable = $this->toRenderable();
     $rendered = render($renderable);
 
@@ -64,17 +56,43 @@ class EdlpAjaxController extends ControllerBase {
         $bundle = NULL;
     }
 
-    $response = new JsonResponse();
-    $response->setData([
+    $data = [
       'test' => 'hello edlp ajax',
       'id' => $this->id,
       'view_mode' => $this->viewmode,
       'bundle' => $bundle,
       'entity_type' => $this->entity_type,
       'rendered'=> $rendered,
-    ]);
+    ];
 
+    // if content type page (productions) get the menu items
+    if($bundle == "page"){
+      $menuLinkManager = \Drupal::service('plugin.manager.menu.link');
+      $links = $menuLinkManager->loadLinksByRoute('entity.node.canonical', array('node' => $this->id), 'productions');
+      // dpm($links, 'links');
+      $menu_parents = array();
+      foreach ($links as $link) {
+        $parents = $menuLinkManager->getParentIds($link->getPluginId());
+        // dpm($parents, 'parents');
+        foreach ($parents as $parent_id) {
+          $parent = $menuLinkManager->getInstance(array('id'=>$parent_id));
+          // dpm($parent, 'parent');
+          $url = $parent->getUrlObject();
+          $sys_path = $url->getInternalPath();
+          // dpm($sys_path);
+          $menu_parents[] = $sys_path;
+        }
+      }
+      $data['menu_parents'] = $menu_parents;
+    }
+
+    $response = new JsonResponse();
+    $response->setData($data);
     return $response;
+
+    // return array(
+    //   '#markup'=>'hello'
+    // );
   }
 
 }

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

@@ -60,7 +60,7 @@
     var _node_pop_up;
     // Colors depend on drupalSettings loaded by edlp_corpus.module
     var _ecolors = drupalSettings.edlp_corpus.colors;
-    console.log('Corpus : _ecolors', _ecolors);
+    //console.log('Corpus : _ecolors', _ecolors);
     // Physics
     var _attracter,
         _repulser_top,
@@ -127,7 +127,7 @@
       console.warn('corpus load failed', jqxhr.responseText);
     };
     function onCorpusLoaded(data){
-      console.log('corpus loaded : data', data);
+      //console.log('corpus loaded : data', data);
       // console.log('first node', data.nodes[0]);
       // buildParticles(data.nodes);
       initPhysics();
@@ -188,7 +188,7 @@
     // | .` / _ \/ _` / -_|_-<
     // |_|\_\___/\__,_\___/__/
     function buildNodes(nodes){
-      console.log("buildNodes", nodes);
+      //console.log("buildNodes", nodes);
       var d;
       for (var i in nodes) {
         d = i < 1 ? true : false;
@@ -201,12 +201,12 @@
           'audio_url':nodes[i].audio_url
         });
       }
-      console.log('_nodes',_nodes);
-      console.log('_articles_nodes',_articles_nodes);
-      console.log('_no_articles_nodes',_no_articles_nodes);
-      console.log('_nodes_by_entries', _nodes_by_entries);
+      //console.log('_nodes',_nodes);
+      //console.log('_articles_nodes',_articles_nodes);
+      //console.log('_no_articles_nodes',_no_articles_nodes);
+      //console.log('_nodes_by_entries', _nodes_by_entries);
 
-      console.log('_physics.attractions.length', _physics.attractions.length);
+      //console.log('_physics.attractions.length', _physics.attractions.length);
     };
 
     function Node(i,node,d){
@@ -624,7 +624,7 @@
     }
     function createNodesRepulsions(){
       // how to delete all these attractions before creates new once
-      console.log('_nodes_centered', _nodes_centered);
+      //console.log('_nodes_centered', _nodes_centered);
       purgeNodesRepulsions();
       for (var n = 0; n < _nodes_centered.length; n++) {
         for (var q = n+1; q < _nodes_centered.length; q++) {
@@ -767,13 +767,13 @@
       return false;
     };
     function filterArticles(){
-      console.log('filterArticles');
+      //console.log('filterArticles');
       for (var i = 0; i < _no_articles_nodes.length; i++) {
         _no_articles_nodes[i].fade();
       }
     };
     function resetArticlesFilter(){
-      console.log('resetArticlesFilter');
+      //console.log('resetArticlesFilter');
       for (var i = 0; i < _no_articles_nodes.length; i++) {
         _no_articles_nodes[i].unFade();
       }
@@ -856,7 +856,7 @@
           _nodes_by_nid[e.target_id].chutier_action = e.new_action;
         })
         .on('search-results-loaded', function(e){
-          console.log("Edlp Corpus, search-results-loaded",e.results);
+          //console.log("Edlp Corpus, search-results-loaded",e.results);
           // TODO: filter map's nodes
           filterSearchResults(e.results);
         })
@@ -981,10 +981,12 @@
     function startAnime(){
       _physics.onUpdate(render);
       _physics.play()
-      $('body').trigger({
-        'type':'corpus-map-ready',
-        'playlist':_playlist
-      });
+      $('body')
+        .attr('corpus', 'map-ready')
+        .trigger({
+          'type':'corpus-map-ready',
+          'playlist':_playlist
+        });
     };
 
     init();

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

@@ -60,7 +60,7 @@
     var _node_pop_up;
     // Colors depend on drupalSettings loaded by edlp_corpus.module
     var _ecolors = drupalSettings.edlp_corpus.colors;
-    console.log('Corpus : _ecolors', _ecolors);
+    //console.log('Corpus : _ecolors', _ecolors);
     // Physics
     var _attracter,
         _repulser_top,
@@ -127,7 +127,7 @@
       console.warn('corpus load failed', jqxhr.responseText);
     };
     function onCorpusLoaded(data){
-      console.log('corpus loaded : data', data);
+      //console.log('corpus loaded : data', data);
       // console.log('first node', data.nodes[0]);
       // buildParticles(data.nodes);
       initPhysics();
@@ -188,7 +188,7 @@
     // | .` / _ \/ _` / -_|_-<
     // |_|\_\___/\__,_\___/__/
     function buildNodes(nodes){
-      console.log("buildNodes", nodes);
+      //console.log("buildNodes", nodes);
       var d;
       for (var i in nodes) {
         d = i < 1 ? true : false;
@@ -201,12 +201,12 @@
           'audio_url':nodes[i].audio_url
         });
       }
-      console.log('_nodes',_nodes);
-      console.log('_articles_nodes',_articles_nodes);
-      console.log('_no_articles_nodes',_no_articles_nodes);
-      console.log('_nodes_by_entries', _nodes_by_entries);
+      //console.log('_nodes',_nodes);
+      //console.log('_articles_nodes',_articles_nodes);
+      //console.log('_no_articles_nodes',_no_articles_nodes);
+      //console.log('_nodes_by_entries', _nodes_by_entries);
 
-      console.log('_physics.attractions.length', _physics.attractions.length);
+      //console.log('_physics.attractions.length', _physics.attractions.length);
     };
 
     function Node(i,node,d){
@@ -624,7 +624,7 @@
     }
     function createNodesRepulsions(){
       // how to delete all these attractions before creates new once
-      console.log('_nodes_centered', _nodes_centered);
+      //console.log('_nodes_centered', _nodes_centered);
       purgeNodesRepulsions();
       for (var n = 0; n < _nodes_centered.length; n++) {
         for (var q = n+1; q < _nodes_centered.length; q++) {
@@ -767,13 +767,13 @@
       return false;
     };
     function filterArticles(){
-      console.log('filterArticles');
+      //console.log('filterArticles');
       for (var i = 0; i < _no_articles_nodes.length; i++) {
         _no_articles_nodes[i].fade();
       }
     };
     function resetArticlesFilter(){
-      console.log('resetArticlesFilter');
+      //console.log('resetArticlesFilter');
       for (var i = 0; i < _no_articles_nodes.length; i++) {
         _no_articles_nodes[i].unFade();
       }
@@ -856,7 +856,7 @@
           _nodes_by_nid[e.target_id].chutier_action = e.new_action;
         })
         .on('search-results-loaded', function(e){
-          console.log("Edlp Corpus, search-results-loaded",e.results);
+          //console.log("Edlp Corpus, search-results-loaded",e.results);
           // TODO: filter map's nodes
           filterSearchResults(e.results);
         })
@@ -981,10 +981,12 @@
     function startAnime(){
       _physics.onUpdate(render);
       _physics.play()
-      $('body').trigger({
-        'type':'corpus-map-ready',
-        'playlist':_playlist
-      });
+      $('body')
+        .attr('corpus', 'map-ready')
+        .trigger({
+          'type':'corpus-map-ready',
+          'playlist':_playlist
+        });
     };
 
     init();

sites/all/modules/figli/edlp_corpus/src/Plugin/Block/BlockEntrees.php

@@ -49,6 +49,7 @@ class BlockEntrees extends BlockBase {
         'attributes' => array(
           'class' => ['term-'.$tid, 'term-link'],
           'tid'=>$tid,
+          'selector' => 'entree-term-link-'.$tid,
           'data-drupal-link-system-path' => $url->getInternalPath()
         )
       ));
@@ -61,6 +62,7 @@ class BlockEntrees extends BlockBase {
           'class' => ['index-link', 'ajax-link'],
           'viewmode'=>'index',
           'tid'=>$tid,
+          'selector' => 'entree-index-link-'.$tid,
           'data-drupal-link-system-path' => $url->getInternalPath()
         )
       ));
@@ -73,6 +75,7 @@ class BlockEntrees extends BlockBase {
           'class' => ['notice-link', 'ajax-link'],
           'viewmode'=>'notice',
           'tid'=>$tid,
+          'selector' => 'entree-notice-link-'.$tid,
           'data-drupal-link-system-path' => $url->getInternalPath()
         )
       ));

sites/all/modules/figli/edlp_search/assets/js/edlp_search.js

@@ -6,7 +6,7 @@
   var _$form;
 
   function init(){
-    console.log('EdlpSearch Init', settings);
+    // console.log('EdlpSearch Init', settings);
     initEvents();
     initAjax();
   };
@@ -20,8 +20,8 @@
   function initAjax(){
     _$form = $('#edlp-search-form:not(.ajax-enabled)');
     if(!_$form.length) return false;
-    
-    console.log('EdlpSearch initAjaxForm()');
+
+    //console.log('EdlpSearch initAjaxForm()');
     _$form = $('#edlp-search-form:not(.ajax-enabled)')
       .on('submit', onSubmitForm)
       .addClass('ajax-enabled');
@@ -51,7 +51,7 @@
     // genres
     args.genres = $('input[name="genres"]', this).val();
 
-    console.log('EdlpSearch onSubmitForm() : args',args);
+    //console.log('EdlpSearch onSubmitForm() : args',args);
 
     loadResults(args);
 
@@ -59,7 +59,7 @@
   };
 
   function loadResults(args){
-    console.log('EdlpSearch loadResults() : args', args);
+    //console.log('EdlpSearch loadResults() : args', args);
     _$form.addClass('ajax-loading');
     _$body.addClass('ajax-loading');
     $('[theme="edlp_search_results"]', _$container).addClass('ajax-loading');

sites/all/modules/figli/edlp_search/src/Controller/EdlpSearchController.php

@@ -273,12 +273,12 @@ class EdlpSearchController extends ControllerBase {
       $query->keys($this->keys);
     }
 
-    // TODO: langues
+    // langues
     if (!empty($this->langues)) {
       $query->addCondition('field_langues', $this->langues, "=");
     }
 
-    // TODO: genres
+    // genres
     if (!empty($this->genres)) {
       $query->addCondition('field_genres', $this->genres, "=");
     }

sites/all/modules/figli/edlp_studio/assets/js/edlp_studio.js

@@ -6,7 +6,7 @@
   // audio play is handled by edlp_theme
 
   function init(){
-    console.log('Studio Init');
+    // console.log('Studio Init');
     initEvents();
     initStudio();
   };
@@ -35,13 +35,13 @@
   // | (__| ' \ || |  _| / -_) '_| | .` / _ \/ _` / -_) | |__| | ' \| / /(_-<
   //  \___|_||_\_,_|\__|_\___|_|   |_|\_\___/\__,_\___| |____|_|_||_|_\_\/__/
   function initAjaxChutierLinks(){
-    console.log('studio initAjaxChutierLinks');
+    //console.log('studio initAjaxChutierLinks');
     $('.chutier-ajax-link:not(.ajax-enabled)')
       .addClass('ajax-enabled')
       .on('click', onClickChutierAjaxLink);
   };
   function onClickChutierAjaxLink(e){
-    console.log('studio onClickAjaxLink chutier');
+    //console.log('studio onClickAjaxLink chutier');
     e.preventDefault();
     addRemoveToChutier($(this));
     return false;
@@ -60,7 +60,7 @@
       });
   };
   function onActionToChutierDone($link, data){
-    console.log('onActionToChutierDone',data);
+    //console.log('onActionToChutierDone',data);
     $('body').trigger({
       'type':'chutier-action-done',
       'action_done':data.action_done,
@@ -82,7 +82,7 @@
   //  \___\___/_|_|_| .__/\___/__/_|\__|_\___/_||_/__/
   //                |_|
   function initAjaxCompoLinks(){
-    console.log('studio initAjaxCompoLinks');
+    //console.log('studio initAjaxCompoLinks');
     $('.new-composition-link:not(.ajax-enabled)')
     .on('click', onClickNewCompoLink)
       .addClass('ajax-enabled');
@@ -101,7 +101,7 @@
   //       |_|                             |_|
   function onClickCompoLink(e){
     e.preventDefault();
-    console.log('onClickCompoLink');
+    //console.log('onClickCompoLink');
     openCompo($(this));
     return false;
   };
@@ -120,7 +120,7 @@
       });
   };
   function onOpenCompoDone(data, $link){
-    console.log('onActionToCompoDone',data);
+    //console.log('onActionToCompoDone',data);
     $('.composition-link').removeClass('is-active');
     $link.removeClass('ajax-loading').addClass('is-active');
     if($('.composition', $composer).length){
@@ -163,7 +163,7 @@
   };
   function onNewCompoFormSubmit(e, $link, $form){
     var name = $('input[type="text"]',$form).val();
-    console.log('onNewCompoFormSubmit', name);
+    //console.log('onNewCompoFormSubmit', name);
     if(name != ''){
       $form.addClass('ajax-loading').children('*').attr('disabled', 'disabled');
       createNewCompo(name, $link, $form);
@@ -185,7 +185,7 @@
       });
   };
   function onCreateCompoDone(data, $link, $form){
-    console.log('onActionToCompoDone',data);
+    //console.log('onActionToCompoDone',data);
     var $new_link = $(data.new_link);
     var $delete_link = $(data.delete_link);
     $link
@@ -225,10 +225,10 @@
       });
   };
   function onDeleteCompoDone(data, $link, $form){
-    console.log('onDeleteCompoDone',data);
+    //console.log('onDeleteCompoDone',data);
     if(data.status == "ok"){
       $link.parents('li').remove();
-      console.log("$('.composition-link').length", $('.composition-link').length);
+      //console.log("$('.composition-link').length", $('.composition-link').length);
       if($('.composition-link').length){
         openCompo($('.composition-link').eq(0));
       }else{
@@ -365,7 +365,7 @@
     });
   }
   function onOrderChanged(e, ui){
-    console.log('onOrderChanged : e', e);
+    //console.log('onOrderChanged : e', e);
     var cid = $(e.target).parents('.composition').attr('cid');
     var documents = {};
     $('a', e.target).each(function(i) {
@@ -376,10 +376,10 @@
     recordCompoList(cid, documents);
   };
   function recordCompoList(cid, docs){
-    console.log('recordCompoList '+cid, docs);
+    //console.log('recordCompoList '+cid, docs);
     var ajax_path = _settings.save_compo_ajax_url+'/'+cid;
     var path = window.location.origin + Drupal.url(ajax_path);
-    console.log('path', path);
+    //console.log('path', path);
     $.getJSON(path, {
         documents:docs
       })
@@ -394,7 +394,7 @@
     });
   }
   function onRecordCompoDone(data){
-    console.log('onDeleteCompoDone',data);
+    //console.log('onDeleteCompoDone',data);
     if(data.status == "ok"){
     }else{
       console.warn(data.message);

sites/all/modules/figli/edlp_studio/edlp_studio.routing.yml

@@ -25,7 +25,7 @@ edlp_studio.composition_controller_action_ajax:
     _permission: 'use chutier'
 
 edlp_studio.studio_ui:
-  path: '/edlp/studio-ui'
+  path: '/studio'
   defaults:
     _controller: '\Drupal\edlp_studio\Controller\StudioUIController::StudioUI'
     _title: 'Studio User Interface'
@@ -33,7 +33,7 @@ edlp_studio.studio_ui:
     _permission: 'use chutier'
 
 edlp_studio.studio_ui_ajax:
-  path: '/edlp/studio-ui/ajax'
+  path: '/studio/ajax'
   defaults:
     _controller: '\Drupal\edlp_studio\Controller\StudioUIController::StudioUIJson'
     _title: 'Studio User Interface'
@@ -41,7 +41,7 @@ edlp_studio.studio_ui_ajax:
     _permission: 'use chutier'
 
 edlp_studio.studio_chutier_ui_ajax:
-  path: '/edlp/studio/chutier-ui/ajax'
+  path: '/studio/chutier-ui/ajax'
   defaults:
     _controller: '\Drupal\edlp_studio\Controller\StudioUIController::StudioChutierUIJson'
     _title: 'Chutier of Studio User Interface'

sites/all/modules/figli/edlp_studio/src/Plugin/Block/StudioLinkBlock.php

@@ -51,7 +51,7 @@ class StudioLinkBlock extends BlockBase  implements ContainerFactoryPluginInterf
   public function build() {
     $build = [];
     if($this->user->id()){
-      $url = Url::fromRoute('edlp_studio.studio_ui', [], ['absolute' => TRUE]);
+      $url = Url::fromRoute('edlp_studio.studio_ui');
       $build['edlp_studio_link_block'] = array(
         '#title' => "Studio",
         '#type' => 'link',

sites/all/themes/custom/edlptheme/assets/dist/scripts/history.min.js

@@ -1,10 +1,21 @@
 // console.log('History');
-// console.log(window.location);
-// console.log(document);
-document.body.style.visibility = 'hidden';
-if(window.location.pathname != "" && window.location.pathname != "/"){
-  // console.log('redirect');
+
+// https://plainjs.com/javascript/utilities/set-cookie-get-cookie-and-delete-cookie-5/
+function setCookie(name, value, days) {
+  var d = new Date;
+  d.setTime(d.getTime() + 24*60*60*1000*days);
+  document.cookie = name + "=" + value + ";path=/;expires=" + d.toGMTString();
+}
+// var edlp is provided by edlp_ajax.module file
+if(edlp.redirect){
+  document.body.style.visibility = 'hidden';
+
+  // record current sys_path in cookie (or storage) (without first slash to be like real system-path)
+  setCookie('edlp_origin_path', edlp.sys_path.replace(/^\//, ''), 1);
+  // create new location (transform current path to hash)
+  // TODO: understand why edlp.com/#/presentation is magicaly transformed into edlp.com/presentation
   var newloc = window.location.origin+'#'+window.location.pathname;
+  // redirect
   window.location.replace(newloc);
 }else{
   document.body.style.visibility = 'visible';

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

@@ -1,6 +1,7 @@
 (function($, Drupal, drupalSettings) {
 
   EdlpTheme = function(){
+    var _ajax_settings = drupalSettings.edlp_ajax;
     var _$body = $('body');
     var _is_front = _$body.is('.path-frontpage');
     var _$corpus_canvas;
@@ -15,9 +16,10 @@
     //  | || ' \| |  _|
     // |___|_||_|_|\__|
     function init(){
-      console.log("EdlpTheme init()");
+      //console.log("EdlpTheme init()");
 
-      // TODO: redirect all no-front pages to front with write hash
+      // redirect all no-front pages to front with right url ajax load
+      initHistory();
 
       _$body.on('corpus-map-ready', onCorpusMapReady);
 
@@ -26,16 +28,11 @@
 
       initAjaxLinks();
 
-      if (_$body.is('.path-productions')){
-        initProductions();
-      }
+      if (_$body.is('.path-productions')) initProductions();
 
-      if(_$body.is('.path-frontpage')){
-        initHome();
-      }
+      if(_$body.is('.path-frontpage')) initHome();
 
       // initScrollbars();
-      initHistory();
       initEvents();
     };
 
@@ -81,110 +78,50 @@
       // });
     };
 
+
     //    _    _
     //   /_\  (_)__ ___ __
     //  / _ \ | / _` \ \ /
     // /_/ \_\/ \__,_/_\_\
     //      |__/
-    // TODO: add url hash nav
-    // TODO: implement history.js
-    function initAjaxLinks(){
-      console.log('initAjaxLinks');
-
-      $('a', '#block-mainnavigation')
-        .add('a', '#block-footer.menu--footer')
-        .add('a', '#block-productions')
-        .add('a', 'article.node:not(.node--type-enregistrement) h2.node-title')
-        .add('a', '.productions-subtree')
-        .add('a', '.productions-parent')
-        // .add('a.index-link, a.notice-link', '#block-edlpentreesblock')
-        .addClass('ajax-link');
-
-
-      _$ajaxLinks = $('.ajax-link:not(.ajax-enabled)')
-        .each(function(i,e){
-          var $this = $(this);
-          // avoid already ajaxified links
-          if($this.is('.ajax-enable')) return;
-          if($this.attr('data-drupal-link-system-path')){
-            $this.on('click', onClickAjaxLink).addClass('ajax-enable');
-          }
-        });
-    };
-    function onClickAjaxLink(e){
-      e.preventDefault();
-      var $link = $(this);
-
-      if($link.is('.is-active'))
-        return false;
-
-      // Audio links
-      // launch audio player and stop here
-      if($link.is('.audio-link')){
-        _audioPlayer
-          .emmit('stop-shuffle')
-          .openDocument({
-            nid:$link.attr('nid'),
-            audio_url:$link.attr('audio_url')
-          });
-        return false;
-      }
-
-      // other links
-      var url = $(this).attr('href');
-      var sys_path = $(this).attr('data-drupal-link-system-path');
-
-      // front page
-      // just remove contents and stop here
-      if(sys_path == '<front>'){
-        backToFrontPage();
-        return false;
-      }
-
-      var ajax_path = parseLinkAjaxPath($link);
-
-      $link.addClass('ajax-loading');
-
-      ajaxLinkLoadContent(url, sys_path, ajax_path);
-      return false;
-    };
-    function parseLinkAjaxPath($link){
-      var ajax_path = $link.attr('data-drupal-link-system-path');
+    function parseAjaxSysPath(sys_path, view_mode){
+      // console.log('Theme : parseAjaxSysPath', sys_path);
+      var ajax_path = sys_path;
 
       // convert node link to edlp_ajax_node module links
       var node_match = ajax_path.match(/^\/?(node\/\d+)$/g);
       var term_match = ajax_path.match(/^\/?(taxonomy\/term\/\d+)$/g);
       if(node_match){
-        ajax_path = 'edlp/ajax/json/'+node_match[0];
+        ajax_path = _ajax_settings.entityjson_path+'/'+node_match[0];
         // check for viewmode attribute
-        if($link.attr('viewmode')){
-          ajax_path += '/'+$link.attr('viewmode');
+        if(view_mode){
+          ajax_path += '/'+view_mode;
         }
       }else if(term_match){
-        ajax_path = 'edlp/ajax/json/'+term_match[0];
+        ajax_path = _ajax_settings.entityjson_path+'/'+term_match[0];
         ajax_path = ajax_path.replace(/taxonomy\/term/, 'taxonomy_term');
         // check for viewmode attribute
-        if($link.attr('viewmode')){
-          ajax_path += '/'+$link.attr('viewmode');
+        if(view_mode){
+          ajax_path += '/'+view_mode;
         }
       }else{
         // convert other link to ajax
+        // TODO: we assume that other links (no node, no term) are all from own modules (e.g. productions) !! may not be true !!
         ajax_path += '/ajax'
       }
-
       return ajax_path;
     };
-    function ajaxLinkLoadContent(url, sys_path, ajax_path){
-
+    function ajaxLoadContent(url, sys_path, ajax_path, selector){
+      //console.log('ajaxLoadContent : ajax_path', ajax_path);
       _$body.addClass('ajax-loading');
 
       var path = window.location.origin + Drupal.url(ajax_path);
       $.getJSON(path, {})
         .done(function(data){
-          onAjaxLinkLoaded(data, sys_path);
+          onAjaxLoaded(data, sys_path, selector);
         })
         .fail(function(jqxhr, textStatus, error){
-          onAjaxLinkLoadError(jqxhr, textStatus, error, sys_path);
+          onAjaxLoadError(jqxhr, textStatus, error, sys_path);
         });
 
 
@@ -195,18 +132,19 @@
       // url is null means that we are loading content on popState event
       // so we don't record the state again
       if(url){
+        // console.log('url:'+url+' ; state',state);
+        // we can not pushestate with absolute url
         history.pushState(state, null, url);
       }
 
     };
-    function onAjaxLinkLoadError(jqxhr, textStatus, error, sys_path){
+    function onAjaxLoadError(jqxhr, textStatus, error, sys_path){
       console.warn('ajaxlink load failed for '+sys_path+' : '+error, jqxhr.responseText);
       $('.ajax-loading').removeClass('ajax-loading');
       _$body.removeClass('ajax-loading');
     };
-    function onAjaxLinkLoaded(data, sys_path){
-      // console.log('ajax link loaded : data', data);
-      _$body.removeClass('ajax-loading');
+    function onAjaxLoaded(data, sys_path, selector){
+      console.log('ajax link loaded : data', data);
 
       // reset all style may been added by other pages (like masonry for productions)
       // and replace all content with newly loaded
@@ -214,7 +152,7 @@
       _$row.removeAttr('style').html(data.rendered);
 
       // add close btn
-      if(sys_path != 'procuction'){
+      if(sys_path != 'productions'){
         addCloseBtnToCols();
       }
 
@@ -235,13 +173,28 @@
       // handle clicked link classes
       _$ajaxLinks.removeClass('is-active');
       $('.ajax-loading').removeClass('ajax-loading');
-      $('a[data-drupal-link-system-path="'+sys_path+'"]').addClass('is-active');
 
-      // TODO: keep production menu active for content type Page (production)
+      // TODO: break entrees links wich all have same sys_path
+      if(typeof selector != 'undefined'){
+        $('a[selector="'+selector+'"]').addClass('is-active');
+      }else{
+        $('a[data-drupal-link-system-path="'+sys_path+'"]').addClass('is-active');
+      }
 
-      // TODO: if node is in production menu tree, set first level of tree active, e.g. pieces sonores
+      // if bundle page (productions) activate production links
+      if (typeof data.bundle != 'undefined' && data.bundle == "page") {
+        $('a[data-drupal-link-system-path="productions"]').addClass('is-active');
+      }
+      // if node is in production menu tree, set first level of tree active, e.g. pieces sonores
+      if (typeof data.menu_parents != 'undefined') {
+        for (var i = 0; i < data.menu_parents.length; i++) {
+          var menu_sys_path = data.menu_parents[i];
+          $('a[data-drupal-link-system-path="'+menu_sys_path+'"]').addClass('is-active');
+        }
+      }
 
       // if block attached (eg : from edlp_productions module)
+      // not used anymore as production block is always present (but not visible)
       if(typeof data.block != 'undefined'){
         // if block not already added
         if(!$('#'+data.block.id, '.region-'+data.block.region).length){
@@ -261,6 +214,9 @@
       // and call druapl behaviours
       Drupal.attachBehaviors(_$row[0]);
 
+      _$body.attr('booted', 'booted');
+      _$body.removeClass('ajax-loading');
+
     };
 
     function addCloseBtnToCols(){
@@ -289,44 +245,119 @@
       });
     };
 
-
-    //  _  _ _    _                   _ ___
-    // | || (_)__| |_ ___ _ _ _  _ _ | / __|
-    // | __ | (_-<  _/ _ \ '_| || | || \__ \
-    // |_||_|_/__/\__\___/_|  \_, |\__/|___/
+    //  _  _ _    _
+    // | || (_)__| |_ ___ _ _ _  _
+    // | __ | (_-<  _/ _ \ '_| || |
+    // |_||_|_/__/\__\___/_|  \_, |
     //                        |__/
     function initHistory(){
       initFirstLoad();
       window.addEventListener('popstate', onHistoryPopState);
     };
     function initFirstLoad(){
-      console.log(window.location);
-      // console.log(document);
+      // console.log('theme : initFirstLoad()', window.location);
+      // console.log(document.cookie);
       var url = window.location.pathname;
-      if( url != "" && url != "/"){
-        // TODO: THIS IS NOT WORKING ! with link which dont exist in dom, e.g. productions
-        // TODO: how to retrieve sys_path without dom ?
-        var $link = $('a[href="'+url+'"][data-drupal-link-system-path]').eq(0);
-        console.log($link);
-        var sys_path = $link.attr('data-drupal-link-system-path');
-
-        var state = {
-          ajax_path: parseLinkAjaxPath($link),
-          sys_path: sys_path,
-        };
-        history.replaceState(state, null, url);
-        ajaxLinkLoadContent(null, state.sys_path, state.ajax_path)
+      if(url != '' && url != '/'){
+        var origin_path = getCookie('edlp_origin_path');
+        // console.log('origin_path', origin_path);
+        if(origin_path){
+          var state = {
+            ajax_path: parseAjaxSysPath(origin_path),
+            sys_path: origin_path,
+          };
+          ajaxLoadContent(null, state.sys_path, state.ajax_path);
+          history.replaceState(state, null, url);
+          // reset the cookie
+          deleteCookie('edlp_origin_path');
+          deleteCookie('edlp_sys_path');
+
+        }
+
       }else{
         history.replaceState({home:true}, null, url);
+        _$body.attr('booted', 'booted');
       }
     };
     function onHistoryPopState(e){
-      console.log('onPopState',e);
+      //console.log('onPopState',e);
       if(e.state.home){
         backToFrontPage();
       }else{
-        ajaxLinkLoadContent(null, e.state.sys_path, e.state.ajax_path)
+        ajaxLoadContent(null, e.state.sys_path, e.state.ajax_path)
+      }
+    };
+
+    //    _    _          _    _      _
+    //   /_\  (_)__ ___ _| |  (_)_ _ | |__ ___
+    //  / _ \ | / _` \ \ / |__| | ' \| / /(_-<
+    // /_/ \_\/ \__,_/_\_\____|_|_||_|_\_\/__/
+    //      |__/
+    function initAjaxLinks(){
+      // console.log('initAjaxLinks');
+
+      $('a', '#block-mainnavigation')
+        .add('a', '#block-footer.menu--footer')
+        .add('a', '#block-productions')
+        .add('a', 'article.node:not(.node--type-enregistrement) h2.node-title')
+        .add('a', '.productions-subtree')
+        .add('a', '.productions-parent')
+        // .add('a.index-link, a.notice-link', '#block-edlpentreesblock')
+        // .addClass('use-ajax')
+        .addClass('ajax-link');
+
+      Drupal.ajax.bindAjaxLinks('#block-footer.menu--footer');
+      _$ajaxLinks = $('.ajax-link:not(.ajax-enabled)')
+        .each(function(i,e){
+          var $this = $(this);
+          // avoid already ajaxified links
+          if($this.is('.ajax-enable')) return;
+          if($this.attr('data-drupal-link-system-path')){
+            $this.on('click', onClickAjaxLink).addClass('ajax-enable');
+          }
+        });
+    };
+    function onClickAjaxLink(e){
+      e.preventDefault();
+      var $link = $(this);
+
+      if($link.is('.is-active'))
+        return false;
+
+      // Audio links
+      // launch audio player and stop here
+      if($link.is('.audio-link')){
+        _audioPlayer
+          .emmit('stop-shuffle')
+          .openDocument({
+            nid:$link.attr('nid'),
+            audio_url:$link.attr('audio_url')
+          });
+        return false;
+      }
+
+      // other links
+      var url = $(this).attr('href');
+      var sys_path = $(this).attr('data-drupal-link-system-path');
+
+      // front page
+      // just remove contents and stop here
+      if(sys_path == '<front>'){
+        backToFrontPage();
+        return false;
+      }
+
+      var view_mode = $link.attr('viewmode');
+      var ajax_path = parseAjaxSysPath(sys_path, view_mode);
+
+      $link.addClass('ajax-loading');
+
+      if($link.is('[selector]')){
+        var selector = $link.attr('selector');
       }
+
+      ajaxLoadContent(url, sys_path, ajax_path, selector);
+      return false;
     };
 
     //   ___
@@ -335,15 +366,15 @@
     //  \___\___/_| | .__/\_,_/__/
     //              |_|
     function onCorpusMapReady(e){
-      console.log('theme : onCorpusReady', e);
+      //console.log('theme : onCorpusReady', e);
       _$corpus_canvas = $('canvas#corpus-map');
       _$corpus_canvas
         .on('corpus-cliked-on-map', function(e) {
-          console.log('theme : corpus-cliked-on-map');
+          //console.log('theme : corpus-cliked-on-map');
           backToFrontPage();
         })
         .on('corpus-cliked-on-node', function(e) {
-          console.log('theme : corpus-cliked-on-node', e);
+          //console.log('theme : corpus-cliked-on-node', e);
           _audioPlayer
             .emmit('stop-shuffle')
             .openDocument(e.target_node);
@@ -491,7 +522,7 @@
           var that = this;
           window.requestAnimationFrame(that.updateLoadingBar.bind(that));
         }else{
-          console.log('Audio fully loaded');
+          //console.log('Audio fully loaded');
         }
       },
       onCanplay(){
@@ -554,7 +585,10 @@
       // cartel functions
       loadNode(nid){
         this.$cartel.addClass('loading');
-        $.getJSON('/edlp/ajax/json/node/'+nid+'/player_cartel', {})
+        var vm = 'player_cartel';
+        var ajax_path = _ajax_settings.entityjson_path+'/node/'+nid+'/'+vm;
+        var path = window.location.origin + Drupal.url(ajax_path);
+        $.getJSON(path, {})
           .done(this.onNodeLoaded.bind(this))
           .fail(this.onNodeLoadFail.bind(this));
       },
@@ -671,7 +705,7 @@
           var r = Math.floor(Math.random() * tempPLaylist.length);
           this.shuffledPlaylist.push(tempPLaylist.splice(r,1)[0]);
         }
-        console.log('RandomPlayer, this.shuffledPlaylist', this.shuffledPlaylist);
+        //console.log('RandomPlayer, this.shuffledPlaylist', this.shuffledPlaylist);
       },
       toggleActive(e){
         if (this.active) {
@@ -697,11 +731,11 @@
           _audioPlayer.openDocument(this.shuffledPlaylist.splice(0,1)[0]);
       },
       onAudioPlayNext(){
-        console.log('RandomPlayer : onAudioPlayNext()');
+        //console.log('RandomPlayer : onAudioPlayNext()');
         this.next();
       },
       onAudioPlayerEnded(){
-        console.log('RandomPlayer : onAudioPlayerEnded()');
+        //console.log('RandomPlayer : onAudioPlayerEnded()');
         this.next();
       }
     };
@@ -724,7 +758,7 @@
     };
     CompoPlayer.prototype = {
       init(){
-        console.log('CompoPlayer init()');
+        // console.log('CompoPlayer init()');
         // attach an event on AudioPlayer
         _audioPlayer
           .on('audio-open-document', this.onAudioOpenDocument.bind(this))
@@ -736,12 +770,12 @@
         // this.newCompo();
       },
       newCompo(){
-        console.log('CompoPlayer newCompo()');
+        //console.log('CompoPlayer newCompo()');
         // this.$compo = $('.composition_ui .composer .composition');
         this.initControls();
       },
       initControls(){
-        console.log('CompoPlayer initControls()');
+        //console.log('CompoPlayer initControls()');
         this.$composer = $('.composition_ui .composer');
         this.$compo = $('.composition_ui .composer .composition');
         this.$controls = $('.composition_ui .composer .compo-player-controls');
@@ -794,7 +828,7 @@
         }
       },
       start(){
-        console.log('start');
+        //console.log('start');
         // console.log('CompoPlayer start()');
         this.playing = true;
         this.play();
@@ -810,7 +844,7 @@
         this.setActiveItem().showHideControls();
       },
       pause(){
-        console.log('pause');
+        //console.log('pause');
         this.paused = true;
         this.showHideControls();
         _audioPlayer.stop();
@@ -936,7 +970,6 @@
       // }
     };
 
-
     //  ___            _   ___
     // | __| _ ___ _ _| |_| _ \__ _ __ _ ___
     // | _| '_/ _ \ ' \  _|  _/ _` / _` / -_)
@@ -952,7 +985,7 @@
 
     function initHome(){
       addCloseBtnToCols();
-      console.log('theme : initHome');
+      // console.log('theme : initHome');
       // console.log('theme : initProductions');
       var $grid = $('.grid',_$row).masonry({
         itemSelector:'.col',
@@ -971,7 +1004,6 @@
       });
     }
 
-
     //  ___             _         _   _
     // | _ \_ _ ___  __| |_  _ __| |_(_)___ _ _  ___
     // |  _/ '_/ _ \/ _` | || / _|  _| / _ \ ' \(_-<
@@ -1000,13 +1032,32 @@
     // | |\/| / _ \/ _` / _` | (_-<
     // |_|  |_\___/\__,_\__,_|_/__/
     function closeAllModals(){
-      console.log('theme : closeAllModals');
+      //console.log('theme : closeAllModals');
       // TODO: animate the remove
       _$row.html('');
       _$ajaxLinks.removeClass('is-active');
       _$body.trigger({'type':'all-modal-closed'});
     };
 
+    //  _  _     _
+    // | || |___| |_ __  ___ _ _ ___
+    // | __ / -_) | '_ \/ -_) '_(_-<
+    // |_||_\___|_| .__/\___|_| /__/
+    //            |_|
+
+    // https://plainjs.com/javascript/utilities/set-cookie-get-cookie-and-delete-cookie-5/
+    function getCookie(name) {
+      var v = document.cookie.match('(^|;) ?' + name + '=([^;]*)(;|$)');
+      return v ? v[2] : null;
+    }
+    function setCookie(name, value, days) {
+      var d = new Date;
+      d.setTime(d.getTime() + 24*60*60*1000*days);
+      document.cookie = name + "=" + value + ";path=/;expires=" + d.toGMTString();
+    }
+
+    function deleteCookie(name) { setCookie(name, '', -1); }
+
     init();
   } // end EdlpTheme()
 

sites/all/themes/custom/edlptheme/assets/dist/styles/app.min.css

@@ -1259,6 +1259,28 @@ header[role="banner"] {
         border-color: red;
         background-color: red; }
 
+#corpus-map {
+  opacity: 0; }
+  body[corpus="map-ready"] #corpus-map {
+    -webkit-transition: opacity 2s ease-out;
+    transition: opacity 2s ease-out;
+    opacity: 1; }
+
+main[role="main"] .row {
+  opacity: 0; }
+  main[role="main"] .row .col {
+    opacity: 1;
+    -webkit-transition: opacity 0.5s ease-in-out;
+    transition: opacity 0.5s ease-in-out; }
+
+body[booted="booted"] main[role="main"] .row {
+  -webkit-transition: opacity 1s ease-out;
+  transition: opacity 1s ease-out;
+  opacity: 1; }
+
+body.ajax-loading main[role="main"] .row .col:not([theme="edlp_search_search_form"]) {
+  opacity: 0.2; }
+
 main[role="main"] .layout-content {
   pointer-events: none; }
   main[role="main"] .layout-content .row {
@@ -1303,14 +1325,6 @@ main[role="main"] ul, main[role="main"] li, main[role="main"] ul.inline li:first
   padding: 0;
   list-style: none; }
 
-main[role="main"] .layout-content {
-  -webkit-transition: opacity 0.5s ease-in-out;
-  transition: opacity 0.5s ease-in-out;
-  opacity: 1; }
-
-body.ajax-loading main[role="main"] .layout-content .col:not([theme="edlp_search_search_form"]) {
-  opacity: 0.2; }
-
 main[role="main"] span.close-col-btn {
   pointer-events: all;
   cursor: pointer;
@@ -2394,6 +2408,17 @@ footer {
               height: 5px;
               border: 1px solid #000;
               margin-right: 0.5em; }
+            footer .block-block-edlp-entrees ul li .entree-content span.oblique-wrapper a.ajax-loading:before {
+              -webkit-animation: rotation 2s infinite linear;
+              animation: rotation 2s infinite linear; }
+
+@keyframes rotation {
+  from {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg); }
+  to {
+    -webkit-transform: rotate(359deg);
+    transform: rotate(359deg); } }
           footer .block-block-edlp-entrees ul li .entree-content .term-description {
             display: inline-block;
             margin-left: 1.5em;

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

@@ -1,10 +1,21 @@
 // console.log('History');
-// console.log(window.location);
-// console.log(document);
-document.body.style.visibility = 'hidden';
-if(window.location.pathname != "" && window.location.pathname != "/"){
-  // console.log('redirect');
+
+// https://plainjs.com/javascript/utilities/set-cookie-get-cookie-and-delete-cookie-5/
+function setCookie(name, value, days) {
+  var d = new Date;
+  d.setTime(d.getTime() + 24*60*60*1000*days);
+  document.cookie = name + "=" + value + ";path=/;expires=" + d.toGMTString();
+}
+// var edlp is provided by edlp_ajax.module file
+if(edlp.redirect){
+  document.body.style.visibility = 'hidden';
+
+  // record current sys_path in cookie (or storage) (without first slash to be like real system-path)
+  setCookie('edlp_origin_path', edlp.sys_path.replace(/^\//, ''), 1);
+  // create new location (transform current path to hash)
+  // TODO: understand why edlp.com/#/presentation is magicaly transformed into edlp.com/presentation
   var newloc = window.location.origin+'#'+window.location.pathname;
+  // redirect
   window.location.replace(newloc);
 }else{
   document.body.style.visibility = 'visible';

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

@@ -1,6 +1,7 @@
 (function($, Drupal, drupalSettings) {
 
   EdlpTheme = function(){
+    var _ajax_settings = drupalSettings.edlp_ajax;
     var _$body = $('body');
     var _is_front = _$body.is('.path-frontpage');
     var _$corpus_canvas;
@@ -15,9 +16,10 @@
     //  | || ' \| |  _|
     // |___|_||_|_|\__|
     function init(){
-      console.log("EdlpTheme init()");
+      //console.log("EdlpTheme init()");
 
-      // TODO: redirect all no-front pages to front with write hash
+      // redirect all no-front pages to front with right url ajax load
+      initHistory();
 
       _$body.on('corpus-map-ready', onCorpusMapReady);
 
@@ -26,16 +28,11 @@
 
       initAjaxLinks();
 
-      if (_$body.is('.path-productions')){
-        initProductions();
-      }
+      if (_$body.is('.path-productions')) initProductions();
 
-      if(_$body.is('.path-frontpage')){
-        initHome();
-      }
+      if(_$body.is('.path-frontpage')) initHome();
 
       // initScrollbars();
-      initHistory();
       initEvents();
     };
 
@@ -81,110 +78,50 @@
       // });
     };
 
+
     //    _    _
     //   /_\  (_)__ ___ __
     //  / _ \ | / _` \ \ /
     // /_/ \_\/ \__,_/_\_\
     //      |__/
-    // TODO: add url hash nav
-    // TODO: implement history.js
-    function initAjaxLinks(){
-      console.log('initAjaxLinks');
-
-      $('a', '#block-mainnavigation')
-        .add('a', '#block-footer.menu--footer')
-        .add('a', '#block-productions')
-        .add('a', 'article.node:not(.node--type-enregistrement) h2.node-title')
-        .add('a', '.productions-subtree')
-        .add('a', '.productions-parent')
-        // .add('a.index-link, a.notice-link', '#block-edlpentreesblock')
-        .addClass('ajax-link');
-
-
-      _$ajaxLinks = $('.ajax-link:not(.ajax-enabled)')
-        .each(function(i,e){
-          var $this = $(this);
-          // avoid already ajaxified links
-          if($this.is('.ajax-enable')) return;
-          if($this.attr('data-drupal-link-system-path')){
-            $this.on('click', onClickAjaxLink).addClass('ajax-enable');
-          }
-        });
-    };
-    function onClickAjaxLink(e){
-      e.preventDefault();
-      var $link = $(this);
-
-      if($link.is('.is-active'))
-        return false;
-
-      // Audio links
-      // launch audio player and stop here
-      if($link.is('.audio-link')){
-        _audioPlayer
-          .emmit('stop-shuffle')
-          .openDocument({
-            nid:$link.attr('nid'),
-            audio_url:$link.attr('audio_url')
-          });
-        return false;
-      }
-
-      // other links
-      var url = $(this).attr('href');
-      var sys_path = $(this).attr('data-drupal-link-system-path');
-
-      // front page
-      // just remove contents and stop here
-      if(sys_path == '<front>'){
-        backToFrontPage();
-        return false;
-      }
-
-      var ajax_path = parseLinkAjaxPath($link);
-
-      $link.addClass('ajax-loading');
-
-      ajaxLinkLoadContent(url, sys_path, ajax_path);
-      return false;
-    };
-    function parseLinkAjaxPath($link){
-      var ajax_path = $link.attr('data-drupal-link-system-path');
+    function parseAjaxSysPath(sys_path, view_mode){
+      // console.log('Theme : parseAjaxSysPath', sys_path);
+      var ajax_path = sys_path;
 
       // convert node link to edlp_ajax_node module links
       var node_match = ajax_path.match(/^\/?(node\/\d+)$/g);
       var term_match = ajax_path.match(/^\/?(taxonomy\/term\/\d+)$/g);
       if(node_match){
-        ajax_path = 'edlp/ajax/json/'+node_match[0];
+        ajax_path = _ajax_settings.entityjson_path+'/'+node_match[0];
         // check for viewmode attribute
-        if($link.attr('viewmode')){
-          ajax_path += '/'+$link.attr('viewmode');
+        if(view_mode){
+          ajax_path += '/'+view_mode;
         }
       }else if(term_match){
-        ajax_path = 'edlp/ajax/json/'+term_match[0];
+        ajax_path = _ajax_settings.entityjson_path+'/'+term_match[0];
         ajax_path = ajax_path.replace(/taxonomy\/term/, 'taxonomy_term');
         // check for viewmode attribute
-        if($link.attr('viewmode')){
-          ajax_path += '/'+$link.attr('viewmode');
+        if(view_mode){
+          ajax_path += '/'+view_mode;
         }
       }else{
         // convert other link to ajax
+        // TODO: we assume that other links (no node, no term) are all from own modules (e.g. productions) !! may not be true !!
         ajax_path += '/ajax'
       }
-
       return ajax_path;
     };
-    function ajaxLinkLoadContent(url, sys_path, ajax_path){
-
+    function ajaxLoadContent(url, sys_path, ajax_path, selector){
+      //console.log('ajaxLoadContent : ajax_path', ajax_path);
       _$body.addClass('ajax-loading');
 
       var path = window.location.origin + Drupal.url(ajax_path);
       $.getJSON(path, {})
         .done(function(data){
-          onAjaxLinkLoaded(data, sys_path);
+          onAjaxLoaded(data, sys_path, selector);
         })
         .fail(function(jqxhr, textStatus, error){
-          onAjaxLinkLoadError(jqxhr, textStatus, error, sys_path);
+          onAjaxLoadError(jqxhr, textStatus, error, sys_path);
         });
 
 
@@ -195,18 +132,19 @@
       // url is null means that we are loading content on popState event
       // so we don't record the state again
       if(url){
+        // console.log('url:'+url+' ; state',state);
+        // we can not pushestate with absolute url
         history.pushState(state, null, url);
       }
 
     };
-    function onAjaxLinkLoadError(jqxhr, textStatus, error, sys_path){
+    function onAjaxLoadError(jqxhr, textStatus, error, sys_path){
       console.warn('ajaxlink load failed for '+sys_path+' : '+error, jqxhr.responseText);
       $('.ajax-loading').removeClass('ajax-loading');
       _$body.removeClass('ajax-loading');
     };
-    function onAjaxLinkLoaded(data, sys_path){
-      // console.log('ajax link loaded : data', data);
-      _$body.removeClass('ajax-loading');
+    function onAjaxLoaded(data, sys_path, selector){
+      console.log('ajax link loaded : data', data);
 
       // reset all style may been added by other pages (like masonry for productions)
       // and replace all content with newly loaded
@@ -214,7 +152,7 @@
       _$row.removeAttr('style').html(data.rendered);
 
       // add close btn
-      if(sys_path != 'procuction'){
+      if(sys_path != 'productions'){
         addCloseBtnToCols();
       }
 
@@ -235,13 +173,28 @@
       // handle clicked link classes
       _$ajaxLinks.removeClass('is-active');
       $('.ajax-loading').removeClass('ajax-loading');
-      $('a[data-drupal-link-system-path="'+sys_path+'"]').addClass('is-active');
 
-      // TODO: keep production menu active for content type Page (production)
+      // TODO: break entrees links wich all have same sys_path
+      if(typeof selector != 'undefined'){
+        $('a[selector="'+selector+'"]').addClass('is-active');
+      }else{
+        $('a[data-drupal-link-system-path="'+sys_path+'"]').addClass('is-active');
+      }
 
-      // TODO: if node is in production menu tree, set first level of tree active, e.g. pieces sonores
+      // if bundle page (productions) activate production links
+      if (typeof data.bundle != 'undefined' && data.bundle == "page") {
+        $('a[data-drupal-link-system-path="productions"]').addClass('is-active');
+      }
+      // if node is in production menu tree, set first level of tree active, e.g. pieces sonores
+      if (typeof data.menu_parents != 'undefined') {
+        for (var i = 0; i < data.menu_parents.length; i++) {
+          var menu_sys_path = data.menu_parents[i];
+          $('a[data-drupal-link-system-path="'+menu_sys_path+'"]').addClass('is-active');
+        }
+      }
 
       // if block attached (eg : from edlp_productions module)
+      // not used anymore as production block is always present (but not visible)
       if(typeof data.block != 'undefined'){
         // if block not already added
         if(!$('#'+data.block.id, '.region-'+data.block.region).length){
@@ -261,6 +214,9 @@
       // and call druapl behaviours
       Drupal.attachBehaviors(_$row[0]);
 
+      _$body.attr('booted', 'booted');
+      _$body.removeClass('ajax-loading');
+
     };
 
     function addCloseBtnToCols(){
@@ -289,44 +245,119 @@
       });
     };
 
-
-    //  _  _ _    _                   _ ___
-    // | || (_)__| |_ ___ _ _ _  _ _ | / __|
-    // | __ | (_-<  _/ _ \ '_| || | || \__ \
-    // |_||_|_/__/\__\___/_|  \_, |\__/|___/
+    //  _  _ _    _
+    // | || (_)__| |_ ___ _ _ _  _
+    // | __ | (_-<  _/ _ \ '_| || |
+    // |_||_|_/__/\__\___/_|  \_, |
     //                        |__/
     function initHistory(){
       initFirstLoad();
       window.addEventListener('popstate', onHistoryPopState);
     };
     function initFirstLoad(){
-      console.log(window.location);
-      // console.log(document);
+      // console.log('theme : initFirstLoad()', window.location);
+      // console.log(document.cookie);
       var url = window.location.pathname;
-      if( url != "" && url != "/"){
-        // TODO: THIS IS NOT WORKING ! with link which dont exist in dom, e.g. productions
-        // TODO: how to retrieve sys_path without dom ?
-        var $link = $('a[href="'+url+'"][data-drupal-link-system-path]').eq(0);
-        console.log($link);
-        var sys_path = $link.attr('data-drupal-link-system-path');
-
-        var state = {
-          ajax_path: parseLinkAjaxPath($link),
-          sys_path: sys_path,
-        };
-        history.replaceState(state, null, url);
-        ajaxLinkLoadContent(null, state.sys_path, state.ajax_path)
+      if(url != '' && url != '/'){
+        var origin_path = getCookie('edlp_origin_path');
+        // console.log('origin_path', origin_path);
+        if(origin_path){
+          var state = {
+            ajax_path: parseAjaxSysPath(origin_path),
+            sys_path: origin_path,
+          };
+          ajaxLoadContent(null, state.sys_path, state.ajax_path);
+          history.replaceState(state, null, url);
+          // reset the cookie
+          deleteCookie('edlp_origin_path');
+          deleteCookie('edlp_sys_path');
+
+        }
+
       }else{
         history.replaceState({home:true}, null, url);
+        _$body.attr('booted', 'booted');
       }
     };
     function onHistoryPopState(e){
-      console.log('onPopState',e);
+      //console.log('onPopState',e);
       if(e.state.home){
         backToFrontPage();
       }else{
-        ajaxLinkLoadContent(null, e.state.sys_path, e.state.ajax_path)
+        ajaxLoadContent(null, e.state.sys_path, e.state.ajax_path)
+      }
+    };
+
+    //    _    _          _    _      _
+    //   /_\  (_)__ ___ _| |  (_)_ _ | |__ ___
+    //  / _ \ | / _` \ \ / |__| | ' \| / /(_-<
+    // /_/ \_\/ \__,_/_\_\____|_|_||_|_\_\/__/
+    //      |__/
+    function initAjaxLinks(){
+      // console.log('initAjaxLinks');
+
+      $('a', '#block-mainnavigation')
+        .add('a', '#block-footer.menu--footer')
+        .add('a', '#block-productions')
+        .add('a', 'article.node:not(.node--type-enregistrement) h2.node-title')
+        .add('a', '.productions-subtree')
+        .add('a', '.productions-parent')
+        // .add('a.index-link, a.notice-link', '#block-edlpentreesblock')
+        // .addClass('use-ajax')
+        .addClass('ajax-link');
+
+      Drupal.ajax.bindAjaxLinks('#block-footer.menu--footer');
+      _$ajaxLinks = $('.ajax-link:not(.ajax-enabled)')
+        .each(function(i,e){
+          var $this = $(this);
+          // avoid already ajaxified links
+          if($this.is('.ajax-enable')) return;
+          if($this.attr('data-drupal-link-system-path')){
+            $this.on('click', onClickAjaxLink).addClass('ajax-enable');
+          }
+        });
+    };
+    function onClickAjaxLink(e){
+      e.preventDefault();
+      var $link = $(this);
+
+      if($link.is('.is-active'))
+        return false;
+
+      // Audio links
+      // launch audio player and stop here
+      if($link.is('.audio-link')){
+        _audioPlayer
+          .emmit('stop-shuffle')
+          .openDocument({
+            nid:$link.attr('nid'),
+            audio_url:$link.attr('audio_url')
+          });
+        return false;
+      }
+
+      // other links
+      var url = $(this).attr('href');
+      var sys_path = $(this).attr('data-drupal-link-system-path');
+
+      // front page
+      // just remove contents and stop here
+      if(sys_path == '<front>'){
+        backToFrontPage();
+        return false;
+      }
+
+      var view_mode = $link.attr('viewmode');
+      var ajax_path = parseAjaxSysPath(sys_path, view_mode);
+
+      $link.addClass('ajax-loading');
+
+      if($link.is('[selector]')){
+        var selector = $link.attr('selector');
       }
+
+      ajaxLoadContent(url, sys_path, ajax_path, selector);
+      return false;
     };
 
     //   ___
@@ -335,15 +366,15 @@
     //  \___\___/_| | .__/\_,_/__/
     //              |_|
     function onCorpusMapReady(e){
-      console.log('theme : onCorpusReady', e);
+      //console.log('theme : onCorpusReady', e);
       _$corpus_canvas = $('canvas#corpus-map');
       _$corpus_canvas
         .on('corpus-cliked-on-map', function(e) {
-          console.log('theme : corpus-cliked-on-map');
+          //console.log('theme : corpus-cliked-on-map');
           backToFrontPage();
         })
         .on('corpus-cliked-on-node', function(e) {
-          console.log('theme : corpus-cliked-on-node', e);
+          //console.log('theme : corpus-cliked-on-node', e);
           _audioPlayer
             .emmit('stop-shuffle')
             .openDocument(e.target_node);
@@ -491,7 +522,7 @@
           var that = this;
           window.requestAnimationFrame(that.updateLoadingBar.bind(that));
         }else{
-          console.log('Audio fully loaded');
+          //console.log('Audio fully loaded');
         }
       },
       onCanplay(){
@@ -554,7 +585,10 @@
       // cartel functions
       loadNode(nid){
         this.$cartel.addClass('loading');
-        $.getJSON('/edlp/ajax/json/node/'+nid+'/player_cartel', {})
+        var vm = 'player_cartel';
+        var ajax_path = _ajax_settings.entityjson_path+'/node/'+nid+'/'+vm;
+        var path = window.location.origin + Drupal.url(ajax_path);
+        $.getJSON(path, {})
           .done(this.onNodeLoaded.bind(this))
           .fail(this.onNodeLoadFail.bind(this));
       },
@@ -671,7 +705,7 @@
           var r = Math.floor(Math.random() * tempPLaylist.length);
           this.shuffledPlaylist.push(tempPLaylist.splice(r,1)[0]);
         }
-        console.log('RandomPlayer, this.shuffledPlaylist', this.shuffledPlaylist);
+        //console.log('RandomPlayer, this.shuffledPlaylist', this.shuffledPlaylist);
       },
       toggleActive(e){
         if (this.active) {
@@ -697,11 +731,11 @@
           _audioPlayer.openDocument(this.shuffledPlaylist.splice(0,1)[0]);
       },
       onAudioPlayNext(){
-        console.log('RandomPlayer : onAudioPlayNext()');
+        //console.log('RandomPlayer : onAudioPlayNext()');
         this.next();
       },
       onAudioPlayerEnded(){
-        console.log('RandomPlayer : onAudioPlayerEnded()');
+        //console.log('RandomPlayer : onAudioPlayerEnded()');
         this.next();
       }
     };
@@ -724,7 +758,7 @@
     };
     CompoPlayer.prototype = {
       init(){
-        console.log('CompoPlayer init()');
+        // console.log('CompoPlayer init()');
         // attach an event on AudioPlayer
         _audioPlayer
           .on('audio-open-document', this.onAudioOpenDocument.bind(this))
@@ -736,12 +770,12 @@
         // this.newCompo();
       },
       newCompo(){
-        console.log('CompoPlayer newCompo()');
+        //console.log('CompoPlayer newCompo()');
         // this.$compo = $('.composition_ui .composer .composition');
         this.initControls();
       },
       initControls(){
-        console.log('CompoPlayer initControls()');
+        //console.log('CompoPlayer initControls()');
         this.$composer = $('.composition_ui .composer');
         this.$compo = $('.composition_ui .composer .composition');
         this.$controls = $('.composition_ui .composer .compo-player-controls');
@@ -794,7 +828,7 @@
         }
       },
       start(){
-        console.log('start');
+        //console.log('start');
         // console.log('CompoPlayer start()');
         this.playing = true;
         this.play();
@@ -810,7 +844,7 @@
         this.setActiveItem().showHideControls();
       },
       pause(){
-        console.log('pause');
+        //console.log('pause');
         this.paused = true;
         this.showHideControls();
         _audioPlayer.stop();
@@ -936,7 +970,6 @@
       // }
     };
 
-
     //  ___            _   ___
     // | __| _ ___ _ _| |_| _ \__ _ __ _ ___
     // | _| '_/ _ \ ' \  _|  _/ _` / _` / -_)
@@ -952,7 +985,7 @@
 
     function initHome(){
       addCloseBtnToCols();
-      console.log('theme : initHome');
+      // console.log('theme : initHome');
       // console.log('theme : initProductions');
       var $grid = $('.grid',_$row).masonry({
         itemSelector:'.col',
@@ -971,7 +1004,6 @@
       });
     }
 
-
     //  ___             _         _   _
     // | _ \_ _ ___  __| |_  _ __| |_(_)___ _ _  ___
     // |  _/ '_/ _ \/ _` | || / _|  _| / _ \ ' \(_-<
@@ -1000,13 +1032,32 @@
     // | |\/| / _ \/ _` / _` | (_-<
     // |_|  |_\___/\__,_\__,_|_/__/
     function closeAllModals(){
-      console.log('theme : closeAllModals');
+      //console.log('theme : closeAllModals');
       // TODO: animate the remove
       _$row.html('');
       _$ajaxLinks.removeClass('is-active');
       _$body.trigger({'type':'all-modal-closed'});
     };
 
+    //  _  _     _
+    // | || |___| |_ __  ___ _ _ ___
+    // | __ / -_) | '_ \/ -_) '_(_-<
+    // |_||_\___|_| .__/\___|_| /__/
+    //            |_|
+
+    // https://plainjs.com/javascript/utilities/set-cookie-get-cookie-and-delete-cookie-5/
+    function getCookie(name) {
+      var v = document.cookie.match('(^|;) ?' + name + '=([^;]*)(;|$)');
+      return v ? v[2] : null;
+    }
+    function setCookie(name, value, days) {
+      var d = new Date;
+      d.setTime(d.getTime() + 24*60*60*1000*days);
+      document.cookie = name + "=" + value + ";path=/;expires=" + d.toGMTString();
+    }
+
+    function deleteCookie(name) { setCookie(name, '', -1); }
+
     init();
   } // end EdlpTheme()
 

sites/all/themes/custom/edlptheme/assets/styles/app.scss

@@ -152,10 +152,62 @@ header[role="banner"]{
   }
 }
 
+
+//   ___
+//  / __|__ _ _ ___ ____ _ ___
+// | (__/ _` | ' \ V / _` (_-<
+//  \___\__,_|_||_\_/\__,_/__/
+#corpus-map{
+  opacity: 0;
+  body[corpus="map-ready"] &{
+    transition: opacity 2s ease-out;
+    opacity: 1;
+  }
+}
+
 //             _
 //  _ __  __ _(_)_ _
 // | '  \/ _` | | ' \
 // |_|_|_\__,_|_|_||_|
+
+// booting sequence
+// and ajax loading effects
+main[role="main"]{
+  .row{
+    opacity: 0;
+    .col{
+      opacity:1;
+      transition: opacity 0.5s ease-in-out;
+    }
+  }
+  body[booted="booted"] &{
+    .row{
+      transition: opacity 1s ease-out;
+      opacity:1;
+    }
+  }
+  body.ajax-loading &{
+    .row .col:not([theme="edlp_search_search_form"]){
+      opacity:0.2;
+    }
+    // &:before{
+    //   content:"";
+    //   display: block;
+    //   position: absolute;
+    //   z-index: 10;
+    //   $s:60px;
+    //   width:$s; height:$s;
+    //   top:calc(50% - #{$s/2}); left:calc(50% - #{$s/2});
+    //   // padding:1em;
+    //   background-color: rgba(255,255,255, 0.5);
+    //   background-image: url(../img/edlp-loader-anim.svg);
+    //   background-size: 50%;
+    //   background-repeat: no-repeat;
+    //   background-position: center;
+    //   // border-radius: $s/2;
+    // }
+  }
+}
 main[role="main"]{
   .layout-content{
     pointer-events: none;
@@ -209,32 +261,6 @@ main[role="main"]{
     list-style: none;
   }
 
-  // ajax loading effects
-  .layout-content{
-    transition: opacity 0.5s ease-in-out;
-    opacity: 1;
-  }
-  body.ajax-loading &{
-    .layout-content .col:not([theme="edlp_search_search_form"]){
-      opacity:0.2;
-    }
-    // &:before{
-    //   content:"";
-    //   display: block;
-    //   position: absolute;
-    //   z-index: 10;
-    //   $s:60px;
-    //   width:$s; height:$s;
-    //   top:calc(50% - #{$s/2}); left:calc(50% - #{$s/2});
-    //   // padding:1em;
-    //   background-color: rgba(255,255,255, 0.5);
-    //   background-image: url(../img/edlp-loader-anim.svg);
-    //   background-size: 50%;
-    //   background-repeat: no-repeat;
-    //   background-position: center;
-    //   // border-radius: $s/2;
-    // }
-  }
   span.close-col-btn{
     // z-index: 10;
     pointer-events: all;
@@ -1374,6 +1400,9 @@ footer{
               border: 1px solid #000;
               margin-right: 0.5em;
             }
+            &.ajax-loading:before{
+              @include spining-loader-square;
+            }
           }
           .term-description{
             display: inline-block;

sites/all/themes/custom/edlptheme/edlptheme.libraries.yml

@@ -8,7 +8,7 @@ global-css:
 history-js:
   version: VERSION
   js:
-    assets/dist/scripts/history.min.js: { weight:-999, scope: header }
+    assets/dist/scripts/history.min.js: { weight:-998, scope: header, group: edlptheme }
 
 global-js:
   version: VERSION

sites/all/themes/custom/edlptheme/edlptheme.theme

@@ -11,6 +11,18 @@ use Drupal\Core\Template\Attribute;
 use Drupal\Component\Utility\Unicode;
 use Drupal\Core\Render\Element;
 
+
+/**
+ * Implements hook_page_attachments().
+ * @param array $attachments
+ */
+ // this does not work with themes
+// function edlptheme_page_attachments(array &$attachments) {
+//   dpm('edlptheme_page_attachments', $attachments);
+// }
+
+
+
 function edlptheme_preprocess_page(&$vars){
   // dsm($vars, 'vars');
 }

sites/default/config/sync/block.block.productions.yml

@@ -24,6 +24,6 @@ settings:
 visibility:
   request_path:
     id: request_path
-    pages: "/productions\r\n/productions/*"
+    pages: '<front>'
     negate: false
     context_mapping: {  }