j1-template 2020.0.12 → 2020.0.17

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

@@ -41,15 +41,12 @@ regenerate: true
 
 {% comment %} Set config files
 -------------------------------------------------------------------------------- {% endcomment %}
-{% assign site_config             = site %}
 {% assign template_config         = site.data.template_settings %}
 {% assign blocks                  = site.data.blocks %}
 {% assign modules                 = site.data.modules %}
 
 {% comment %} Set config data
 -------------------------------------------------------------------------------- {% endcomment %}
-{% assign environment             = site_config.environment %}
-
 {% assign banner_config_defaults  = blocks.defaults.banner.defaults %}
 {% assign banner_config_settings  = blocks.banner.settings %}
 {% assign panel_config_defaults   = blocks.defaults.panel.defaults %}
@@ -239,11 +236,16 @@ var j1 = (function () {
       // global var (function)
       // -----------------------------------------------------------------------
       var logger        = log4javascript.getLogger('j1.init');
-      var url           = new parseURL(window.location.href);
+      var url           = new liteURL(window.location.href);
       var baseUrl       = url.origin;
-      var epoch         = Math.floor(Date.now()/1000);
-      var timestamp_now = moment.unix(epoch).format('YYYY-MM-DD HH:mm:ss');
+//    var epoch         = Math.floor(Date.now()/1000);
+//    var timestamp_now = moment.unix(epoch).format('YYYY-MM-DD HH:mm:ss');
+      var date          = new Date();
+      var timestamp_now = date.toISOString();
       var curr_state    = 'started';
+      // var date          = new Date();
+      // var my_timestamp  = date.toISOString();
+
 
       // -----------------------------------------------------------------------
       // options loader
@@ -256,6 +258,13 @@ var j1 = (function () {
         options
       );
 
+      // -----------------------------------------------------------------------
+      // status settings
+      // save status into the adapter object for (later) global access
+      // -----------------------------------------------------------------------
+      j1['xhrDataState'] = {};
+      j1['xhrDOMState']  = {};
+
       // -----------------------------------------------------------------------
       // session ON_CLOSE event
       // wrapup if ALL browser windows get closed. Update user STATE
@@ -266,8 +275,10 @@ var j1 = (function () {
         var cookie_names              = j1.getCookieNames();
         var cookie_user_state_name    = cookie_names.user_state;
         var cookie_user_session_name  = cookie_names.user_session;
-        var epoch                     = Math.floor(Date.now()/1000);
-        var timestamp_now             = moment.unix(epoch).format('YYYY-MM-DD HH:mm:ss');
+//      var epoch                     = Math.floor(Date.now()/1000);
+//      var timestamp_now             = moment.unix(epoch).format('YYYY-MM-DD HH:mm:ss');
+        var date                      = new Date();
+        var timestamp_now             = date.toISOString();
         var user_state                = j1.readCookie(cookie_user_state_name);
         var ep_status;
         var url;
@@ -315,7 +326,7 @@ var j1 = (function () {
       // -----------------------------------------------------------------------
       // if (user_session.mode === 'na' || user_session.mode === 'app') {
       if (user_session.mode === 'na') {
-        var url           = new parseURL(window.location.href);
+        var url           = new liteURL(window.location.href);
         var ep_status     = baseUrl + '/status' + '?page=' + window.location.pathname;
         var detectTimeout =  50;
 
@@ -342,6 +353,31 @@ var j1 = (function () {
           });
           j1.setState(curr_state);
           logger.info('state: ' + j1.getState());
+
+
+
+
+          var dependencies_met_page_displayed = setInterval (function () {
+            if (j1.getState() == 'finished') {
+              if (j1.authEnabled()) {
+                if (user_session.authenticated === 'true') {
+                  // set signout
+                  logger.info('show signout icon');
+                  $('#navLinkSignInOut').attr('data-target','#modalOmniSignOut');
+                  $('#iconSignInOut').removeClass('mdi-login').addClass('mdi-logout');
+                } else {
+                  // set signin
+                  logger.info('show signin icon');
+                  $('#navLinkSignInOut').attr('data-target','#modalOmniSignIn');
+                  $('#iconSignInOut').removeClass('mdi-logout').addClass('mdi-login');
+                }
+                logger.info('authentication detected as: ' + user_session.authenticated);
+                $('#quickLinksSignInOutButton').css('display', 'block');
+                logger.info('met dependencies for: j1');
+                clearInterval(dependencies_met_page_displayed);
+              }
+            }
+          }, 25); // END dependencies_met_page_displayed
         })
         .catch(function(error) {
           // jadams, 2018-08-31: Why a hell a setTimeout is needed ???
@@ -362,12 +398,16 @@ var j1 = (function () {
             logger.info('state: ' + j1.getState());
           }, detectTimeout);
         });
-      } else {
+      } else { // app mode
         state = 'started';
         logger.info('state: ' + state);
         logger.info('page is being initialized');
       }
 
+      // jadams: for testing only
+      // display page
+      // $('#no_flicker').css('display', 'block');
+
       state = 'started';
       logger.info('state: ' + state);
       logger.info('page is being initialized');
@@ -390,7 +430,7 @@ var j1 = (function () {
       // see: https://developer.mozilla.org/de/docs/Web/API/Window/history
       //
       user_session.timestamp      = timestamp_now;
-      referrer                    = new parseURL(document.referrer);
+      referrer                    = new liteURL(document.referrer);
       current_page                = window.location.pathname;
       user_session.requested_page = current_page;
       user_session.previous_page  = referrer.search === '' ?
@@ -408,17 +448,17 @@ var j1 = (function () {
         last_pager                = user_session.last_pager;
       }
 
+      // jadams: for testing only
+      // display page
+      //$('#no_flicker').css('display', 'block');
+
       logger.info('update user session cookie');
       j1.writeCookie({
         name: cookie_names.user_session,
         data: user_session
       });
 
-      {% comment %} Deferred data loads
-      See: https://stackoverflow.com/questions/3709597/wait-until-all-jquery-ajax-requests-are-done
-      Load J1 Template data objects 'asychronously'
-      -------------------------------------------------------------------------- {% endcomment %}
-      // initialize page resources for global modules
+      // initialize page resources for blocks
       // (asynchronous, should be rewitten to xhrData)
       j1.initBanner(settings);
       j1.initPanel(settings);
@@ -449,10 +489,11 @@ var j1 = (function () {
     // AJAX fetcher to load and place all banner used for a page
     // -------------------------------------------------------------------------
     initBanner: function (options) {
-      var logger        = log4javascript.getLogger('j1.initBanner');
-      var banner        = [];
-      var bannerOptions = [];
-      var mod           = 'j1';
+      var logger            = log4javascript.getLogger('j1.initBanner');
+      var banner            = [];
+      var bannerOptions     = [];
+      var mod               = 'j1';
+      var logText;
 
       {% comment %}
       Closure to pass additional data (e.g. #banner_id) to AJAX load callback
@@ -461,12 +502,19 @@ var j1 = (function () {
       var cb_load_closure = function(banner_id) {
         return function ( responseTxt, statusTxt, xhr ) {
           if ( statusTxt ==  'success' ) {
+            var logger = log4javascript.getLogger('j1.xhrData');
             logText = 'loading banner completed on id: ' +banner_id;
+            $(banner_id).addClass("mutated");
             logger.info(logText);
+            j1.setXhrDataState(banner_id, statusTxt);
+            j1.setXhrDomState(banner_id, statusTxt);
+            logger.info('XHR data loaded in the DOM: ' + banner_id);
           }
           if ( statusTxt == 'error' ) {
             logText = 'loading banner failed on id: ' +banner_id+ ', error: ' + xhr.status + ': ' + xhr.statusText;
             logger.error(logText);
+            j1.setXhrDataState(banner_id, statusTxt);
+            j1.setXhrDomState(banner_id, statusTxt);
             // Set|Log status
             state = 'failed';
             logger.error('state: ' + state);
@@ -533,14 +581,14 @@ var j1 = (function () {
             logText = 'loading banner on id: ' +banner[i];
             logger.info(logText);
             var banner_data_path = '{{banner_data_path}} ' + id + ' > *';
-            selector.load( banner_data_path, cb_load_closure( id ) );
+            selector.load(banner_data_path, cb_load_closure(id));
           }
-        }
+        } // END for
       }  else {
         logText = 'no banner found in site';
         logger.info(logText);
+        return false;
       }
-
       return true;
     }, // END initBanner
 
@@ -550,22 +598,34 @@ var j1 = (function () {
     // -------------------------------------------------------------------------
     // ToDo:
     initPanel: function ( options ) {
-      var logger  = log4javascript.getLogger('j1.initPanel');
-      var panel   = [];
-      var mod     = 'j1';
+      var logger            = log4javascript.getLogger('j1.initPanel');
+      var panel             = [];
+      var mod               = 'j1';
+      var logText;
 
       {% comment %} Closure to pass additional data (e.g. panel_id) to AJAX load callback
       See: http://stackoverflow.com/questions/939032/jquery-pass-more-parameters-into-callback
       -------------------------------------------------------------------------- {% endcomment %}
+
+      {% comment %} NOTE
+      strategy for MutationObserver callbacks to monitor DOM changes
+      needs to be checked if multiple containers are chenaged in a row
+      -------------------------------------------------------------------------- {% endcomment %}
       var cb_load_closure = function(panel_id) {
         return function ( responseTxt, statusTxt, xhr ) {
+          var logger = log4javascript.getLogger('j1.xhrData');
           if ( statusTxt == 'success' ) {
             logText = 'loading panel completed on id: ' +panel_id;
             logger.info(logText);
+            j1.setXhrDataState(panel_id, statusTxt);
+            j1.setXhrDomState(panel_id, statusTxt);
+            logger.info('XHR data loaded in the DOM: ' + panel_id);
           }
           if ( statusTxt == 'error' ) {
             logText = 'loading panel failed on id: ' +panel_id+ ', error ' + xhr.status + ': ' + xhr.statusText;
             logger.error(logText);
+            j1.setXhrDataState(panel_id, statusTxt);
+            j1.setXhrDomState(panel_id, statusTxt);
             // Set|Log status
             state = 'Error';
             logger.error('state: ' + state);
@@ -616,7 +676,7 @@ var j1 = (function () {
         {% endfor %}  {% comment %} END panel_config {% endcomment %}
       {% endfor %}  {% comment %} END panel_config_settings {% endcomment %}
 
-      if ( panel.length ) {
+      if (panel.length) {
         for (var i in panel) {
           var id = '#' + panel[i];
           var selector = $(id);
@@ -624,14 +684,14 @@ var j1 = (function () {
             logText = 'loading panel on id: ' +panel[i];
             logger.info(logText);
             var panel_data_path = '{{panel_data_path}} ' + id + ' > *';
-            selector.load( panel_data_path, cb_load_closure( id ) );
+            selector.load(panel_data_path, cb_load_closure(id));
           }
-        }
+        } // END for
       } else {
         logText = 'no panel found in site';
         logger.info(logText);
+        return false;
       }
-
       return true;
     }, // END initPanel
 
@@ -640,21 +700,28 @@ var j1 = (function () {
     // AJAX fetcher to load and place the footer used for a page
     // -------------------------------------------------------------------------
     initFooter: function ( options ) {
-      var logger = log4javascript.getLogger('j1.initFooter');
-      var mod    = 'j1';
+      var logger            = log4javascript.getLogger('j1.initFooter');
+      var mod               = 'j1';
+      var logText;
 
-      logText = 'initialization started';
+      logText = 'loading footer started';
       logger.info(logText);
 
       var cb_load_closure = function(footer_id) {
         return function ( responseTxt, statusTxt, xhr ) {
+          var logger = log4javascript.getLogger('j1.xhrData');
           if ( statusTxt ==  'success' ) {
             logText = 'footer loaded successfully on id: ' + footer_id;
             logger.info(logText);
+            $(footer_id).addClass("mutated");
+            j1.setXhrDataState(footer_id, statusTxt);
+            j1.setXhrDomState(footer_id, statusTxt);
+            logger.info('XHR data loaded in the DOM: ' + footer_id);
 
-            state = 'footer_loaded';
-            logger.info('set state for module ' + mod + ': ' + state);
-            executeFunctionByName(mod + '.setState', window, state);
+            // jadams, 2020-07-21: intermediate state DISABLED
+            // state = 'footer_loaded';
+            // logger.info('set state for module ' + mod + ': ' + state);
+            // executeFunctionByName(mod + '.setState', window, state);
 
             logText = 'initialization finished';
             logger.info(logText);
@@ -662,6 +729,9 @@ var j1 = (function () {
           if ( statusTxt == 'error' ) {
             logText = 'loading footer failed on id: ' +footer_id+ ', error ' + xhr.status + ': ' + xhr.statusText;
             logger.error(logText);
+            j1.setXhrDataState(footer_id, statusTxt);
+            j1.setXhrDomState(footer_id, statusTxt);
+
             // Set|Log status
             state = 'failed';
             logger.error('state: ' + state);
@@ -675,10 +745,14 @@ var j1 = (function () {
       var selector = $(id);
       if ( selector.length ) {
         var footer_data_path = '{{footer_data_path}}';
-        // var footer_data_path = '{{footer_data_path}}' + id + ' > *';
-        selector.load( footer_data_path, cb_load_closure( id ) );
+        selector.load(footer_data_path, cb_load_closure(id));
+      } else {
+        logText = 'data not loaded';
+        logger.warn(logText);
+        j1.setXhrDataState(id, 'not loaded');
+        j1.setXhrDomState(id, 'pending');
+        return false;
       }
-
       return true;
     }, // END initFooter
 
@@ -695,12 +769,12 @@ var j1 = (function () {
     displayPage: function (options) {
       var logger              = log4javascript.getLogger('j1.displayPage');
       var flickerTimeout      = {{template_config.flicker_timeout}};
-      var url                 = new parseURL(window.location.href);
+      var url                 = new liteURL(window.location.href);
       var baseUrl             = url.origin;
       var ep_status           = baseUrl + '/status' + '?page=' + window.location.pathname;
       var user_session        = j1.readCookie(cookie_names.user_session);
       var user_state          = j1.readCookie(cookie_names.user_state);
-      var current_url         = new parseURL(window.location.href);
+      var current_url         = new liteURL(window.location.href);
       var providerPermissions = {};
       var provider;
       var previous_page;
@@ -710,8 +784,10 @@ var j1 = (function () {
       logger.info('finalize page');
       j1.setCss();
 
-      if (j1.appDetected()) {
-        // APP mode
+      logText= 'loading page partials: started';
+      logger.info(logText);
+
+      if (j1.appDetected()) { // app mode
         logger.info('mode detected: app');
 
         $.when ($.ajax(ep_status))
@@ -735,8 +811,8 @@ var j1 = (function () {
           if (
             j1.authEnabled() &&
             user_session.page_permission !== 'public' &&
-            categoryAllowed === false)
-          {
+            categoryAllowed === false
+          ){
             // redirect to middleware|page_authentication
             if (data.authenticated === 'true') {
               var ep_post_authentication = baseUrl + '/post_authentication';
@@ -753,19 +829,16 @@ var j1 = (function () {
             // display page
             $('#no_flicker').css('display', 'block');
 
-            // bind MDB services to current page
-            j1.initMDB();
-
-            // show|hide cookie icon
+            // show|hide cookie icon (should MOVED to Cookiebar ???)
             if (user_state.cookies_accepted === 'accepted') {
-              // show cookie icon
+              // Display cookie icon
               logText = 'show cookie icon';
               logger.info(logText);
               $('#quickLinksCookieButton').css('display', 'block');
             } else {
               logText = 'hide cookie icon';
               logger.info(logText);
-              // hide cookie icon
+              // Display cookie icon
               $('#quickLinksCookieButton').css('display', 'none');
             }
 
@@ -777,9 +850,8 @@ var j1 = (function () {
             }
 
             // show cc icon
-            $('#quickLinksControlCenterButton').css('display', 'block');
+            // $('#quickLinksControlCenterButton').css('display', 'block');
 
-            // show|hide signin|out icon
             if (j1.authEnabled()) {
               if (user_session.authenticated === 'true') {
                 // set signout
@@ -809,7 +881,7 @@ var j1 = (function () {
               logger.info(logText);
             }
 
-            // update sidebar for changed consent|theme data
+            // update sidebar for changed theme data
             logger.info('update sidebar');
             user_state        = j1.readCookie(cookie_names.user_state);
             current_user_data = j1.mergeData(user_session, user_state);
@@ -827,6 +899,10 @@ var j1 = (function () {
       } else { // web mode
         // show the page delayed
         setTimeout (function() {
+          j1.setState('finished');
+          logger.info('state: finished');
+          logger.info('page initialization: finished');
+
           // display page
           $('#no_flicker').css('display', 'block');
           logger.info('mode detected: web');
@@ -846,7 +922,7 @@ var j1 = (function () {
             $('.goog-te-combo').addClass('form-control');
           }
 
-          // show|hide cookie icon
+          // show|hide cookie icon (should MOVED to Cookiebar ???)
           if (user_state.cookies_accepted === 'accepted') {
             // Display cookie icon
             logText = 'show cookie icon';
@@ -872,7 +948,7 @@ var j1 = (function () {
             logger.info(logText);
           }
 
-          // update sidebar for changed consent|theme data
+          // update sidebar for changed theme data
           logger.info('update sidebar');
           user_state        = j1.readCookie(cookie_names.user_state);
           current_user_data = j1.mergeData(user_session, user_state);
@@ -889,26 +965,6 @@ var j1 = (function () {
       } // END WEB mode
     }, // END displayPage
 
-    // -------------------------------------------------------------------------
-    // initMDB()
-    // initialize page for MDB
-    // -------------------------------------------------------------------------
-    initMDB: function (options) {
-      var dependencies_met_bmd = setInterval(function() {
-        if ( j1.adapter.mdb.getState() == 'finished' ) {
-          var logger = log4javascript.getLogger('j1.initMDB');
-          logText = 'initializing MDB for current page: started';
-          logger.info(logText);
-
-          $('body').bootstrapMaterialDesign();
-
-          logText = 'initializing MDB for current page: finished';
-          logger.info(logText);
-          clearInterval(dependencies_met_bmd);
-        }
-      }, 25);
-    }, // END initMDB
-
     // -------------------------------------------------------------------------
     // Helper functions
     // -------------------------------------------------------------------------
@@ -932,7 +988,7 @@ var j1 = (function () {
 
     // -------------------------------------------------------------------------
     // getPrevPage()
-    // returns the last vistited page
+    // Returns the last vistited page
     // -------------------------------------------------------------------------
     getPrevPage: function () {
       return previous_page;
@@ -940,7 +996,7 @@ var j1 = (function () {
 
     // -------------------------------------------------------------------------
     // getLanguage()
-    // returns the preferred language taken form window.navigator
+    // Returns the preferred language taken form window.navigator
     // See:
     // https://stackoverflow.com/questions/1043339/javascript-for-detecting-browser-language-preference
     // -------------------------------------------------------------------------
@@ -950,7 +1006,7 @@ var j1 = (function () {
 
     // -------------------------------------------------------------------------
     // getTemplateVersion()
-    // returns the template version taken from site config (_config.yml)
+    // Returns the template version taken from site config (_config.yml)
     // -------------------------------------------------------------------------
     getTemplateVersion: function () {
       return '{{template_version}}';
@@ -1019,81 +1075,99 @@ var j1 = (function () {
 
     // -------------------------------------------------------------------------
     // xhrData()
-    // Load data asychronously using XHR on a DIV container
-    // specified (from options: xhr_data_path)
-    // -------------------------------------------------------------------------
-    xhrData: function (mod, options, status) {
-      var logger  = log4javascript.getLogger('j1.xhrData');
-      var state   = status;
+    // Load data asychronously using XHR|jQuery on an HTML element (e.g. <div>)
+    // specified by xhr_container_id, xhr_data_path (options)
+    // -------------------------------------------------------------------------
+    xhrData: function (options, mod, status) {
+      var logger            = log4javascript.getLogger('j1.xhrData');
+      var selector          = $('#' + options.xhr_container_id);
+      var state             = status;
+      var observer_options  = {
+        attributes:     false,
+        childList:      true,
+        characterData:  false,
+        subtree:        true
+      };
+      var observer;
       var logText;
 
       var cb_load_closure = function(mod, id) {
         return function (responseTxt, statusTxt, xhr) {
+          var logger = log4javascript.getLogger('j1.xhrData');
           if ( statusTxt === 'success' ) {
-            if (state) {
-              logger.info('set state for ' +mod+ ' to: ' + state);
-              executeFunctionByName(mod + '.setState', window, state);
-            }
+            // jadams, 2020-07-21: intermediate state should DISABLED
+            // if (state) {
+            //   logger.info('set state for ' +mod+ ' to: ' + state);
+            //   executeFunctionByName(mod + '.setState', window, state);
+            // }
+            j1.setXhrDataState(id, statusTxt);
+            j1.setXhrDomState(id, 'pending');
+
             logText = 'data loaded successfully on id: ' +id;
             logger.info(logText);
+            state = true;
           }
           if ( statusTxt === 'error' ) {
-            state = 'failed';
-            logger.info('set state for ' +mod+ ' to: ' + state);
-            executeFunctionByName(mod + '.setState', window, state);
-            logText = 'loading data failed on id: ' +id+ ', error ' + xhr.status + ': ' + xhr.statusText;
-            logger.error(logText);
+            // jadams, 2020-07-21: to be checked why id could be UNDEFINED
+            if (typeof(id) != "undefined") {
+              state = 'failed';
+              logger.info('set state for ' +mod+ ' to: ' + state);
+              // jadams, 2020-07-21: intermediate state should DISABLED
+              // executeFunctionByName(mod + '.setState', window, state);
+              j1.setXhrDataState(id, statusTxt);
+              j1.setXhrDomState(id, 'pending');
+              logText = 'loading data failed on id: ' +id+ ', error ' + xhr.status + ': ' + xhr.statusText;
+              logger.error(logText);
+              state = false;
+            }
           }
         };
       };
-
+      // see: https://stackoverflow.com/questions/20420577/detect-added-element-to-dom-with-mutation-observer
       var id = '#' + options.xhr_container_id;
-      var selector = $(id);
-
-      if ( selector.length ) {
-        var modal_html_data_path = options.xhr_data_path + ' > *';
-        selector.load( modal_html_data_path, cb_load_closure( mod, id ) );
-        return true;
+      var $selector = $(id);
+      if ( $selector.length ) {
+        var html_data_path = options.xhr_data_path + ' > *';
+        $selector.load( html_data_path, cb_load_closure( mod, id ) );
+
+        var MutationObserver = window.MutationObserver || window.WebKitMutationObserver;
+        var xhrObserver = new MutationObserver (mutationHandler);
+        var obsConfig = {
+            childList: true,
+            characterData: false,
+            attributes: false,
+            subtree: false };
+
+        selector.each(function(){
+            xhrObserver.observe(this, obsConfig);
+        } );
+
+        function mutationHandler (mutationRecords) {
+          mutationRecords.forEach ( function (mutation) {
+            if (mutation.addedNodes.length) {
+              logger.info('XHR data loaded in the DOM: ' + id);
+              j1.setXhrDomState(id, 'success');
+            }
+          });
+        }
       } else {
-        logText = 'data not loaded';
-        logger.warn(logText);
-        // Set processing state to 'finished' to complete module load
-        state = 'finished';
-        logger.info('state: ' + state);
-        executeFunctionByName(mod + '.setState', window, state);
-        return false;
+        // jadams, 2020-07-21: To be clarified why a id is "undefined"
+        if (id != '#undefined') {
+          logText = 'data not loaded on id:' + id;
+          logger.warn(logText);
+          j1.setXhrDataState(id, 'not loaded');
+          j1.setXhrDomState(id, 'not loaded');
+          // Set processing state to 'finished' to complete module load
+          state = 'finished';
+          logger.info('state: ' + state);
+          // jadams, 2020-07-21: intermediate state should DISABLED
+          // executeFunctionByName(mod + '.setState', window, state);
+          state = false;
+        }
       }
+      return state;
     }, // END xhrData
 
-    // -------------------------------------------------------------------------
-    // xhrApi:()
-    // XMLHttpRequest (XHR) based async server API request
-    // Request an REST API at 'url', using verb 'type' of response type 'type'
-    // -------------------------------------------------------------------------
-    xhrApi: function (url, request_type, data_type) {
-      var logger    = log4javascript.getLogger('j1.xhrApi');
-      var type      = typeof request_type == 'undefined' || request_type == '' ? 'GET'  : request_type;
-      var data_type = typeof data_type == 'undefined' || data_type == '' ? 'json' : data_type;
-
-      return $.ajax({
-        url:      url,
-        type:     type,
-        dataType: data_type,
-        success:  function(data) {
-          if (typeof data == 'string') {
-            return JSON.parse(data);
-          }
-          if (typeof data == 'object') {
-            return data;
-          }
-        },
-        error: function(error) {
-          logger.error('xhr request failed: ' + error.statusText);
-        }
-      });
-
-    }, // END xhrApi
-
     // -------------------------------------------------------------------------
     //  readCookie()
     // -------------------------------------------------------------------------
@@ -1131,18 +1205,21 @@ var j1 = (function () {
       };
       var settings = $.extend(defaults, options);
 
-      var epoch         = Math.floor(Date.now()/1000);
-      var timestamp     = moment.unix(epoch).format('YYYY-MM-DD hh:mm:ss');
+//    var epoch         = Math.floor(Date.now()/1000);
+//    var timestamp_now = moment.unix(epoch).format('YYYY-MM-DD HH:mm:ss');
+      var date          = new Date();
+      var timestamp_now = date.toISOString();
       var cookie_data   = {};
       var data_json;
       var data_encoded;
 
       if (j1.existsCookie(settings.name)) {
-        cookie_data   = j1.readCookie(settings.name);
-        cookie_data.timestamp = timestamp;
-        cookie_data   = j1.mergeData(cookie_data, settings.data);
-        data_json     = JSON.stringify( cookie_data );
-        data_encoded  = window.btoa(data_json);
+        cookie_data           = j1.readCookie(settings.name);
+        cookie_data.timestamp = timestamp_now;
+        cookie_data           = j1.mergeData(cookie_data, settings.data);
+        data_json             = JSON.stringify( cookie_data );
+        data_encoded          = window.btoa(data_json);
+
         if (settings.expires > 0) {
           Cookies.set(settings.name, data_encoded, { expires: settings.expires });
         } else {
@@ -1318,6 +1395,7 @@ var j1 = (function () {
               });
 
             });
+            logger.info('met dependencies for: sidebarLoaded');
             clearInterval(sidebarLoaded);
             return true;
           } else {
@@ -1375,6 +1453,7 @@ var j1 = (function () {
               });
 
             });
+            logger.info('met dependencies for: sidebarLoaded');
             clearInterval(sidebarLoaded);
             return true;
           } else {
@@ -1457,8 +1536,8 @@ var j1 = (function () {
 
     // -------------------------------------------------------------------------
     // getStyleValue:
-    // returns the value of a style from a css class definition
-    // example: j1.getStyleValue('bg-primary', 'background-color')
+    // Returns the value of a style from a css class definition
+    // example: j1.getStyleValue('uno-primary', 'background-color')
     getStyleValue: function (className, style) {
       var elementId = 'test-' + className,
         testElement = document.getElementById(elementId),
@@ -1505,13 +1584,13 @@ var j1 = (function () {
 
       // asciidoc
       // -----------------------------------------------------------------------
-      var admonitionblock_note_color      = bg_primary;
+      var admonitionblock_note_color      = '#0D47A1';                          // md-blue-900, was: bg_primary;
       var admonitionblock_tip_color       = j1.getStyleValue('btn-success', 'background-color');
       var admonitionblock_important_color = j1.getStyleValue('btn-warning', 'background-color');
       var admonitionblock_warning_color   = j1.getStyleValue('icon-warning', 'color');
       var admonitionblock_caution_color   = j1.getStyleValue('btn-danger', 'background-color');
 
-      $('head').append('<style>.icon-note { color: ' +bg_primary+ ' !important; }</style>');
+      $('head').append('<style>.icon-note { color: ' +admonitionblock_note_color+ ' !important; }</style>');
       $('head').append('<style>.icon-tip { color: ' +admonitionblock_tip_color+ ' !important; }</style>');
       $('head').append('<style>.icon-important { color: ' +admonitionblock_important_color+ ' !important; }</style>');
       $('head').append('<style>.icon-warning { color: ' +admonitionblock_warning_color+ ' !important; }</style>');
@@ -1546,38 +1625,74 @@ var j1 = (function () {
     }, // END setCss
 
     // -------------------------------------------------------------------------
-    //  Set the current (processing) state of the module
+    // setState()
+    // Set the current (processing) state of the module
     // -------------------------------------------------------------------------
     setState: function (stat) {
-      state= stat;
-      //j1.state stat;
+      state = stat;
     }, // end setState
 
     // -------------------------------------------------------------------------
-    //  Returns the current (processing) state of the module
+    // getState()
+    // Returns the current (processing) state of the module
     // -------------------------------------------------------------------------
     getState: function () {
-      // return j1.state;
       return state;
     }, // end getState
 
     // -------------------------------------------------------------------------
-    //  Set the current mode of the site (web|app)
+    // setXhrDataState()
+    // Set the final (loading) state of an element (partial) loaded via Xhr
+    // -------------------------------------------------------------------------
+    setXhrDataState: function (obj, stat) {
+      j1.xhrDataState[obj] = stat;
+    }, // END setXhrDataState
+
+    // -------------------------------------------------------------------------
+    // getXhrDataState()
+    // Returns the final (loading) state of an element (partial) loaded via Xhr
+    // -------------------------------------------------------------------------
+    getXhrDataState: function (obj) {
+      return j1.xhrDataState[obj];
+    }, // END getXhrDataState
+
+    // -------------------------------------------------------------------------
+    // setXhrDomState()
+    // Set the state of an element loaded via Xhr that is
+    // successfully added to the DOM
+    // -------------------------------------------------------------------------
+    setXhrDomState: function (obj, stat) {
+      j1.xhrDOMState[obj] = stat;
+    }, // END setXhrDomState
+
+    // -------------------------------------------------------------------------
+    // getXhrDataState()
+    // Returns the state of an element loaded via Xhr that is
+    // successfully added to the DOM
+    // -------------------------------------------------------------------------
+    getXhrDOMState: function (obj) {
+      return j1.xhrDOMState[obj];
+    }, // END getXhrDOMState
+
+    // -------------------------------------------------------------------------
+    // setMode()
+    // Set the current mode of the site (web|app)
     // -------------------------------------------------------------------------
     setMode: function (mod) {
       mode = mod;
     }, // END setMode
 
     // -------------------------------------------------------------------------
-    //  Return the current mode of the site (web|app)
+    // getMode()
+    // Returns the current mode of the site (web|app)
     // -------------------------------------------------------------------------
     getMode: function () {
       return mode;
     }, // END getMode
 
     // -------------------------------------------------------------------------
-    // getUserAgent
-    //  Return the name of the web browser
+    // checkUserAgent()
+    // Returns the name (UA) of the web browser
     // -------------------------------------------------------------------------
     checkUserAgent: function () {
       if (navigator.userAgent.search(ua_name) >= 0) {
@@ -1586,22 +1701,40 @@ var j1 = (function () {
         return false;
       }
     }, // END checkUserAgent
+
+    // -------------------------------------------------------------------------
+    // checkUserAgent()
+    // Returns the name (UA) of the web browser
+    // -------------------------------------------------------------------------
+    generateId: function (length) {
+     var result           = '';
+     var characters       = 'abcdefghijklmnopqrstuvwxyz0123456789';
+     var charactersLength = characters.length;
+     for ( var i = 0; i < length; i++ ) {
+        result += characters.charAt(Math.floor(Math.random() * charactersLength));
+     }
+   return result;
+    }, // END checkUserAgent
+
     // -------------------------------------------------------------------------
-    //  Return always true (for testing purposes)
+    // getTrue()
+    // Returns always true (for testing purposes)
     // -------------------------------------------------------------------------
     getTrue: function () {
       return true;
     }, // END isTrue
 
     // -------------------------------------------------------------------------
-    //  Return always false (for testing purposes)
+    // getFalse()
+    // Returns always false (for testing purposes)
     // -------------------------------------------------------------------------
     getFalse: function () {
       return false;
     }, // END isTrue
 
     // -------------------------------------------------------------------------
-    //  Return users to their browser homepage
+    // goHome()
+    // Redirect current page to the browser homepage
     // -------------------------------------------------------------------------
     goHome: function () {
       // most browsers
@@ -1613,7 +1746,17 @@ var j1 = (function () {
       } else {
         window.location.href = 'about:blank';
       }
-    } // END gohome
+    }, // END gohome
+
+    // -------------------------------------------------------------------------
+    // goBack()
+    // Redirect current page to last visited page (referrer)
+    // -------------------------------------------------------------------------
+    goBack: function () {
+      // where visitor has come from
+      window.location.href = document.referrer;
+    } // END goBack
+
   }; // END j1 (return)
 }) (j1, window);