j1-template 2020.0.4 → 2020.0.9

data/{lib/starter_web/assets → assets}/themes/j1/adapter/js/algolia.js

@@ -302,7 +302,7 @@ j1.adapter['algolia'] = (function (j1, window) {
     // Set the current (processing) state of the module
     // -------------------------------------------------------------------------
     setState: function (stat) {
-      j1.adapter.scroller.state = stat;
+      j1.adapter.algolia.state = stat;
     }, // END setState
 
     // -------------------------------------------------------------------------
@@ -310,7 +310,7 @@ j1.adapter['algolia'] = (function (j1, window) {
     // Returns the current (processing) state of the module
     // -------------------------------------------------------------------------
     getState: function () {
-      return j1.adapter.scroller.state;
+      return j1.adapter.algolia.state;
     } // END state
 
   }; // END return
@@ -318,4 +318,4 @@ j1.adapter['algolia'] = (function (j1, window) {
 
 {% endcapture %}
 {{ cache | strip_empty_lines }}
-{% assign cache = nil %}
+{% assign cache = nil %}

data/{lib/starter_web/assets → assets}/themes/j1/adapter/js/attic.js

@@ -120,7 +120,7 @@ j1.adapter['attic'] = (function (j1, window) {
           // clear interval checking
           clearInterval(dependencies_met_attic_adapter);
         }
-      }, 50); // END 'dataLoaded'
+      }, 25); // END 'dataLoaded'
 
       return true;
     }, // END init
@@ -544,7 +544,7 @@ j1.adapter['attic'] = (function (j1, window) {
     // Set the current (processing) state of the module
     // -------------------------------------------------------------------------
     setState: function (stat) {
-      j1.adapter.scroller.state = stat;
+      j1.adapter.attic.state = stat;
     }, // END setState
 
     // -------------------------------------------------------------------------
@@ -552,7 +552,7 @@ j1.adapter['attic'] = (function (j1, window) {
     // Returns the current (processing) state of the module
     // -------------------------------------------------------------------------
     getState: function () {
-      return j1.adapter.scroller.state;
+      return j1.adapter.attic.state;
     } // END state
 
   }; // END return
@@ -560,4 +560,4 @@ j1.adapter['attic'] = (function (j1, window) {
 
 {% endcapture %}
 {{ cache | strip_empty_lines }}
-{% assign cache = nil %}
+{% assign cache = nil %}

data/{lib/starter_web/assets → assets}/themes/j1/adapter/js/carousel.js

@@ -293,7 +293,7 @@ j1.adapter['carousel'] = (function (j1, window) {
     // Set the current (processing) state of the module
     // -------------------------------------------------------------------------
     setState: function (stat) {
-      j1.adapter.scroller.state = stat;
+      j1.adapter.carousel.state = stat;
     }, // END setState
 
     // -------------------------------------------------------------------------
@@ -301,7 +301,7 @@ j1.adapter['carousel'] = (function (j1, window) {
     // Returns the current (processing) state of the module
     // -------------------------------------------------------------------------
     getState: function () {
-      return j1.adapter.scroller.state;
+      return j1.adapter.carousel.state;
     } // END state
 
   }; // END return
@@ -310,4 +310,4 @@ j1.adapter['carousel'] = (function (j1, window) {
 
 {% endcapture %}
 {{cache | strip_empty_lines}}
-{% assign cache = nil %}
+{% assign cache = nil %}

data/{lib/starter_web/assets → assets}/themes/j1/adapter/js/framer.js

@@ -189,7 +189,7 @@ j1.adapter['framer'] = (function (j1, window) {
     // Set the current (processing) state of the module
     // -------------------------------------------------------------------------
     setState: function (stat) {
-      j1.adapter.scroller.state = stat;
+      j1.adapter.framer.state = stat;
     }, // END setState
 
     // -------------------------------------------------------------------------
@@ -197,7 +197,7 @@ j1.adapter['framer'] = (function (j1, window) {
     // Returns the current (processing) state of the module
     // -------------------------------------------------------------------------
     getState: function () {
-      return j1.adapter.scroller.state;
+      return j1.adapter.framer.state;
     } // END state
 
   }; // END return
@@ -205,4 +205,4 @@ j1.adapter['framer'] = (function (j1, window) {
 
 {% endcapture %}
 {{ cache | strip_empty_lines }}
-{% assign cache = nil %}
+{% assign cache = nil %}

data/{lib/starter_web/assets → assets}/themes/j1/adapter/js/j1.js

@@ -1064,8 +1064,6 @@ var j1 = (function () {
 
       var logText = 'initializing material design finished';
       logger.info(logText);
-
-      return true;
     }, // END initMDB
 
     // -------------------------------------------------------------------------
@@ -1085,7 +1083,6 @@ var j1 = (function () {
           o[p] = a[i][p];
         }
       }
-
       return o;
     },  // END mergeData
 
@@ -1103,61 +1100,43 @@ var j1 = (function () {
     // -------------------------------------------------------------------------
     getLanguage: function () {
       var language = navigator.languages ? navigator.languages[0] : (navigator.language || navigator.userLanguage);
-
-      return language;
     }, // END getLanguage
 
     // -------------------------------------------------------------------------
-    //  returns the template version taken from site config ( _config.yml)
+    //  returns the template version taken from site config (_config.yml)
     // -------------------------------------------------------------------------
     getTemplateVersion: function () {
       return '{{template_version}}';
     }, // END getTemplateVersion
 
     // -------------------------------------------------------------------------
-    // Scrolls smooth to any anchor referenced by an page URL
-    // Values for delay|offset are taken from TOC module (Tocbot)
+    // Scrolls smooth to any anchor referenced by an page URL on
+    // e.g. a page reload. Values for delay|offset are taken from
+    // TOCCER module
     // -------------------------------------------------------------------------
     scrollTo: function () {
-      // Unclear why a offset correction is needed (sometimes ???)
-      var offset_correction = {{toccer_options.headingsOffset}};
-      var offset            = {{toccer_options.smoothScrollOffset}};
-      var anchor_id         = window.location.href.split("#")[1];
+      var anchor    = window.location.href.split("#")[1];
+      var anchor_id = '#' + anchor;
       var selector;
-      var heading;
-      var re;
-
-      if (anchor_id) {
-        selector    = $('.' + anchor_id + ', #' + anchor_id +',[name='+anchor_id+']');
-        heading     = selector[0].nodeName;
 
+      if (anchor && anchor_id) {
         // scroll only, if an anchor is given with URL
+        selector = $(anchor_id);
         if (selector.length) {
-          var delay     = {{toccer_options.smoothScrollDuration}};
-          var scroll_to = parseInt( selector.offset().top - offset - offset_correction );
-          //var scroll_to = selector.offset().top;
-          $('html,body').animate({scrollTop: scroll_to}, delay,
-            function () {
-              // scroll the page one pixel back and forth
-              // to get the right position for the NAV Module (Tocbot)
-              $(window).scrollTop($(window).scrollTop()+1);
-              $(window).scrollTop($(window).scrollTop()-1);
+          j1.core.scrollSmooth.scroll( anchor_id, {
+            duration: {{toccer_options.scrollSmoothDuration}},
+            offset: {{toccer_options.scrollSmoothOffset}},
+            callback: null
           });
         } else {
-          // TODO: to be checked if this else is needed
-          // scroll the page one pixel back and forth
-          // to get the right position for the NAV Module (Tocbot)
+          // scroll the page one pixel back and forth (trigger)
+          // to get the right position for the Toccer and adjust the
+          // Navigator to display the (tranparent) navbar correctly
+          //
           $(window).scrollTop($(window).scrollTop()+1);
           $(window).scrollTop($(window).scrollTop()-1);
-        } // selector.length
-      } else {
-        // scroll the page one pixel back and forth
-        // to get the right position for the NAV Module (Tocbot)
-        $(window).scrollTop($(window).scrollTop()+1);
-        $(window).scrollTop($(window).scrollTop()-1);
-      } // END if anchor_id
-
-      return true;
+        } // END if anchor_id
+      }
     }, // END scrollTo
 
     // -------------------------------------------------------------------------

data/{lib/starter_web/assets → assets}/themes/j1/adapter/js/mmenu.js

@@ -174,7 +174,6 @@ j1.adapter['mmenu'] = (function (j1, window) {
           j1.adapter.mmenu.mmenuLoader(navMenuOptions);
         }
       }, 25);
-
     }, // END init
 
     // -------------------------------------------------------------------------
@@ -217,7 +216,7 @@ j1.adapter['mmenu'] = (function (j1, window) {
           'j1.adapter.mmenu', {
           xhr_container_id: "{{menu_id}}",
           xhr_data_path:    "{{xhr_data_path}}" },
-          {% if forloop.last %}'data_loaded'{% else %}'data_loaded'{% endif %}){% if forloop.last %}{% else %},{% endif %}
+          {% if forloop.last %}'null'{% else %}'null'{% endif %}){% if forloop.last %}{% else %},{% endif %}
 
       {% endif %}
       {% capture id_list %}{{id_list}}{{menu_id}}{% if forloop.last %}{% else %},{% endif %} {% endcapture %}
@@ -226,6 +225,11 @@ j1.adapter['mmenu'] = (function (j1, window) {
         // ---------------------------------------------------------------------
         // Initialize MMenu Navs and Drawers
         // ---------------------------------------------------------------------
+        // Make sure that Load HTML data (AJAX) is finished
+        setTimeout (function() {
+          _this.setState('data_loaded');
+        }, 300);
+
         var dependencies_met_mmenu_initialized = setInterval (function () {
           if (_this.getState() === 'data_loaded') {
             logger.info('load HTML data (AJAX): finished');
@@ -235,7 +239,15 @@ j1.adapter['mmenu'] = (function (j1, window) {
             j1.adapter.mmenu.mmenuInitializer(mmOptions);
             clearInterval(dependencies_met_mmenu_initialized);
           }
-        }); // END dependencies_met_mmenu_loaded
+        }, 25); // END dependencies_met_mmenu_loaded
+
+        var dependencies_met_all_menu_loaded = setInterval (function () {
+          if ( $('#menu_mmenu').length && $('#sidebar_mmenu').length && $('#toc_mmenu').length ) {
+            _this.setState('finished');
+            logger.info('status: ' + _this.getState());
+            clearInterval(dependencies_met_all_menu_loaded);
+          }
+        }, 25); // END dependencies_met_all_menu_loaded
       }); // END done
     }, // END dataLoader
 
@@ -290,29 +302,34 @@ j1.adapter['mmenu'] = (function (j1, window) {
 
             // Toggle Bars (Hamburger) for the NavBar to open|close
             // the mmenu drawer
-            $('{{item.menu.content.toggler}}').each(function(e) {
+            $('{{item.menu.content.button}}').each(function(e) {
               var $this = $(this);
 
               $this.on('click', function(e){
-                const toggler_{{menu_id}} = this;
+                const button_{{menu_id}} = this;
 
                 // TODO: Animated toggle button
                 //
-                $('{{item.menu.content.toggler}}').toggleClass('fadeIn');
-                $('{{item.menu.content.toggler}}').toggleClass('rotateIn')
+                // $('{{item.menu.content.toggler}}').toggleClass('fadeIn');
+                // $('{{item.menu.content.toggler}}').toggleClass('rotateIn')
+
+                // $('.mdi', this).toggleClass('mdi-menu');
+                // $('.mdi', this).toggleClass('mdi-close');
 
-                $('.mdi', this).toggleClass('mdi-menu');
-                $('.mdi', this).toggleClass('mdi-close');
                 e.preventDefault();
-                (toggler_{{menu_id}}.t = !toggler_{{menu_id}}.t)
-                  ? drawer_{{menu_id}}.open()
-                  : drawer_{{menu_id}}.close();
+
+                // (toggler_{{menu_id}}.t = !toggler_{{menu_id}}.t)
+                //   ? drawer_{{menu_id}}.open()
+                //   : drawer_{{menu_id}}.close();
+
+                drawer_{{menu_id}}.open()
               });
             });
             clearInterval(dependencies_met_{{menu_id}}_loaded);
+            $('#{{item.menu.content.id}}').show();
             logger.info('initializing mmenu finished on id: #{{menu_id}}');
           }; // END mmenu_loaded
-        }); // END dependencies_met_mmenu_loaded
+        }, 25); // END dependencies_met_mmenu_loaded
         {% endif %} // ENDIF content_type: NAVIGATION
 
         {% if item.menu.content.type == "drawer" %}
@@ -339,40 +356,43 @@ j1.adapter['mmenu'] = (function (j1, window) {
                 position: "{{item.menu.drawer.position}}"
               });
 
-              // Toggler for the MMenu tocbar to open|close the toc drawer
-              $('{{item.menu.content.toggler}}').each(function(e) {
+              // button for the MMenu tocbar to open|close the toc drawer
+              $('{{item.menu.content.button}}').each(function(e) {
                 var $this = $(this);
 
                 $this.on('click', function(e) {
-                  var toggler_{{menu_id}} = this;
+                  var button_{{menu_id}} = this;
                   var hasClass;
 
-                  // check if the toggler should be activated
+                  // check if the button should be activated
                   // e.g for TOC only if clas js-toc-content is found
                   //
-                  if ('{{item.menu.content.toggler_activated}}' != 'always') {
-                    hasClass = $('main').hasClass('{{item.menu.content.toggler_activated}}');
+                  if ('{{item.menu.content.button_activated}}' != 'always') {
+                    hasClass = $('main').hasClass('{{item.menu.content.button_activated}}');
                   } else {
                     hasClass = true;
                   }
                   if (hasClass) {
                     // Toggle button animation
-                    $('{{item.menu.content.toggler}}').toggleClass('{{item.menu.content.toggler_animation}}')
+                    //$('{{item.menu.content.toggler}}').toggleClass('{{item.menu.content.toggler_animation}}')
 
                     e.preventDefault();
-                    (toggler_{{menu_id}}.t = !toggler_{{menu_id}}.t)
-                      ? drawer_{{menu_id}}.open()
-                      : drawer_{{menu_id}}.close();
+
+                    // (toggler_{{menu_id}}.t = !toggler_{{menu_id}}.t)
+                    //   ? drawer_{{menu_id}}.open()
+                    //   : drawer_{{menu_id}}.close();
+
+                    drawer_{{menu_id}}.open()
                   } // END if hasclass
                 });
               });
               clearInterval(dependencies_met_{{menu_id}}_loaded);
+              $('#{{item.menu.content.id}}').show();
           }; // END if menu_loaded
-        }); // END dependencies_met_mmenu_loaded
+        }, 25); // END dependencies_met_mmenu_loaded
         logger.info('initializing mmenu finished on id: #{{menu_id}}');
         {% endif %} // ENDIF content_type: DRAWER
         } // END menus|drawers
-
       {% endif %} // ENDIF menu enabled
       {% endfor %} // ENDFOR menus
     }, // END mmenuInitializer

data/{lib/starter_web/assets → assets}/themes/j1/adapter/js/navigator.js

@@ -244,6 +244,18 @@ j1.adapter['navigator'] = (function (j1, window) {
       logger.info('state: ' + _this.getState());
       logger.info('module is being initialized');
 
+      // -----------------------------------------------------------------------
+      // Load HTML data (AJAX)
+      // -----------------------------------------------------------------------
+      // jadams, 202-06-24: Promise (chain) if $.when seems NOT to work correctly.
+      // It semms a chain using .then will be a better solution to make it sure
+      // that the last Deferred set the state to 'data_loaded'.
+      // Found the final state randomly set to 'null' what prevent the module
+      // to run mmenuInitializer.
+      // Workaround: Set 'data_loaded' to be returned by all Deferred in
+      // the chain.
+      // See: https://stackoverflow.com/questions/5436327/jquery-deferreds-and-promises-then-vs-done
+      //
       // -----------------------------------------------------------------------
       // data loader
       // -----------------------------------------------------------------------
@@ -268,6 +280,12 @@ j1.adapter['navigator'] = (function (j1, window) {
         // ---------------------------------------------------------------------
         // core initializer
         // ---------------------------------------------------------------------
+
+        // Make sure that Load HTML data (AJAX) is finished
+        // setTimeout (function() {
+        //   _this.setState('data_loaded');
+        // }, 150);
+
         var dependencies_met_navigator_core = setInterval (function () {
           if (_this.getState() === 'data_loaded') {
             _this.setState('processing');
@@ -581,14 +599,14 @@ j1.adapter['navigator'] = (function (j1, window) {
       $('head').append("<style>@media (min-width: " +gridBreakpoint_lg+ ") { nav.navbar.navigator.navbar-scrolled.light { background-color: " +bg_scrolled+ " !important; } }</style>");
 
       // Menubar collapsed (mobile)
-      $('head').append('<style>.navbar-collapse.collapse.show { background-color: ' +bg_scrolled+ ' !important; }</style>');
+//    $('head').append('<style>.navbar-collapse.collapse.show { background-color: ' +bg_scrolled+ ' !important; }</style>');
 
 
       /* Navbar media-queries, LARGE Window|Desktop (>= 1024) */
       /* jadams:  Oversized menu bar fixed by: overflow: hidden */
 //    $('head').append("<style>@media (max-width: " +gridBreakpoint_lg+ ") { nav.navbar.navigator { background-color: " +navBarOptions.background_color_collapsed+ " !important; overflow: hidden; } }</style>");
-      $('head').append("<style>@media (max-width: " +gridBreakpoint_lg+ ") { nav.navbar.navigator { background-color: " +bg_collapsed+ " !important; overflow: hidden; } }</style>");
-      //$('head').append("<style>@media (max-width: 1023px) { row { margin-left: 0 !important; margin-right: 0 !important; } }</style>");
+//    $('head').append("<style>@media (max-width: " +gridBreakpoint_lg+ ") { nav.navbar.navigator { background-color: " +bg_collapsed+ " !important; overflow: hidden; } }</style>");
+//    $('head').append("<style>@media (max-width: 1023px) { row { margin-left: 0 !important; margin-right: 0 !important; } }</style>");
 
       {% comment %} navQuicklinks styles
       -------------------------------------------------------------------------- {% endcomment %}

data/assets/themes/j1/adapter/js/ssm.js

@@ -0,0 +1,538 @@
+---
+regenerate:                             true
+---
+
+{% capture cache %}
+
+{% comment %}
+ # -----------------------------------------------------------------------------
+ # ~/assets/themes/j1/adapter/js/ssm.js
+ # Liquid template to adapt SSM Core functions
+ #
+ # Product/Info:
+ # https://jekyll.one
+ #
+ # Copyright (C) 2020 Juergen Adams
+ #
+ # J1 Template is licensed under the MIT License.
+ # For details, see https://jekyll.one
+ # -----------------------------------------------------------------------------
+ # Test data:
+ #  {{ liquid_var | debug }}
+ # -----------------------------------------------------------------------------
+{% endcomment %}
+
+{% comment %} Liquid var initialization
+-------------------------------------------------------------------------------- {% endcomment %}
+
+{% comment %} Set config files
+-------------------------------------------------------------------------------- {% endcomment %}
+{% assign site_config     = site %}
+{% assign template_config = site.data.template_settings %}
+{% assign modules         = site.data.modules %}
+
+{% comment %} Set config data
+-------------------------------------------------------------------------------- {% endcomment %}
+{% assign toccer_defaults = modules.defaults.toccer.defaults %}
+{% assign toccer_settings = modules.toccer.settings %}
+{% assign ssm_settings    = modules.ssm.settings %}
+{% assign ssm_defaults    = modules.defaults.ssm.defaults %}
+
+{% comment %} Set config options
+-------------------------------------------------------------------------------- {% endcomment %}
+{% assign toccer_options  = toccer_defaults | merge: toccer_settings %}
+{% assign ssm_options     = ssm_defaults | merge: ssm_settings %}
+
+/*
+ # -----------------------------------------------------------------------------
+ # ~/assets/themes/j1/adapter/js/ssm.js
+ # JS Adapter for J1 SSM (Sticky Side Menu)
+ #
+ # Product/Info:
+ # {{site.data.template_settings.theme_author_url}}
+ #
+ # Copyright (C) 2020 Juergen Adams
+ #
+ # J1 Template is licensed under the MIT License.
+ # For details, see {{site.data.template_settings.theme_author_url}}
+ # -----------------------------------------------------------------------------
+ # Adapter generated: {{site.time}}
+ # -----------------------------------------------------------------------------
+*/
+'use strict';
+
+j1.adapter['ssm'] = (function (j1, window) {
+
+  // ---------------------------------------------------------------------------
+  // globals
+  // ---------------------------------------------------------------------------
+  var environment         = '{{environment}}';
+  var dclFinished         = false;
+  var moduleOptions       = {};
+  var cookie_names        = j1.getCookieNames();
+  var user_state;
+  var user_session;
+  var user_data;
+  var sect1Nodes;
+  var sect12Nodes;
+  var _this;
+  var logger;
+  var logText;
+
+  // ---------------------------------------------------------------------------
+  // helper functions
+  // ---------------------------------------------------------------------------
+
+
+  // ---------------------------------------------------------------------------
+  // main object
+  // ---------------------------------------------------------------------------
+  return {
+
+    // -------------------------------------------------------------------------
+    // module initializer
+    // -------------------------------------------------------------------------
+    init: function (options) {
+
+      // create seetings object from frontmatterOptions
+      var frontmatterOptions = options != null ? $.extend({}, options) : {};
+
+      // initialize state flag
+      j1.adapter.ssm.state = 'pending';
+
+      // -----------------------------------------------------------------------
+      // defaults
+      // -----------------------------------------------------------------------
+      var settings  = $.extend({
+        module_name: 'j1.adapter.ssm',
+        generated:   '{{site.time}}'
+      }, options);
+
+      // -----------------------------------------------------------------------
+      // globals
+      // -----------------------------------------------------------------------
+      _this         = j1.adapter.ssm;
+      logger        = log4javascript.getLogger('j1.adapter.ssm');
+      sect12Nodes   = $("[class$='sect1'],[class$='sect2'");
+      sect1Nodes    = $("[class$='sect1']");
+
+      // -----------------------------------------------------------------------
+      // options loader
+      // -----------------------------------------------------------------------
+      var ssmMenuOptions = $.extend({}, {{nav_ssm_options | replace: '=>', ':' }});
+      var ssmOptions = $.extend({}, {{ssm_options | replace: 'nil', 'null' | replace: '=>', ':' }});
+      var xhr_data_path;
+      var menu_id;
+
+      // Load (individual) frontmatter options (currently NOT used)
+      //
+      if (options != null) { var frontmatterOptions = $.extend({}, options) }
+
+      if (typeof frontmatterOptions !== 'undefined') {
+        moduleOptions = j1.mergeData(ssmOptions, frontmatterOptions);
+      }
+
+      // save config settings into the mmenu object for global access
+      //
+      j1.adapter.ssm['moduleOptions'] = moduleOptions;
+
+      _this.setState('started');
+      logger.info('set module state to: ' + _this.getState());
+      logger.info('module is being initialized');
+
+      // jadams, 2020-06-24: Set max_count to 100 what cause to wait 2.5s
+      // for J1 Navigator to finish (init)
+      //
+      var interval_count = 0;
+      var max_count      = 100;
+
+      var dependencies_met_navigator = setInterval(function() {
+        interval_count += 1;
+        if ( j1.adapter.navigator.getState() == 'finished' ) {
+          logger.info('dependencies of module navigator met for: mmenu');
+          logger.info('dependencies of module navigator met after: ' + interval_count * 25 + ' ms');
+          j1.core.ssm.init (moduleOptions);
+          _this.ssmLoader(moduleOptions);
+          clearInterval(dependencies_met_navigator);
+        }
+        if (interval_count > max_count) {
+          logger.warn('dependency check failed for module: navigator');
+          logger.warn('dependencies of module navigator met after: ' + interval_count * 25 + ' ms');
+          j1.core.ssm.init (moduleOptions);
+          _this.ssmLoader(moduleOptions);
+          clearInterval(dependencies_met_navigator);
+        }
+      }, 25);
+
+    }, // END init
+
+    // -------------------------------------------------------------------------
+    // SSM Loader
+    // -------------------------------------------------------------------------
+    ssmLoader: function (ssmOptions) {
+      var menu_id;
+      var xhr_data_path;
+
+      // cast text-based booleans
+      var isToc = (ssmOptions.toc === 'true');
+
+      _this.setState('loading');
+      logger.info('set module state to: ' + _this.getState());
+      logger.info('load HTML data for ssm');
+
+      {% assign id_list = "" %}
+
+      $.when (
+        {% assign menu_id       = ssm_options.xhr_container_id %}
+        {% assign xhr_data_path = ssm_options.xhr_data_path %}
+        j1.xhrData (
+          'j1.adapter.ssm', {
+          xhr_container_id: "{{menu_id}}",
+          xhr_data_path:    "{{xhr_data_path}}" },
+          'data_loaded')
+      ).done (function (ssm_html_loaded) {
+        // ---------------------------------------------------------------------
+        // Initialize MMenu Navs and Drawers
+        // ---------------------------------------------------------------------
+        var dependencies_met_mmenu_initialized = setInterval (function () {
+          if (ssm_html_loaded && $('#{{ssm_options.menu_id}}').length) {
+            _this.setState('loaded');
+            logger.info('set module state to: ' + _this.getState());
+            logger.info('HTML data for ssm: ' + _this.getState());
+            if(isToc) {
+              logger.info('found toc in page: enabled');
+              if ( j1.adapter.toccer.getState() == 'finished' ) {
+                logger.info('dependency met for module : toccer');
+                _this.setState('processing');
+                logger.info('set module state to: ' + _this.getState());
+                logger.info('initialize ssm menu');
+                (ssmOptions.mode === 'icon')
+                  ? logger.info('ssm mode detected: icon')
+                  : logger.info('ssm mode detected: menu');
+                _this.scrollSpy(ssmOptions);
+                _this.buttonInitializer(ssmOptions);
+                clearInterval(dependencies_met_mmenu_initialized);
+              }
+            } else {
+              logger.info('found toc in page: disabled');
+              logger.info('disable toc menu button');
+              $('#ssm_toc').closest('.ssm-btn').hide()
+              _this.scrollSpy(ssmOptions);
+              _this.buttonInitializer(ssmOptions);
+              clearInterval(dependencies_met_mmenu_initialized);
+            }
+          }
+        }, 25); // END dependencies_met_mmenu_loaded
+      }); // END done
+    }, // END dataLoader
+
+    // -------------------------------------------------------------------------
+    // Button Initializer
+    // -------------------------------------------------------------------------
+    buttonInitializer: function (ssmOptions) {
+      var eventHandler;
+
+      {% for item in ssm_options.items %} {% if item.enabled %}
+
+      {% comment %} Identify the menu (item) type
+      -------------------------------------------------------------------------- {% endcomment %}
+      {% if item.sublevel %}
+        {% assign menu_type = 'sublevel_menu' %}
+      {% else %}
+        {% assign menu_type = 'top_level_item' %}
+      {% endif %}
+
+      {% if menu_type ==  'top_level_item' %}
+      {% assign button_id = item.id %}
+
+      // Create an eventhandler instance if id exists: {{button_id}}
+      if ($('#{{button_id}}').length) {
+        eventHandler = "{{item.event_handler}}"
+        // check if eventhandler configured is a SINGLE word
+        if (eventHandler.split(" ").length == 1) {
+          logger.info('register pre-configured eventhandler {{item.event_handler}} on id: {{button_id}}');
+          $('#{{button_id}}').each(function(e) {
+            var $this = $(this);
+            $this.on('click', function(e) {
+              j1.adapter.ssm.{{item.event_handler}}(sect1Nodes);
+            });
+          });
+        } else {
+          logger.info('register custom eventhandler on id: {{button_id}}');
+        }
+      } else {
+        alert ("Creating Eventhandler failed on: #{{button_id}}");
+      } // END items (buttons)
+      {% endif %} // menu_type 'top_level_item'
+      {% endif %} // ENDIF button_id enabled
+      {% endfor %} // ENDFOR items
+    }, // END buttonInitializer
+
+    // -------------------------------------------------------------------------
+    // Eventhandler
+
+    // -------------------------------------------------------------------------
+    // open mobile menu
+    // -------------------------------------------------------------------------
+    open_ssm_toc: function () {
+    }, // END open_ssm_toc
+
+    // -------------------------------------------------------------------------
+    // reload page
+    // -------------------------------------------------------------------------
+    reload_page: function () {
+      location.reload();
+    }, // END open_ssm_toc
+    // -------------------------------------------------------------------------
+    // scroll to previous section
+    // -------------------------------------------------------------------------
+    scroll_previous_section: function (nodes) {
+      var previous_header_id;
+      var currentNode;
+      var prev_node;
+      var anchor_id;
+
+      var index             = 0;
+      var maxNode           = $(nodes).length - 1;
+      var $toc              = $("#sidebar");
+      var current_header_id = $toc.find(".is-active-link").attr('href');
+
+      nodes.each(function() {
+        currentNode = $(this).find(current_header_id);
+        if (currentNode.length) {
+          if (index > maxNode) {
+            return false
+          } else {
+            prev_node           = (index > 0) ? nodes[index-1] : nodes[index];
+            previous_header_id  = $(prev_node).find(":header").first()[0].id;
+            anchor_id           = '#' + previous_header_id;
+
+            $('a[href*="' + current_header_id + '"]').removeClass('is-active-link');
+            $('a[href*="' + previous_header_id + '"]').addClass('is-active-link');
+
+            j1.core.scrollSmooth.scroll( anchor_id, {
+              duration: {{toccer_options.scrollSmoothDuration}},
+              offset: {{toccer_options.scrollSmoothOffset}},
+              callback: null
+            });
+
+            // scroll the page one pixel back and forth (trigger)
+            // to get the right position for the Toccer
+            //
+            // $(window).scrollTop($(window).scrollTop()+1);
+            // $(window).scrollTop($(window).scrollTop()-1);
+          }
+        }
+        (index < maxNode) ? index++ : index;
+      });
+    }, // END scroll_previous_section
+
+    // -------------------------------------------------------------------------
+    // scroll to next section
+    // -------------------------------------------------------------------------
+    scroll_next_section: function (nodes) {
+      var next_header_id;
+      var currentNode;
+      var nextNode;
+      var anchor_id;
+
+      var index             = 0;
+      var maxNode           = $(nodes).length -1;
+      var $toc              = $("#sidebar");
+      var current_header_id = $toc.find(".is-active-link").attr('href');
+
+      nodes.each(function() {
+        currentNode = $(this).find(current_header_id);
+        if (currentNode.length) {
+          if (index == maxNode) {
+            return false
+          } else {
+            nextNode = nodes[index+1];
+            next_header_id  = $(nextNode).closest().find(":header").first();
+            next_header_id  = $(nextNode).find(":header").first()[0].id;
+            anchor_id       = '#' + next_header_id;
+
+            $('a[href*="' + current_header_id + '"]').removeClass('is-active-link');
+            $('a[href*="' + next_header_id + '"]').addClass('is-active-link');
+
+            j1.core.scrollSmooth.scroll( anchor_id, {
+              duration: {{toccer_options.scrollSmoothDuration}},
+              offset: {{toccer_options.scrollSmoothOffset}},
+              callback: null
+            });
+
+            // scroll the page one pixel back and forth (trigger)
+            // to get the right position for the Toccer
+            //
+            // $(window).scrollTop($(window).scrollTop()+1);
+            // $(window).scrollTop($(window).scrollTop()-1);
+          }
+        }
+        (index < maxNode) ? index++ : index;
+      });
+    }, // END scroll_next_section
+
+    // -------------------------------------------------------------------------
+    // scroll to top
+    // -------------------------------------------------------------------------
+    scroll_to_top: function () {
+      var dest = 0;
+
+      $('html, body').animate({
+        scrollTop: dest
+      }, 500);
+
+      // scroll the page one pixel back and forth (trigger)
+      // to get the right position for the Toccer
+      //
+      // $(window).scrollTop($(window).scrollTop()+1);
+      // $(window).scrollTop($(window).scrollTop()-1);
+    }, // END scroll_top
+
+    // -------------------------------------------------------------------------
+    // scroll to bottom
+    // -------------------------------------------------------------------------
+    scroll_to_bottom: function () {
+      var $page           = $(document);
+      var $footer         = $('#j1_footer');
+      var f               = $footer.length ? $footer.outerHeight() : 0;
+      var pageHeight      = $page.height() - f - 400;
+      var pageHeightOuter = $page.outerHeight()
+
+      $('html, body').animate({
+        scrollTop: pageHeight
+      }, 500);
+
+      // scroll the page one pixel back and forth (trigger)
+      // to get the right position for the Toccer
+      //
+      // $(window).scrollTop($(window).scrollTop()+1);
+      // $(window).scrollTop($(window).scrollTop()-1);
+    }, // END scroll_bottom
+
+    // -------------------------------------------------------------------------
+    // scroll to comments (Disqus)
+    // -------------------------------------------------------------------------
+    scroll_to_comments: function () {
+    }, // END scroll_comments
+
+    // -------------------------------------------------------------------------
+    // create generic alert
+    // -------------------------------------------------------------------------
+    alert_me: function () {
+      alert ("Hello world!");
+    }, // END alert_me
+
+    // -------------------------------------------------------------------------
+    // messageHandler
+    // Manage messages (paylods) send from other J1 modules
+    // -------------------------------------------------------------------------
+    messageHandler: function (sender, message) {
+      // var json_message = JSON.stringify(message, undefined, 2);              // multiline
+      var json_message = JSON.stringify(message);
+
+      logText = 'received message from ' + sender + ': ' + json_message;
+      logger.debug(logText);
+
+      // -----------------------------------------------------------------------
+      //  Process commands|actions
+      // -----------------------------------------------------------------------
+      if (message.type === 'command' && message.action === 'module_initialized') {
+        //
+        // Place handling of command|action here
+        //
+        logger.info(message.text);
+      }
+      if (message.type === 'command' && message.action === 'status') {
+        logger.info('messageHandler: received - ' + message.action);
+      }
+
+      //
+      // Place handling of other command|action here
+      //
+
+      return true;
+    }, // END messageHandler
+
+    // -------------------------------------------------------------------------
+    // setState
+    // Set the current (processing) state of the module
+    // -------------------------------------------------------------------------
+    setState: function (stat) {
+      j1.adapter.ssm.state = stat;
+    }, // END setState
+
+    // -------------------------------------------------------------------------
+    // getState
+    // Returns the current (processing) state of the module
+    // -------------------------------------------------------------------------
+    getState: function () {
+      return j1.adapter.ssm.state;
+    }, // END state
+
+    // -------------------------------------------------------------------------
+    // Manage (top) position and sizes (@media breakpoints) of the
+    // SSM container depending on the size of the page header (attic)
+    // -------------------------------------------------------------------------
+    scrollSpy: function (options) {
+      logger = log4javascript.getLogger('j1.adapter.ssm.scrollSpy');
+
+      $(window).scroll(function(event){
+        var $navbar         = $('nav.navbar');
+        var $pagehead       = $('.attic');
+        var $main_content   = $('.js-toc-content');
+        var $adblock        = $('#adblock');
+        var $footer         = $('#j1_footer');
+        var $ssmContainer   = $('#ssm-container');
+        var $page           = $(document);
+
+        var offset          = 0;
+        var pageOffset      = -120;
+        var scrollPos       = $(document).scrollTop();
+        var pageHeight      = $page.height()
+        var pageHeightOuter = $page.outerHeight()
+
+//      var m               = parseInt(pagehead.css('margin-bottom'), 10);
+        var m               = $main_content.offset().top;
+        var s               = $ssmContainer.length ? $ssmContainer.height() : 0;
+        var f               = $footer.length   ? $footer.outerHeight() : 0;
+        var n               = $navbar.length   ? $navbar.height() : 0;
+//      var h               = $pagehead.length ? $pagehead.outerHeight() : 0;
+        var a               = $adblock.length  ? $adblock.outerHeight() : 0;
+
+//      var o               = n + h + a + offset;
+//      var o               = n + m + offset;
+        var o               = n + offset;
+
+        // space above the (fixed) ssm container
+        var showSsmPos      = m + pageOffset;
+
+        // space below the (fixed) ssm container
+        var hideSsmPos      = pageHeight - s - f + pageOffset;
+
+        // set the top position of ssm container for navbar modes
+        // e.g. "sticky" (navbar-fixed)
+        if($navbar.hasClass('navbar-fixed')){
+          $('#ssm-container').css('top', o);
+        } else {
+          $('#ssm-container').css('top', m);
+        }
+
+        // show|hide ssm container on scroll position in page
+        //
+        ( scrollPos >= showSsmPos ) && ( scrollPos <= hideSsmPos )
+          ? $ssmContainer.css('display','block')
+          : $ssmContainer.css('display','none');
+
+        logger.debug('content pos detected as: ' + m + 'px');
+        logger.debug('scroll pos detected as: ' + scrollPos + 'px');
+      }); // END setTop on scroll
+
+    } // END scrollSpy
+
+  }; // END return
+})(j1, window);
+
+{% endcapture %}
+{{ cache | strip_empty_lines }}
+{% assign cache = nil %}