scroll-into-view - npm Package Compare versions

Comparing version 1.15.0 to 1.16.0

LICENSE.txt

@@ -0,0 +0,0 @@ The MIT License (MIT)

package.json

 {
   "name": "scroll-into-view",
-  "version": "1.15.0",
+  "version": "1.16.0",
   "description": "scrolls an elements into view, recursively aligning parents.",
@@ -5,0 +5,0 @@ "main": "scrollIntoView.js",

README.md

@@ -59,3 +59,5 @@
         topOffset: pixels to offset top alignment
-        leftOffset: pixels to offset left alignment
+        leftOffset: pixels to offset left alignment,
+        lockX: boolean to prevent X scrolling,
+        lockY: boolean to prevent Y scrolling
     },
@@ -68,3 +70,3 @@
 
-        return defaultIsScrollable(target) || ~target.className.indexOf('scrollable');
+        return defaultIsScrollable(target) || target !== window && ~target.className.indexOf('scrollable');
     },
@@ -71,0 +73,0 @@

scrollIntoView.js

@@ -13,2 +13,5 @@ var COMPLETE = 'complete',
 function setElementScroll(element, x, y){
+    Math.max(0, x);
+    Math.max(0, y);
+
     if(element.self === element){
@@ -47,2 +50,4 @@ element.scrollTo(x, y);
         y -= topOffset;
+        x = scrollSettings.align.lockX ? parent.pageXOffset : x;
+        y = scrollSettings.align.lockY ? parent.pageYOffset : y;
         differenceX = x - parent.pageXOffset;
@@ -62,2 +67,4 @@ differenceY = y - parent.pageYOffset;
         y = Math.max(Math.min(y, parent.scrollHeight - parent.clientHeight), 0);
+        x = scrollSettings.align.lockX ? parent.scrollLeft : x;
+        y = scrollSettings.align.lockY ? parent.scrollTop : y;
         differenceX = x - parent.scrollLeft;
@@ -103,3 +110,6 @@ differenceY = y - parent.scrollTop;
         scrollSettings.endIterations++;
-        return animate(parent);
+        // Align ancestor synchronously
+        scrollSettings.scrollAncestor && animate(scrollSettings.scrollAncestor);
+        animate(parent);
+        return;
     }
@@ -114,3 +124,3 @@
 
-function transitionScrollTo(target, parent, settings, callback){
+function transitionScrollTo(target, parent, settings, scrollAncestor, callback){
     var idle = !parent._scrollSettings,
@@ -159,3 +169,4 @@ lastSettings = parent._scrollSettings,
         maxSynchronousAlignments: maxSynchronousAlignments,
-        end: end
+        end: end,
+        scrollAncestor
     };
@@ -227,2 +238,3 @@
     settings.ease = settings.ease || function(v){return 1 - Math.pow(1 - v, v / 2);};
+    settings.align = settings.align || {};
 
@@ -250,3 +262,3 @@ var parent = findParentElement(target),
 
-    var cancel;
+    var scrollingElements = [];
 
@@ -260,3 +272,3 @@ while(parent){
             parents++;
-            cancel = transitionScrollTo(target, parent, settings, done);
+            scrollingElements.push(parent);
         }
@@ -272,3 +284,3 @@
 
-    return cancel;
+    return scrollingElements.reduce((cancel, parent, index) => transitionScrollTo(target, parent, settings, scrollingElements[index + 1], done), null);
 };

scrollIntoView.min.js

 (function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(require,module,exports){
-var COMPLETE="complete",CANCELED="canceled";function raf(e){if("requestAnimationFrame"in window)return window.requestAnimationFrame(e);setTimeout(e,16)}function setElementScroll(e,t,n){e.self===e?e.scrollTo(t,n):(e.scrollLeft=t,e.scrollTop=n)}function getTargetScrollLocation(e,t){var n,l,i,o,r,a,s,f=e.align,c=e.target.getBoundingClientRect(),d=f&&null!=f.left?f.left:.5,u=f&&null!=f.top?f.top:.5,g=f&&null!=f.leftOffset?f.leftOffset:0,m=f&&null!=f.topOffset?f.topOffset:0,h=d,p=u;if(e.isWindow(t))a=Math.min(c.width,t.innerWidth),s=Math.min(c.height,t.innerHeight),l=c.left+t.pageXOffset-t.innerWidth*h+a*h,i=c.top+t.pageYOffset-t.innerHeight*p+s*p,i-=m,o=(l-=g)-t.pageXOffset,r=i-t.pageYOffset;else{a=c.width,s=c.height,n=t.getBoundingClientRect();var E=c.left-(n.left-t.scrollLeft),S=c.top-(n.top-t.scrollTop);l=E+a*h-t.clientWidth*h,i=S+s*p-t.clientHeight*p,l-=g,i-=m,l=Math.max(Math.min(l,t.scrollWidth-t.clientWidth),0),i=Math.max(Math.min(i,t.scrollHeight-t.clientHeight),0),o=l-t.scrollLeft,r=i-t.scrollTop}return{x:l,y:i,differenceX:o,differenceY:r}}function animate(e){var t=e._scrollSettings;if(t){var n=t.maxSynchronousAlignments,l=getTargetScrollLocation(t,e),i=Date.now()-t.startTime,o=Math.min(1/t.time*i,1);if(t.endIterations>=n)return setElementScroll(e,l.x,l.y),e._scrollSettings=null,t.end(COMPLETE);var r=1-t.ease(o);if(setElementScroll(e,l.x-l.differenceX*r,l.y-l.differenceY*r),i>=t.time)return t.endIterations++,animate(e);raf(animate.bind(null,e))}}function defaultIsWindow(e){return e.self===e}function transitionScrollTo(e,t,n,l){var i,o=!t._scrollSettings,r=t._scrollSettings,a=Date.now(),s={passive:!0};function f(e){t._scrollSettings=null,t.parentElement&&t.parentElement._scrollSettings&&t.parentElement._scrollSettings.end(e),n.debug&&console.log("Scrolling ended with type",e,"for",t),l(e),i&&(t.removeEventListener("touchstart",i,s),t.removeEventListener("wheel",i,s))}r&&r.end(CANCELED);var c=n.maxSynchronousAlignments;return null==c&&(c=3),t._scrollSettings={startTime:a,endIterations:0,target:e,time:n.time,ease:n.ease,align:n.align,isWindow:n.isWindow||defaultIsWindow,maxSynchronousAlignments:c,end:f},"cancellable"in n&&!n.cancellable||(i=f.bind(null,CANCELED),t.addEventListener("touchstart",i,s),t.addEventListener("wheel",i,s)),o&&animate(t),i}function defaultIsScrollable(e){return"pageXOffset"in e||(e.scrollHeight!==e.clientHeight||e.scrollWidth!==e.clientWidth)&&"hidden"!==getComputedStyle(e).overflow}function defaultValidTarget(){return!0}function findParentElement(e){if(e.assignedSlot)return findParentElement(e.assignedSlot);if(e.parentElement)return"BODY"===e.parentElement.tagName?e.parentElement.ownerDocument.defaultView||e.parentElement.ownerDocument.ownerWindow:e.parentElement;if(e.getRootNode){var t=e.getRootNode();if(11===t.nodeType)return t.host}}module.exports=function(e,t,n){if(e){"function"==typeof t&&(n=t,t=null),t||(t={}),t.time=isNaN(t.time)?1e3:t.time,t.ease=t.ease||function(e){return 1-Math.pow(1-e,e/2)};var l,i=findParentElement(e),o=1,r=t.validTarget||defaultValidTarget,a=t.isScrollable;for(t.debug&&(console.log("About to scroll to",e),i||console.error("Target did not have a parent, is it mounted in the DOM?"));i;)if(t.debug&&console.log("Scrolling parent node",i),r(i,o)&&(a?a(i,defaultIsScrollable):defaultIsScrollable(i))&&(o++,l=transitionScrollTo(e,i,t,s)),!(i=findParentElement(i))){s(COMPLETE);break}return l}function s(e){--o||n&&n(e)}};
+var COMPLETE="complete",CANCELED="canceled";function raf(e){if("requestAnimationFrame"in window)return window.requestAnimationFrame(e);setTimeout(e,16)}function setElementScroll(e,t,n){Math.max(0,t),Math.max(0,n),e.self===e?e.scrollTo(t,n):(e.scrollLeft=t,e.scrollTop=n)}function getTargetScrollLocation(e,t){var n,l,i,o,r,a,s,c=e.align,f=e.target.getBoundingClientRect(),d=c&&null!=c.left?c.left:.5,u=c&&null!=c.top?c.top:.5,g=c&&null!=c.leftOffset?c.leftOffset:0,m=c&&null!=c.topOffset?c.topOffset:0,h=d,p=u;if(e.isWindow(t))a=Math.min(f.width,t.innerWidth),s=Math.min(f.height,t.innerHeight),l=f.left+t.pageXOffset-t.innerWidth*h+a*h,i=f.top+t.pageYOffset-t.innerHeight*p+s*p,l-=g,i-=m,l=e.align.lockX?t.pageXOffset:l,i=e.align.lockY?t.pageYOffset:i,o=l-t.pageXOffset,r=i-t.pageYOffset;else{a=f.width,s=f.height,n=t.getBoundingClientRect();var E=f.left-(n.left-t.scrollLeft),S=f.top-(n.top-t.scrollTop);l=E+a*h-t.clientWidth*h,i=S+s*p-t.clientHeight*p,l-=g,i-=m,l=Math.max(Math.min(l,t.scrollWidth-t.clientWidth),0),i=Math.max(Math.min(i,t.scrollHeight-t.clientHeight),0),l=e.align.lockX?t.scrollLeft:l,i=e.align.lockY?t.scrollTop:i,o=l-t.scrollLeft,r=i-t.scrollTop}return{x:l,y:i,differenceX:o,differenceY:r}}function animate(e){var t=e._scrollSettings;if(t){var n=t.maxSynchronousAlignments,l=getTargetScrollLocation(t,e),i=Date.now()-t.startTime,o=Math.min(1/t.time*i,1);if(t.endIterations>=n)return setElementScroll(e,t.align.lockX?null:l.x,t.align.lockY?null:l.y),e._scrollSettings=null,t.end(COMPLETE);var r=1-t.ease(o);if(setElementScroll(e,l.x-l.differenceX*r,l.y-l.differenceY*r),i>=t.time)return t.endIterations++,t.scrollAncestor&&animate(t.scrollAncestor),void animate(e);raf(animate.bind(null,e))}}function defaultIsWindow(e){return e.self===e}function transitionScrollTo(e,t,n,l,i){var o,r=!t._scrollSettings,a=t._scrollSettings,s=Date.now(),c={passive:!0};function f(e){t._scrollSettings=null,t.parentElement&&t.parentElement._scrollSettings&&t.parentElement._scrollSettings.end(e),n.debug&&console.log("Scrolling ended with type",e,"for",t),i(e),o&&(t.removeEventListener("touchstart",o,c),t.removeEventListener("wheel",o,c))}a&&a.end(CANCELED);var d=n.maxSynchronousAlignments;return null==d&&(d=3),t._scrollSettings={startTime:s,endIterations:0,target:e,time:n.time,ease:n.ease,align:n.align,isWindow:n.isWindow||defaultIsWindow,maxSynchronousAlignments:d,end:f,scrollAncestor:l},"cancellable"in n&&!n.cancellable||(o=f.bind(null,CANCELED),t.addEventListener("touchstart",o,c),t.addEventListener("wheel",o,c)),r&&animate(t),o}function defaultIsScrollable(e){return"pageXOffset"in e||(e.scrollHeight!==e.clientHeight||e.scrollWidth!==e.clientWidth)&&"hidden"!==getComputedStyle(e).overflow}function defaultValidTarget(){return!0}function findParentElement(e){if(e.assignedSlot)return findParentElement(e.assignedSlot);if(e.parentElement)return"BODY"===e.parentElement.tagName?e.parentElement.ownerDocument.defaultView||e.parentElement.ownerDocument.ownerWindow:e.parentElement;if(e.getRootNode){var t=e.getRootNode();if(11===t.nodeType)return t.host}}module.exports=function(e,t,n){if(e){"function"==typeof t&&(n=t,t=null),t||(t={}),t.time=isNaN(t.time)?1e3:t.time,t.ease=t.ease||function(e){return 1-Math.pow(1-e,e/2)},t.align=t.align||{};var l=findParentElement(e),i=1,o=t.validTarget||defaultValidTarget,r=t.isScrollable;t.debug&&(console.log("About to scroll to",e),l||console.error("Target did not have a parent, is it mounted in the DOM?"));for(var a=[];l;)if(t.debug&&console.log("Scrolling parent node",l),o(l,i)&&(r?r(l,defaultIsScrollable):defaultIsScrollable(l))&&(i++,a.push(l)),!(l=findParentElement(l))){s(COMPLETE);break}return a.reduce((n,l,i)=>transitionScrollTo(e,l,t,a[i+1],s),null)}function s(e){--i||n&&n(e)}};
 
@@ -4,0 +4,0 @@ },{}],2:[function(require,module,exports){

standalone.js

 // This file is used by `npm run build` to output scrollIntoView.min.js
 window.scrollIntoView = require('./scrollIntoView');

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

22261

increased by7.64%

Lines of code

248

increased by5.08%

Number of lines in readme file

163

increased by1.24%

No dependency changes