foundation-rails 6.1.2.0 → 6.2.0.0

data/vendor/assets/js/{foundation.util.motion.js → foundation.util.motion.js.es6}

@@ -1,12 +1,53 @@
+'use strict';
+
+!function($) {
+
 /**
  * Motion module.
  * @module foundation.motion
  */
-!function($, Foundation) {
 
-var initClasses   = ['mui-enter', 'mui-leave'];
-var activeClasses = ['mui-enter-active', 'mui-leave-active'];
+const initClasses   = ['mui-enter', 'mui-leave'];
+const activeClasses = ['mui-enter-active', 'mui-leave-active'];
+
+const Motion = {
+  animateIn: function(element, animation, cb) {
+    animate(true, element, animation, cb);
+  },
+
+  animateOut: function(element, animation, cb) {
+    animate(false, element, animation, cb);
+  }
+}
+
+function Move(duration, elem, fn){
+  var anim, prog, start = null;
+  // console.log('called');
+
+  function move(ts){
+    if(!start) start = window.performance.now();
+    // console.log(start, ts);
+    prog = ts - start;
+    fn.apply(elem);
+
+    if(prog < duration){ anim = window.requestAnimationFrame(move, elem); }
+    else{
+      window.cancelAnimationFrame(anim);
+      elem.trigger('finished.zf.animate', [elem]).triggerHandler('finished.zf.animate', [elem]);
+    }
+  }
+  anim = window.requestAnimationFrame(move);
+}
 
+/**
+ * Animates an element in or out using a CSS transition class.
+ * @function
+ * @private
+ * @param {Boolean} isIn - Defines if the animation is in or out.
+ * @param {Object} element - jQuery or HTML object to animate.
+ * @param {String} animation - CSS class to use.
+ * @param {Function} cb - Callback to run when animation is finished.
+ */
 function animate(isIn, element, animation, cb) {
   element = $(element).eq(0);
 
@@ -17,28 +58,26 @@ function animate(isIn, element, animation, cb) {
 
   // Set up the animation
   reset();
-  element.addClass(animation)
-         .css('transition', 'none');
-        //  .addClass(initClass);
-  // if(isIn) element.show();
-  requestAnimationFrame(function() {
+
+  element
+    .addClass(animation)
+    .css('transition', 'none');
+
+  requestAnimationFrame(() => {
     element.addClass(initClass);
     if (isIn) element.show();
   });
+
   // Start the animation
-  requestAnimationFrame(function() {
+  requestAnimationFrame(() => {
     element[0].offsetWidth;
-    element.css('transition', '');
-    element.addClass(activeClass);
+    element
+      .css('transition', '')
+      .addClass(activeClass);
   });
-  // Move(500, element, function(){
-  //   // element[0].offsetWidth;
-  //   element.css('transition', '');
-  //   element.addClass(activeClass);
-  // });
 
   // Clean up the animation when it finishes
-  element.one(Foundation.transitionend(element), finish);//.one('finished.zf.animate', finish);
+  element.one(Foundation.transitionend(element), finish);
 
   // Hides the element (for out animations), resets the element, and runs a callback
   function finish() {
@@ -50,40 +89,11 @@ function animate(isIn, element, animation, cb) {
   // Resets transitions and removes motion-specific classes
   function reset() {
     element[0].style.transitionDuration = 0;
-    element.removeClass(initClass + ' ' + activeClass + ' ' + animation);
+    element.removeClass(`${initClass} ${activeClass} ${animation}`);
   }
 }
 
-var Motion = {
-  animateIn: function(element, animation, /*duration,*/ cb) {
-    animate(true, element, animation, cb);
-  },
-
-  animateOut: function(element, animation, /*duration,*/ cb) {
-    animate(false, element, animation, cb);
-  }
-};
-
-var Move = function(duration, elem, fn){
-  var anim, prog, start = null;
-  // console.log('called');
-
-  function move(ts){
-    if(!start) start = window.performance.now();
-    // console.log(start, ts);
-    prog = ts - start;
-    fn.apply(elem);
-
-    if(prog < duration){ anim = window.requestAnimationFrame(move, elem); }
-    else{
-      window.cancelAnimationFrame(anim);
-      elem.trigger('finished.zf.animate', [elem]).triggerHandler('finished.zf.animate', [elem]);
-    }
-  }
-  anim = window.requestAnimationFrame(move);
-};
-
 Foundation.Move = Move;
 Foundation.Motion = Motion;
 
-}(jQuery, Foundation);
+}(jQuery);

data/vendor/assets/js/foundation.util.nest.js.es6

@@ -0,0 +1,76 @@
+'use strict';
+
+!function($) {
+
+const Nest = {
+  Feather(menu, type = 'zf') {
+    menu.attr('role', 'menubar');
+
+    var items = menu.find('li').attr({'role': 'menuitem'}),
+        subMenuClass = `is-${type}-submenu`,
+        subItemClass = `${subMenuClass}-item`,
+        hasSubClass = `is-${type}-submenu-parent`;
+
+    menu.find('a:first').attr('tabindex', 0);
+
+    items.each(function() {
+      var $item = $(this),
+          $sub = $item.children('ul');
+
+      if ($sub.length) {
+        $item
+          .addClass(hasSubClass)
+          .attr({
+            'aria-haspopup': true,
+            'aria-expanded': false,
+            'aria-label': $item.children('a:first').text()
+          });
+
+        $sub
+          .addClass(`submenu ${subMenuClass}`)
+          .attr({
+            'data-submenu': '',
+            'aria-hidden': true,
+            'role': 'menu'
+          });
+      }
+
+      if ($item.parent('[data-submenu]').length) {
+        $item.addClass(`is-submenu-item ${subItemClass}`);
+      }
+    });
+
+    return;
+  },
+
+  Burn(menu, type) {
+    var items = menu.find('li').removeAttr('tabindex'),
+        subMenuClass = `is-${type}-submenu`,
+        subItemClass = `${subMenuClass}-item`,
+        hasSubClass = `is-${type}-submenu-parent`;
+
+    menu
+      .find('*')
+      .removeClass(`${subMenuClass} ${subItemClass} ${hasSubClass} is-submenu-item submenu is-active`)
+      .removeAttr('data-submenu').css('display', '');
+
+    // console.log(      menu.find('.' + subMenuClass + ', .' + subItemClass + ', .has-submenu, .is-submenu-item, .submenu, [data-submenu]')
+    //           .removeClass(subMenuClass + ' ' + subItemClass + ' has-submenu is-submenu-item submenu')
+    //           .removeAttr('data-submenu'));
+    // items.each(function(){
+    //   var $item = $(this),
+    //       $sub = $item.children('ul');
+    //   if($item.parent('[data-submenu]').length){
+    //     $item.removeClass('is-submenu-item ' + subItemClass);
+    //   }
+    //   if($sub.length){
+    //     $item.removeClass('has-submenu');
+    //     $sub.removeClass('submenu ' + subMenuClass).removeAttr('data-submenu');
+    //   }
+    // });
+  }
+}
+
+Foundation.Nest = Nest;
+
+}(jQuery);

data/vendor/assets/js/foundation.util.timerAndImageLoader.js.es6

@@ -0,0 +1,86 @@
+'use strict';
+
+!function($) {
+
+function Timer(elem, options, cb) {
+  var _this = this,
+      duration = options.duration,//options is an object for easily adding features later.
+      nameSpace = Object.keys(elem.data())[0] || 'timer',
+      remain = -1,
+      start,
+      timer;
+
+  this.isPaused = false;
+
+  this.restart = function() {
+    remain = -1;
+    clearTimeout(timer);
+    this.start();
+  }
+
+  this.start = function() {
+    this.isPaused = false;
+    // if(!elem.data('paused')){ return false; }//maybe implement this sanity check if used for other things.
+    clearTimeout(timer);
+    remain = remain <= 0 ? duration : remain;
+    elem.data('paused', false);
+    start = Date.now();
+    timer = setTimeout(function(){
+      if(options.infinite){
+        _this.restart();//rerun the timer.
+      }
+      cb();
+    }, remain);
+    elem.trigger(`timerstart.zf.${nameSpace}`);
+  }
+
+  this.pause = function() {
+    this.isPaused = true;
+    //if(elem.data('paused')){ return false; }//maybe implement this sanity check if used for other things.
+    clearTimeout(timer);
+    elem.data('paused', true);
+    var end = Date.now();
+    remain = remain - (end - start);
+    elem.trigger(`timerpaused.zf.${nameSpace}`);
+  }
+}
+
+/**
+ * Runs a callback function when images are fully loaded.
+ * @param {Object} images - Image(s) to check if loaded.
+ * @param {Func} callback - Function to execute when image is fully loaded.
+ */
+function onImagesLoaded(images, callback){
+  var self = this,
+      unloaded = images.length;
+
+  if (unloaded === 0) {
+    callback();
+  }
+
+  images.each(function() {
+    if (this.complete) {
+      singleImageLoaded();
+    }
+    else if (typeof this.naturalWidth !== 'undefined' && this.naturalWidth > 0) {
+      singleImageLoaded();
+    }
+    else {
+      $(this).one('load', function() {
+        singleImageLoaded();
+      });
+    }
+  });
+
+  function singleImageLoaded() {
+    unloaded--;
+    if (unloaded === 0) {
+      callback();
+    }
+  }
+}
+
+Foundation.Timer = Timer;
+Foundation.onImagesLoaded = onImagesLoaded;
+
+}(jQuery);

data/vendor/assets/js/{foundation.util.touch.js → foundation.util.touch.js.es6}

@@ -43,7 +43,7 @@
       if(dir) {
         e.preventDefault();
         onTouchEnd.call(this);
-        $(this).trigger('swipe', dir).trigger('swipe' + dir);
+        $(this).trigger('swipe', dir).trigger(`swipe${dir}`);
       }
     }
   }
@@ -70,7 +70,7 @@
   $.event.special.swipe = { setup: init };
 
   $.each(['left', 'up', 'down', 'right'], function () {
-    $.event.special['swipe' + this] = { setup: function(){
+    $.event.special[`swipe${this}`] = { setup: function(){
       $(this).on('swipe', $.noop);
     } };
   });

data/vendor/assets/js/foundation.util.triggers.js.es6

@@ -0,0 +1,239 @@
+'use strict';
+
+!function($) {
+
+const MutationObserver = (function () {
+  var prefixes = ['WebKit', 'Moz', 'O', 'Ms', ''];
+  for (var i=0; i < prefixes.length; i++) {
+    if (`${prefixes[i]}MutationObserver` in window) {
+      return window[`${prefixes[i]}MutationObserver`];
+    }
+  }
+  return false;
+}());
+
+const triggers = (el, type) => {
+  el.data(type).split(' ').forEach(id => {
+    $(`#${id}`)[ type === 'close' ? 'trigger' : 'triggerHandler'](`${type}.zf.trigger`, [el]);
+  });
+};
+// Elements with [data-open] will reveal a plugin that supports it when clicked.
+$(document).on('click.zf.trigger', '[data-open]', function() {
+  triggers($(this), 'open');
+});
+
+// Elements with [data-close] will close a plugin that supports it when clicked.
+// If used without a value on [data-close], the event will bubble, allowing it to close a parent component.
+$(document).on('click.zf.trigger', '[data-close]', function() {
+  let id = $(this).data('close');
+  if (id) {
+    triggers($(this), 'close');
+  }
+  else {
+    $(this).trigger('close.zf.trigger');
+  }
+});
+
+// Elements with [data-toggle] will toggle a plugin that supports it when clicked.
+$(document).on('click.zf.trigger', '[data-toggle]', function() {
+  triggers($(this), 'toggle');
+});
+
+// Elements with [data-closable] will respond to close.zf.trigger events.
+$(document).on('close.zf.trigger', '[data-closable]', function(e){
+  e.stopPropagation();
+  let animation = $(this).data('closable');
+
+  if(animation !== ''){
+    Foundation.Motion.animateOut($(this), animation, function() {
+      $(this).trigger('closed.zf');
+    });
+  }else{
+    $(this).fadeOut().trigger('closed.zf');
+  }
+});
+
+$(document).on('focus.zf.trigger blur.zf.trigger', '[data-toggle-focus]', function() {
+  let id = $(this).data('toggle-focus');
+  $(`#${id}`).triggerHandler('toggle.zf.trigger', [$(this)]);
+});
+
+/**
+* Fires once after all other scripts have loaded
+* @function
+* @private
+*/
+$(window).load(() => {
+  checkListeners();
+});
+
+function checkListeners() {
+  eventsListener();
+  resizeListener();
+  scrollListener();
+  closemeListener();
+}
+
+//******** only fires this function once on load, if there's something to watch ********
+function closemeListener(pluginName) {
+  var yetiBoxes = $('[data-yeti-box]'),
+      plugNames = ['dropdown', 'tooltip', 'reveal'];
+
+  if(pluginName){
+    if(typeof pluginName === 'string'){
+      plugNames.push(pluginName);
+    }else if(typeof pluginName === 'object' && typeof pluginName[0] === 'string'){
+      plugNames.concat(pluginName);
+    }else{
+      console.error('Plugin names must be strings');
+    }
+  }
+  if(yetiBoxes.length){
+    let listeners = plugNames.map((name) => {
+      return `closeme.zf.${name}`;
+    }).join(' ');
+
+    $(window).off(listeners).on(listeners, function(e, pluginId){
+      let plugin = e.namespace.split('.')[0];
+      let plugins = $(`[data-${plugin}]`).not(`[data-yeti-box="${pluginId}"]`);
+
+      plugins.each(function(){
+        let _this = $(this);
+
+        _this.triggerHandler('close.zf.trigger', [_this]);
+      });
+    });
+  }
+}
+
+function resizeListener(debounce){
+  let timer,
+      $nodes = $('[data-resize]');
+  if($nodes.length){
+    $(window).off('resize.zf.trigger')
+    .on('resize.zf.trigger', function(e) {
+      if (timer) { clearTimeout(timer); }
+
+      timer = setTimeout(function(){
+
+        if(!MutationObserver){//fallback for IE 9
+          $nodes.each(function(){
+            $(this).triggerHandler('resizeme.zf.trigger');
+          });
+        }
+        //trigger all listening elements and signal a resize event
+        $nodes.attr('data-events', "resize");
+      }, debounce || 10);//default time to emit resize event
+    });
+  }
+}
+
+function scrollListener(debounce){
+  let timer,
+      $nodes = $('[data-scroll]');
+  if($nodes.length){
+    $(window).off('scroll.zf.trigger')
+    .on('scroll.zf.trigger', function(e){
+      if(timer){ clearTimeout(timer); }
+
+      timer = setTimeout(function(){
+
+        if(!MutationObserver){//fallback for IE 9
+          $nodes.each(function(){
+            $(this).triggerHandler('scrollme.zf.trigger');
+          });
+        }
+        //trigger all listening elements and signal a scroll event
+        $nodes.attr('data-events', "scroll");
+      }, debounce || 10);//default time to emit scroll event
+    });
+  }
+}
+
+function eventsListener() {
+  if(!MutationObserver){ return false; }
+  let nodes = document.querySelectorAll('[data-resize], [data-scroll], [data-mutate]');
+
+  //element callback
+  var listeningElementsMutation = function(mutationRecordsList) {
+    var $target = $(mutationRecordsList[0].target);
+    //trigger the event handler for the element depending on type
+    switch ($target.attr("data-events")) {
+
+      case "resize" :
+      $target.triggerHandler('resizeme.zf.trigger', [$target]);
+      break;
+
+      case "scroll" :
+      $target.triggerHandler('scrollme.zf.trigger', [$target, window.pageYOffset]);
+      break;
+
+      // case "mutate" :
+      // console.log('mutate', $target);
+      // $target.triggerHandler('mutate.zf.trigger');
+      //
+      // //make sure we don't get stuck in an infinite loop from sloppy codeing
+      // if ($target.index('[data-mutate]') == $("[data-mutate]").length-1) {
+      //   domMutationObserver();
+      // }
+      // break;
+
+      default :
+      return false;
+      //nothing
+    }
+  }
+
+  if(nodes.length){
+    //for each element that needs to listen for resizing, scrolling, (or coming soon mutation) add a single observer
+    for (var i = 0; i <= nodes.length-1; i++) {
+      let elementObserver = new MutationObserver(listeningElementsMutation);
+      elementObserver.observe(nodes[i], { attributes: true, childList: false, characterData: false, subtree:false, attributeFilter:["data-events"]});
+    }
+  }
+}
+
+// ------------------------------------
+
+// [PH]
+// Foundation.CheckWatchers = checkWatchers;
+Foundation.IHearYou = checkListeners;
+// Foundation.ISeeYou = scrollListener;
+// Foundation.IFeelYou = closemeListener;
+
+}(jQuery);
+
+// function domMutationObserver(debounce) {
+//   // !!! This is coming soon and needs more work; not active  !!! //
+//   var timer,
+//   nodes = document.querySelectorAll('[data-mutate]');
+//   //
+//   if (nodes.length) {
+//     // var MutationObserver = (function () {
+//     //   var prefixes = ['WebKit', 'Moz', 'O', 'Ms', ''];
+//     //   for (var i=0; i < prefixes.length; i++) {
+//     //     if (prefixes[i] + 'MutationObserver' in window) {
+//     //       return window[prefixes[i] + 'MutationObserver'];
+//     //     }
+//     //   }
+//     //   return false;
+//     // }());
+//
+//
+//     //for the body, we need to listen for all changes effecting the style and class attributes
+//     var bodyObserver = new MutationObserver(bodyMutation);
+//     bodyObserver.observe(document.body, { attributes: true, childList: true, characterData: false, subtree:true, attributeFilter:["style", "class"]});
+//
+//
+//     //body callback
+//     function bodyMutation(mutate) {
+//       //trigger all listening elements and signal a mutation event
+//       if (timer) { clearTimeout(timer); }
+//
+//       timer = setTimeout(function() {
+//         bodyObserver.disconnect();
+//         $('[data-mutate]').attr('data-events',"mutate");
+//       }, debounce || 150);
+//     }
+//   }
+// }