dom-navigator - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

bower.json

 {
   "name": "dom-navigator",
   "description": "Library that allow keyboard navigation through DOM elements (←↑→↓).",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "main": "dist/dom-navigator.js",
@@ -6,0 +6,0 @@ "license": "MIT",

dist/dom-navigator.js

@@ -1,2 +0,2 @@
-/*! dom-navigator - v1.0.1 - 2014-08-16
+/*! dom-navigator - v1.0.2 - 2014-08-19
 * https://github.com/rmariuzzo/dom-navigator
@@ -72,2 +72,19 @@ * Copyright (c) 2014 Rubens Mariuzzo; Licensed MIT */
 
+  /**
+   * Indicates if a given element is fully visible in the viewport.
+   *
+   * @param el {Element} The element to check.
+   *
+   * @return {Boolean} True if the given element is fully visible in the viewport, otherwise false.
+   */
+  function inViewport(el) {
+    var rect = el.getBoundingClientRect();
+    return (
+      rect.top >= 0 &&
+      rect.left >= 0 &&
+      rect.bottom <= window.innerHeight &&
+      rect.right <= window.innerWidth
+    );
+  }
+
   //-------------//
@@ -316,2 +333,3 @@ // Constructor //
   Navigator.prototype.scrollTo = function(el, direction) {
+    el = unboxElement(el);
     if (!this.inContainerViewport(el)) {
@@ -332,2 +350,17 @@ switch (direction) {
       }
+    } else if (!inViewport(el)) {
+      switch (direction) {
+        case DIRECTION.left:
+          document.body.scrollLeft = el.offsetLeft - document.body.offsetLeft;
+          break;
+        case DIRECTION.up:
+          document.body.scrollTop = el.offsetTop - document.body.offsetTop;
+          break;
+        case DIRECTION.right:
+          document.body.scrollLeft = el.offsetLeft - document.body.offsetLeft - (document.documentElement.clientWidth - el.offsetWidth);
+          break;
+        case DIRECTION.down:
+          document.body.scrollTop = el.offsetTop - document.body.offsetTop - (document.documentElement.clientHeight - el.offsetHeight);
+          break;
+      }
     }
@@ -334,0 +367,0 @@ };

dist/dom-navigator.min.js

@@ -1,4 +0,4 @@
-/*! dom-navigator - v1.0.1 - 2014-08-16
+/*! dom-navigator - v1.0.2 - 2014-08-19
 * https://github.com/rmariuzzo/dom-navigator
 * Copyright (c) 2014 Rubens Mariuzzo; Licensed MIT */
-!function(a){"function"==typeof define&&define.amd?define([],function(){return a(window.jQuery)}):a(window.jQuery)}(function(a){function b(a){a=a||{};for(var b=1;b<arguments.length;b++)if(arguments[b])for(var c in arguments[b])arguments[b].hasOwnProperty(c)&&(a[c]=arguments[b][c]);return a}function c(a,b){a.classList?a.classList.add(b):a.className+=" "+b}function d(a,b){a.classList?a.classList.remove(b):a.className=a.className.replace(new RegExp("(^|\\b)"+b.split(" ").join("|")+"(\\b|$)","gi")," ")}function e(a){return a.jquery||Array.isArray(a)?a[0]:a}var f=function(a,c){this.$doc=window.document,this.$container=a,this.$options=b({},f.defaults,c),this.$selected=null,this.$keydownHandler=null,this.$keys={},this.$keys[this.$options.left]=this.left,this.$keys[this.$options.up]=this.up,this.$keys[this.$options.right]=this.right,this.$keys[this.$options.down]=this.down,this.enable()};f.defaults={selected:"selected",left:37,up:38,right:39,down:40};var g={left:"left",up:"up",right:"right",down:"down"};if(f.prototype.enable=function(){var a=this;this.$keydownHandler=function(b){a.handleKeydown.call(a,b)},this.$doc.addEventListener("keydown",this.$keydownHandler)},f.prototype.disable=function(){this.$keydownHandler&&this.$doc.removeEventListener("keydown",this.$keydownHandler)},f.prototype.destroy=function(){this.disable(),this.$container.domNavigator&&delete this.$container.domNavigator},f.prototype.left=function(){if(this.$selected){var a=this.$selected.offsetLeft-1,b=this.$selected.offsetTop,c=this.elementsBefore(a,1/0).reduce(function(c,d){var e=Math.abs(a-d.offsetLeft)+Math.abs(b-d.offsetTop);return e<c.distance?{distance:e,element:d}:c},{distance:1/0});this.select(c.element,g.left)}else this.select(this.elements()[0])},f.prototype.up=function(){if(this.$selected){var a=this.$selected.offsetLeft,b=this.$selected.offsetTop-1,c=this.elementsBefore(1/0,b).reduce(function(c,d){var e=Math.abs(a-d.offsetLeft)+Math.abs(b-d.offsetTop);return e<c.distance?{distance:e,element:d}:c},{distance:1/0});this.select(c.element,g.up)}else this.select(this.elements()[0])},f.prototype.right=function(){if(this.$selected){var a=this.$selected.offsetLeft+this.$selected.offsetWidth,b=this.$selected.offsetTop,c=this.elementsAfter(a,0).reduce(function(c,d){var e=Math.abs(d.offsetLeft-a)+Math.abs(d.offsetTop-b);return e<c.distance?{distance:e,element:d}:c},{distance:1/0});this.select(c.element,g.right)}else this.select(this.elements()[0])},f.prototype.down=function(){if(this.$selected){var a=this.$selected.offsetLeft,b=this.$selected.offsetTop+this.$selected.offsetHeight,c=this.elementsAfter(0,b).reduce(function(c,d){var e=Math.abs(d.offsetLeft-a)+Math.abs(d.offsetTop-b);return e<c.distance?{distance:e,element:d}:c},{distance:1/0});this.select(c.element,g.down)}else this.select(this.elements()[0])},f.prototype.selected=function(){return this.$selected},f.prototype.select=function(a,b){a&&a!==this.$selected&&(a=e(a),this.$selected&&d(this.$selected,this.$options.selected),this.scrollTo(a,b),c(a,this.$options.selected),this.$selected=a)},f.prototype.scrollTo=function(a,b){if(!this.inContainerViewport(a))switch(b){case g.left:break;case g.up:this.$container.scrollTop=a.offsetTop-this.$container.offsetTop;break;case g.right:break;case g.down:this.$container.scrollTop=a.offsetTop-this.$container.offsetTop-(this.$container.offsetHeight-a.offsetHeight)}},f.prototype.inContainerViewport=function(a){return a=e(a),a.offsetLeft-this.$container.scrollLeft<this.$container.offsetLeft?!1:a.offsetTop-this.$container.scrollTop<this.$container.offsetTop?!1:a.offsetLeft+a.offsetWidth-this.$container.scrollLeft>this.$container.offsetLeft+this.$container.offsetWidth?!1:a.offsetTop+a.offsetHeight-this.$container.scrollTop>this.$container.offsetTop+this.$container.offsetHeight?!1:!0},f.prototype.elements=function(){for(var a=[],b=this.$container.children.length;b--;)8!==this.$container.children[b].nodeType&&a.unshift(this.$container.children[b]);return a},f.prototype.elementsAfter=function(a,b){return this.elements().filter(function(c){return c.offsetLeft>=a&&c.offsetTop>=b})},f.prototype.elementsBefore=function(a,b){return this.elements().filter(function(c){return c.offsetLeft<=a&&c.offsetTop<=b})},f.prototype.handleKeydown=function(a){this.$keys[a.which]&&(a.preventDefault(),this.$keys[a.which].call(this))},window.DomNavigator=f,a){var h=a.fn.domNavigator;a.fn.domNavigator=function(a){var b,c=Array.prototype.slice.call(arguments,1);return this.each(function(){this.domNavigator||(this.domNavigator=new f(this,"object"==typeof a&&a)),"string"==typeof a&&this.domNavigator[a]&&(b=this.domNavigator[a].apply(this.domNavigator,c))}),void 0===b&&(b=this),b},a.fn.domNavigator.Constructor=f,a.fn.domNavigator.noConflict=function(){return a.fn.domNavigator=h,this}}});
+!function(a){"function"==typeof define&&define.amd?define([],function(){return a(window.jQuery)}):a(window.jQuery)}(function(a){function b(a){a=a||{};for(var b=1;b<arguments.length;b++)if(arguments[b])for(var c in arguments[b])arguments[b].hasOwnProperty(c)&&(a[c]=arguments[b][c]);return a}function c(a,b){a.classList?a.classList.add(b):a.className+=" "+b}function d(a,b){a.classList?a.classList.remove(b):a.className=a.className.replace(new RegExp("(^|\\b)"+b.split(" ").join("|")+"(\\b|$)","gi")," ")}function e(a){return a.jquery||Array.isArray(a)?a[0]:a}function f(a){var b=a.getBoundingClientRect();return b.top>=0&&b.left>=0&&b.bottom<=window.innerHeight&&b.right<=window.innerWidth}var g=function(a,c){this.$doc=window.document,this.$container=a,this.$options=b({},g.defaults,c),this.$selected=null,this.$keydownHandler=null,this.$keys={},this.$keys[this.$options.left]=this.left,this.$keys[this.$options.up]=this.up,this.$keys[this.$options.right]=this.right,this.$keys[this.$options.down]=this.down,this.enable()};g.defaults={selected:"selected",left:37,up:38,right:39,down:40};var h={left:"left",up:"up",right:"right",down:"down"};if(g.prototype.enable=function(){var a=this;this.$keydownHandler=function(b){a.handleKeydown.call(a,b)},this.$doc.addEventListener("keydown",this.$keydownHandler)},g.prototype.disable=function(){this.$keydownHandler&&this.$doc.removeEventListener("keydown",this.$keydownHandler)},g.prototype.destroy=function(){this.disable(),this.$container.domNavigator&&delete this.$container.domNavigator},g.prototype.left=function(){if(this.$selected){var a=this.$selected.offsetLeft-1,b=this.$selected.offsetTop,c=this.elementsBefore(a,1/0).reduce(function(c,d){var e=Math.abs(a-d.offsetLeft)+Math.abs(b-d.offsetTop);return e<c.distance?{distance:e,element:d}:c},{distance:1/0});this.select(c.element,h.left)}else this.select(this.elements()[0])},g.prototype.up=function(){if(this.$selected){var a=this.$selected.offsetLeft,b=this.$selected.offsetTop-1,c=this.elementsBefore(1/0,b).reduce(function(c,d){var e=Math.abs(a-d.offsetLeft)+Math.abs(b-d.offsetTop);return e<c.distance?{distance:e,element:d}:c},{distance:1/0});this.select(c.element,h.up)}else this.select(this.elements()[0])},g.prototype.right=function(){if(this.$selected){var a=this.$selected.offsetLeft+this.$selected.offsetWidth,b=this.$selected.offsetTop,c=this.elementsAfter(a,0).reduce(function(c,d){var e=Math.abs(d.offsetLeft-a)+Math.abs(d.offsetTop-b);return e<c.distance?{distance:e,element:d}:c},{distance:1/0});this.select(c.element,h.right)}else this.select(this.elements()[0])},g.prototype.down=function(){if(this.$selected){var a=this.$selected.offsetLeft,b=this.$selected.offsetTop+this.$selected.offsetHeight,c=this.elementsAfter(0,b).reduce(function(c,d){var e=Math.abs(d.offsetLeft-a)+Math.abs(d.offsetTop-b);return e<c.distance?{distance:e,element:d}:c},{distance:1/0});this.select(c.element,h.down)}else this.select(this.elements()[0])},g.prototype.selected=function(){return this.$selected},g.prototype.select=function(a,b){a&&a!==this.$selected&&(a=e(a),this.$selected&&d(this.$selected,this.$options.selected),this.scrollTo(a,b),c(a,this.$options.selected),this.$selected=a)},g.prototype.scrollTo=function(a,b){if(a=e(a),this.inContainerViewport(a)){if(!f(a))switch(b){case h.left:document.body.scrollLeft=a.offsetLeft-document.body.offsetLeft;break;case h.up:document.body.scrollTop=a.offsetTop-document.body.offsetTop;break;case h.right:document.body.scrollLeft=a.offsetLeft-document.body.offsetLeft-(document.documentElement.clientWidth-a.offsetWidth);break;case h.down:document.body.scrollTop=a.offsetTop-document.body.offsetTop-(document.documentElement.clientHeight-a.offsetHeight)}}else switch(b){case h.left:break;case h.up:this.$container.scrollTop=a.offsetTop-this.$container.offsetTop;break;case h.right:break;case h.down:this.$container.scrollTop=a.offsetTop-this.$container.offsetTop-(this.$container.offsetHeight-a.offsetHeight)}},g.prototype.inContainerViewport=function(a){return a=e(a),a.offsetLeft-this.$container.scrollLeft<this.$container.offsetLeft?!1:a.offsetTop-this.$container.scrollTop<this.$container.offsetTop?!1:a.offsetLeft+a.offsetWidth-this.$container.scrollLeft>this.$container.offsetLeft+this.$container.offsetWidth?!1:a.offsetTop+a.offsetHeight-this.$container.scrollTop>this.$container.offsetTop+this.$container.offsetHeight?!1:!0},g.prototype.elements=function(){for(var a=[],b=this.$container.children.length;b--;)8!==this.$container.children[b].nodeType&&a.unshift(this.$container.children[b]);return a},g.prototype.elementsAfter=function(a,b){return this.elements().filter(function(c){return c.offsetLeft>=a&&c.offsetTop>=b})},g.prototype.elementsBefore=function(a,b){return this.elements().filter(function(c){return c.offsetLeft<=a&&c.offsetTop<=b})},g.prototype.handleKeydown=function(a){this.$keys[a.which]&&(a.preventDefault(),this.$keys[a.which].call(this))},window.DomNavigator=g,a){var i=a.fn.domNavigator;a.fn.domNavigator=function(a){var b,c=Array.prototype.slice.call(arguments,1);return this.each(function(){this.domNavigator||(this.domNavigator=new g(this,"object"==typeof a&&a)),"string"==typeof a&&this.domNavigator[a]&&(b=this.domNavigator[a].apply(this.domNavigator,c))}),void 0===b&&(b=this),b},a.fn.domNavigator.Constructor=g,a.fn.domNavigator.noConflict=function(){return a.fn.domNavigator=i,this}}});

package.json

 {
   "name": "dom-navigator",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Library that allow keyboard navigation through DOM elements (←↑→↓).",
@@ -5,0 +5,0 @@ "keywords": [

src/dom-navigator.js

@@ -77,2 +77,19 @@ /*
 
+  /**
+   * Indicates if a given element is fully visible in the viewport.
+   *
+   * @param el {Element} The element to check.
+   *
+   * @return {Boolean} True if the given element is fully visible in the viewport, otherwise false.
+   */
+  function inViewport(el) {
+    var rect = el.getBoundingClientRect();
+    return (
+      rect.top >= 0 &&
+      rect.left >= 0 &&
+      rect.bottom <= window.innerHeight &&
+      rect.right <= window.innerWidth
+    );
+  }
+
   //-------------//
@@ -321,2 +338,3 @@ // Constructor //
   Navigator.prototype.scrollTo = function(el, direction) {
+    el = unboxElement(el);
     if (!this.inContainerViewport(el)) {
@@ -337,2 +355,17 @@ switch (direction) {
       }
+    } else if (!inViewport(el)) {
+      switch (direction) {
+        case DIRECTION.left:
+          document.body.scrollLeft = el.offsetLeft - document.body.offsetLeft;
+          break;
+        case DIRECTION.up:
+          document.body.scrollTop = el.offsetTop - document.body.offsetTop;
+          break;
+        case DIRECTION.right:
+          document.body.scrollLeft = el.offsetLeft - document.body.offsetLeft - (document.documentElement.clientWidth - el.offsetWidth);
+          break;
+        case DIRECTION.down:
+          document.body.scrollTop = el.offsetTop - document.body.offsetTop - (document.documentElement.clientHeight - el.offsetHeight);
+          break;
+      }
     }
@@ -339,0 +372,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

Total package byte prevSize

88546

increased by3.41%

Lines of code

1469

increased by4.56%

No dependency changes