j1-template 2020.0.12 → 2020.0.17

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

@@ -50,14 +50,12 @@ regenerate: true
 {% assign environment                   = site.environment %}
 {% assign brand_image_height            = site.brand.image_height %}
 
-
 {% comment %} Process YML config data
 ================================================================================ {% endcomment %}
 
 {% comment %} Set config files
 {% assign auth_manager_config           = site.j1_auth %}
 -------------------------------------------------------------------------------- {% endcomment %}
-{% assign site_config                   = site %}
 {% assign template_config               = site.data.template_settings %}
 {% assign blocks                        = site.data.blocks %}
 {% assign modules                       = site.data.modules %}
@@ -198,8 +196,17 @@ j1.adapter['navigator'] = (function (j1, window) {
     // module initializer
     // -------------------------------------------------------------------------
     init: function (options) {
+
+      // -----------------------------------------------------------------------
+      // globals
+      // -----------------------------------------------------------------------
+      _this         = j1.adapter.navigator;
+      logger        = log4javascript.getLogger('j1.adapter.navigator');
+
       // initialize state flag
-      j1.adapter.navigator.state = 'pending';
+      _this.setState('started');
+      logger.info('state: ' + _this.getState());
+      logger.info('module is being initialized');
 
       // -----------------------------------------------------------------------
       // defaults
@@ -208,8 +215,6 @@ j1.adapter['navigator'] = (function (j1, window) {
         module_name: 'j1.adapter.navigator',
         generated:   '{{site.time}}'
       }, options);
-      _this         = j1.adapter.navigator;
-      logger        = log4javascript.getLogger('j1.adapter.navigator');
 
       // -----------------------------------------------------------------------
       // options loader
@@ -248,29 +253,25 @@ j1.adapter['navigator'] = (function (j1, window) {
       navTopsearchOptions                           = j1.mergeData(navTopsearchConfig, navDefaults.nav_topsearch);
       navAuthClientConfig                           = j1.mergeData(navAuthClientConfig, navDefaults.nav_authclient);
 
-      // save config settings into the navigator object for global access
+      // save config settings into the adapter object for global access
       //
-      j1.adapter.navigator['navDefaults']           = navDefaults;
-      j1.adapter.navigator['navBarOptions']         = navBarOptions;
-      j1.adapter.navigator['navMenuOptions']        = navMenuOptions;
-      j1.adapter.navigator['navQuicklinksOptions']  = navQuicklinksOptions;
-      j1.adapter.navigator['navTopsearchOptions']   = navTopsearchOptions;
-      j1.adapter.navigator['navAuthClientConfig']   = navAuthClientConfig;
-      j1.adapter.navigator['navAuthManagerConfig']  = navAuthMAnagerConfig;
+      _this['navDefaults']           = navDefaults;
+      _this['navBarOptions']         = navBarOptions;
+      _this['navMenuOptions']        = navMenuOptions;
+      _this['navQuicklinksOptions']  = navQuicklinksOptions;
+      _this['navTopsearchOptions']   = navTopsearchOptions;
+      _this['navAuthClientConfig']   = navAuthClientConfig;
+      _this['navAuthManagerConfig']  = navAuthMAnagerConfig;
 
       // Load (individual) frontmatter options (currently NOT used)
       if (options  != null) { var frontmatterOptions = $.extend({}, options) }
       /* eslint-enable */
 
-      _this.setState('started');
-      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
+      // It seems 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.
@@ -281,68 +282,79 @@ j1.adapter['navigator'] = (function (j1, window) {
       // -----------------------------------------------------------------------
       // data loader
       // -----------------------------------------------------------------------
-      logger.info('run deferred data load');
-      $.when (
-        j1.xhrData ( // quicklinks
-          'j1.adapter.navigator', {
-          xhr_container_id: navQuicklinksOptions.xhr_container_id,
-          xhr_data_path:    navQuicklinksOptions.xhr_data_path },
-          null),
-        j1.xhrData ( // authclient
-          'j1.adapter.navigator', {
-          xhr_container_id: navAuthClientConfig.xhr_container_id,
-          xhr_data_path:    navAuthClientConfig.xhr_data_path },
-          null),
-        j1.xhrData ( // menubar
-          'j1.adapter.navigator', {
-          xhr_container_id: navMenuOptions.xhr_container_id,
-          xhr_data_path:    navMenuOptions.xhr_data_path },
-          'data_loaded'))
-      .done (function (quickLinks, authclient, menuBar) {
-        // ---------------------------------------------------------------------
-        // core initializer
-        // ---------------------------------------------------------------------
 
+      j1.xhrData({
+        xhr_container_id: navQuicklinksOptions.xhr_container_id,
+        xhr_data_path:    navQuicklinksOptions.xhr_data_path },
+        'j1.adapter.navigator',
+        null);
+      j1.xhrData({
+        xhr_container_id: navAuthClientConfig.xhr_container_id,
+        xhr_data_path:    navAuthClientConfig.xhr_data_path },
+        'j1.adapter.navigator',
+        null);
+      j1.xhrData({
+        xhr_container_id: navMenuOptions.xhr_container_id,
+        xhr_data_path:    navMenuOptions.xhr_data_path },
+        'j1.adapter.navigator',
+        'null');
+
+      var dependencies_met_load_menu_finished = setInterval (function () {
+        if (j1.xhrDOMState['#'+navQuicklinksOptions.xhr_container_id] == 'not loaded' ||
+            j1.xhrDOMState['#'+navAuthClientConfig.xhr_container_id] == 'not loaded' ||
+            j1.xhrDOMState['#'+navMenuOptions.xhr_container_id] == 'not loaded' ){
+          logger.error('load HTML data (AJAX): failed');
+          _this.setState('finished');
+          logger.info('state: ' + _this.getState());
+          logger.info('initializing module: failed');
+          logger.info('met dependencies for: xhrData');
+          clearInterval(dependencies_met_load_menu_finished);
+        }
         // continue if all AJAX loads (xhrData) has finished
-        var dependencies_met_navigator_core = setInterval (function () {
-          if (_this.getState() === 'data_loaded') {
-            _this.setState('processing');
-
-            logger.info('status: ' + _this.getState());
-            logger.info('initialize navigator core');
-
-            // Detect|Set J1 App status
-            appDetected       = j1.appDetected();
-            authClientEnabled = j1.authEnabled();
-            logger.info('application status detected: ' + appDetected);
-
-            j1.core.navigator.init (
-              _this.navDefaults,
-              _this.navMenuOptions
-            );
-
-            // cast text-based booleans
-            themerEnabled = ({{themer_options.enabled }} === 'true');
-
-            if ({{themer_options.enabled }}) {
-              logText = 'theme switcher detect: enabled';
-              logger.info(logText);
-              // initialize theme switcher menu
-              $('#ThemeList').bootstrapThemeSwitcher({localFeed: ''});          // load themes from Bootswatch API
-              $('#ThemeSelect').bootstrapThemeSwitcher();                       // Load (local) J1 themes
-              logText = 'theme switcher menu loaded successfully';
-              logger.info(logText);
-            } else {
-              logText = 'theme switcher detect: disabled';
-              logger.info(logText);
-            }
-            _this.setState('initialized');
-
-            // -----------------------------------------------------------------
-            // event handler|css styles
-            // -----------------------------------------------------------------
-            // continue if Theme CSS is applied
-            var dependencies_met_adapter_finished = setInterval(function() {
+        if (j1.xhrDOMState['#'+navQuicklinksOptions.xhr_container_id] == 'success' &&
+            j1.xhrDOMState['#'+navAuthClientConfig.xhr_container_id] == 'success' &&
+            j1.xhrDOMState['#'+navMenuOptions.xhr_container_id] == 'success' ){
+          _this.setState('processing');
+          logger.info('status: ' + _this.getState());
+          logger.info('initialize navigator core');
+
+          // Detect|Set J1 App status
+          appDetected       = j1.appDetected();
+          authClientEnabled = j1.authEnabled();
+          logger.info('application status detected: ' + appDetected);
+
+          j1.core.navigator.init (
+            _this.navDefaults,
+            _this.navMenuOptions
+          );
+
+          // cast text-based booleans
+          // themerEnabled = ({{themer_options.enabled }} === 'true');
+
+          if ({{themer_options.enabled }}) {
+            logText = 'theme switcher detect: enabled';
+            logger.info(logText);
+            // initialize theme switcher menu
+            // load themes from Bootswatch API (set localFeed EMPTY)
+            $('#ThemeList').bootstrapThemeSwitcher({
+                localFeed: ''
+            });
+            // load (local) J1 themes (default settings)
+            $('#ThemeSelect').bootstrapThemeSwitcher();
+            logText = 'theme switcher menu loaded successfully';
+            logger.info(logText);
+          } else {
+            logText = 'theme switcher detect: disabled';
+            logger.info(logText);
+          }
+          _this.setState('initialized');
+
+          // -----------------------------------------------------------------
+          // event handler|css styles
+          // -----------------------------------------------------------------
+          // continue if Theme CSS is applied
+          var dependencies_met_adapter_finished = setInterval(function() {
+            if (themerEnabled) {
               if (j1.adapter.themer.getState() === 'finished') {
                 _this.setState('processing');
 
@@ -352,56 +364,77 @@ j1.adapter['navigator'] = (function (j1, window) {
                 // set general|global theme colors
                 logger.info('apply dynamic CSS styles');
                 _this.setCSS (
-                  navBarOptions, navMenuOptions,
+                  navDefaults, navBarOptions, navMenuOptions,
                   navQuicklinksOptions, navTopsearchOptions
                 );
 
                 logger.info('init auth client');
-                j1.adapter.navigator.initAuthClient(j1.adapter.navigator.navAuthManagerConfig);
+                _this.initAuthClient(_this.navAuthManagerConfig);
+
                 _this.setState('finished');
                 logger.info('state: ' + _this.getState());
+                logger.info('module initialized successfully');
+                logger.info('met dependencies for: j1');
                 clearInterval(dependencies_met_adapter_finished);
               }
-            }, 25); // END 'dependencies_met_adapter_finished'
-            clearInterval(dependencies_met_navigator_core);
-          }
-        }, 25); // END 'dependencies_met_navigator_core'
-
-        // --------------------------------------------------------------------
-        // Register event 'reset on resize' to call j1.core.navigator on
-        // manageDropdownMenu to manage the (current) NAV menu for
-        // desktop or mobile
-        // ---------------------------------------------------------------------
-        $(window).on('resize', function() {
-          j1.core.navigator.manageDropdownMenu(navDefaults, navMenuOptions);
-
-          // jadams, 2020-07-10: cause severe trouble on mobile devices if
-          // OnScreen Kbd comes up and reduces the window size (resize event)
-          // DISABLED
-          // -------------------------------------------------------------------
-          // Hide|Close topSearch on resize event
-          // $('.top-search').slideUp();
-
-          // Manage sticky NAV bars
-          setTimeout (function(){
-            j1.core.navigator.navbarSticky();
-          }, 500);
-
-          // Scroll the page one pixel back and forth to get
-          // the right position for Toccer (trigger) and SSM
-          $(window).scrollTop($(window).scrollTop()+1);
-          $(window).scrollTop($(window).scrollTop()-1);
-
-          // jadams, 2020-06-21: unclear|forgotten what I'm doing here!
-          // Looks like the old BS3 implementation
-          //
-          // $('.navbar-collapse').removeClass('in');
-          // $('.navbar-collapse').removeClass('on');
-          // $('.navbar-collapse').removeClass('bounceIn');
-        });
-
-        return true;
-      }); // END 'core initializer'
+            } else {
+              _this.setState('processing');
+
+              logger.info('initialize eventHandler');
+              j1.core.navigator.eventHandler();
+
+              // set general|global theme colors
+              logger.info('apply dynamic CSS styles');
+              _this.setCSS (
+                navDefaults, navBarOptions, navMenuOptions,
+                navQuicklinksOptions, navTopsearchOptions
+              );
+
+              logger.info('init auth client');
+              _this.initAuthClient(_this.navAuthManagerConfig);
+              _this.setState('finished');
+              logger.info('state: ' + _this.getState());
+              logger.info('met dependencies for: themer');
+              clearInterval(dependencies_met_adapter_finished);
+            }
+          }, 25); // END 'dependencies_met_adapter_finished'
+          logger.info('met dependencies for: themer');
+          clearInterval(dependencies_met_load_menu_finished);
+        }
+      }, 25); // END 'dependencies_met_load_menu_finished'
+
+      // --------------------------------------------------------------------
+      // Register event 'reset on resize' to call j1.core.navigator on
+      // manageDropdownMenu to manage the (current) NAV menu for
+      // desktop or mobile
+      // ---------------------------------------------------------------------
+      $(window).on('resize', function() {
+        j1.core.navigator.manageDropdownMenu(navDefaults, navMenuOptions);
+
+        // jadams, 2020-07-10: cause severe trouble on mobile devices if
+        // OnScreen Kbd comes up and reduces the window size (resize event)
+        // DISABLED
+        // -------------------------------------------------------------------
+        // Hide|Close topSearch on resize event
+        // $('.top-search').slideUp();
+
+        // Manage sticky NAV bars
+        setTimeout (function() {
+          j1.core.navigator.navbarSticky();
+        }, 500);
+
+        // Scroll the page one pixel back and forth to get
+        // the right position for Toccer (trigger) and SSM
+        $(window).scrollTop($(window).scrollTop()+1);
+        $(window).scrollTop($(window).scrollTop()-1);
+
+        // jadams, 2020-06-21: unclear|forgotten what I'm doing here!
+        // Looks like the old BS3 implementation
+        //
+        // $('.navbar-collapse').removeClass('in');
+        // $('.navbar-collapse').removeClass('on');
+        // $('.navbar-collapse').removeClass('bounceIn');
+      });
     }, // END init
 
     // -------------------------------------------------------------------------
@@ -563,11 +596,12 @@ j1.adapter['navigator'] = (function (j1, window) {
     // setCSS
     // Set dynamic CSS styles
     // -------------------------------------------------------------------------
-    setCSS: function (navBarOptions, navMenuOptions, navQuicklinksOptions, navTopsearchOptions) {
+    setCSS: function (navDefaults, navBarOptions, navMenuOptions, navQuicklinksOptions, navTopsearchOptions) {
       var logger              = log4javascript.getLogger('j1.adapter.navigator.setCSS');
       var gridBreakpoint_lg   = '992px';
       var gridBreakpoint_md   = '768px';
       var gridBreakpoint_sm   = '576px';
+      var navPrimaryColor     = navDefaults.nav_primary_color;
 
       {% comment %} Set|Resolve navMenuOptions
       -------------------------------------------------------------------------- {% endcomment %}
@@ -601,10 +635,12 @@ j1.adapter['navigator'] = (function (j1, window) {
 
       {% comment %} Set dymanic styles
       -------------------------------------------------------------------------- {% endcomment %}
+      $('nav-primary').css({"background-color": "navPrimaryColor"});
+
 
       {% comment %} navBar styles
       -------------------------------------------------------------------------- {% endcomment %}
-      var bg_primary    = j1.getStyleValue('bg-primary', 'background-color');
+      var bg_primary    = j1.getStyleValue('nav-primary', 'background-color');
       var bg_scrolled   = bg_primary;
       var bg_collapsed  = bg_primary;
 
@@ -630,10 +666,10 @@ j1.adapter['navigator'] = (function (j1, window) {
       $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator .dropdown-item:focus, nav.navbar.navigator .dropdown-item:hover, nav.navbar.navigator .nav-sub-item:focus, nav.navbar.navigator .nav-sub-item:hover { background: ' +navMenuOptions.dropdown_background_color_hover+ ' !important; }}</style>');
 
       // Limit 1st dropdown item width
-      $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator ul.nav.navbar-right .dropdown-menu .dropdown-menu { left: -' +navMenuOptions.dropdown_item_width+ 'em !important; } }</style>');
+      $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator ul.nav.navbar-right .dropdown-menu .dropdown-menu { left: -' +navMenuOptions.dropdown_item_min_width+ 'rem !important; } }</style>');
 
       // Limit last (2nd) dropdown in height (nav.navbar.navigator li.dropdown ul.dropdown-menu ul.dropdown-menu)
-      $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator li.dropdown ul.dropdown-menu ul.dropdown-menu  { top: -' +navMenuOptions.dropdown_border_top+ 'px !important; max-height: ' +navMenuOptions.dropdown_menu_height_max+ 'em !important; } }</style>');
+      $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator li.dropdown ul.dropdown-menu ul.dropdown-menu  { top: -' +navMenuOptions.dropdown_border_top+ 'px !important; max-height: ' +navMenuOptions.dropdown_menu_max_height+ 'em !important; } }</style>');
 
       //  Set dropdown item colors
       $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator ul.nav > li > a { color: ' +navMenuOptions.menu_item_color+ ' !important; } }</style>');
@@ -641,7 +677,7 @@ j1.adapter['navigator'] = (function (j1, window) {
 
       // Dropdown menu styles
       // jadams, 2017-11-30: removed left padding from dropdown mwenu (for new j1nav style based on Navigator|Slate)
-      $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator li.dropdown ul.dropdown-menu { animation-duration: ' +navMenuOptions.dropdown_animate_duration+ 's !important; color: ' +bg_scrolled+ ' !important; width: ' +navMenuOptions.dropdown_item_width+ 'emm !important; border-top: solid ' +navMenuOptions.dropdown_border_top+ 'px !important; border-radius: ' +navMenuOptions.dropdown_border_radius+ 'px !important; left: 0; } }</style>');
+      $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator li.dropdown ul.dropdown-menu { animation-duration: ' +navMenuOptions.dropdown_animate_duration+ 's !important; color: ' +bg_scrolled+ ' !important; min-width: ' +navMenuOptions.dropdown_item_min_width+ 'rem !important; border-top: solid ' +navMenuOptions.dropdown_border_top+ 'px !important; border-radius: ' +navMenuOptions.dropdown_border_radius+ 'px !important; left: 0; } }</style>');
 
       {% if dropdown_style == 'raised' %}
       $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator li.dropdown ul.dropdown-menu { box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2) !important; } }</style>');
@@ -746,20 +782,20 @@ j1.adapter['navigator'] = (function (j1, window) {
     }, // END messageHandler
 
     // -------------------------------------------------------------------------
-    // setState
-    // Set the current (processing) state of the module
+    // setState()
+    // Sets the current (processing) state of the module
     // -------------------------------------------------------------------------
     setState: function (stat) {
-      j1.adapter.navigator.state = stat;
+      _this.state = stat;
     }, // END setState
 
     // -------------------------------------------------------------------------
-    // getState
+    // getState()
     // Returns the current (processing) state of the module
     // -------------------------------------------------------------------------
     getState: function () {
-      return j1.adapter.navigator.state;
-    } // END state
+      return _this.state;
+    } // END getState
 
   }; // END return
 })(j1, window);

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

@@ -99,8 +99,18 @@ j1.adapter['searcher'] = (function (j1, window) {
     // Initializer
     // -------------------------------------------------------------------------
     init: function (options) {
+
+      // -----------------------------------------------------------------------
+      // globals
+      // -----------------------------------------------------------------------
+      _this   = j1.adapter.searcher;
+      logger  = log4javascript.getLogger('j1.adapter.searcher');
+
       // initialize state flag
-      j1.adapter.searcher.state = 'pending';
+      _this.setState('pending');
+      logger.info('state: ' + _this.getState());
+      logger.info('Module is being started');
+
 
       // -----------------------------------------------------------------------
       // Default module settings
@@ -110,11 +120,6 @@ j1.adapter['searcher'] = (function (j1, window) {
         generated:   '{{site.time}}'
       }, options);
 
-      {% comment %} Set global variables
-      -------------------------------------------------------------------------- {% endcomment %}
-      _this   = j1.adapter.searcher;
-      logger  = log4javascript.getLogger('j1.adapter.searcher');
-
       {% comment %} Load module config from yml data
       -------------------------------------------------------------------------- {% endcomment %}
       // Load  module DEFAULTS|CONFIG
@@ -147,6 +152,7 @@ j1.adapter['searcher'] = (function (j1, window) {
 
         _this.setState('finished');
         logger.info('state: ' + _this.getState());
+        logger.info('module initialized successfully');
       } else {
         _this.setState('finished');
         logger.info('state: ' + _this.getState());
@@ -184,20 +190,20 @@ j1.adapter['searcher'] = (function (j1, window) {
     }, // END messageHandler
 
     // -------------------------------------------------------------------------
-    // setState
-    // Set the current (processing) state of the module
+    // setState()
+    // Sets the current (processing) state of the module
     // -------------------------------------------------------------------------
     setState: function (stat) {
-      j1.adapter.searcher.state = stat;
+      _this.state = stat;
     }, // END setState
 
     // -------------------------------------------------------------------------
-    // getState
+    // getState()
     // Returns the current (processing) state of the module
     // -------------------------------------------------------------------------
     getState: function () {
-      return j1.adapter.searcher.state;
-    } // END state
+      return _this.state;
+    } // END getState
 
   }; // END return
 })(j1, window);