j1-template 2024.1.5 → 2024.2.0

data/assets/themes/j1/adapter/js/{themer.js → themes.js}

@@ -6,7 +6,7 @@ regenerate:                             true
 
 {% comment %}
  # -----------------------------------------------------------------------------
- # ~/assets/themes/j1/adapter/js/themer.js
+ # ~/assets/themes/j1/adapter/js/themes.js
  # Liquid template to adapt theme functions
  #
  # Product/Info:
@@ -43,14 +43,14 @@ regenerate:                             true
 
 {% comment %} Set config data
 -------------------------------------------------------------------------------- {% endcomment %}
-{% 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 footer_defaults   = blocks.defaults.footer.defaults %}
 {% assign footer_settings   = blocks.footer.settings %}
 
 {% comment %} Set config options
 -------------------------------------------------------------------------------- {% endcomment %}
-{% assign themer_options    = themer_defaults| merge: themer_settings %}
+{% assign themes_options    = themes_defaults| merge: themes_settings %}
 {% assign footer_options    = footer_defaults | merge: footer_settings %}
 {% assign footer            = 'active_footer' %}
 {% assign footer_id         = footer_options.active_footer %}
@@ -74,20 +74,20 @@ regenerate:                             true
 
 /*
  # -----------------------------------------------------------------------------
- # ~/assets/themes/j1/adapter/js/themer.js
- # JS Adapter for J1 themer (bootstrapThemeSwitcher)
+ # ~/assets/themes/j1/adapter/js/themes.js
+ # JS Adapter for J1 themes (ThemeSwitcher)
  #
  # Product/Info:
  # https://jekyll.one
- # https://github.com/jguadagno/bootstrapThemeSwitcher
+ # https://github.com/jguadagno/ThemeSwitcher
  #
  # Copyright (C) 2023, 2024 Juergen Adams
  # Copyright (C) 2014 Joseph Guadagno
  #
  # J1 Template is licensed under the MIT License.
  # For details, see: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE.md
- # bootstrapThemeSwitcher is licensed under the MIT License.
- # For details, see https://github.com/jguadagno/bootstrapThemeSwitcher/blob/master/LICENSE
+ # ThemeSwitcher is licensed under the MIT License.
+ # For details, see https://github.com/jguadagno/ThemeSwitcher/blob/master/LICENSE
  # -----------------------------------------------------------------------------
  # NOTE:
  #  Setup of theme loaders for local_themes|remote_themes moved
@@ -105,11 +105,10 @@ regenerate:                             true
 // -----------------------------------------------------------------------------
 
 'use strict';
-j1.adapter.themer = (function (j1, window) {
+j1.adapter.themes = (function (j1, window) {
 
-  // ---------------------------------------------------------------------------
-  // globals
-  // ---------------------------------------------------------------------------
+  {% comment %} Set global variables
+  ------------------------------------------------------------------------------ {% endcomment %}
   var environment               = '{{environment}}';
   var development               = (environment.includes('dev') ? true : false);
   var url                       = new liteURL(window.location.href);
@@ -117,7 +116,7 @@ j1.adapter.themer = (function (j1, window) {
   var user_state                = {};
   var user_consent              = {};
   var cookie_names              = j1.getCookieNames();
-  var user_state_detected       = false;
+//var user_state_detected       = false;
   var styleLoaded               = false;
   var id                        = 'default';
   var state                     = 'not_started';
@@ -128,15 +127,13 @@ j1.adapter.themer = (function (j1, window) {
   var default_theme_css_name    = default_theme_name.toLowerCase();
   var default_theme_css         = '{{asset_path}}/{{theme_base}}/' + default_theme_css_name + '/bootstrap' + cssExtension;
   var interval_count            = 0;
+
   var user_state_cookie;
   var theme_css_html;
-  var _this;
-  var logger;
-  var logText;
   var cookie_written;
-  var themerDefaults;
-  var themerSettings;
-  var themerOptions;
+  var themesDefaults;
+  var themesSettings;
+  var themesOptions;
   var max_count;
   var j1Cookies;
   var gaCookies;
@@ -144,6 +141,17 @@ j1.adapter.themer = (function (j1, window) {
   var baseUrl;
   var error_page;
 
+  var _this;
+  var logger;
+  var logText;
+
+  // date|time
+  var startTime;
+  var endTime;
+  var startTimeModule;
+  var endTimeModule;
+  var timeSeconds;
+
   // ---------------------------------------------------------------------------
   // helper functions
   // ---------------------------------------------------------------------------
@@ -152,7 +160,7 @@ j1.adapter.themer = (function (j1, window) {
     var sheets = document.styleSheets, stylesheet = sheets[(sheets.length - 1)];
 
     // find CSS file 'styleSheetName' in document
-    for(var i in document.styleSheets) {
+    for (var i in document.styleSheets) {
       if(sheets[i].href && sheets[i].href.indexOf(styleSheet) > -1) {
         return true;
       }
@@ -163,8 +171,8 @@ j1.adapter.themer = (function (j1, window) {
   // see: https://stackoverflow.com/questions/4301968/checking-a-url-in-jquery-javascript
   // see: https://stackoverflow.com/questions/16481598/prevent-unhandled-jquery-ajax-error
   //
-  var urlExists = function(url, callback) {
-      if ( ! $.isFunction(callback)) {
+  var urlExists = function (url, callback) {
+      if ( ! $.isFunction (callback)) {
          throw Error('Not a valid callback');
       }
 
@@ -189,40 +197,35 @@ j1.adapter.themer = (function (j1, window) {
       // Default module settings
       // -----------------------------------------------------------------------
       var settings = $.extend({
-        module_name: 'j1.adapter.themer',
+        module_name: 'j1.adapter.themes',
         generated:   '{{site.time}}'
       }, options);
 
       // -----------------------------------------------------------------------
       // Global variable settings
       // -----------------------------------------------------------------------
-      _this       = j1.adapter.themer;
-      logger      = log4javascript.getLogger('j1.adapter.themer');
+      _this           = j1.adapter.themes;
+      logger          = log4javascript.getLogger('j1.adapter.themes');
 
       // Load  module DEFAULTS|CONFIG
-      themerDefaults = $.extend({}, {{themer_defaults | replace: 'nil', 'null' | replace: '=>', ':' }});
-      themerSettings = $.extend({}, {{themer_settings | replace: 'nil', 'null' | replace: '=>', ':' }});
-      themerOptions  = $.extend(true, {}, themerDefaults, themerSettings);
-
-      max_count   = themerOptions.retries;
-      url         = new liteURL(window.location.href);
-      baseUrl     = url.origin;
-      error_page  = url.origin + '/204.html';
-      j1Cookies   = j1.findCookie('j1');
-      gaCookies   = j1.findCookie('__g');
+      themesDefaults  = $.extend({}, {{themes_defaults | replace: 'nil', 'null' | replace: '=>', ':' }});
+      themesSettings  = $.extend({}, {{themes_settings | replace: 'nil', 'null' | replace: '=>', ':' }});
+      themesOptions   = $.extend(true, {}, themesDefaults, themesSettings);
 
-      // initialize state flag
-      _this.state = 'started';
-      logger.debug('\n' + 'state: ' + _this.getState());
+      max_count       = themesOptions.retries;
+      url             = new liteURL(window.location.href);
+      baseUrl         = url.origin;
+      error_page      = url.origin + '/204.html';
+      j1Cookies       = j1.findCookie('j1');
+      gaCookies       = j1.findCookie('__g');
 
-      // hide page until 'theme' is loaded
-      $('#no_flicker').hide();
 
       // jadams, 2023-06-10: Added to optimze 'CLS' of a page load.
       // Find conterpart (show) in the j1.adapter
       // hide content|footer until 'page' is loaded
-      $('#content').hide();
-      $('.{{footer}}').hide();
+      //
+      // $('#content').hide();
+      // $('.{{footer}}').hide();
 
       // jadams, 2021-07-25: problem seems NOT an timing issue on the iPad
       // platform. (General) Dependency should be REMOVED!!!
@@ -230,70 +233,91 @@ j1.adapter.themer = (function (j1, window) {
       //
       // jadams, 2021-07-11: added dependecy on the user state cookie
       // Found timing issues testing mobile devices (iPad)
-      var dependencies_met_user_state_available = setInterval (function () {
-        user_state_detected = j1.existsCookie(cookie_names.user_state);
+      //
+
+      // -----------------------------------------------------------------------
+      // module initializer
+      // -----------------------------------------------------------------------
+      var dependencies_met_page_ready = setInterval (() => {
+        var pageState           = $('#content').css("display");
+//      var pageState           = $('#no_flicker').css("display");
+        var pageVisible         = (pageState === 'block') ? true : false;
+        var j1CoreFinished      = (j1.getState() === 'finished') ? true : false;
+        var atticFinished       = (j1.adapter.attic.getState() === 'finished') ? true: false;
+//      var userStateDetected   = j1.existsCookie(cookie_names.user_state);
 
         // counter how often the check should be done for the existence
         // of the user state cookie
-        interval_count += 1;
-        if (user_state_detected) {
-           user_state   = j1.readCookie(cookie_names.user_state);
-           user_consent = j1.readCookie(cookie_names.user_consent);
-
-           logger.debug('\n' + 'cookie ' +  cookie_names.user_state + ' successfully loaded after: ' + interval_count * 25 + ' ms');
-
-           // initial theme data
-           if (user_state.theme_css === '') {
-             user_state.theme_name       = default_theme_name;
-             user_state.theme_css        = default_theme_css;
-             user_state.theme_author     = default_theme_author;
-             user_state.theme_author_url = default_theme_author_url;
-
-             cookie_written = j1.writeCookie({
-               name:     cookie_names.user_state,
-               data:     user_state,
-               secure:   secure,
-               expires:  365
-             });
-
-             if (!cookie_written) {
-               logger.error('\n' + 'failed to write cookie: ' + cookie_names.user_consent);
-             }
-           }
+        // interval_count += 1;
 
-           // set the theme switcher state
-           user_state.theme_switcher = themerOptions.enabled;
-           if (themerOptions.enabled) {
+        if (pageVisible && j1CoreFinished) {
+          startTimeModule = Date.now();
+
+          user_state   = j1.readCookie(cookie_names.user_state);
+          user_consent = j1.readCookie(cookie_names.user_consent);
+
+          _this.setState('started');
+          logger.debug('\n' + 'state: ' + _this.getState());
+          logger.info('\n' + 'module is being initialized');
+
+          // hide page until 'theme' is loaded
+          logger.info('\n' + 'hide page until theme is loaded');
+          $('#no_flicker').hide();
+
+          // logger.info('\n' + 'cookie ' +  cookie_names.user_state + ' successfully loaded after: ' + interval_count * 25 + ' ms');
+
+          // initial theme data
+          if (user_state.theme_css === '') {
+            user_state.theme_name       = default_theme_name;
+            user_state.theme_css        = default_theme_css;
+            user_state.theme_author     = default_theme_author;
+            user_state.theme_author_url = default_theme_author_url;
+
+            cookie_written = j1.writeCookie({
+              name:     cookie_names.user_state,
+              data:     user_state,
+              secure:   secure,
+              expires:  365
+            });
+
+            if (!cookie_written) {
+             logger.error('\n' + 'failed to write cookie: ' + cookie_names.user_consent);
+            }
+          } // END if user_state theme_css === ''
+
+          // set the theme switcher state
+          user_state.theme_switcher = themesOptions.enabled;
+          if (themesOptions.enabled) {
              // enable BS ThemeSwitcher
-             logger.info('\n' + 'themes detected as: ' + themerOptions.enabled);
+             logger.info('\n' + 'themes detected as: ' + themesOptions.enabled);
              logger.info('\n' + 'remote themes are being initialized');
 
              /* eslint-disable */
              // load list of remote themes
-             $('#remote_themes').bootstrapThemeSwitcher.defaults = {
-               debug:                    themerOptions.debug,
-               saveToCookie:             themerOptions.saveToCookie,
-               cssThemeLink:             themerOptions.cssThemeLink,
-               cookieThemeName:          themerOptions.cookieThemeName,
-               cookieDefaultThemeName:   themerOptions.cookieDefaultThemeName,
-               cookieThemeCss:           themerOptions.cookieThemeCss,
-               cookieThemeExtensionCss:  themerOptions.cookieThemeExtensionCss,
-               cookieExpiration:         themerOptions.cookieExpiration,
-               cookiePath:               themerOptions.cookiePath,
-               defaultCssFile:           themerOptions.defaultCssFile,
-               bootswatchApiUrl:         themerOptions.bootswatchApiUrl,
-               bootswatchApiVersion:     themerOptions.bootswatchApiVersion,
-               loadFromBootswatch:       themerOptions.loadFromBootswatch,
-               localFeed:                themerOptions.localThemes,
-               excludeBootswatch:        themerOptions.excludeBootswatch,
-               includeBootswatch:        themerOptions.includeBootswatch,
-               skipIncludeBootswatch:    themerOptions.skipIncludeBootswatch
+             $('#remote_themes').ThemeSwitcher.defaults = {
+               debug:                    themesOptions.debug,
+               saveToCookie:             themesOptions.saveToCookie,
+               cssThemeLink:             themesOptions.cssThemeLink,
+               cookieThemeName:          themesOptions.cookieThemeName,
+               cookieDefaultThemeName:   themesOptions.cookieDefaultThemeName,
+               cookieThemeCss:           themesOptions.cookieThemeCss,
+               cookieThemeExtensionCss:  themesOptions.cookieThemeExtensionCss,
+               cookieExpiration:         themesOptions.cookieExpiration,
+               cookiePath:               themesOptions.cookiePath,
+               defaultCssFile:           themesOptions.defaultCssFile,
+               bootswatchApiUrl:         themesOptions.bootswatchApiUrl,
+               bootswatchApiVersion:     themesOptions.bootswatchApiVersion,
+               loadFromBootswatch:       themesOptions.loadFromBootswatch,
+               localFeed:                themesOptions.localThemes,
+               excludeBootswatch:        themesOptions.excludeBootswatch,
+               includeBootswatch:        themesOptions.includeBootswatch,
+               skipIncludeBootswatch:    themesOptions.skipIncludeBootswatch
              };
              /* eslint-enable */
            } else {
              logger.debug('\n' + 'themes detected as: disabled');
              logger.debug('\n' + 'no remote themes are available');
-          }
+          } // END if themesOptions enabled
 
           // validate theme to be loaded
           urlExists(user_state.theme_css, function(success) {
@@ -340,62 +364,70 @@ j1.adapter.themer = (function (j1, window) {
                location.reload(true);
              }
            });
-          clearInterval(dependencies_met_user_state_available);
+
+          clearInterval(dependencies_met_page_ready);
         }
-      }, 10); // END dependencies_met_user_state_available
+      }, 10); // END dependencies_met_page_ready
 
       // set final module state if theme loaded
-      var dependencies_met_theme_applied = setInterval (function () {
+      var dependencies_met_theme_applied = setInterval (() => {
         user_state  = j1.readCookie(cookie_names.user_state);
         styleLoaded = styleSheetLoaded(user_state.theme_css);
 
         if (styleLoaded) {
           // show page (theme is loaded)
-          $('#no_flicker').show();
-
           logger.info('\n' + 'theme loaded successfully: ' + user_state.theme_name);
           logger.debug('\n' + 'theme CSS loaded: ' + user_state.theme_css);
+          logger.info('\n' + 'show page on theme loaded');
+          $('#no_flicker').show();
 
           _this.setState('finished');
-
           logger.debug('\n' + 'state: ' + _this.getState());
-          logger.info('\n' + 'module initialized successfully');
+          logger.info('\n' + 'initializing module finished');
 
-          clearInterval(dependencies_met_theme_applied);
-        }
+          endTimeModule = Date.now();
+          logger.info('\n' + 'module initializing time: ' + (endTimeModule-startTimeModule) + 'ms');
 
+          clearInterval(dependencies_met_theme_applied);
+        } // ENF if styleLoaded
       }, 10); // END dependencies_met_theme_applied
 
     }, // END init
 
     // -------------------------------------------------------------------------
-    // messageHandler
-    // Manage messages send from other J1 modules
+    // messageHandler()
+    // manage messages send from other J1 modules
     // -------------------------------------------------------------------------
-    messageHandler: function (sender, message) {
+    messageHandler: (sender, message) => {
       var json_message = JSON.stringify(message, undefined, 2);
 
       logText = '\n' + 'received message from ' + sender + ': ' + json_message;
-      logger.info(logText);
+      logger.debug(logText);
 
       // -----------------------------------------------------------------------
-      //  Process commands|actions
+      //  process commands|actions
       // -----------------------------------------------------------------------
       if (message.type === 'command' && message.action === 'module_initialized') {
-        logger.info('\n' + message.text);
 
         //
-        // Place handling of other command|action here
+        // place handling of command|action here
         //
 
+        logger.info('\n' + message.text);
       }
+
+      //
+      // place handling of other command|action here
+      //
+
+      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
 
@@ -403,11 +435,11 @@ j1.adapter.themer = (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 %}