j1-template 2020.0.13 → 2020.0.14

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

@@ -108,8 +108,17 @@ j1.adapter['framer'] = (function (j1, window) {
     // Initializer
     // -------------------------------------------------------------------------
     init: function (options) {
+
+      // -----------------------------------------------------------------------
+      // globals
+      // -----------------------------------------------------------------------
+      _this   = j1.adapter.framer;
+      logger  = log4javascript.getLogger('j1.adapter.framer');
+
       // initialize state flag
-      j1.adapter.framer.state = 'pending';
+      _this.setState('started');
+      logger.info('state: ' + _this.getState());
+      logger.info('module is being initialized');
 
       // -----------------------------------------------------------------------
       // Default module settings
@@ -130,15 +139,6 @@ j1.adapter['framer'] = (function (j1, window) {
         moduleOptions = j1.mergeData(moduleOptions, settings);
       }
 
-      {% comment %} Set global variables
-      -------------------------------------------------------------------------- {% endcomment %}
-      _this   = j1.adapter.framer;
-      logger  = log4javascript.getLogger('j1.adapter.framer');
-
-      _this.setState('started');
-      logger.info('state: ' + _this.getState());
-      logger.info('module is being initialized');
-
       iFrameResize({
         log:                      moduleOptions.log,
         autoResize:               moduleOptions.autoResize,
@@ -196,20 +196,28 @@ j1.adapter['framer'] = (function (j1, window) {
     }, // END messageHandler
 
     // -------------------------------------------------------------------------
-    // setState
-    // Set the current (processing) state of the module
+    // getState
+    // Returns the current (processing) state of the module
+    // -------------------------------------------------------------------------
+    getState: function () {
+      return j1.adapter.navigator.state;
+    }, // END getState
+
+    // -------------------------------------------------------------------------
+    // setXhrState
+    // Set the final (loading) state of an element (partial) loaded via Xhr
     // -------------------------------------------------------------------------
-    setState: function (stat) {
-      j1.adapter.framer.state = stat;
-    }, // END setState
+    setXhrState: function (obj, stat) {
+      j1.adapter.navigator.xhrData[obj] = stat;
+    }, // END setXhrState
 
     // -------------------------------------------------------------------------
     // getState
-    // Returns the current (processing) state of the module
+    // Returns the final (loading) state of an element (partial) loaded via Xhr
     // -------------------------------------------------------------------------
-    getState: function () {
-      return j1.adapter.framer.state;
-    } // END state
+    getXhrState: function (obj) {
+      return j1.adapter.navigator.xhrData[obj];
+    } // END getXhrState
 
   }; // END return
 })(j1, window);

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

@@ -112,21 +112,6 @@ j1.adapter['gallery_customizer'] = (function (j1, window) {
   var logger;
   var logText;
 
-  // ---------------------------------------------------------------------------
-  // Helper functions
-  // ---------------------------------------------------------------------------
-  function executeFunctionByName(functionName, context /*, args */) {
-    // See: https://stackoverflow.com/questions/359788/how-to-execute-a-javascript-function-when-i-have-its-name-as-a-string
-    //
-    var args = Array.prototype.slice.call(arguments, 2);
-    var namespaces = functionName.split('.');
-    var func = namespaces.pop();
-    for(var i = 0; i < namespaces.length; i++) {
-      context = context[namespaces[i]];
-    }
-    return context[func].apply(context, args);
-  }
-
   // ---------------------------------------------------------------------------
   // Main object
   // ---------------------------------------------------------------------------
@@ -136,8 +121,17 @@ j1.adapter['gallery_customizer'] = (function (j1, window) {
     // initializer
     // -------------------------------------------------------------------------
     init: function (options) {
+
+      // -----------------------------------------------------------------------
+      // globals
+      // -----------------------------------------------------------------------
+      _this   = j1.adapter.gallery_customizer;
+      logger  = log4javascript.getLogger('j1.adapter.gallery_customizer');
+
       // initialize state flag
-      j1.adapter.gallery_customizer.state = 'pending';
+      _this.setState('started');
+      logger.info('state: ' + _this.getState());
+      logger.info('module is being initialized');
 
       // -----------------------------------------------------------------------
       // Default module settings
@@ -154,239 +148,216 @@ j1.adapter['gallery_customizer'] = (function (j1, window) {
       customizerOptions = $.extend({}, {{customizer_options | replace: '=>', ':' | replace: 'nil', '""'}});
       /* eslint-enable */
 
-      {% comment %} Set global variables
-      -------------------------------------------------------------------------- {% endcomment %}
-      _this   = j1.adapter.gallery_customizer;
-      logger  = log4javascript.getLogger('j1.adapter.gallery_customizer');
-
-      _this.setState('started');
-      logger.info('state: ' + _this.getState());
-      logger.info('module is being initialized');
-
       // ---------------------------------------------------------------------
       // data loader
       // ---------------------------------------------------------------------
-      $.when (
-        j1.xhrData (
-          'j1.adapter.gallery_customizer', {
-          xhr_container_id: customizerOptions.xhr_container_id,
-          xhr_data_path:    customizerOptions.xhr_data_path },
-          'data_loaded'))
-      .then (function (success) {
-        if (success) {
-          logger.info('loading customizer started on id: #' + customizerOptions.xhr_container_id);
+      j1.xhrData ({
+        xhr_container_id: customizerOptions.xhr_container_id,
+        xhr_data_path:    customizerOptions.xhr_data_path },
+        'j1.adapter.gallery_customizer',
+        'null');
+
+      // -------------------------------------------------------------------
+      // initializer
+      // -------------------------------------------------------------------
+      var dependencies_met_data_loaded = setInterval(function() {
+        if (j1.xhrDOMState['#customizer'] == 'success') {
+          var environment     = '{{site.environment}}';
+          var galleryId       = '#jg_customizer';
+          var $formId         = $('#jg-customizer-form');
+          var $instance       = $('#jg_customizer');
+          var kbdDelay        = 750;
+          var imageHeightMin  = 40;
+
+          logger.info('loading customizer finished on id: #' + customizerOptions.xhr_container_id);
 
           // -------------------------------------------------------------------
-          // initializer
-          // -------------------------------------------------------------------
-          var dependencies_met_data_loaded = setInterval(function() {
-            if (_this.getState() == 'data_loaded') {
-              var environment     = '{{site.environment}}';
-              var galleryId       = '#jg_customizer';
-              var $formId         = $('#jg-customizer-form');
-              var $instance       = $('#jg_customizer');
-              var kbdDelay        = 750;
-              var imageHeightMin  = 40;
-
-              logger.info('loading customizer finished on id: #' + customizerOptions.xhr_container_id);
-
-              // -------------------------------------------------------------------
-              // load gallery data
-              j1.adapter.jf_gallery.initialize(galleryOptions);
-
-              logger.info('initialize customizer ui|forms');
-
-              if ($formId.length) {
-                var timerid;
-
-                $('input[name="rowHeight"]').on('input', function (e) {
-                  var value = $(this).val();
-
-                  if (value < imageHeightMin) { return false; }
-
-                  if($(this).data('lastval') != value){
-                      $(this).data('lastval', value);
-                      clearTimeout(timerid);
-                      //change action
-                      timerid = setTimeout(function() {
-                        $instance.justifiedGallery({rowHeight: value});
-                        if (environment === 'development') {
-                          logText = 'Gallery on ID ' +galleryId+ ' changed rowHeight to: ' +value;
-                          logger.info(logText);
-                        }
-                      }, kbdDelay);
-                  };
-                  e.stopPropagation();
-                });
-
-                $('input[name="rowHeightMax"]').on('input', function (e) {
-                  var value = $(this).val();
-
-                  if($(this).data('lastval') != value){
-                      $(this).data('lastval', value);
-                      clearTimeout(timerid);
-                      //change action
-                      timerid = setTimeout(function() {
-                        $instance.justifiedGallery({maxRowHeight: value});
-                        if(environment === 'development') {
-                          logText = 'Gallery on ID ' +galleryId+ ' changed maxRowHeight to: ' +value;
-                          logger.info(logText);
-                        }
-                      }, kbdDelay);
-                  };
-                  e.stopPropagation();
-                });
-
-                $('input[name="margins"]').on('input', function (e) {
-                  var value = $(this).val();
-
-                  if($(this).data('lastval') != value){
-                      $(this).data('lastval', value);
-                      clearTimeout(timerid);
-                      //change action
-                      timerid = setTimeout(function() {
-                        $instance.justifiedGallery({margins: value});
-                        if(environment === 'development') {
-                          logText = 'Gallery on ID ' +galleryId+ ' changed margins to: ' +value;
-                          logger.info(logText);
-                        }
-                      }, kbdDelay);
-                  };
-                  e.stopPropagation();
-                });
-
-                $('input[name="border"]').on('input', function (e) {
-                  var value = $(this).val();
-
-                  if($(this).data('lastval') != value){
-                      $(this).data('lastval', value);
-                      clearTimeout(timerid);
-                      //change action
-                      timerid = setTimeout(function() {
-                        $instance.justifiedGallery({border: value});
-                        if(environment === 'development') {
-                          logText = 'Gallery on ID ' +galleryId+ ' changed padding to: ' +value;
-                          logger.info(logText);
-                        }
-                      }, kbdDelay);
-                  };
-                  e.stopPropagation();
-                });
-
-                $('input:checkbox[name="captions"]').on('click', function (e) {
-                  var value = $(this).is(':checked');
-
-                  $instance.justifiedGallery({captions: value});
-                  if(environment === 'development') {
-                    logText = 'Gallery on ID ' +galleryId+ ' changed captions to: ' +value;
-                    logger.info(logText);
-                  }
-                  e.stopPropagation();
-                });
-
-                $('input:checkbox[name="random"]').on('click', function (e) {
-                  var value = $(this).is(':checked');
-
-                  $instance.justifiedGallery({randomize: value});
-                  if(environment === 'development') {
-                    logText = 'Gallery on ID ' +galleryId+ ' changed randomize to: ' +value;
-                    logger.info(logText);
-                  }
-                  e.stopPropagation();
-                });
-
-                $('input:checkbox[name="justify_last_row"]').on('click', function (e) {
-                  var value = $(this).is(':checked');
-
-                  if (value == true) {
-                    value = 'justify';
-                    $instance.justifiedGallery({lastRow: value});
-                  } else {
-                    value = 'nojustify';
-                    $instance.justifiedGallery({lastRow: value});
-                  }
-                  if(environment === 'development') {
-                    logText = 'Gallery on ID ' +galleryId+ ' changed lastRow to: ' +value;
-                    logger.info(logText);
-                  }
-                  e.stopPropagation();
-                });
-
-                $('input:checkbox[name="hide_last_row"]').on('click', function (e) {
-                  var value = $(this).is(':checked');
-
-                  if (value == true) {
-                    value = 'hide';
-                    $instance.justifiedGallery({lastRow: value});
-                  } else {
-                    value = 'nojustify';
-                    $instance.justifiedGallery({lastRow: value});
-                  }
-                  if(environment === 'development') {
-                    logText = 'Gallery on ID ' +galleryId+ ' changed lastRow to: ' +value;
-                    logger.info(logText);
-                  }
-                  e.stopPropagation();
-                });
-
-                $('#jg-customizer-form button[name="reset-defaults"]').on('click', function (e) {
-
-                  $('#rowHeight').val(customizerOptions.gallery_settings.rowHeight);
-                  $('#rowHeightMax').val(customizerOptions.gallery_settings.maxRowHeight);
-                  $('#margins').val(customizerOptions.gallery_settings.margins);
-                  $('#border').val(customizerOptions.gallery_settings.border);
-                  $('input:checkbox[name="captions"]').val('on').filter('[value="on"]').prop('checked', customizerOptions.gallery_settings.captions);
-                  $('input:checkbox[name="random"]').val('off').filter('[value="off"]').prop('checked', customizerOptions.gallery_settings.randomize);
-                  $('input:checkbox[name="justify_last_row"]').val('on').filter('[value="on"]').prop('checked', customizerOptions.gallery_settings.justifyLastRow);
-                  $('input:checkbox[name="hide_last_row"]').val('off').filter('[value="off"]').prop('checked', customizerOptions.gallery_settings.hideLastRow);
-
-                  $instance.justifiedGallery({
-                    rowHeight:          customizerOptions.gallery_settings.rowHeight,
-                    maxRowHeight:       customizerOptions.gallery_settings.maxRowHeight,
-                    lastRow:            customizerOptions.gallery_settings.lastRow,
-                    margins:            customizerOptions.gallery_settings.margins,
-                    border:             customizerOptions.gallery_settings.border,
-                    randomize:          customizerOptions.gallery_settings.randomize,
-                    sort:               customizerOptions.gallery_settings.sort,
-                    refreshTime:        customizerOptions.gallery_settings.refreshTime,
-                    refreshSensitivity: customizerOptions.gallery_settings.refreshSensitivity,
-                    justifyThreshold:   customizerOptions.gallery_settings.justifyThreshold,
-                    captions:           customizerOptions.gallery_settings.captions
-                  });
-
-                  if(environment === 'development') {
-                    logText = 'Gallery on ID ' +galleryId+ ' reset to default values';
-                    logger.info(logText);
-                  }
-                  e.stopPropagation();
-                });
-
-              } // END form events
-
-              // See: https://jsfiddle.net/prathviraj080/vbbbw46a/1/
-              $('button.drawer-toggler').click(function(){
-                $('button.drawer-toggler span.mdi').toggleClass('mdi-menu mdi-close');
-              });
-              $('button.drawer-toggler').click(function(){
-                $('button.drawer-toggler').toggleClass('fadeIn rotateIn');
+          // load gallery data
+          j1.adapter.jf_gallery.initialize(galleryOptions);
+
+          logger.info('initialize customizer ui|forms');
+
+          if ($formId.length) {
+            var timerid;
+
+            $('input[name="rowHeight"]').on('input', function (e) {
+              var value = $(this).val();
+
+              if (value < imageHeightMin) { return false; }
+
+              if($(this).data('lastval') != value){
+                  $(this).data('lastval', value);
+                  clearTimeout(timerid);
+                  //change action
+                  timerid = setTimeout(function() {
+                    $instance.justifiedGallery({rowHeight: value});
+                    if (environment === 'development') {
+                      logText = 'Gallery on ID ' +galleryId+ ' changed rowHeight to: ' +value;
+                      logger.info(logText);
+                    }
+                  }, kbdDelay);
+              };
+              e.stopPropagation();
+            });
+
+            $('input[name="rowHeightMax"]').on('input', function (e) {
+              var value = $(this).val();
+
+              if($(this).data('lastval') != value){
+                  $(this).data('lastval', value);
+                  clearTimeout(timerid);
+                  //change action
+                  timerid = setTimeout(function() {
+                    $instance.justifiedGallery({maxRowHeight: value});
+                    if(environment === 'development') {
+                      logText = 'Gallery on ID ' +galleryId+ ' changed maxRowHeight to: ' +value;
+                      logger.info(logText);
+                    }
+                  }, kbdDelay);
+              };
+              e.stopPropagation();
+            });
+
+            $('input[name="margins"]').on('input', function (e) {
+              var value = $(this).val();
+
+              if($(this).data('lastval') != value){
+                  $(this).data('lastval', value);
+                  clearTimeout(timerid);
+                  //change action
+                  timerid = setTimeout(function() {
+                    $instance.justifiedGallery({margins: value});
+                    if(environment === 'development') {
+                      logText = 'Gallery on ID ' +galleryId+ ' changed margins to: ' +value;
+                      logger.info(logText);
+                    }
+                  }, kbdDelay);
+              };
+              e.stopPropagation();
+            });
+
+            $('input[name="border"]').on('input', function (e) {
+              var value = $(this).val();
+
+              if($(this).data('lastval') != value){
+                  $(this).data('lastval', value);
+                  clearTimeout(timerid);
+                  //change action
+                  timerid = setTimeout(function() {
+                    $instance.justifiedGallery({border: value});
+                    if(environment === 'development') {
+                      logText = 'Gallery on ID ' +galleryId+ ' changed padding to: ' +value;
+                      logger.info(logText);
+                    }
+                  }, kbdDelay);
+              };
+              e.stopPropagation();
+            });
+
+            $('input:checkbox[name="captions"]').on('click', function (e) {
+              var value = $(this).is(':checked');
+
+              $instance.justifiedGallery({captions: value});
+              if(environment === 'development') {
+                logText = 'Gallery on ID ' +galleryId+ ' changed captions to: ' +value;
+                logger.info(logText);
+              }
+              e.stopPropagation();
+            });
+
+            $('input:checkbox[name="random"]').on('click', function (e) {
+              var value = $(this).is(':checked');
+
+              $instance.justifiedGallery({randomize: value});
+              if(environment === 'development') {
+                logText = 'Gallery on ID ' +galleryId+ ' changed randomize to: ' +value;
+                logger.info(logText);
+              }
+              e.stopPropagation();
+            });
+
+            $('input:checkbox[name="justify_last_row"]').on('click', function (e) {
+              var value = $(this).is(':checked');
+
+              if (value == true) {
+                value = 'justify';
+                $instance.justifiedGallery({lastRow: value});
+              } else {
+                value = 'nojustify';
+                $instance.justifiedGallery({lastRow: value});
+              }
+              if(environment === 'development') {
+                logText = 'Gallery on ID ' +galleryId+ ' changed lastRow to: ' +value;
+                logger.info(logText);
+              }
+              e.stopPropagation();
+            });
+
+            $('input:checkbox[name="hide_last_row"]').on('click', function (e) {
+              var value = $(this).is(':checked');
+
+              if (value == true) {
+                value = 'hide';
+                $instance.justifiedGallery({lastRow: value});
+              } else {
+                value = 'nojustify';
+                $instance.justifiedGallery({lastRow: value});
+              }
+              if(environment === 'development') {
+                logText = 'Gallery on ID ' +galleryId+ ' changed lastRow to: ' +value;
+                logger.info(logText);
+              }
+              e.stopPropagation();
+            });
+
+            $('#jg-customizer-form button[name="reset-defaults"]').on('click', function (e) {
+
+              $('#rowHeight').val(customizerOptions.gallery_settings.rowHeight);
+              $('#rowHeightMax').val(customizerOptions.gallery_settings.maxRowHeight);
+              $('#margins').val(customizerOptions.gallery_settings.margins);
+              $('#border').val(customizerOptions.gallery_settings.border);
+              $('input:checkbox[name="captions"]').val('on').filter('[value="on"]').prop('checked', customizerOptions.gallery_settings.captions);
+              $('input:checkbox[name="random"]').val('off').filter('[value="off"]').prop('checked', customizerOptions.gallery_settings.randomize);
+              $('input:checkbox[name="justify_last_row"]').val('on').filter('[value="on"]').prop('checked', customizerOptions.gallery_settings.justifyLastRow);
+              $('input:checkbox[name="hide_last_row"]').val('off').filter('[value="off"]').prop('checked', customizerOptions.gallery_settings.hideLastRow);
+
+              $instance.justifiedGallery({
+                rowHeight:          customizerOptions.gallery_settings.rowHeight,
+                maxRowHeight:       customizerOptions.gallery_settings.maxRowHeight,
+                lastRow:            customizerOptions.gallery_settings.lastRow,
+                margins:            customizerOptions.gallery_settings.margins,
+                border:             customizerOptions.gallery_settings.border,
+                randomize:          customizerOptions.gallery_settings.randomize,
+                sort:               customizerOptions.gallery_settings.sort,
+                refreshTime:        customizerOptions.gallery_settings.refreshTime,
+                refreshSensitivity: customizerOptions.gallery_settings.refreshSensitivity,
+                justifyThreshold:   customizerOptions.gallery_settings.justifyThreshold,
+                captions:           customizerOptions.gallery_settings.captions
               });
 
-              _this.setState('finished');
-              logger.info('state: ' + _this.getState());
-              logger.info('initializing module finished');
-              clearInterval(dependencies_met_data_loaded);
-
-              return true;
-            }
-          }, 25);
-
-        } // END if success
-      })
-      .catch(function(error) {
-        logger.error('loading html data failed at: j1.xhrData');
-        return false;
-      }); // End thenable
-
+              if(environment === 'development') {
+                logText = 'Gallery on ID ' +galleryId+ ' reset to default values';
+                logger.info(logText);
+              }
+              e.stopPropagation();
+            });
+
+          } // END form events
+
+          // See: https://jsfiddle.net/prathviraj080/vbbbw46a/1/
+          $('button.drawer-toggler').click(function(){
+            $('button.drawer-toggler span.mdi').toggleClass('mdi-menu mdi-close');
+          });
+          $('button.drawer-toggler').click(function(){
+            $('button.drawer-toggler').toggleClass('fadeIn rotateIn');
+          });
+
+          _this.setState('finished');
+          logger.info('state: ' + _this.getState());
+          logger.info('initializing module finished');
+          clearInterval(dependencies_met_data_loaded);
+        } // END dependencies_met_data_loaded
+      }, 25);
     }, // END init
 
     // -------------------------------------------------------------------------
@@ -417,20 +388,20 @@ j1.adapter['gallery_customizer'] = (function (j1, window) {
     }, // END messageHandler
 
     // -------------------------------------------------------------------------
-    // setState
-    // Set the current (processing) state of the module
+    // setState()
+    // Sets the current (processing) state of the module
     // -------------------------------------------------------------------------
     setState: function (stat) {
-      j1.adapter.gallery_customizer.state = stat;
+      _this.state = stat;
     }, // END setState
 
     // -------------------------------------------------------------------------
-    // getState
+    // getState()
     // Returns the current (processing) state of the module
     // -------------------------------------------------------------------------
     getState: function () {
-      return j1.adapter.gallery_customizer.state;
-    } // END state
+      return _this.state;
+    } // END getState
 
   }; // END return
 })(j1, window);