Browse Source

Update scroll behavior polyfill to version 2.0.6

tags/v1.0.0
hawkeye116477 6 years ago
parent
commit
85c42cfa81
No account linked to committer's email address
1 changed files with 31 additions and 63 deletions
  1. 31
    63
      assets/js/scroll-behavior-polyfill.js

+ 31
- 63
assets/js/scroll-behavior-polyfill.js View File

@@ -1,6 +1,6 @@
// https://www.jsdelivr.com/package/npm/scroll-behavior-polyfill?path=dist
/*!
scroll-behavior-polyfill 2.0.4
scroll-behavior-polyfill 2.0.6
license: MIT (https://github.com/wessberg/scroll-behavior-polyfill/blob/master/LICENSE.md)
Copyright © 2019 Frederik Wessberg <frederikwessberg@hotmail.com>
*/
@@ -14,6 +14,8 @@
*/
var SUPPORTS_SCROLL_BEHAVIOR = "scrollBehavior" in document.documentElement.style;


/*! *****************************************************************************
Copyright (c) Microsoft Corporation. All rights reserved.
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
@@ -112,6 +114,8 @@
return value;
}


var HALF = 0.5;
/**
* The easing function to use when applying the smooth scrolling
@@ -136,12 +140,12 @@
var timeLapsed = 0;
var distanceX = endX - startX;
var distanceY = endY - startY;
var speed = Math.max(Math.abs(distanceX / 1000 * SCROLL_TIME), Math.abs(distanceY / 1000 * SCROLL_TIME));
var speed = Math.max(Math.abs((distanceX / 1000) * SCROLL_TIME), Math.abs((distanceY / 1000) * SCROLL_TIME));
requestAnimationFrame(function animate(timestamp) {
timeLapsed += timestamp - startTime;
var percentage = Math.max(0, Math.min(1, speed === 0 ? 0 : (timeLapsed / speed)));
var positionX = Math.floor(startX + (distanceX * ease(percentage)));
var positionY = Math.floor(startY + (distanceY * ease(percentage)));
var percentage = Math.max(0, Math.min(1, speed === 0 ? 0 : timeLapsed / speed));
var positionX = Math.floor(startX + distanceX * ease(percentage));
var positionY = Math.floor(startY + distanceY * ease(percentage));
method(positionX, positionY);
if (positionX !== endX || positionY !== endY) {
requestAnimationFrame(animate);
@@ -159,6 +163,8 @@
return Date.now();
}


var ELEMENT_ORIGINAL_SCROLL = Element.prototype.scroll;

var WINDOW_ORIGINAL_SCROLL = window.scroll;
@@ -267,12 +273,8 @@
startTime: startTime,
startX: startX,
startY: startY,
endX: Math.floor(kind === "scrollBy"
? startX + x
: x),
endY: Math.floor(kind === "scrollBy"
? startY + y
: y),
endX: Math.floor(kind === "scrollBy" ? startX + x : x),
endY: Math.floor(kind === "scrollBy" ? startY + y : y),
method: getOriginalScrollMethodForKind("scrollTo", window).bind(window)
};
}
@@ -284,12 +286,8 @@
startTime: startTime,
startX: startX,
startY: startY,
endX: Math.floor(kind === "scrollBy"
? startX + x
: x),
endY: Math.floor(kind === "scrollBy"
? startY + y
: y),
endX: Math.floor(kind === "scrollBy" ? startX + x : x),
endY: Math.floor(kind === "scrollBy" ? startY + y : y),
method: getOriginalScrollMethodForKind("scrollTo", element).bind(element)
};
}
@@ -446,7 +444,7 @@
if ("nodeType" in currentElement && currentElement.nodeType === 1) {
return currentElement.parentNode;
}
if ("ShadowRoot" in window && (currentElement instanceof window.ShadowRoot)) {
if ("ShadowRoot" in window && currentElement instanceof window.ShadowRoot) {
return currentElement.host;
}
else if (currentElement === document) {
@@ -474,8 +472,7 @@
function isScrollable(element) {
if (element.clientHeight < element.scrollHeight || element.clientWidth < element.scrollWidth) {
var style = getComputedStyle(element, null);
return (canOverflow(style.overflowY) ||
canOverflow(style.overflowX));
return canOverflow(style.overflowY) || canOverflow(style.overflowX);
}
return false;
}
@@ -516,7 +513,7 @@
function findNearestRoot(target) {
var currentElement = target;
while (currentElement != null) {
if ("ShadowRoot" in window && (currentElement instanceof window.ShadowRoot)) {
if ("ShadowRoot" in window && currentElement instanceof window.ShadowRoot) {
// Assume this is a ShadowRoot
return currentElement;
}
@@ -546,14 +543,13 @@
return;
var hrefAttributeValue = e.target.getAttribute("href");
// Only work with HTMLAnchorElements that navigates to a specific ID
if (hrefAttributeValue == null || !hrefAttributeValue.startsWith("#"))
if (hrefAttributeValue == null || !hrefAttributeValue.startsWith("#")) {
return;
}
// Find the nearest root, whether it be a ShadowRoot or the document itself
var root = findNearestRoot(e.target);
// Attempt to match the selector from that root. querySelector' doesn't support IDs that start with a digit, so work around that limitation
var elementMatch = hrefAttributeValue.match(ID_WITH_LEADING_DIGIT_REGEXP) != null
? root.getElementById(hrefAttributeValue.slice(1))
: root.querySelector(hrefAttributeValue);
var elementMatch = hrefAttributeValue.match(ID_WITH_LEADING_DIGIT_REGEXP) != null ? root.getElementById(hrefAttributeValue.slice(1)) : root.querySelector(hrefAttributeValue);
// If no selector could be found, don't proceed
if (elementMatch == null)
return;
@@ -608,9 +604,7 @@
* └───────────┘
* ┗ ━ ━ ━ ━ ┛
*/
if ((elementEdgeStart < scrollingEdgeStart &&
elementEdgeEnd > scrollingEdgeEnd) ||
(elementEdgeStart > scrollingEdgeStart && elementEdgeEnd < scrollingEdgeEnd)) {
if ((elementEdgeStart < scrollingEdgeStart && elementEdgeEnd > scrollingEdgeEnd) || (elementEdgeStart > scrollingEdgeStart && elementEdgeEnd < scrollingEdgeEnd)) {
return 0;
}
/**
@@ -652,8 +646,7 @@
* └───────────┘ └───────────┘
* ┗ ━ ━ ━ ━ ┛ ┗ ━ ━ ━ ━ ┛
*/
if ((elementEdgeStart <= scrollingEdgeStart && elementSize <= scrollingSize) ||
(elementEdgeEnd >= scrollingEdgeEnd && elementSize >= scrollingSize)) {
if ((elementEdgeStart <= scrollingEdgeStart && elementSize <= scrollingSize) || (elementEdgeEnd >= scrollingEdgeEnd && elementSize >= scrollingSize)) {
return elementEdgeStart - scrollingEdgeStart - scrollingBorderStart;
}
/**
@@ -696,8 +689,7 @@
* ┗ ━ ━ ━ ━ ┛ ┗ ━ ━ ━ ━ ┛
*
*/
if ((elementEdgeEnd > scrollingEdgeEnd && elementSize < scrollingSize) ||
(elementEdgeStart < scrollingEdgeStart && elementSize > scrollingSize)) {
if ((elementEdgeEnd > scrollingEdgeEnd && elementSize < scrollingSize) || (elementEdgeStart < scrollingEdgeStart && elementSize > scrollingSize)) {
return elementEdgeEnd - scrollingEdgeEnd + scrollingBorderEnd;
}
return 0;
@@ -711,26 +703,14 @@
// and viewport dimensions on window.innerWidth/Height
// https://www.quirksmode.org/mobile/viewports2.html
// https://bokand.github.io/viewport/index.html
var viewportWidth = window.visualViewport != null
? visualViewport.width
: innerWidth;
var viewportHeight = window.visualViewport != null
? visualViewport.height
: innerHeight;
var viewportWidth = window.visualViewport != null ? visualViewport.width : innerWidth;
var viewportHeight = window.visualViewport != null ? visualViewport.height : innerHeight;
var viewportX = window.scrollX != null ? window.scrollX : window.pageXOffset;
var viewportY = window.scrollY != null ? window.scrollY : window.pageYOffset;
var _a = target.getBoundingClientRect(), targetHeight = _a.height, targetWidth = _a.width, targetTop = _a.top, targetRight = _a.right, targetBottom = _a.bottom, targetLeft = _a.left;
// These values mutate as we loop through and generate scroll coordinates
var targetBlock = block === "start" || block === "nearest"
? targetTop
: block === "end"
? targetBottom
: targetTop + targetHeight / 2; // block === 'center
var targetInline = inline === "center"
? targetLeft + targetWidth / 2
: inline === "end"
? targetRight
: targetLeft; // inline === 'start || inline === 'nearest
var targetBlock = block === "start" || block === "nearest" ? targetTop : block === "end" ? targetBottom : targetTop + targetHeight / 2; // block === 'center
var targetInline = inline === "center" ? targetLeft + targetWidth / 2 : inline === "end" ? targetRight : targetLeft; // inline === 'start || inline === 'nearest
var _b = scroller.getBoundingClientRect(), height = _b.height, width = _b.width, top = _b.top, right = _b.right, bottom = _b.bottom, left = _b.left;
var frameStyle = getComputedStyle(scroller);
var borderLeft = parseInt(frameStyle.borderLeftWidth, 10);
@@ -741,18 +721,8 @@
var inlineScroll = 0;
// The property existance checks for offset[Width|Height] is because only HTMLElement objects have them, but any Element might pass by here
// @TODO find out if the "as HTMLElement" overrides can be dropped
var scrollbarWidth = "offsetWidth" in scroller
? scroller.offsetWidth -
scroller.clientWidth -
borderLeft -
borderRight
: 0;
var scrollbarHeight = "offsetHeight" in scroller
? scroller.offsetHeight -
scroller.clientHeight -
borderTop -
borderBottom
: 0;
var scrollbarWidth = "offsetWidth" in scroller ? scroller.offsetWidth - scroller.clientWidth - borderLeft - borderRight : 0;
var scrollbarHeight = "offsetHeight" in scroller ? scroller.offsetHeight - scroller.clientHeight - borderTop - borderBottom : 0;
if (scrollingElement === scroller) {
// Handle viewport logic (document.documentElement or document.body)
if (block === "start") {
@@ -843,9 +813,7 @@
: arg;
// Find the nearest ancestor that can be scrolled
var _a = __read(findNearestAncestorsWithScrollBehavior(this), 2), ancestorWithScroll = _a[0], ancestorWithScrollBehavior = _a[1];
var behavior = normalizedOptions.behavior != null
? normalizedOptions.behavior
: ancestorWithScrollBehavior;
var behavior = normalizedOptions.behavior != null ? normalizedOptions.behavior : ancestorWithScrollBehavior;
// If the behavior isn't smooth, simply invoke the original implementation and do no more
if (behavior !== "smooth") {
// Assert that 'scrollIntoView' is actually defined

Loading…
Cancel
Save