j1-template 2024.1.5 → 2024.2.0

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

@@ -29,7 +29,7 @@ regenerate:                             true
  # NOTE:
  #  jadams, 2020-06-21:
  #    J1 Navigator needs a general revision on BS4 code and functionalities
- #    Current, only base function are tested with BS4 (was coded for BS3)
+ #    Current, only base functions are tested with BS4 (was coded for BS3)
  # -----------------------------------------------------------------------------
  # NOTE:
  #  jadams, 2020-07-17:
@@ -50,10 +50,6 @@ 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 %}
@@ -61,8 +57,8 @@ regenerate:                             true
 {% assign blocks                        = site.data.blocks %}
 {% assign modules                       = site.data.modules %}
 
-{% assign themer_defaults               = modules.defaults.themer.defaults %}
-{% assign themer_settings               = modules.themer.settings %}
+{% assign themes_defaults               = modules.defaults.themes.defaults %}
+{% assign themes_settings               = modules.themes.settings %}
 
 {% assign authentication_defaults       = modules.defaults.authentication.defaults %}
 {% assign authentication_settings       = modules.authentication.settings %}
@@ -86,7 +82,7 @@ regenerate:                             true
 {% comment %} Set config options
 -------------------------------------------------------------------------------- {% endcomment %}
 {% assign authentication_options        = authentication_defaults | merge: authentication_settings %}
-{% assign themer_options                = themer_defaults | merge: themer_settings %}
+{% assign themes_options                = themes_defaults | merge: themes_settings %}
 {% assign nav_bar_options               = nav_bar_defaults | merge: nav_bar_settings %}
 {% assign nav_menu_options              = nav_menu_defaults | merge: nav_menu_settings %}
 {% assign quicklinks_options            = nav_quicklinks_defaults | merge: nav_quicklinks_settings %}
@@ -147,11 +143,10 @@ ToDo: Remove configuration from j1_navigator.yml
 /* eslint indent: "off"                                                       */
 // -----------------------------------------------------------------------------
 'use strict';
-j1.adapter.navigator = (function (j1, window) {
+j1.adapter.navigator = ((j1, window) => {
 
-  // ---------------------------------------------------------------------------
-  // globals
-  // ---------------------------------------------------------------------------
+  {% comment %} Set global variables
+  ------------------------------------------------------------------------------ {% endcomment %}
   var environment                 = '{{environment}}';
   var dclFinished                 = false;
   var moduleOptions               = {};
@@ -170,15 +165,24 @@ j1.adapter.navigator = (function (j1, window) {
   var colors_data_path            = '{{template_config.colors_data_path}}';
   var font_size_data_path         = '{{template_config.font_size_data_path}}';
 
-
   var cookie_names                = j1.getCookieNames();
   var cookie_user_session_name    = cookie_names.user_session;
 
+  var navigatorCoreInitialized  = false;
+  var themesEnabled             = {{themes_options.enabled}};
+
   var user_session                = {};
   var user_session_merged         = {};
   var session_state               = {};
 
-  var themerEnabled               = {{themer_options.enabled}};                 //was (test): false;
+  // switcher|state
+  var desktopThemesLocalLoaded    =  false;
+  var desktopThemesRemoteLoaded   =  false;
+  var mobileThemesLocalLoaded     =  false;
+  var mobileThemesRemoteLoaded    =  false;
+  var switcher;
+  var switcher_menu;
+
   var authClientEnabled;
   var appDetected;
   var json_data;
@@ -186,23 +190,29 @@ j1.adapter.navigator = (function (j1, window) {
   var logger;
   var logText;
 
+  // date|time
+  var startTime;
+  var endTime;
+  var startTimeModule;
+  var endTimeModule;
+  var timeSeconds;
 
   // ---------------------------------------------------------------------------
   // helper functions
   // ---------------------------------------------------------------------------
 
   // ---------------------------------------------------------------------------
-  // main object
+  // main
   // ---------------------------------------------------------------------------
   return {
 
     // -------------------------------------------------------------------------
-    // module initializer
+    // adapter initializer
     // -------------------------------------------------------------------------
-    init: function (options) {
+    init: (options) => {
 
       // -----------------------------------------------------------------------
-      // Default module settings
+      // default module settings
       // -----------------------------------------------------------------------
       var settings  = $.extend({
         module_name: 'j1.adapter.navigator',
@@ -210,7 +220,7 @@ j1.adapter.navigator = (function (j1, window) {
       }, options);
 
       // -----------------------------------------------------------------------
-      // Global variable settings
+      // global variable settings
       // -----------------------------------------------------------------------
       _this         = j1.adapter.navigator;
       logger        = log4javascript.getLogger('j1.adapter.navigator');
@@ -224,51 +234,42 @@ j1.adapter.navigator = (function (j1, window) {
       // options loader
       // -----------------------------------------------------------------------
       /* eslint-disable */
-      var authConfig                                = {};
-      var navDefaults                               = {};
-      var navBarConfig                              = {};
-      var navMenuConfig                             = {};
-      var navQuicklinksConfig                       = {};
-      var navAuthClientConfig                       = {};
-      var navBarOptions                             = {};
-      var navMenuOptions                            = {};
-      var navQuicklinksOptions                      = {};
-      var navAuthClientOptions                      = {};
-      var navAuthMAnagerConfig                      = {};
-
-      var user_state                                = {};
-      var cookie_names                              = j1.getCookieNames();
-      var cookie_user_state_name                    = cookie_names.user_state;
-
-      var themerOptions                             = {};
-      var interval_count                            = 0;
-      var user_state_detected;
-      var themes_count;
-      var max_count                                 = 100;
-
-      var gaCookies                                 = j1.findCookie('_ga');
-      var j1Cookies                                 = j1.findCookie('j1');
-
-      navDefaults                                   = $.extend({}, {{navigator_defaults | replace: '=>', ':' }});
-      navBarConfig                                  = $.extend({}, {{nav_bar_options | replace: '=>', ':' }});
-      navMenuConfig                                 = $.extend({}, {{nav_menu_options | replace: '=>', ':' }});
-      navQuicklinksConfig                           = $.extend({}, {{quicklinks_options | replace: '=>', ':' }});
-      navAuthClientConfig                           = $.extend({}, {{authclient_options | replace: '=>', ':' }});
-
-      navAuthMAnagerConfig                          = $.extend({}, {{authentication_options | replace: '=>', ':' }});
-      authClientEnabled                             = navAuthMAnagerConfig.enabled;
-
-      themerOptions                                 = $.extend({}, {{themer_options | replace: '=>', ':' | replace: 'nil', '""' }});
-
-      // Merge|Overload module CONFIG by DEFAULTS
-      //
-      navBarOptions                                 = $.extend(true, {}, navDefaults.nav_bar,  navBarConfig);
-      navMenuOptions                                = $.extend(true, {}, navDefaults.nav_menu, navMenuConfig);
-      navQuicklinksOptions                          = $.extend(true, {}, navDefaults.nav_bar,  navQuicklinksConfig,);
-      navAuthClientConfig                           = $.extend(true, {}, navAuthClientConfig,  navDefaults.nav_authclient);
-
-      // save config settings into the adapter object for global access
-      //
+      var authConfig                = {};
+      var navDefaults               = {};
+      var navBarConfig              = {};
+      var navMenuConfig             = {};
+      var navQuicklinksConfig       = {};
+      var navAuthClientConfig       = {};
+      var navBarOptions             = {};
+      var navMenuOptions            = {};
+      var navQuicklinksOptions      = {};
+      var navAuthClientOptions      = {};
+      var navAuthMAnagerConfig      = {};
+
+      var user_state                = {};
+      var cookie_names              = j1.getCookieNames();
+      var cookie_user_state_name    = cookie_names.user_state;
+
+      var themesOptions             = {};
+
+      navDefaults                   = $.extend({}, {{navigator_defaults | replace: '=>', ':' }});
+      navBarConfig                  = $.extend({}, {{nav_bar_options | replace: '=>', ':' }});
+      navMenuConfig                 = $.extend({}, {{nav_menu_options | replace: '=>', ':' }});
+      navQuicklinksConfig           = $.extend({}, {{quicklinks_options | replace: '=>', ':' }});
+      navAuthClientConfig           = $.extend({}, {{authclient_options | replace: '=>', ':' }});
+
+      navAuthMAnagerConfig          = $.extend({}, {{authentication_options | replace: '=>', ':' }});
+      authClientEnabled             = navAuthMAnagerConfig.enabled;
+
+      themesOptions                 = $.extend({}, {{themes_options | replace: '=>', ':' | replace: 'nil', '""' }});
+
+      // merge|overload module CONFIG by DEFAULTS
+      navBarOptions                  = $.extend(true, {}, navDefaults.nav_bar,  navBarConfig);
+      navMenuOptions                 = $.extend(true, {}, navDefaults.nav_menu, navMenuConfig);
+      navQuicklinksOptions           = $.extend(true, {}, navDefaults.nav_bar,  navQuicklinksConfig,);
+      navAuthClientConfig            = $.extend(true, {}, navAuthClientConfig,  navDefaults.nav_authclient);
+
+      // save config settings for later use
       _this['navDefaults']           = navDefaults;
       _this['navBarOptions']         = navBarOptions;
       _this['navMenuOptions']        = navMenuOptions;
@@ -276,13 +277,17 @@ j1.adapter.navigator = (function (j1, window) {
       _this['navAuthClientConfig']   = navAuthClientConfig;
       _this['navAuthManagerConfig']  = navAuthMAnagerConfig;
 
-      // Load (individual) frontmatter options (currently NOT used)
-      if (options  != null) { var frontmatterOptions = $.extend({}, options) }
+      // load frontmatter options (currently NOT used)
+      if (options !== null) {var frontmatterOptions = $.extend({}, options)}
       /* eslint-enable */
 
+      // start module processing time
+      startTimeModule = Date.now();
+
       // -----------------------------------------------------------------------
-      // Load HTML data (AJAX)
+      // Load dymanic HTML data (AJAX)
       // -----------------------------------------------------------------------
+      //
       // jadams, 202-06-24: Promise (chain) if $.when seems NOT to work correctly.
       // 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'.
@@ -292,8 +297,9 @@ j1.adapter.navigator = (function (j1, window) {
       // the chain.
       // See: https://stackoverflow.com/questions/5436327/jquery-deferreds-and-promises-then-vs-done
       // authclient_xhr_data_element
+      //
       // -----------------------------------------------------------------------
-      // data loader
+      // data loaders
       // -----------------------------------------------------------------------
       j1.loadHTML({
         xhr_container_id:   navQuicklinksOptions.xhr_container_id,
@@ -314,164 +320,121 @@ j1.adapter.navigator = (function (j1, window) {
         'j1.adapter.navigator',
         'data_loaded');
 
-        var dependencies_met_load_menu_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' ) {
-            // continue if all AJAX loads (loadHTML) has finished
-            _this.setState('processing');
-            logger.info('\n' + 'status: ' + _this.getState());
-            logger.info('\n' + 'initialize navigator core');
-
-            // Detect|Set J1 App status
-            appDetected       = j1.appDetected();
-            authClientEnabled = j1.authEnabled();
-            logger.info('\n' + 'application status detected: ' + appDetected);
-
-            // setTimeout (function() {
-            //   j1.core.navigator.init (_this.navDefaults, _this.navMenuOptions);
-            // }, 1000);  // {{template_config.page_on_load_timeout}}
-
-            j1.core.navigator.init (_this.navDefaults, _this.navMenuOptions);
-
-            // load themes (to menu) if themer is enabled|finished
-            if (themerEnabled) {
-              logText = '\n' + 'theme switcher: enabled';
-              logger.info(logText);
-
-              // detect j1 user state cookie
-              user_state_detected = j1.existsCookie(cookie_user_state_name);
-
-
-              if (user_state_detected) {
-                user_state        = j1.readCookie(cookie_user_state_name);
-              }  else {
-                logger.error('\n' + 'cookie not found: j1.user.state');
-                logger.debug('\n' + 'j1 cookies found:' + j1Cookies.length);
-                j1Cookies.forEach(item => console.log('j1.core.switcher: ' + item));
-                logger.debug('\n' + 'ga cookies found:' + gaCookies.length);
-                gaCookies.forEach(item => console.log('j1.core.switcher: ' + item));
-              }
-
-              // jadams, 2021-07-03: wait until navigator CORE get finished
-              var dependencies_met_page_finished = setInterval(function() {
-                if (j1.adapter.navigator.getState() == 'core_initialized') {
-                  logText = '\n' + 'load themes';
-                  logger.info(logText);
-
-                  // load LOCAL themes from JSON data
-                  logText = '\n' + 'load local themes (json file)';
-                  logger.info(logText);
-                  $('#local_themes').bootstrapThemeSwitcher({
-                    localFeed: themerOptions.localThemes
-                  });
-
-                  // load REMOTE themes from Bootswatch API (localFeed EMPTY!)
-                  $('#remote_themes').bootstrapThemeSwitcher({
-                    localFeed: '',
-                    bootswatchApiVersion: themerOptions.bootswatchApiVersion
-                  });
-
-                  // jadams, 2021-04-22: Up to now, it is unclear why in some
-                  // cases the menu bar is NOT fully loaded for THEMES
-                  // TODO: Add additional checks to find the reason
-
-                  // added same checks (as already done by adapter themer) to
-                  // check if remote theme menu detected as LOADED
-                  //
-                  var dependencies_met_remote_themes_loaded = setInterval(function() {
-                    interval_count += 1;
-                    themes_count = document.getElementById("remote_themes").getElementsByTagName("li").length;
-                    if ( themes_count > 0  ) {
-                      logger.info('\n' + 'remote themes loaded: successfully');
-                      logger.info('\n' + 'remote themes loaded: successfully after: ' + interval_count * 25 + ' ms');
-
-                      clearInterval(dependencies_met_remote_themes_loaded);
-                    } else {
-                        logger.debug('\n' + 'wait for theme to be loaded: ' + user_state.theme_name);
-                    }
-                    if (interval_count > max_count) {
-                      logger.warn('\n' + 'remote themes loading: failed');
-                      logger.warn('\n' + 'continue processing');
-                      clearInterval(dependencies_met_remote_themes_loaded);
-                    }
-                    clearInterval(dependencies_met_page_finished);
-                  }, 10);
-                }
-//              _this.setState('initialized');
-                _this.setState('finished');
-              }, 10); // END 'dependencies_met_page_finished'
-            } else {
-              logText = '\n' + 'theme switcher detected as: disabled';
-              logger.info(logText);
-              _this.setState('finished');
-            }
-
-            // -----------------------------------------------------------------
-            // event handler|css styles
-            // -----------------------------------------------------------------
-            var dependencies_met_initialized = setInterval(function() {
-              var pageState     = $('#no_flicker').css("display");
-              var pageVisible   = (pageState == 'block') ? true: false;
-              var atticFinished = (j1.adapter.attic.getState() == 'finished') ? true: false;
-
-              // initialize if page and themer ready
-              if (j1.getState() === 'finished' && j1.adapter.themer.getState() === 'finished' && pageVisible) {
-//            if (j1.getState() === 'finished' && j1.adapter.themer.getState() === 'finished' && pageVisible && atticFinished) {
-                _this.setState('processing');
-
-                // apply module configuration settings
-                _this.applyNavigatorSettings (
-                  navDefaults, navBarOptions, navMenuOptions,
-                  navQuicklinksOptions
-                );
-
-                // (static) delay applying styles until added CSS data
-                // of the theme is processed by the browser
-                // TODO: Check why a timeout is required to load dynamic styles in a page
-                setTimeout (function() {
-                  // set general|global theme colors
-                  logger.info('\n' + 'initializing dynamic CSS styles');
-                  _this.applyThemeSettings (
-                    navDefaults, navBarOptions, navMenuOptions,
-                    navQuicklinksOptions
-                  );
-                }, {{template_config.page_on_load_timeout}} );
-
-                logger.info('\n' + 'init auth client');
-                _this.initAuthClient(_this.navAuthManagerConfig);
-
-                _this.setState('finished');
-                logger.debug('\n' + 'state: ' + _this.getState());
-                logger.info('\n' + 'module initialized successfully');
-                logger.debug('\n' + 'met dependencies for: j1');
-                clearInterval(dependencies_met_initialized);
-              }
-            }, 10); // END 'dependencies_met_initialized'
-            logger.debug('\n' + 'met dependencies for: themer');
-            clearInterval(dependencies_met_load_menu_finished);
-          }
-        }, 10); // 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);
-
-        // Manage sticky NAV bars
-        // TODO: Check why a timeout is required to manage sticky NAV bars on RESIZE a page
-        setTimeout (function() {
-          j1.core.navigator.navbarSticky();
-        }, 500);
-
-        // Scroll the page one pixel back and forth to get
-        // the right position for the toccer
-        $(window).scrollTop($(window).scrollTop()+1);
-        $(window).scrollTop($(window).scrollTop()-1);
-      });
+      // initialize navigator core
+      var dependencies_met_html_loaded = setInterval(() => {
+        var htmloaded = (j1.xhrDOMState['#'+navQuicklinksOptions.xhr_container_id] === 'success'
+          && j1.xhrDOMState['#'+navAuthClientConfig.xhr_container_id] === 'success'
+          && j1.xhrDOMState['#'+navMenuOptions.xhr_container_id] === 'success') ? true : false;
+
+        // initialize navigator core if all AJAX loads finished
+        if (htmloaded) {
+
+          _this.setState('started');
+          logger.debug('\n' + 'set module state to: ' + _this.getState());
+          logger.info('\n' + 'initializing module: started');
+
+          logger.info('\n' + 'initialize navigator core: started');
+          j1.core.navigator.init (_this.navDefaults, _this.navMenuOptions);
+
+          clearInterval(dependencies_met_html_loaded);
+        } // END if htmloaded
+      }, 10); // END dependencies_met_navigator_core_initialized
+
+      if (themesEnabled) {
+        logger.info('\n' + 'themes detected: enabled');
+        logger.info('\n' + 'loading themes menu: started');
+        // load
+        var dependencies_met_navigator_core_initialized = setInterval(() => {
+          if (navigatorCoreInitialized) {
+            logger.info('\n' + 'initialize navigator core: finished');
+            logger.info('\n' + 'loading theme menu: started');
+
+            // load LOCAL themes (switcher)
+            logger.debug('\n' + 'load local themes to menu');
+            $('#local_themes').ThemeSwitcher({
+              localFeed: themesOptions.localThemes
+            });
+
+            // load REMOTE themes (switcher)
+            logger.debug('\n' + 'load remote themes to menu');
+            $('#remote_themes').ThemeSwitcher({
+              localFeed: '',
+              bootswatchApiVersion: themesOptions.bootswatchApiVersion
+            });
+
+            clearInterval(dependencies_met_navigator_core_initialized);
+          } // END if navigatorCoreInitialized
+        }, 10); // END dependencies_met_navigator_core_initialized
+      } // END if themesEnabled
+
+      // -------------------------------------------------------------------
+      // final initialization
+      // -------------------------------------------------------------------
+      var dependencies_met_module_initialized = setInterval (() => {
+        var pageState          = $('#content').css("display");
+        var pageVisible        = (pageState === 'block') ? true: false;
+        var j1CoreFinished     = (j1.getState() === 'finished') ? true: false;
+
+        {% if themes_options.enabled %}
+        var themesFinished     = (j1.adapter.themes.getState() === 'finished') ? true: false;
+        var themeMenuLoaded    = (desktopThemesLocalLoaded && desktopThemesRemoteLoaded) ? true: false;
+
+        if (pageVisible && j1CoreFinished && themesFinished && themeMenuLoaded) {
+        {% else %}
+        if (pageVisible && j1CoreFinished) {
+        {% endif %}
+
+          // apply Navigator configuration settings
+          logger.info('\n' + 'apply configuration settings');
+          _this.applyNavigatorSettings (
+            navDefaults, navBarOptions,
+            navMenuOptions, navQuicklinksOptions
+          );
+
+          // apply general|global theme CSS settings
+          logger.info('\n' + 'apply CSS styles');
+          _this.applyThemeSettings (
+            navDefaults, navBarOptions, navMenuOptions,
+            navQuicklinksOptions
+          );
+
+          // detect J1 App state
+          appDetected       = j1.appDetected();
+          authClientEnabled = j1.authEnabled();
+          if (appDetected && authClientEnabled) {
+            logger.debug('\n' + 'application status detected: ' + appDetected);
+            logger.debug('\n' + 'init auth client');
+
+            _this.initAuthClient(_this.navAuthManagerConfig);
+          } // END if
+
+          // ----------------------------------------------------------------------
+          // 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);
+
+            // Manage sticky NAV bars
+            j1.core.navigator.navbarSticky();
+
+            // Scroll the page one pixel back and forth to get
+            // the right position for the toccer
+            $(window).scrollTop($(window).scrollTop()+1);
+            $(window).scrollTop($(window).scrollTop()-1);
+          });
+
+          _this.setState('finished');
+          logger.debug('\n' + 'state: ' + _this.getState());
+          logger.info('\n' + 'initializing module: finished');
+
+          endTimeModule = Date.now();
+          logger.info('\n' + 'module initializing time: ' + (endTimeModule-startTimeModule) + 'ms');
+
+          clearInterval(dependencies_met_module_initialized);
+        } // END if
+      }, 10); // END dependencies_met_module_initialized
     }, // END init
 
     // -------------------------------------------------------------------------
@@ -480,13 +443,14 @@ j1.adapter.navigator = (function (j1, window) {
     //       All updates on Cookies are managed by Cookie Consent.
     //       To be considered to re-add cookie updates for the auth state
     // -------------------------------------------------------------------------
-    initAuthClient: function(auth_config) {
-      var logger        = log4javascript.getLogger('j1.adapter.navigator.initAuthClient');
-      var user_session  = j1.readCookie(cookie_user_session_name);
+    initAuthClient: (auth_config) => {
+      var logger       = log4javascript.getLogger('j1.adapter.navigator.initAuthClient');
+      var user_session = j1.readCookie(cookie_user_session_name);
 
       _this.modalEventHandler(auth_config);
 
       if (j1.appDetected() && j1.authEnabled()) {
+
         // Toggle/Set SignIn/SignOut icon|link in QuickLinks
         // See: https://stackoverflow.com/questions/13524107/how-to-set-data-attributes-in-html-elements
         if (user_session.authenticated === 'true') {
@@ -508,7 +472,7 @@ j1.adapter.navigator = (function (j1, window) {
     // Manage button click events for all BS Modals
     // See: https://www.nickang.com/add-event-listener-for-loop-problem-in-javascript/
     // -------------------------------------------------------------------------
-    modalEventHandler: function (options) {
+    modalEventHandler: (options) => {
       // var logger      = log4javascript.getLogger('j1.adapter.navigator.EventHandler');
       var authConfig  = options.j1_auth;
       var route;
@@ -529,20 +493,27 @@ j1.adapter.navigator = (function (j1, window) {
         do:               false
       };
 
-      logText = '\n' + 'initialize button click events';
+      logText = '\n' + 'initialize button click events (modals)';
       logger.info(logText);
 
       // Manage button click events for modal "signInOutButton"
       // -----------------------------------------------------------------------
       $('ul.nav-pills > li').click(function (e) {
+        // suppress default actions|bubble up
         e.preventDefault();
+        e.stopPropagation();
+
         // jadams, 2019-07-30: To be checked if needed
         signIn.provider       = $(this).text().trim();
         signIn.provider       = signIn.provider.toLowerCase();
         signIn.allowed_users  = signIn.users.toString();
       });
 
-      $('a.btn').click(function() {
+      $('a.btn').click(function (e) {
+        // suppress default actions|bubble up
+        e.preventDefault();
+        e.stopPropagation();
+
         if (this.id === 'signInButton') {
           signIn.do = true;
         } else {
@@ -556,9 +527,12 @@ j1.adapter.navigator = (function (j1, window) {
       });
 
       $('input:checkbox[name="providerSignOut"]').on('click', function (e) {
+        // suppress default actions|bubble up
+        e.preventDefault();
         e.stopPropagation();
+
         signOut.providerSignOut = $('input:checkbox[name="providerSignOut"]').is(':checked');
-        if(environment === 'development') {
+        if (environment === 'development') {
           logText = '\n' + 'provider signout set to: ' + signOut.providerSignOut;
           logger.info(logText);
         }
@@ -566,8 +540,9 @@ j1.adapter.navigator = (function (j1, window) {
 
       // Manage pre events on modal "modalOmniSignIn"
       // -----------------------------------------------------------------------
-      $('#modalOmniSignOut').on('show.bs.modal', function() {
+      $('#modalOmniSignOut').on('show.bs.modal', function () {
           var modal = $(this);
+
           logger.info('\n' + 'place current user data');
           user_session = j1.readCookie(cookie_user_session_name);
           modal.find('.user-info').text('You are signed in to provider: ' + user_session.provider);
@@ -575,8 +550,8 @@ j1.adapter.navigator = (function (j1, window) {
 
       // Manage post events on modal "modalOmniSignIn"
       // -----------------------------------------------------------------------
-      $('#modalOmniSignIn').on('hidden.bs.modal', function() {
-        if (signIn.do == true) {
+      $('#modalOmniSignIn').on('hidden.bs.modal', function () {
+        if (signIn.do === true) {
           provider      = signIn.provider.toLowerCase();
           allowed_users = signIn.users.toString();
           logText       = '\n' + 'provider detected: ' + provider;
@@ -597,8 +572,8 @@ j1.adapter.navigator = (function (j1, window) {
 
       // Manage post events on modal "modalOmniSignOut"
       // -----------------------------------------------------------------------
-      $('#modalOmniSignOut').on('hidden.bs.modal', function() {
-        if (signOut.do == true) {
+      $('#modalOmniSignOut').on('hidden.bs.modal', function () {
+        if (signOut.do === true) {
           logger.info('\n' + 'load active provider from cookie: ' + cookie_user_session_name);
 
           user_session  = j1.readCookie(cookie_user_session_name);
@@ -623,7 +598,7 @@ j1.adapter.navigator = (function (j1, window) {
         }
       }); // END post events "modalSignOut"
 
-      logText = '\n' + 'initialize button click events completed';
+      logText = '\n' + 'initialize button click events (modals) completed';
       logger.info(logText);
 
       return true;
@@ -633,12 +608,11 @@ j1.adapter.navigator = (function (j1, window) {
     // applyThemeSettings
     // Apply CSS styles from current theme
     // -------------------------------------------------------------------------
-    applyThemeSettings: function (navDefaults, navBarOptions, navMenuOptions, navQuicklinksOptions) {
-
-      var logger              = log4javascript.getLogger('j1.adapter.navigator.applyThemeSettings');
-      var gridBreakpoint_lg   = '992px';
-      var gridBreakpoint_md   = '768px';
-      var gridBreakpoint_sm   = '576px';
+    applyThemeSettings: (navDefaults, navBarOptions, navMenuOptions, navQuicklinksOptions) => {
+      var logger            = log4javascript.getLogger('j1.adapter.navigator.applyThemeSettings');
+      var gridBreakpoint_lg = '992px';
+      var gridBreakpoint_md = '768px';
+      var gridBreakpoint_sm = '576px';
 
       var navbar_scrolled_color;
       var navbar_scrolled_style;
@@ -650,26 +624,22 @@ j1.adapter.navigator = (function (j1, window) {
       // -----------------------------------------------------------------------
 
       // read current background colors
-      var bg_primary    = $('#bg-primary').css('background-color');
-      var bg_table      = $('body').css('background-color');
+      var bg_primary = $('#bg-primary').css('background-color');
+      var bg_table   = $('body').css('background-color');
 
       // set navbar background colors
-      bg_scrolled   = bg_primary;
-      bg_collapsed  = bg_primary;
+      bg_scrolled    = bg_primary;
+      bg_collapsed   = bg_primary;
 
       // navBar styles
-      // -----------------------------------------------------------------------
-
       var navPrimaryColor     = navDefaults.nav_primary_color;
 
       if (navBarOptions.background_color_scrolled == 'default' ) {
         navbar_scrolled_color = bg_primary;
       } else {
-//      navbar_scrolled_color = '#212529';
         navbar_scrolled_color = navBarOptions.background_color_scrolled;
       }
 
-
       navbar_scrolled_style  = '<style id="navbar_scrolled_color">';
       navbar_scrolled_style += '  .navbar-scrolled {';
       navbar_scrolled_style += '    background-color: ' + navbar_scrolled_color + ' !important;';
@@ -679,23 +649,18 @@ j1.adapter.navigator = (function (j1, window) {
       $('head').append(navbar_scrolled_style);
 
       // set current body background color for all tables
-      // -----------------------------------------------------------------------
       $('table').css('background', bg_table);
 
+      logger.debug('\n' + 'set dynamic styles for the theme');
 
-      logger.info('\n' + 'set dynamic styles for the theme loaded');
-
-      // Set|Resolve navMenuOptions
-      // ------------------------------------------------------------------------
+      // set|resolve navMenuOptions
       navMenuOptions.dropdown_font_size               = navMenuOptions.dropdown_font_size;
       navMenuOptions.megamenu_font_size               = navMenuOptions.megamenu_font_size;
 
-      // Set|Resolve navBarOptions
-      // -----------------------------------------------------------------------
+      // set|resolve navBarOptions
       navBarOptions.background_color_full             = navBarOptions.background_color_full;
 
-      // Set|Resolve navMenuOptions
-      // -----------------------------------------------------------------------
+      // set|resolve navMenuOptions
       navMenuOptions.menu_item_color                  = navMenuOptions.menu_item_color;
       navMenuOptions.menu_item_color_hover            = navMenuOptions.menu_item_color_hover;
       navMenuOptions.menu_item_dropdown_color         = navMenuOptions.menu_item_dropdown_color;
@@ -704,14 +669,12 @@ j1.adapter.navigator = (function (j1, window) {
       navMenuOptions.dropdown_background_color_active = navMenuOptions.dropdown_background_color_active;
       navMenuOptions.dropdown_border_color            = navMenuOptions.dropdown_border_color;
 
-      // Set|Resolve navQuicklinksOptions
-      // -----------------------------------------------------------------------
+      // set|resolve navQuicklinksOptions
       navQuicklinksOptions.icon_color                 = navQuicklinksOptions.icon_color;
       navQuicklinksOptions.icon_color_hover           = navQuicklinksOptions.icon_color_hover;
       navQuicklinksOptions.background_color           = navQuicklinksOptions.background_color;
 
-      // Timeline styles
-      // -----------------------------------------------------------------------
+      // timeline styles
       style  = '<style>';
       style += '  .timeline > li > .timeline-panel:after {';
       style += '    border-left: 14px solid ' + bg_scrolled + ';';
@@ -727,8 +690,7 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-      // Heading styles
-      // -----------------------------------------------------------------------
+      // heading styles
       style  = '<style>';
       style += '  .heading:after {';
       style += '    background: ' + bg_scrolled + ' !important;';
@@ -736,8 +698,7 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-      // Tag Cloud styles
-      // -----------------------------------------------------------------------
+      // cloud tag styles
       style  = '<style>';
       style += '  .tag-cloud ul li a {';
       style += '    background: ' + bg_scrolled + ' !important;';
@@ -745,8 +706,7 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-      // Toccer styles
-      // -----------------------------------------------------------------------
+      // toccer styles
       style  = '<style>';
       style += '  .is-active-link::before {';
       style += '    background-color: ' + bg_scrolled + ' !important;';
@@ -754,8 +714,7 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-      // BS extended Modal styles
-      // -----------------------------------------------------------------------
+      // extended modal styles
       style  = '<style>';
       style += '  .modal-dialog.modal-notify.modal-primary .modal-header {';
       style += '    background-color: ' + bg_scrolled + ' !important;';
@@ -763,8 +722,7 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-      // BS nav|pills styles
-      // -----------------------------------------------------------------------
+      // nav|pills styles
       style  = '<style>';
       style += '  .nav-pills .nav-link.active, .nav-pills .show > .nav-link  {';
       style += '    background-color: ' + bg_scrolled + ' !important;';
@@ -775,13 +733,11 @@ j1.adapter.navigator = (function (j1, window) {
       return true;
     }, // END applyThemeSettings
 
-
     // -------------------------------------------------------------------------
     // applyNavigatorSettings
     // Apply settings from configuration
     // -------------------------------------------------------------------------
-    applyNavigatorSettings: function (navDefaults, navBarOptions, navMenuOptions, navQuicklinksOptions) {
-
+    applyNavigatorSettings: (navDefaults, navBarOptions, navMenuOptions, navQuicklinksOptions) => {
       var logger              = log4javascript.getLogger('j1.adapter.navigator.applyThemeSettings');
       var gridBreakpoint_lg   = '992px';
       var gridBreakpoint_md   = '768px';
@@ -799,19 +755,16 @@ j1.adapter.navigator = (function (j1, window) {
 
       $('head').append(navbar_scrolled_style);
 
-      logger.info('\n' + 'set dynamic styles for the theme loaded');
+      logger.debug('\n' + 'set dynamic styles');
 
-      // Set|Resolve navMenuOptions
-      // ------------------------------------------------------------------------
+      // set|resolve navMenuOptions
       navMenuOptions.dropdown_font_size               = navMenuOptions.dropdown_font_size;
       navMenuOptions.megamenu_font_size               = navMenuOptions.megamenu_font_size;
 
-      // Set|Resolve navBarOptions
-      // -----------------------------------------------------------------------
+      // set|resolve navBarOptions
       navBarOptions.background_color_full             = navBarOptions.background_color_full;
 
-      // Set|Resolve navMenuOptions
-      // -----------------------------------------------------------------------
+      // set|resolve navMenuOptions
       navMenuOptions.menu_item_color                  = navMenuOptions.menu_item_color;
       navMenuOptions.menu_item_color_hover            = navMenuOptions.menu_item_color_hover;
       navMenuOptions.menu_item_dropdown_color         = navMenuOptions.menu_item_dropdown_color;
@@ -820,21 +773,18 @@ j1.adapter.navigator = (function (j1, window) {
       navMenuOptions.dropdown_background_color_active = navMenuOptions.dropdown_background_color_active;
       navMenuOptions.dropdown_border_color            = navMenuOptions.dropdown_border_color;
 
-      // Set|Resolve navQuicklinksOptions
-      // -----------------------------------------------------------------------
+      // set|resolve navQuicklinksOptions
       navQuicklinksOptions.icon_color                 = navQuicklinksOptions.icon_color;
       navQuicklinksOptions.icon_color_hover           = navQuicklinksOptions.icon_color_hover;
       navQuicklinksOptions.background_color           = navQuicklinksOptions.background_color;
 
-      // Set dymanic styles
-      // -----------------------------------------------------------------------
+      // set dymanic styles
       var style;
 
       // read current background colors
       var bg_primary    = $('#bg-primary').css('background-color');
       var bg_table      = $('body').css('background-color');
 
-
       // set navbar background colors
       var bg_scrolled   = bg_primary;
       var bg_collapsed  = bg_primary;
@@ -881,9 +831,7 @@ j1.adapter.navigator = (function (j1, window) {
       // jadams, 2023-02-26: navicon settings
       style  = '<style>';
       style += '  .nav-icon {';
-//    style += '    color: ' + navQuicklinksOptions.icon_color + ' !important;';
       style += '    color: ' + navQuicklinksOptions.icon_color + ';';
-      quicklinks
       style += '  }';
       style += '</style>';
       $('head').append(style);
@@ -891,13 +839,11 @@ j1.adapter.navigator = (function (j1, window) {
       // jadams, 2023-02-26: navicon settings
       style  = '<style>';
       style += '  .nav-icon:hover {';
-//    style += '    color: ' + navQuicklinksOptions.icon_color_hover + ' !important;';
       style += '    color: ' + navQuicklinksOptions.icon_color_hover + ';';
       style += '  }';
       style += '</style>';
       $('head').append(style);
 
-//    $('head').append('<style>.mdi-bg-primary {color: ' +bg_scrolled+ ';}</style>');
       style  = '<style>';
       style += '  var(--bg-primary) {';
       style += '    color: ' + bg_scrolled;
@@ -905,8 +851,7 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-      // Size of brand image
-//    $('head').append('<style>.navbar-brand > img { height: {{brand_image_height}}px !important; }</style>');
+      // size of brand image
       style  = '<style>';
       style += '  .navbar-brand > img {';
       style += '     height: {{brand_image_height}}px !important;';
@@ -914,8 +859,7 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-      // Navbar transparent-light (light)
-//    $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator.navbar-transparent.light { background-color: ' +navBarOptions.background_color_full+ ' !important; border-bottom: solid 0px !important; } }</style>');
+      // navbar transparent-light (light)
       style  = '<style>';
       style += '  @media screen and (min-width: ' + gridBreakpoint_lg + ') {';
       style += '    nav.navbar.navigator.navbar-transparent.light {';
@@ -926,7 +870,6 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-//    $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator.navbar-scrolled.light { background-color: ' +bg_scrolled+ ' !important; } }</style>');
       // style  = '<style>';
       // style += '  @media screen and (min-width: ' + gridBreakpoint_lg + ') {';
       // style += '    nav.navbar.navigator.navbar-scrolled.light {';
@@ -936,7 +879,6 @@ j1.adapter.navigator = (function (j1, window) {
       // style += '</style>';
       // $('head').append(style);
 
-//    $('head').append('<style id="dynNav">@media (max-width: ' +gridBreakpoint_md+ ') { nav.navbar.navigator.navbar-transparent.light { background-color: ' +navBarOptions.background_color_full+ ' !important; border-bottom: solid 0px !important; } }</style>');
       style  = '<style id="dynNav">';
       style += '  @media screen and (max-width: ' + gridBreakpoint_md + ') {';
       style += '    nav.navbar.navigator.navbar-transparent.light {';
@@ -947,7 +889,6 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-//    $('head').append('<style id="dynNav">@media (max-width: ' +gridBreakpoint_md+ ') { nav.navbar.navigator.navbar-scrolled.light { background-color: ' +bg_scrolled+ ' !important; } }</style>');
       // style  = '<style id="dynNav">';
       // style += '  @media screen and (max-width: ' + gridBreakpoint_md + ') {';
       // style += '    nav.navbar.navigator.navbar-scrolled.light {';
@@ -957,7 +898,6 @@ j1.adapter.navigator = (function (j1, window) {
       // style += '</style>';
       // $('head').append(style);
 
-//    $('head').append('<style id="dynNav">@media (min-width: ' +gridBreakpoint_md+ ') { nav.navbar.navigator.navbar-transparent.light { background-color: ' +navBarOptions.background_color_full+ ' !important; border-bottom: solid 0px !important; } }</style>');
       style  = '<style id="dynNav">';
       style += '  @media screen and (min-width: ' + gridBreakpoint_md + ') {';
       style += '    nav.navbar.navigator.navbar-transparent.light {';
@@ -968,7 +908,6 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-//   $('head').append('<style id="dynNav">@media (min-width: ' +gridBreakpoint_md+ ') { nav.navbar.navigator.navbar-scrolled.light { background-color: ' +bg_scrolled+ ' !important; } }</style>');
       // style  = '<style id="dynNav">';
       // style += '  @media screen and (min-width: ' + gridBreakpoint_md + ') {';
       // style += '    nav.navbar.navigator.navbar-scrolled.light {';
@@ -978,7 +917,6 @@ j1.adapter.navigator = (function (j1, window) {
       // style += '</style>';
       // $('head').append(style);
 
-//    $('head').append('<style id="dynNav">@media (max-width: ' +gridBreakpoint_sm+ ') { nav.navbar.navigator.navbar-transparent.light { background-color: ' +navBarOptions.background_color_full+ ' !important; border-bottom: solid 0px !important; } }</style>');
       style  = '<style id="dynNav">';
       style += '  @media screen and (max-width: ' + gridBreakpoint_sm + ') {';
       style += '    nav.navbar.navigator.navbar-transparent.light {';
@@ -989,7 +927,6 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-//    $('head').append('<style id="dynNav">@media (max-width: ' +gridBreakpoint_sm+ ') { nav.navbar.navigator.navbar-scrolled.light { background-color: ' +bg_scrolled+ ' !important; } }</style>');
       // style  = '<style id="dynNav">';
       // style += '  @media screen and (max-width: ' + gridBreakpoint_sm + ') {';
       // style += '    nav.navbar.navigator.navbar-scrolled.light {';
@@ -999,10 +936,7 @@ j1.adapter.navigator = (function (j1, window) {
       // style += '</style>';
       // $('head').append(style);
 
-
-      // navQuicklinks styles
-      // -----------------------------------------------------------------------
-//    $('head').append('<style>.quicklink-nav> ul > li > a { color: ' +navQuicklinksOptions.icon_color+ ' !important; }</style>');
+      // quick link styles
       style  = '<style>';
       style += '  .quicklink-nav> ul > li > a {';
       style += '    color: ' + navQuicklinksOptions.icon_color + ' !important;';
@@ -1010,7 +944,6 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-//    $('head').append('<style>.quicklink-nav> ul > li > a:hover { color: ' +navQuicklinksOptions.icon_color_hover+ ' !important; }</style>');
       style  = '<style>';
       style += '  .quicklink-nav> ul > li > a:hover {';
       style += '    color: ' + navQuicklinksOptions.icon_color_hover + ' !important;';
@@ -1018,11 +951,8 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-
-      // navMenu styles
+      // nav menu styles
       // -----------------------------------------------------------------------
-
-//    $('head').append('<style>.dropdown-menu > .active > a { background-color: transparent !important; }</style>');
       // Remove background for anchor
       style  = '<style>';
       style += '  .dropdown-menu > .active > a {';
@@ -1031,7 +961,6 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(style);
 
-//    $('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>');
       // hover menu-item|menu-sub-item
       style  = '<style>';
       style += '  @media screen and (min-width: ' + gridBreakpoint_lg + ') {';
@@ -1045,8 +974,7 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(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 1st dropdown item width
+      // limit 1st dropdown item width
       style  = '<style>';
       style += '  @media screen and (min-width: ' + gridBreakpoint_lg + ') {';
       style += '    nav.navbar.navigator ul.nav.navbar-right .dropdown-menu .dropdown-menu  {';
@@ -1056,8 +984,7 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(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>');
+      //  set dropdown item colors
       style  = '<style>';
       style += '  @media screen and (min-width: ' + gridBreakpoint_lg + ') {';
       style += '    nav.navbar.navigator ul.nav > li > a  {';
@@ -1066,7 +993,6 @@ j1.adapter.navigator = (function (j1, window) {
       style += '  }';
       style += '</style>';
 
-//    $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator ul.nav > li > a:hover { color: ' +navMenuOptions.menu_item_color_hover+ ' !important; } }</style>');
       style  = '<style>';
       style += '  @media screen and (min-width: ' + gridBreakpoint_lg + ') {';
       style += '    nav.navbar.navigator ul.nav > li > a:hover {';
@@ -1075,17 +1001,16 @@ j1.adapter.navigator = (function (j1, window) {
       style += '  }';
       style += '</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: #616161 !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>');
       // 1st level dropdown menu styles
       style  = '<style>';
       style += '  @media screen and (min-width: ' + gridBreakpoint_lg + ') {';
       style += '    nav.navbar.navigator li.dropdown ul.dropdown-menu {';
       style += '       max-height: ' + navMenuOptions.dropdown_menu_max_height + 'rem !important;';
       style += '       animation-duration: ' + navMenuOptions.dropdown_animate_duration + 's !important;';
-//    style += '       color: #616161 !important;';
       style += '       min-width: ' + navMenuOptions.dropdown_item_min_width + 'rem !important;';
       style += '       border-top: solid ' + navMenuOptions.dropdown_border_top + 'px !important;';
       style += '       border-radius: ' + navMenuOptions.dropdown_border_radius + 'px !important;';
+
       // jadams, 2023-12-22: overwrite "margin-top" default of dropdown-menu[data-bs-popper]
       style += '       margin-top: 0;';
       style += '       left: 0;';
@@ -1094,8 +1019,7 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</style>';
       $('head').append(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; } }</style>');
-      // Limit last (2nd) dropdown in height
+      // limit last (2nd) dropdown in height
       style  = '<style>';
       style += '  @media screen and (min-width: ' + gridBreakpoint_lg + ') {';
       style += '    nav.navbar.navigator li.dropdown ul.dropdown-menu ul.dropdown-menu  {';
@@ -1106,7 +1030,6 @@ j1.adapter.navigator = (function (j1, window) {
       style += '</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>');
       style  = '<style>';
       style += '  @media screen and (min-width: ' + gridBreakpoint_lg + ') {';
       style += '    nav.navbar.navigator li.dropdown ul.dropdown-menu {';
@@ -1117,7 +1040,6 @@ j1.adapter.navigator = (function (j1, window) {
       $('head').append(style);
       {% endif %}
 
-//    $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator li.dropdown ul.dropdown-menu > li > a { color: ' +navMenuOptions.dropdown_item_color+ ' !important; font-size: ' +navMenuOptions.dropdown_font_size+ ' !important; font-weight: 400; } }</style>');
       // configure dropdown_font_size|color
       // style  = '<style>';
       // style += '  @media screen and (min-width: ' + gridBreakpoint_lg + ') {';
@@ -1130,11 +1052,9 @@ j1.adapter.navigator = (function (j1, window) {
       // style += '</style>';
       // $('head').append(style);
 
-//    $('head').append('<style>@media (min-width: ' +gridBreakpoint_lg+ ') { nav.navbar.navigator ul.dropdown-menu.megamenu-content .content ul.menu-col li a { color: ' +navMenuOptions.dropdown_item_color+ ' !important; font-size: ' +navMenuOptions.megamenu_font_size+ ' !important; font-weight: 400; } }</style>');
       style  = '<style>';
       style += '  @media screen and (min-width: ' + gridBreakpoint_lg + ') {';
       style += '    nav.navbar.navigator ul.dropdown-menu.megamenu-content .content ul.menu-col li a {';
-//    style += '       color: ' + navMenuOptions.dropdown_item_color + ' !important;';
       style += '       font-size: ' + navMenuOptions.megamenu_font_size + ' !important;';
       style += '       font-weight: 400;';
       style += '    }';
@@ -1155,45 +1075,60 @@ j1.adapter.navigator = (function (j1, window) {
     }, // END applyThemeSettings
 
     // -------------------------------------------------------------------------
-    // messageHandler
-    // Manage messages (paylods) send from other J1 modules
+    // messageHandler()
+    // manage messages send from other J1 modules
     // -------------------------------------------------------------------------
-    messageHandler: function (sender, message) {
-      // var json_message = JSON.stringify(message, undefined, 2);              // multiline
-      var json_message = JSON.stringify(message);
-      _this.setState(message.action);
+    messageHandler: (sender, message) => {
+      var json_message = JSON.stringify(message, undefined, 2);
 
       logText = '\n' + 'received message from ' + sender + ': ' + json_message;
-      logger.info(logText);
-
-      logText = '\n' + 'set state to: ' + message.action;
-      logger.info(logText);
+      logger.debug(logText);
 
       // -----------------------------------------------------------------------
-      //  Process commands|actions
+      //  process commands|actions
       // -----------------------------------------------------------------------
-      if (message.type === 'command' && message.action === 'module_initialized') {
-        //
-        // Place handling of command|action here
-        //
-        logger.info('\n' + message.text);
-      }
-      if (message.type === 'command' && message.action === 'status') {
-        logger.info('\n' + 'messageHandler: received - ' + message.action);
-      }
+      if (sender === 'j1.navigator.core') {
 
-      //
-      // Place handling of other command|action here
-      //
+        if (message.type === 'state' && message.action === 'core_initialized') {
+          navigatorCoreInitialized = true;
+          logger.info('\n' + message.text);
+        }
+      } // END if sender j1.navigator.core
+
+      if (sender === 'ThemeSwitcher') {
+        switcher      = (message.action.includes("desktop")) ? 'desktop'  : 'mobile';
+        switcher_menu = (message.text.includes("local_themes")) ? 'local' : 'remote';
+
+        if (switcher === 'desktop') {
+          if (switcher_menu === 'local') {
+            desktopThemesLocalLoaded  = true;
+          } else {
+            desktopThemesRemoteLoaded = true;
+          }
+        } // END if switcher desktop
+
+        if (switcher === 'mobile') {
+          if (switcher_menu === 'local') {
+            mobileThemesLocalLoaded  = true;
+          } else {
+            mobileThemesRemoteLoaded = true;
+          }
+        } // END if switcher mobile
+
+        if (message.type === 'state' && message.action === 'desktop') {
+          navigatorCoreInitialized = true;
+          logger.info('\n' + message.text);
+        }
+      } // END if sender j1.themes.switcher
 
       return true;
     }, // END messageHandler
 
     // -------------------------------------------------------------------------
     // setState()
-    // Sets the current (processing) state of the module
+    // sets the current (processing) state of the module
     // -------------------------------------------------------------------------
-    setState: function (stat) {
+    setState: (stat) => {
       _this.state = stat;
     }, // END setState
 
@@ -1201,11 +1136,11 @@ j1.adapter.navigator = (function (j1, window) {
     // getState()
     // Returns the current (processing) state of the module
     // -------------------------------------------------------------------------
-    getState: function () {
+    getState: () => {
       return _this.state;
     } // END getState
 
-  }; // END return
+  }; // END main (return)
 })(j1, window);
 
 {% endcapture %}