]> git.ipfire.org Git - thirdparty/foundation/foundation-sites.git/commitdiff
Code improvements
authorNordanne Isahac <den.isahac@gmail.com>
Mon, 16 Jan 2017 00:20:30 +0000 (08:20 +0800)
committerNordanne Isahac <den.isahac@gmail.com>
Mon, 16 Jan 2017 00:20:30 +0000 (08:20 +0800)
docs/pages/magellan.md
js/foundation.magellan.js
js/foundation.smoothScroll.js

index d849a57faa263816c3fbdd9c341f60e808a16bef..75d340b0cd3ab30a384ce2e6f12e03f6e7bf5cbe 100644 (file)
@@ -8,7 +8,7 @@ tags:
 
 <div data-sticky-container>
   <div class="sticky" id="sticky-magellan" style="width:100%;" data-sticky data-margin-top="0" data-margin-bottom="0" data-top-anchor="setup" data-btm-anchor="destroy:bottom" data-sticky-on="small">
-    <nav data-magellan class="sticky-mag" data-bar-offset="25">
+    <nav data-magellan class="sticky-mag" data-offset="25">
       <ul class="horizontal menu expanded">
         <li><a href="#setup">Setup</a></li>
         <li><a href="#sticky-navigation">Sticky Navigation</a></li>
index e09cf154506374f95e806ba0976d0bee163cd068..688dfd0ae172757a06336354ba47a9672815c4d6 100644 (file)
@@ -113,7 +113,14 @@ class Magellan {
     this._inTransition = true;
     var _this = this;
 
-    Foundation.SmoothScroll.scrollToLoc(loc, this.options, function() {
+    var options = {
+      animationEasing: this.options.animationEasing,
+      animationDuration: this.options.animationDuration,
+      threshold: this.options.threshold,
+      offset: this.options.offset
+    };
+
+    Foundation.SmoothScroll.scrollToLoc(loc, options, function() {
       _this._inTransition = false; 
       _this._updateActive();
     })
@@ -145,7 +152,7 @@ class Magellan {
       var isDown = this.scrollPos < winPos,
           _this = this,
           curVisible = this.points.filter(function(p, i){
-            return isDown ? p - _this.options.barOffset <= winPos : p - _this.options.barOffset - _this.options.threshold <= winPos;
+            return isDown ? p - _this.options.offset <= winPos : p - _this.options.offset - _this.options.threshold <= winPos;
           });
       curIdx = curVisible.length ? curVisible.length - 1 : 0;
     }
@@ -238,7 +245,7 @@ Magellan.defaults = {
    * @type {number}
    * @default 0
    */
-  barOffset: 0
+  offset: 0
 }
 
 // Window exports
index 73b442810bb3abb43cbf59da926fb28b4c3b844d..f81a8a14c1f4b49409859ff7cc3b6d1fa1d3273c 100644 (file)
@@ -17,7 +17,8 @@ class SmoothScroll {
     }
 
     /**
-     * Initialize the SmoothScroll plugin 
+     * Initialize the SmoothScroll plugin
+     * @private
      */
     _init() {
         var id = this.$element[0].id || Foundation.GetYoDigits(6, 'smooth-scroll');
@@ -29,42 +30,50 @@ class SmoothScroll {
         this._events();
     }
 
+    /**
+     * Initializes events for SmoothScroll.
+     * @private
+     */
     _events() {
         var _this = this;
 
-        this.$element.on('click.zf.smoothScroll', 'a[href^="#"]', function(e) {
+        // click handler function.
+        var handleLinkClick = function(e) {
+            // exit function if the event source isn't coming from an anchor with href attribute starts with '#'
+            if(!$(this).is('a[href^="#"]'))  {
+                return false;
+            }
+            
+            var arrival = this.getAttribute('href');
+            
+            _this._inTransition = true;
+
+            SmoothScroll.scrollToLoc(arrival, _this.options, function() {
+                _this._inTransition = false;
+            });
+            
             e.preventDefault();
-            var arrival   = this.getAttribute('href');
-            _this.scrollToLoc(arrival);
-        });
-    }
+        };
 
-    /**
-     * Function to scroll to a given location on the page.
-     * @param {String} loc - a properly formatted jQuery id selector. Example: '#foo'
-     * @function
-     */
-    scrollToLoc(loc) {
-        this._inTransition = true;
-        var _this = this;
-        this.constructor.scrollToLoc(loc, this.options, function() {
-            _this._inTransition = false;
-        });
+        this.$element.on('click.zf.smoothScroll', handleLinkClick)
+        this.$element.on('click.zf.smoothScroll', 'a[href^="#"]', handleLinkClick);
     }
 
     /**
      * Function to scroll to a given location on the page.
-     * @param {String} loc - a properly formatted jQuery id selector. Example: '#foo'
+     * @param {String} loc - A properly formatted jQuery id selector. Example: '#foo'
+     * @param {Object} options - The options to use.
+     * @param {Function} callback - The callback function.
      * @static
      * @function
      */
-    static scrollToLoc(loc, options, callback) {
+    static scrollToLoc(loc, options = SmoothScroll.defaults, callback) {
         // Do nothing if target does not exist to prevent errors
         if (!$(loc).length) {
             return false;
         }
 
-        var scrollPos = Math.round($(loc).offset().top - options.threshold / 2 - options.barOffset);
+        var scrollPos = Math.round($(loc).offset().top - options.threshold / 2 - options.offset);
 
         $('html, body').stop(true).animate(
             { scrollTop: scrollPos },
@@ -78,6 +87,10 @@ class SmoothScroll {
         );
     }
 
+   /**
+    * Destroys an instance of SmoothScroll.
+    * @function
+    */
     destory() {
         Foundation.unregisterPlugin(this);
     }
@@ -115,9 +128,9 @@ SmoothScroll.defaults = {
    * @type {number}
    * @default 0
    */
-  barOffset: 0
+  offset: 0
 }
 
 // Window exports
 Foundation.plugin(SmoothScroll, 'SmoothScroll');
-}(jQuery);
\ No newline at end of file
+}(jQuery);