menuspy - npm Package Compare versions

Comparing version 1.0.1 to 1.1.1

dist/menuspy.js

@@ -1,6 +0,6 @@
-/*! MenuSpy v1.0.0 (Nov 29 2016) - http://leocs.me/menuspy/ - Copyright (c) 2016 Leonardo Santos; MIT License */
+/*! MenuSpy v1.1.0 (Aug 04 2017) - http://leocs.me/menuspy/ - Copyright (c) 2017 Leonardo Santos; MIT License */
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
-  typeof define === 'function' && define.amd ? define(factory) :
-  (global.MenuSpy = factory());
+	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+	typeof define === 'function' && define.amd ? define(factory) :
+	(global.MenuSpy = factory());
 }(this, (function () { 'use strict';
@@ -93,6 +93,6 @@
     if (history.replaceState) {
-      history.replaceState(null, null, ("#" + (this$1.lastId)));
+      history.replaceState(null, null, ("#" + (this$1.lastInViewElm.id)));
     } else {
       var st = utils.scrollTop();
-      window.location.hash = this$1.lastId;
+      window.location.hash = this$1.lastInViewElm;
       window.scrollTo(0, st);
@@ -108,3 +108,3 @@ }
   this.currScrollTop = 0;
-  this.lastId = '';
+  this.lastInViewElm = null;
   this.menuHeight = this.element.offsetHeight + this.options.threshold;
@@ -115,12 +115,11 @@ this.menuItems = [].slice.call(this.element.querySelectorAll(this.options.menuItemSelector));
 MenuSpy.prototype.cacheItems = function cacheItems () {
-  this.scrollItems = this.menuItems.map(function (a) {
-    var elm = document.querySelector(a.getAttribute('href'));
-    if (elm) {
-      var offset = utils.offset(elm).top;
-      return { elm: elm, offset: offset };
-    } else {
-      console.warn('MenuSpy warning: %s not found on page.', a.href);
+  this.scrollItems = this.menuItems.map(function (elm) {
+    var target = elm.dataset.target ? document.querySelector(elm.dataset.target) : document.getElementById(elm.getAttribute('href').slice(1));
+    if (target) {
+      var offset = utils.offset(target).top;
+      return { elm: elm, target: target, offset: offset };
     }
+    return false;
   });
-  this.scrollItems = this.scrollItems.filter( Boolean );
+  this.scrollItems = this.scrollItems.filter(Boolean);
 };
@@ -131,4 +130,3 @@
   var inViewElms = this.scrollItems
-    .filter(function (item) { return item.offset < fromTop; })
-    .map(function (item) { return item.elm; });
+    .filter(function (item) { return item.offset < fromTop; });
 
@@ -141,17 +139,16 @@ this.activateItem(inViewElms.pop());
 
-  var id = inViewElm ? inViewElm.id : '';
   var activeClass = this.options.activeClass;
   var callback = this.options.callback;
 
-  if (this.lastId !== id) {
-    this.lastId = id;
+  if (inViewElm && this.lastInViewElm !== inViewElm.target) {
+    this.lastInViewElm = inViewElm.target;
 
-    this.menuItems.forEach(function (item) {
-      utils.removeClass(item.parentNode, activeClass);
+    this.scrollItems.forEach(function (item) {
+      utils.removeClass(item.elm.parentNode, activeClass);
 
-      if (item.getAttribute('href') === ("#" + id)) {
-        utils.addClass(item.parentNode, activeClass);
+      if (item.elm === inViewElm.elm) {
+        utils.addClass(item.elm.parentNode, activeClass);
 
         if (typeof callback === 'function') {
-          callback.call(this$1, item, inViewElm);
+          callback.call(this$1, item);
         }
@@ -178,2 +175,2 @@
 
-})));
+})));

dist/menuspy.min.js

@@ -1,2 +0,2 @@
-/*! MenuSpy v1.0.0 (Nov 29 2016) - http://leocs.me/menuspy/ - Copyright (c) 2016 Leonardo Santos; MIT License */
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.MenuSpy=e()}(this,function(){"use strict";var t={extend:function(t,e){for(var s in e)e.hasOwnProperty(s)&&(t[s]=e[s]);return t},offset:function(t){var e=t.getBoundingClientRect();return{top:e.top+document.body.scrollTop,left:e.left+document.body.scrollLeft}},scrollTop:function(){return window.pageYOffset||document.documentElement.scrollTop},addClass:function(t,e){if(t.classList)t.classList.add(e);else{var s=t.className.split(" "),o=s.indexOf(e);o===-1&&s.push(e),t.className=s.join(" ")}},removeClass:function(t,e){t.classList?t.classList.remove(e):t.className=t.className.replace(new RegExp("(^|\\b)"+e.split(" ").join("|")+"(\\b|$)","gi")," ")},debounce:function(t,e){var s=null;return function(){var o=arguments,n=this;s||(s=setTimeout(function(){return s=0,t.apply(n,o)},e))}}},e=function(e,s){var o=this;if(e){var n={menuItemSelector:'a[href^="#"]',activeClass:"active",threshold:15,hashTimeout:600,callback:null};this.element=e,this.options=t.extend(n,s),this.assignValues(),window.addEventListener("resize",t.debounce(function(){return o.assignValues()})),this.debouncedHashFn=t.debounce(function(){if(history.replaceState)history.replaceState(null,null,"#"+o.lastId);else{var e=t.scrollTop();window.location.hash=o.lastId,window.scrollTo(0,e)}},this.options.hashTimeout),this.cacheItems(),this.scrollFn()}};return e.prototype.assignValues=function(){this.currScrollTop=0,this.lastId="",this.menuHeight=this.element.offsetHeight+this.options.threshold,this.menuItems=[].slice.call(this.element.querySelectorAll(this.options.menuItemSelector))},e.prototype.cacheItems=function(){this.scrollItems=this.menuItems.map(function(e){var s=document.querySelector(e.getAttribute("href"));if(s){var o=t.offset(s).top;return{elm:s,offset:o}}console.warn("MenuSpy warning: %s not found on page.",e.href)}),this.scrollItems=this.scrollItems.filter(Boolean)},e.prototype.tick=function(){var t=this.currScrollTop+this.menuHeight,e=this.scrollItems.filter(function(e){return e.offset<t}).map(function(t){return t.elm});this.activateItem(e.pop())},e.prototype.activateItem=function(e){var s=this,o=e?e.id:"",n=this.options.activeClass,i=this.options.callback;this.lastId!==o&&(this.lastId=o,this.menuItems.forEach(function(l){t.removeClass(l.parentNode,n),l.getAttribute("href")==="#"+o&&(t.addClass(l.parentNode,n),"function"==typeof i&&i.call(s,l,e),s.debouncedHashFn())}))},e.prototype.scrollFn=function(){var e=t.scrollTop();this.currScrollTop!==e&&(this.currScrollTop=e,this.tick()),window.requestAnimationFrame(this.scrollFn.bind(this))},e});
+/*! MenuSpy v1.0.1 (Aug 03 2017) - http://leocs.me/menuspy/ - Copyright (c) 2017 Leonardo Santos; MIT License */
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.MenuSpy=e()}(this,function(){"use strict";var t={extend:function(t,e){for(var s in e)e.hasOwnProperty(s)&&(t[s]=e[s]);return t},offset:function(t){var e=t.getBoundingClientRect();return{top:e.top+document.body.scrollTop,left:e.left+document.body.scrollLeft}},scrollTop:function(){return window.pageYOffset||document.documentElement.scrollTop},addClass:function(t,e){if(t.classList)t.classList.add(e);else{var s=t.className.split(" ");-1===s.indexOf(e)&&s.push(e),t.className=s.join(" ")}},removeClass:function(t,e){t.classList?t.classList.remove(e):t.className=t.className.replace(new RegExp("(^|\\b)"+e.split(" ").join("|")+"(\\b|$)","gi")," ")},debounce:function(t,e){var s=null;return function(){var o=arguments,n=this;s||(s=setTimeout(function(){return s=0,t.apply(n,o)},e))}}},e=function(e,s){var o=this;if(e){var n={menuItemSelector:'a[href^="#"]',activeClass:"active",threshold:15,hashTimeout:600,callback:null};this.element=e,this.options=t.extend(n,s),this.assignValues(),window.addEventListener("resize",t.debounce(function(){return o.assignValues()})),this.debouncedHashFn=t.debounce(function(){if(history.replaceState)history.replaceState(null,null,"#"+o.lastInViewElm.id);else{var e=t.scrollTop();window.location.hash=o.lastInViewElm,window.scrollTo(0,e)}},this.options.hashTimeout),this.cacheItems(),this.scrollFn()}};return e.prototype.assignValues=function(){this.currScrollTop=0,this.lastInViewElm=null,this.menuHeight=this.element.offsetHeight+this.options.threshold,this.menuItems=[].slice.call(this.element.querySelectorAll(this.options.menuItemSelector))},e.prototype.cacheItems=function(){this.scrollItems=this.menuItems.map(function(e){var s=e.dataset.target?document.querySelector(e.dataset.target):document.getElementById(e.getAttribute("href").slice(1));if(s){return{elm:e,target:s,offset:t.offset(s).top}}return!1}),this.scrollItems=this.scrollItems.filter(Boolean)},e.prototype.tick=function(){var t=this.currScrollTop+this.menuHeight,e=this.scrollItems.filter(function(e){return e.offset<t});this.activateItem(e.pop())},e.prototype.activateItem=function(e){var s=this,o=this.options.activeClass,n=this.options.callback;this.lastInViewElm!==e.target&&(this.lastInViewElm=e.target,this.scrollItems.forEach(function(i){t.removeClass(i.elm.parentNode,o),i.elm===e.elm&&(t.addClass(i.elm.parentNode,o),"function"==typeof n&&n.call(s,i),s.debouncedHashFn())}))},e.prototype.scrollFn=function(){var e=t.scrollTop();this.currScrollTop!==e&&(this.currScrollTop=e,this.tick()),window.requestAnimationFrame(this.scrollFn.bind(this))},e});

karma.conf.js

@@ -0,0 +0,0 @@ // Karma configuration

package.json

 {
   "name": "menuspy",
-  "version": "1.0.1",
+  "version": "1.1.1",
   "title": "MenuSpy",
@@ -34,2 +34,3 @@ "author": {
     "karma-phantomjs-launcher": "^1.0.2",
+    "rollup": "^0.45.2",
     "rollup-plugin-buble": "^0.13.0",
@@ -36,0 +37,0 @@ "rollup-plugin-eslint": "^2.0.2",

README.md

@@ -44,2 +44,8 @@ # MenuSpy
 
+You can also use `data-target` on the anchor element with a selector. Example:
+
+```html
+<a href="#anything" data-target="selector">Anything</a>
+```
+
 ```js
@@ -61,2 +67,2 @@ var elm = document.querySelector('#main-header');
 | `hashTimeout`      | Integer  | `600`                               | Timeout to apply browser's hash location.                                |
-| `callback`         | Function | `function(anchorElm, targetElm) {}` | A function to be called every time a new menu item activates.            |
+| `callback`         | Function | `function(currentItem) {}`          | A function to be called every time a new menu item activates.            |

src/menuspy.js

@@ -25,6 +25,6 @@ import utils from './utils.js';
       if (history.replaceState) {
-        history.replaceState(null, null, `#${this.lastId}`);
+        history.replaceState(null, null, `#${this.lastInViewElm.id}`);
       } else {
         const st = utils.scrollTop();
-        window.location.hash = this.lastId;
+        window.location.hash = this.lastInViewElm;
         window.scrollTo(0, st);
@@ -40,3 +40,3 @@ }
     this.currScrollTop = 0;
-    this.lastId = '';
+    this.lastInViewElm = null;
     this.menuHeight = this.element.offsetHeight + this.options.threshold;
@@ -47,12 +47,11 @@ this.menuItems = [].slice.call(this.element.querySelectorAll(this.options.menuItemSelector));
   cacheItems() {
-    this.scrollItems = this.menuItems.map((a) => {
-      const elm = document.querySelector(a.getAttribute('href'));
-      if (elm) {
-        const offset = utils.offset(elm).top;
-        return { elm, offset };
-      } else {
-        console.warn('MenuSpy warning: %s not found on page.', a.href);
+    this.scrollItems = this.menuItems.map((elm) => {
+      const target = elm.dataset.target ? document.querySelector(elm.dataset.target) : document.getElementById(elm.getAttribute('href').slice(1));
+      if (target) {
+        const offset = utils.offset(target).top;
+        return { elm, target, offset };
       }
+      return false;
     });
-    this.scrollItems = this.scrollItems.filter( Boolean );
+    this.scrollItems = this.scrollItems.filter(Boolean);
   }
@@ -63,4 +62,3 @@
     const inViewElms = this.scrollItems
-      .filter((item) => item.offset < fromTop)
-      .map((item) => item.elm);
+      .filter((item) => item.offset < fromTop);
 
@@ -71,17 +69,16 @@ this.activateItem(inViewElms.pop());
   activateItem(inViewElm) {
-    const id = inViewElm ? inViewElm.id : '';
     const activeClass = this.options.activeClass;
     const callback = this.options.callback;
 
-    if (this.lastId !== id) {
-      this.lastId = id;
+    if (inViewElm && this.lastInViewElm !== inViewElm.target) {
+      this.lastInViewElm = inViewElm.target;
 
-      this.menuItems.forEach((item) => {
-        utils.removeClass(item.parentNode, activeClass);
+      this.scrollItems.forEach((item) => {
+        utils.removeClass(item.elm.parentNode, activeClass);
 
-        if (item.getAttribute('href') === `#${id}`) {
-          utils.addClass(item.parentNode, activeClass);
+        if (item.elm === inViewElm.elm) {
+          utils.addClass(item.elm.parentNode, activeClass);
 
           if (typeof callback === 'function') {
-            callback.call(this, item, inViewElm);
+            callback.call(this, item);
           }
@@ -88,0 +85,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

66

increased by10%

Worsened metrics

Total package byte prevSize

41396

decreased by-0.07%

Dev dependency count

11

increased by10%

Lines of code

901

decreased by-0.55%

No dependency changes