Comparing version 3.0.0-beta.8 to 3.0.0-beta.10
88
all.js
@@ -1,77 +0,13 @@ | ||
import { gsap, Power0, Power1, Power2, Power3, Power4, Linear, Quad, Cubic, Quart, Quint, Strong, Elastic, Back, SteppedEase, Bounce, Sine, Expo, Circ, TweenMax, TweenLite, TimelineLite, TimelineMax } from "./gsap-core.js"; | ||
import { CSSPlugin } from "./CSSPlugin.js"; | ||
import { MotionPathPlugin } from "./MotionPathPlugin.js"; | ||
import { PixiPlugin } from "./PixiPlugin.js"; | ||
import { Draggable } from "./Draggable.js"; | ||
import { EasePack, ExpoScaleEase, RoughEase, SlowMo } from "./EasePack.js"; | ||
import { ScrollToPlugin } from "./ScrollToPlugin.js"; | ||
//BONUS IMPORTS | ||
//import { CustomBounce } from "./CustomBounce.js"; | ||
//import { CustomEase } from "./CustomEase.js"; | ||
//import { CustomWiggle } from "./CustomWiggle.js"; | ||
//import { DrawSVGPlugin } from "./DrawSVGPlugin.js"; | ||
//import { InertiaPlugin } from "./InertiaPlugin.js"; | ||
//import { VelocityTracker } from "./utils/VelocityTracker.js"; | ||
//import { MorphSVGPlugin } from "./MorphSVGPlugin.js"; | ||
//import { MotionPathHelper } from "./MotionPathHelper.js"; | ||
//import { ScrambleTextPlugin } from "./ScrambleTextPlugin.js"; | ||
//import { SplitText } from "./SplitText.js"; | ||
import gsap from "./gsap-core.js"; | ||
import CSSPlugin from "./CSSPlugin.js"; | ||
gsap.registerPlugin(CSSPlugin); | ||
export { | ||
//-- CORE -- | ||
gsap, | ||
gsap as default, | ||
CSSPlugin, | ||
TweenMax, | ||
TweenLite, | ||
TimelineMax, | ||
TimelineLite, | ||
Power0, | ||
Power1, | ||
Power2, | ||
Power3, | ||
Power4, | ||
Linear, | ||
Quad, | ||
Cubic, | ||
Quart, | ||
Quint, | ||
Strong, | ||
Elastic, | ||
Back, | ||
SteppedEase, | ||
Bounce, | ||
Sine, | ||
Expo, | ||
Circ, | ||
//-- PLUGINS -- | ||
Draggable, | ||
MotionPathPlugin, | ||
PixiPlugin, | ||
ScrollToPlugin, | ||
//-- EASE PACK -- | ||
ExpoScaleEase, | ||
RoughEase, | ||
SlowMo, | ||
EasePack | ||
//-- BONUS -- | ||
// CustomBounce, | ||
// CustomEase, | ||
// CustomWiggle, | ||
// DrawSVGPlugin, | ||
// InertiaPlugin, | ||
// MorphSVGPlugin, | ||
// MotionPathHelper, | ||
// ScrambleTextPlugin, | ||
// SplitText, | ||
// VelocityTracker | ||
}; | ||
export { gsap as default, gsap, CSSPlugin }; | ||
export { TweenMax, TweenLite, TimelineMax, TimelineLite, Power0, Power1, Power2, Power3, Power4, Linear, Quad, Cubic, Quart, Quint, Strong, Elastic, Back, SteppedEase, Bounce, Sine, Expo, Circ, wrap, wrapYoyo, distribute, random, snap, normalize, getUnit, clamp, splitColor, toArray, mapRange, pipe, unitize, interpolate } from "./gsap-core.js"; | ||
export * from "./Draggable.js"; | ||
export * from "./CSSRulePlugin.js"; | ||
export * from "./EaselPlugin.js"; | ||
export * from "./EasePack.js"; | ||
export * from "./MotionPathPlugin.js"; | ||
export * from "./PixiPlugin.js"; | ||
export * from "./ScrollToPlugin.js"; | ||
export * from "./TextPlugin.js"; |
2212
CSSPlugin.js
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-10-02 | ||
* http://greensock.com | ||
* CSSPlugin 3.0.0-beta.10 | ||
* https://greensock.com | ||
* | ||
* Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/ | ||
/* eslint-disable */ | ||
import {gsap, _getProperty, _numExp, _getUnit, _isString, _isUndefined, _renderComplexString, _relExp, _forEachName, _sortPropTweensByPriority, _colorStringFilter, _checkPlugin, _replaceRandom, _plugins, GSCache, PropTween, _config, _ticker, _round, _warn, _getSetter, | ||
_setDefaults, _removeLinkedListItem //for the commented-out className feature. | ||
import { gsap, _getProperty, _numExp, getUnit, _isString, _isUndefined, _renderComplexString, _relExp, _forEachName, _sortPropTweensByPriority, _colorStringFilter, _checkPlugin, _replaceRandom, _plugins, GSCache, PropTween, _config, _ticker, _round, _warn, _getSetter, _setDefaults, _removeLinkedListItem //for the commented-out className feature. | ||
} from "./gsap-core.js"; | ||
let _win, _doc, _docElement, _pluginInitted, _tempDiv, _tempDivStyler, _recentSetterPlugin, | ||
_windowExists = () => typeof(window) !== "undefined", | ||
_transformProps = {}, | ||
_RAD2DEG = 180 / Math.PI, | ||
_DEG2RAD = Math.PI / 180, | ||
_atan2 = Math.atan2, | ||
_bigNum = 1e8, | ||
_capsExp = /([A-Z])/g, | ||
_numWithUnitExp = /[-+=\.]*\d+[\.e-]*\d*[a-z%]*/g, | ||
_horizontalExp = /(?:left|right|width|margin|padding|x)/i, | ||
_complexExp = /[\s,\(]\S/, | ||
_propertyAliases = {autoAlpha:"opacity,visibility", scale:"scaleX,scaleY", alpha:"opacity"}, | ||
_renderCSSProp = (ratio, data) => data.set(data.t, data.p, (~~((data.s + data.c * ratio) * 10000) / 10000) + data.u, data), | ||
_renderPropWithEnd = (ratio, data) => data.set(data.t, data.p, ratio === 1 ? data.e : (~~((data.s + data.c * ratio) * 10000) / 10000) + data.u, data), | ||
_renderCSSPropWithBeginning = (ratio, data) => data.set(data.t, data.p, ratio ? (~~((data.s + data.c * ratio) * 10000) / 10000) + data.u : data.b, data), //if units change, we need a way to render the original unit/value when the tween goes all the way back to the beginning (ratio:0) | ||
_renderRoundedCSSProp = (ratio, data) => { | ||
let value = data.s + data.c * ratio; | ||
data.set(data.t, data.p, ~~(value + (value < 0 ? -.5 : .5)) + data.u, data); | ||
}, | ||
_renderNonTweeningValue = (ratio, data) => data.set(data.t, data.p, ratio ? data.e : data.b, data), | ||
_renderNonTweeningValueOnlyAtEnd = (ratio, data) => data.set(data.t, data.p, ratio !== 1 ? data.b : data.e, data), | ||
_setterCSSStyle = (target, property, value) => target.style[property] = value, | ||
_setterTransform = (target, property, value) => target._gsap[property] = value, | ||
_setterScale = (target, property, value) => target._gsap.scaleX = target._gsap.scaleY = value, | ||
_setterScaleWithRender = (target, property, value, data, ratio) => { | ||
let cache = target._gsap; | ||
cache.scaleX = cache.scaleY = value; | ||
cache.renderTransform(ratio, cache); | ||
}, | ||
_setterTransformWithRender = (target, property, value, data, ratio) => { | ||
let cache = target._gsap; | ||
cache[property] = value; | ||
cache.renderTransform(ratio, cache); | ||
}, | ||
_transformProp = "transform", | ||
_transformOriginProp = _transformProp + "Origin", | ||
_supports3D, | ||
_createElement = (type, ns) => { | ||
let e = _doc.createElementNS ? _doc.createElementNS((ns || "http://www.w3.org/1999/xhtml").replace(/^https/, "http"), type) : _doc.createElement(type); //some servers swap in https for http in the namespace which can break things, making "style" inaccessible. | ||
return e.style ? e : _doc.createElement(type); //some environments won't allow access to the element's style when created with a namespace in which case we default to the standard createElement() to work around the issue. Also note that when GSAP is embedded directly inside an SVG file, createElement() won't allow access to the style object in Firefox (see https://greensock.com/forums/topic/20215-problem-using-tweenmax-in-standalone-self-containing-svg-file-err-cannot-set-property-csstext-of-undefined/). | ||
}, | ||
_getComputedProperty = (target, property) => { | ||
let cs = getComputedStyle(target); | ||
return cs[property] || cs.getPropertyValue(property.replace(_capsExp, "-$1").toLowerCase()) || cs.getPropertyValue(property); //css variables may not need caps swapped out for dashes and lowercase. | ||
}, | ||
_checkPropPrefix = (property, element) => { | ||
let e = element || _tempDiv, | ||
s = e.style, | ||
i = 5, | ||
a = "O,Moz,ms,Ms,Webkit".split(","); | ||
if (property in s) { | ||
return property; | ||
} | ||
property = property.charAt(0).toUpperCase() + property.substr(1); | ||
while (i-- && !((a[i]+property) in s)) { } | ||
return (i < 0) ? null : ((i === 3) ? "ms" : (i >= 0) ? a[i] : "") + property; | ||
}, | ||
_initPlugin = () => { | ||
if (_windowExists()) { | ||
_win = window; | ||
_doc = _win.document; | ||
_docElement = _doc.documentElement; | ||
_tempDiv = _createElement("div") || {style:{}}; | ||
_tempDivStyler = _createElement("div"); | ||
_transformProp = _checkPropPrefix(_transformProp); | ||
_transformOriginProp = _checkPropPrefix(_transformProp); | ||
_tempDiv.style.cssText = "border-width:0;line-height:0;position:absolute;padding:0"; //make sure to override certain properties that may contaminate measurements, in case the user has overreaching style sheets. | ||
_supports3D = !!_checkPropPrefix("perspective"); | ||
_pluginInitted = 1; | ||
} | ||
}, | ||
_getBBoxHack = function(swapIfPossible) { //works around issues in some browsers (like Firefox) that don't correctly report getBBox() on SVG elements inside a <defs> element and/or <mask>. We try creating an SVG, adding it to the documentElement and toss the element in there so that it's definitely part of the rendering tree, then grab the bbox and if it works, we actually swap out the original getBBox() method for our own that does these extra steps whenever getBBox is needed. This helps ensure that performance is optimal (only do all these extra steps when absolutely necessary...most elements don't need it). | ||
let svg = _createElement("svg", (this.ownerSVGElement && this.ownerSVGElement.getAttribute("xmlns")) || "http://www.w3.org/2000/svg"), | ||
oldParent = this.parentNode, | ||
oldSibling = this.nextSibling, | ||
oldCSS = this.style.cssText, | ||
bbox; | ||
_docElement.appendChild(svg); | ||
svg.appendChild(this); | ||
this.style.display = "block"; | ||
if (swapIfPossible) { | ||
try { | ||
bbox = this.getBBox(); | ||
this._gsapBBox = this.getBBox; //store the original | ||
this.getBBox = _getBBoxHack; | ||
} catch (e) { } | ||
} else if (this._gsapBBox) { | ||
bbox = this._gsapBBox(); | ||
} | ||
if (oldSibling) { | ||
oldParent.insertBefore(this, oldSibling); | ||
} else { | ||
oldParent.appendChild(this); | ||
} | ||
_docElement.removeChild(svg); | ||
this.style.cssText = oldCSS; | ||
return bbox; | ||
}, | ||
_getAttributeFallbacks = (target, attributesArray) => { | ||
let i = attributesArray.length; | ||
while (i--) { | ||
if (target.hasAttribute(attributesArray[i])) { | ||
return target.getAttribute(attributesArray[i]); | ||
} | ||
} | ||
}, | ||
_getBBox = target => { | ||
let bounds; | ||
try { | ||
bounds = target.getBBox(); //Firefox throws errors if you try calling getBBox() on an SVG element that's not rendered (like in a <symbol> or <defs>). https://bugzilla.mozilla.org/show_bug.cgi?id=612118 | ||
} catch (error) { | ||
bounds = _getBBoxHack.call(target, true); | ||
} | ||
//some browsers (like Firefox) misreport the bounds if the element has zero width and height (it just assumes it's at x:0, y:0), thus we need to manually grab the position in that case. | ||
return (bounds && !bounds.width && !bounds.x && !bounds.y) ? {x: +_getAttributeFallbacks(target, ["x","cx","x1"]), y:+_getAttributeFallbacks(target, ["y","cy","y1"]), width:0, height:0} : bounds; | ||
}, | ||
_isSVG = e => !!(e.getCTM && (!e.parentNode || e.ownerSVGElement) && _getBBox(e)), //reports if the element is an SVG on which getBBox() actually works | ||
_removeProperty = (target, property) => { | ||
if (property) { | ||
let style = target.style; | ||
if (property in _transformProps) { | ||
property = _transformProp; | ||
} | ||
if (style.removeProperty) { | ||
if (property.substr(0,2) === "ms" || property.substr(0,6) === "webkit") { //Microsoft and some Webkit browsers don't conform to the standard of capitalizing the first prefix character, so we adjust so that when we prefix the caps with a dash, it's correct (otherwise it'd be "ms-transform" instead of "-ms-transform" for IE9, for example) | ||
property = "-" + property; | ||
} | ||
style.removeProperty(property.replace(_capsExp, "-$1").toLowerCase()); | ||
} else { //note: old versions of IE use "removeAttribute()" instead of "removeProperty()" | ||
style.removeAttribute(property); | ||
} | ||
} | ||
}, | ||
_addNonTweeningPT = (plugin, target, property, beginning, end, onlySetAtEnd) => { | ||
let pt = new PropTween(plugin._pt, target, property, 0, 1, onlySetAtEnd ? _renderNonTweeningValueOnlyAtEnd : _renderNonTweeningValue); | ||
plugin._pt = pt; | ||
pt.b = beginning; | ||
pt.e = end; | ||
plugin._props.push(property); | ||
return pt; | ||
}, | ||
_nonConvertibleUnits = {deg:1, rad:1, turn:1}, | ||
//takes a single value like 20px and converts it to the unit specified, like "%", returning only the numeric amount. | ||
_convertToUnit = (target, property, value, unit) => { | ||
let curValue = parseFloat(value), | ||
curUnit = (value + "").substr((curValue + "").length), | ||
style = _tempDiv.style, | ||
horizontal = _horizontalExp.test(property), | ||
isRootSVG = target.tagName.toLowerCase() === "svg", | ||
measureProperty = (isRootSVG ? "client" : "offset") + (horizontal ? "Width" : "Height"), | ||
amount = 100, | ||
toPixels = unit === "px", | ||
px, parent, cache, isSVG; | ||
if (unit === curUnit || _nonConvertibleUnits[unit] || _nonConvertibleUnits[curUnit]) { | ||
return curValue; | ||
} | ||
isSVG = target.getCTM && _isSVG(target); | ||
if (unit === "%" && _transformProps[property]) { //transforms are relative to the size of the element itself! | ||
return _round(curValue / (isSVG ? target.getBBox()[horizontal ? "width" : "height"] : target[measureProperty]) * amount); | ||
} | ||
style[horizontal ? "width" : "height"] = amount + (toPixels ? curUnit : unit); | ||
parent = (unit === "em" && target.appendChild && !isRootSVG) ? target : target.parentNode; | ||
if (isSVG) { | ||
parent = (target.ownerSVGElement || {}).parentNode; | ||
} | ||
if (!parent || parent === _doc || !parent.appendChild) { | ||
parent = _doc.body; | ||
} | ||
cache = parent._gsap; | ||
if (cache && unit === "%" && cache.width && horizontal && cache.time === _ticker.time) { | ||
px = cache.width * curValue / amount; | ||
} else { | ||
parent.appendChild(_tempDiv); | ||
px = _tempDiv[measureProperty]; | ||
parent.removeChild(_tempDiv); | ||
if (horizontal && unit === "%") { | ||
cache = parent._gsap = parent._gsap || {}; | ||
cache.time = _ticker.time; | ||
cache.width = px / curValue * amount; | ||
} | ||
} | ||
return _round(toPixels ? px * curValue / amount : amount / px * curValue); | ||
}, | ||
_get = (target, property, unit, uncache) => { | ||
let skipStyle, value; | ||
if (!_pluginInitted) { | ||
_initPlugin(); | ||
} | ||
if (property in _propertyAliases) { | ||
property = _propertyAliases[property]; | ||
if (~property.indexOf(",")) { | ||
property = property.split(",")[0]; | ||
} | ||
} | ||
if (_transformProps[property]) { | ||
value = _parseTransform(target, uncache)[property]; | ||
skipStyle = property !== "transformOrigin"; | ||
} | ||
if (!skipStyle) { | ||
value = target.style[property]; | ||
if (!value || value === "auto" || uncache) { | ||
value = _getComputedProperty(target, property) || _getProperty(target, property); | ||
} | ||
} | ||
return unit ? _convertToUnit(target, property, value, unit) + unit : value; | ||
var _win, | ||
_doc, | ||
_docElement, | ||
_pluginInitted, | ||
_tempDiv, | ||
_tempDivStyler, | ||
_recentSetterPlugin, | ||
_windowExists = function _windowExists() { | ||
return typeof window !== "undefined"; | ||
}, | ||
_transformProps = {}, | ||
_RAD2DEG = 180 / Math.PI, | ||
_DEG2RAD = Math.PI / 180, | ||
_atan2 = Math.atan2, | ||
_bigNum = 1e8, | ||
_capsExp = /([A-Z])/g, | ||
_numWithUnitExp = /[-+=\.]*\d+[\.e-]*\d*[a-z%]*/g, | ||
_horizontalExp = /(?:left|right|width|margin|padding|x)/i, | ||
_complexExp = /[\s,\(]\S/, | ||
_propertyAliases = { | ||
autoAlpha: "opacity,visibility", | ||
scale: "scaleX,scaleY", | ||
alpha: "opacity" | ||
}, | ||
_renderCSSProp = function _renderCSSProp(ratio, data) { | ||
return data.set(data.t, data.p, ~~((data.s + data.c * ratio) * 10000) / 10000 + data.u, data); | ||
}, | ||
_renderPropWithEnd = function _renderPropWithEnd(ratio, data) { | ||
return data.set(data.t, data.p, ratio === 1 ? data.e : ~~((data.s + data.c * ratio) * 10000) / 10000 + data.u, data); | ||
}, | ||
_renderCSSPropWithBeginning = function _renderCSSPropWithBeginning(ratio, data) { | ||
return data.set(data.t, data.p, ratio ? ~~((data.s + data.c * ratio) * 10000) / 10000 + data.u : data.b, data); | ||
}, | ||
//if units change, we need a way to render the original unit/value when the tween goes all the way back to the beginning (ratio:0) | ||
_renderRoundedCSSProp = function _renderRoundedCSSProp(ratio, data) { | ||
var value = data.s + data.c * ratio; | ||
data.set(data.t, data.p, ~~(value + (value < 0 ? -.5 : .5)) + data.u, data); | ||
}, | ||
_renderNonTweeningValue = function _renderNonTweeningValue(ratio, data) { | ||
return data.set(data.t, data.p, ratio ? data.e : data.b, data); | ||
}, | ||
_renderNonTweeningValueOnlyAtEnd = function _renderNonTweeningValueOnlyAtEnd(ratio, data) { | ||
return data.set(data.t, data.p, ratio !== 1 ? data.b : data.e, data); | ||
}, | ||
_setterCSSStyle = function _setterCSSStyle(target, property, value) { | ||
return target.style[property] = value; | ||
}, | ||
_setterCSSProp = function _setterCSSProp(target, property, value) { | ||
return target.style.setProperty(property, value); | ||
}, | ||
_setterTransform = function _setterTransform(target, property, value) { | ||
return target._gsap[property] = value; | ||
}, | ||
_setterScale = function _setterScale(target, property, value) { | ||
return target._gsap.scaleX = target._gsap.scaleY = value; | ||
}, | ||
_setterScaleWithRender = function _setterScaleWithRender(target, property, value, data, ratio) { | ||
var cache = target._gsap; | ||
cache.scaleX = cache.scaleY = value; | ||
cache.renderTransform(ratio, cache); | ||
}, | ||
_setterTransformWithRender = function _setterTransformWithRender(target, property, value, data, ratio) { | ||
var cache = target._gsap; | ||
cache[property] = value; | ||
cache.renderTransform(ratio, cache); | ||
}, | ||
_transformProp = "transform", | ||
_transformOriginProp = _transformProp + "Origin", | ||
_supports3D, | ||
_createElement = function _createElement(type, ns) { | ||
var e = _doc.createElementNS ? _doc.createElementNS((ns || "http://www.w3.org/1999/xhtml").replace(/^https/, "http"), type) : _doc.createElement(type); //some servers swap in https for http in the namespace which can break things, making "style" inaccessible. | ||
}, | ||
_tweenComplexCSSString = function(target, prop, start, end) { //note: we call _tweenComplexCSSString.call(pluginInstance...) to ensure that it's scoped properly. We may call it from within a plugin too, thus "this" would refer to the plugin. | ||
let pt = new PropTween(this._pt, target.style, prop, 0, 1, _renderComplexString), | ||
index = 0, | ||
matchIndex = 0, | ||
a, result, startValues, startNum, color, startValue, endValue, endNum, chunk, endUnit, startUnit, relative, endValues; | ||
pt.b = start; | ||
pt.e = end; | ||
start += ""; //ensure values are strings | ||
end += ""; | ||
if (end === "auto") { | ||
target.style[prop] = end; | ||
end = _getComputedProperty(target, prop) || end; | ||
target.style[prop] = start; | ||
} | ||
a = [start, end]; | ||
_colorStringFilter(a); //pass an array with the starting and ending values and let the filter do whatever it needs to the values. | ||
start = a[0]; | ||
end = a[1]; | ||
startValues = start.match(_numWithUnitExp) || []; | ||
endValues = end.match(_numWithUnitExp) || []; | ||
if (endValues.length) { | ||
while ((result = _numWithUnitExp.exec(end))) { | ||
endValue = result[0]; | ||
chunk = end.substring(index, result.index); | ||
if (color) { | ||
color = (color + 1) % 5; | ||
} else if (chunk.substr(-5) === "rgba(") { | ||
color = 1; | ||
} | ||
if (endValue !== (startValue = startValues[matchIndex++] || "")) { | ||
startNum = parseFloat(startValue) || 0; | ||
startUnit = startValue.substr((startNum + "").length); | ||
relative = (endValue.charAt(1) === "=") ? +(endValue.charAt(0) + "1") : 0; | ||
if (relative) { | ||
endValue = endValue.substr(2); | ||
} | ||
endNum = parseFloat(endValue); | ||
endUnit = endValue.substr((endNum + "").length); | ||
index = _numWithUnitExp.lastIndex - endUnit.length; | ||
if (!endUnit) { //if something like "perspective:300" is passed in and we must add a unit to the end | ||
endUnit = endUnit || _config.units[prop] || startUnit; | ||
if (index === end.length) { | ||
end += endUnit; | ||
pt.e += endUnit; | ||
} | ||
} | ||
if (startUnit !== endUnit) { | ||
startNum = _convertToUnit(target, prop, startValue, endUnit); | ||
} | ||
//these nested PropTweens are handled in a special way - we'll never actually call a render or setter method on them. We'll just loop through them in the parent complex string PropTween's render method. | ||
pt._pt = { | ||
_next:pt._pt, | ||
p:(chunk || (matchIndex === 1)) ? chunk : ",", //note: SVG spec allows omission of comma/space when a negative sign is wedged between two numbers, like 2.5-5.3 instead of 2.5,-5.3 but when tweening, the negative value may switch to positive, so we insert the comma just in case. | ||
s:startNum, | ||
c:relative ? relative * endNum : endNum - startNum, | ||
m:(color && color < 4) ? Math.round : 0 | ||
}; | ||
} | ||
} | ||
pt.c = (index < end.length) ? end.substring(index, end.length) : ""; //we use the "c" of the PropTween to store the final part of the string (after the last number) | ||
} else { | ||
pt.r = prop === "display" ? _renderNonTweeningValueOnlyAtEnd : _renderNonTweeningValue; | ||
} | ||
if (_relExp.test(end)) { | ||
pt.e = 0; //if the end string contains relative values or dynamic random(...) values, delete the end it so that on the final render we don't actually set it to the string with += or -= characters (forces it to use the calculated value). | ||
} | ||
this._pt = pt; //start the linked list with this new PropTween. Remember, we call _tweenComplexCSSString.call(pluginInstance...) to ensure that it's scoped properly. We may call it from within another plugin too, thus "this" would refer to the plugin. | ||
return pt; | ||
}, | ||
_keywordToPercent = {top:"0%", bottom:"100%", left:"0%", right:"100%", center:"50%"}, | ||
_convertKeywordsToPercentages = value => { | ||
let split = value.split(" "), | ||
x = split[0], | ||
y = split[1] || "50%"; | ||
if (x === "top" || x === "bottom" || y === "left" || y === "right") { //the user provided them in the wrong order, so flip them | ||
split = x; | ||
x = y; | ||
y = split; | ||
} | ||
return (_keywordToPercent[x] || x) + " " + (_keywordToPercent[y] || y); | ||
}, | ||
_renderClearProps = (ratio, data) => { | ||
if (data.tween && data.tween._time === data.tween._dur) { | ||
let target = data.t, | ||
style = target.style, | ||
props = data.u, | ||
prop, clearTransforms, i; | ||
if (props === "all" || props === true) { | ||
style.cssText = ""; | ||
clearTransforms = 1; | ||
} else { | ||
props = props.split(","); | ||
i = props.length; | ||
while (--i > -1) { | ||
prop = props[i]; | ||
if (_transformProps[prop]) { | ||
clearTransforms = 1; | ||
prop = (prop === "transformOrigin") ? _transformOriginProp : _transformProp; | ||
} | ||
_removeProperty(target, prop); | ||
} | ||
} | ||
if (clearTransforms) { | ||
_removeProperty(target, _transformProp); | ||
clearTransforms = target._gsap; | ||
if (clearTransforms) { | ||
if (clearTransforms.svg) { | ||
target.removeAttribute("transform"); | ||
} | ||
delete clearTransforms.x; | ||
} | ||
} | ||
} | ||
}, | ||
// note: specialProps should return 1 if (and only if) they have a non-zero priority. It indicates we need to sort the linked list. | ||
_specialProps = { | ||
clearProps(plugin, target, property, endValue, tween) { | ||
let pt = plugin._pt = new PropTween(plugin._pt, target, property, 0, 0, _renderClearProps); | ||
pt.u = endValue; | ||
pt.pr = -10; | ||
pt.tween = tween; | ||
plugin._props.push(property); | ||
return 1; | ||
} | ||
/* className feature (about 0.4kb gzipped). | ||
, className(plugin, target, property, endValue, tween) { | ||
let _renderClassName = (ratio, data) => { | ||
data.css.render(ratio, data.css); | ||
if (!ratio || ratio === 1) { | ||
let inline = data.rmv, | ||
target = data.t, | ||
p; | ||
target.setAttribute("class", ratio ? data.e : data.b); | ||
for (p in inline) { | ||
_removeProperty(target, p); | ||
} | ||
} | ||
}, | ||
_getAllStyles = (target) => { | ||
let styles = {}, | ||
computed = getComputedStyle(target), | ||
p; | ||
for (p in computed) { | ||
if (isNaN(p) && p !== "cssText" && p !== "length") { | ||
styles[p] = computed[p]; | ||
} | ||
} | ||
_setDefaults(styles, _parseTransform(target, 1)); | ||
return styles; | ||
}, | ||
startClassList = target.getAttribute("class"), | ||
style = target.style, | ||
cssText = style.cssText, | ||
cache = target._gsap, | ||
classPT = cache.classPT, | ||
inlineToRemoveAtEnd = {}, | ||
data = {t:target, plugin:plugin, rmv:inlineToRemoveAtEnd, b:startClassList, e:(endValue.charAt(1) !== "=") ? endValue : startClassList.replace(new RegExp("(?:\\s|^)" + endValue.substr(2) + "(?![\\w-])"), "") + ((endValue.charAt(0) === "+") ? " " + endValue.substr(2) : "")}, | ||
changingVars = {}, | ||
startVars = _getAllStyles(target), | ||
transformRelated = /(transform|perspective)/i, | ||
endVars, p; | ||
if (classPT) { | ||
classPT.r(1, classPT.d); | ||
_removeLinkedListItem(classPT.d.plugin, classPT, "_pt"); | ||
} | ||
target.setAttribute("class", data.e); | ||
endVars = _getAllStyles(target, true); | ||
target.setAttribute("class", startClassList); | ||
for (p in endVars) { | ||
if (endVars[p] !== startVars[p] && !transformRelated.test(p)) { | ||
changingVars[p] = endVars[p]; | ||
if (!style[p] && style[p] !== "0") { | ||
inlineToRemoveAtEnd[p] = 1; | ||
} | ||
} | ||
} | ||
cache.classPT = plugin._pt = new PropTween(plugin._pt, target, "className", 0, 0, _renderClassName, data, 0, -11); | ||
if (style.cssText !== cssText) { //only apply if things change. Otherwise, in cases like a background-image that's pulled dynamically, it could cause a refresh. See https://greensock.com/forums/topic/20368-possible-gsap-bug-switching-classnames-in-chrome/. | ||
style.cssText = cssText; //we recorded cssText before we swapped classes and ran _getAllStyles() because in cases when a className tween is overwritten, we remove all the related tweening properties from that class change (otherwise class-specific stuff can't override properties we've directly set on the target's style object due to specificity). | ||
} | ||
_parseTransform(target, true); //to clear the caching of transforms | ||
data.css = new gsap.plugins.css(); | ||
data.css.init(target, changingVars, tween); | ||
plugin._props.push(...data.css._props); | ||
return 1; | ||
} | ||
*/ | ||
}, | ||
return e.style ? e : _doc.createElement(type); //some environments won't allow access to the element's style when created with a namespace in which case we default to the standard createElement() to work around the issue. Also note that when GSAP is embedded directly inside an SVG file, createElement() won't allow access to the style object in Firefox (see https://greensock.com/forums/topic/20215-problem-using-tweenmax-in-standalone-self-containing-svg-file-err-cannot-set-property-csstext-of-undefined/). | ||
}, | ||
_getComputedProperty = function _getComputedProperty(target, property) { | ||
var cs = getComputedStyle(target); | ||
return cs[property] || cs.getPropertyValue(property.replace(_capsExp, "-$1").toLowerCase()) || cs.getPropertyValue(property); //css variables may not need caps swapped out for dashes and lowercase. | ||
}, | ||
_checkPropPrefix = function _checkPropPrefix(property, element) { | ||
var e = element || _tempDiv, | ||
s = e.style, | ||
i = 5, | ||
a = "O,Moz,ms,Ms,Webkit".split(","); | ||
if (property in s) { | ||
return property; | ||
} | ||
property = property.charAt(0).toUpperCase() + property.substr(1); | ||
while (i-- && !(a[i] + property in s)) {} | ||
return i < 0 ? null : (i === 3 ? "ms" : i >= 0 ? a[i] : "") + property; | ||
}, | ||
_initCore = function _initCore() { | ||
if (_windowExists()) { | ||
_win = window; | ||
_doc = _win.document; | ||
_docElement = _doc.documentElement; | ||
_tempDiv = _createElement("div") || { | ||
style: {} | ||
}; | ||
_tempDivStyler = _createElement("div"); | ||
_transformProp = _checkPropPrefix(_transformProp); | ||
_transformOriginProp = _checkPropPrefix(_transformOriginProp); | ||
_tempDiv.style.cssText = "border-width:0;line-height:0;position:absolute;padding:0"; //make sure to override certain properties that may contaminate measurements, in case the user has overreaching style sheets. | ||
/* | ||
* -------------------------------------------------------------------------------------- | ||
* TRANSFORMS | ||
* -------------------------------------------------------------------------------------- | ||
*/ | ||
_identity2DMatrix = [1,0,0,1,0,0], | ||
_rotationalProperties = {}, | ||
_getComputedTransformMatrixAsArray = target => { | ||
let matrixString = _getComputedProperty(target, _transformProp); | ||
return (matrixString === "matrix(1, 0, 0, 1, 0, 0)" || matrixString === "none" || !matrixString) ? _identity2DMatrix : matrixString.substr(7).match(_numExp).map(_round); | ||
}, | ||
_getMatrix = (target, force2D) => { | ||
let cache = target._gsap, | ||
style = target.style, | ||
matrix = _getComputedTransformMatrixAsArray(target), | ||
parent, nextSibling, temp, addedToDOM; | ||
if (cache.svg && target.getAttribute("transform")) { | ||
temp = target.transform.baseVal.consolidate().matrix; //ensures that even complex values like "translate(50,60) rotate(135,0,0)" are parsed because it mashes it into a matrix. | ||
matrix = [temp.a, temp.b, temp.c, temp.d, temp.e, temp.f]; | ||
return (matrix.join(",") === "1,0,0,1,0,0") ? _identity2DMatrix : matrix; | ||
} else if (matrix === _identity2DMatrix && !target.offsetParent && target !== _docElement && !cache.svg) { //note: if offsetParent is null, that means the element isn't in the normal document flow, like if it has display:none or one of its ancestors has display:none). Firefox returns null for getComputedStyle() if the element is in an iframe that has display:none. https://bugzilla.mozilla.org/show_bug.cgi?id=548397 | ||
//browsers don't report transforms accurately unless the element is in the DOM and has a display value that's not "none". Firefox and Microsoft browsers have a partial bug where they'll report transforms even if display:none BUT not any percentage-based values like translate(-50%, 8px) will be reported as if it's translate(0, 8px). | ||
temp = style.display; | ||
style.display = "block"; | ||
parent = target.parentNode; | ||
if (!parent || !target.offsetParent) { | ||
addedToDOM = 1; //flag | ||
nextSibling = target.nextSibling; | ||
_docElement.appendChild(target); //we must add it to the DOM in order to get values properly | ||
} | ||
matrix = _getComputedTransformMatrixAsArray(target); | ||
if (temp) { | ||
style.display = temp; | ||
} else { | ||
_removeProperty(target, "display"); | ||
} | ||
if (addedToDOM) { | ||
if (nextSibling) { | ||
parent.insertBefore(target, nextSibling); | ||
} else if (parent) { | ||
parent.appendChild(target); | ||
} else { | ||
_docElement.removeChild(target); | ||
} | ||
} | ||
} | ||
return (force2D && matrix.length > 6) ? [matrix[0], matrix[1], matrix[4], matrix[5], matrix[12], matrix[13]] : matrix; | ||
}, | ||
_applySVGOrigin = (target, origin, originIsAbsolute, smooth, matrixArray, pluginToAddPropTweensTo) => { | ||
let cache = target._gsap, | ||
matrix = matrixArray || _getMatrix(target, true), | ||
xOriginOld = cache.xOrigin || 0, | ||
yOriginOld = cache.yOrigin || 0, | ||
xOffsetOld = cache.xOffset || 0, | ||
yOffsetOld = cache.yOffset || 0, | ||
a = matrix[0], | ||
b = matrix[1], | ||
c = matrix[2], | ||
d = matrix[3], | ||
tx = matrix[4], | ||
ty = matrix[5], | ||
originSplit = origin.split(" "), | ||
xOrigin = parseFloat(originSplit[0]) || 0, | ||
yOrigin = parseFloat(originSplit[1]) || 0, | ||
bounds, determinant, x, y; | ||
if (!originIsAbsolute) { | ||
bounds = _getBBox(target); | ||
xOrigin = bounds.x + (~originSplit[0].indexOf("%") ? xOrigin / 100 * bounds.width : xOrigin); | ||
yOrigin = bounds.y + (~((originSplit[1] || originSplit[0]).indexOf("%")) ? yOrigin / 100 * bounds.height : yOrigin); | ||
} else if (matrix !== _identity2DMatrix && (determinant = (a * d - b * c))) { //if it's zero (like if scaleX and scaleY are zero), skip it to avoid errors with dividing by zero. | ||
x = xOrigin * (d / determinant) + yOrigin * (-c / determinant) + ((c * ty - d * tx) / determinant); | ||
y = xOrigin * (-b / determinant) + yOrigin * (a / determinant) - ((a * ty - b * tx) / determinant); | ||
xOrigin = x; | ||
yOrigin = y; | ||
} | ||
if (smooth || (smooth !== false && cache.smooth)) { | ||
tx = xOrigin - xOriginOld; | ||
ty = yOrigin - yOriginOld; | ||
cache.xOffset += (tx * a + ty * c) - tx; | ||
cache.yOffset += (tx * b + ty * d) - ty; | ||
} else { | ||
cache.xOffset = cache.yOffset = 0; | ||
} | ||
cache.xOrigin = xOrigin; | ||
cache.yOrigin = yOrigin; | ||
cache.smooth = !!smooth; | ||
cache.origin = origin; | ||
cache.originIsAbsolute = !!originIsAbsolute; | ||
if (pluginToAddPropTweensTo) { | ||
_addNonTweeningPT(pluginToAddPropTweensTo, cache, "xOrigin", xOriginOld, xOrigin); | ||
_addNonTweeningPT(pluginToAddPropTweensTo, cache, "yOrigin", yOriginOld, yOrigin); | ||
_addNonTweeningPT(pluginToAddPropTweensTo, cache, "xOffset", xOffsetOld, cache.xOffset); | ||
_addNonTweeningPT(pluginToAddPropTweensTo, cache, "yOffset", yOffsetOld, cache.yOffset); | ||
} | ||
}, | ||
_parseTransform = (target, uncache) => { | ||
let cache = target._gsap || new GSCache(target); | ||
if ("x" in cache && !uncache) { | ||
return cache; | ||
} | ||
let style = target.style, | ||
invertedScaleX = cache.scaleX < 0, | ||
xOrigin = cache.xOrigin || 0, | ||
yOrigin = cache.yOrigin || 0, | ||
px = "px", | ||
deg = "deg", | ||
x, y, z, scaleX, scaleY, rotation, rotationX, rotationY, skewX, skewY, perspective, | ||
matrix, angle, cos, sin, a, b, c, d, a12, a22, t1, t2, t3, a13, a23, a33, a42, a43, a32; | ||
x = y = z = rotation = rotationX = rotationY = skewX = skewY = perspective = 0; | ||
scaleX = scaleY = 1; | ||
cache.svg = !!(target.getCTM && _isSVG(target)); | ||
matrix = _getMatrix(target, cache.svg); | ||
if (cache.svg) { | ||
_applySVGOrigin(target, _getComputedProperty(target, "transformOrigin") || "0", cache.originIsAbsolute, cache.smooth !== false, matrix); | ||
} | ||
if (matrix !== _identity2DMatrix) { | ||
a = matrix[0]; //a11 | ||
b = matrix[1]; //a21 | ||
c = matrix[2]; //a31 | ||
d = matrix[3]; //a41 | ||
x = a12 = matrix[4]; | ||
y = a22 = matrix[5]; | ||
_supports3D = !!_checkPropPrefix("perspective"); | ||
_pluginInitted = 1; | ||
} | ||
}, | ||
_getBBoxHack = function _getBBoxHack(swapIfPossible) { | ||
//works around issues in some browsers (like Firefox) that don't correctly report getBBox() on SVG elements inside a <defs> element and/or <mask>. We try creating an SVG, adding it to the documentElement and toss the element in there so that it's definitely part of the rendering tree, then grab the bbox and if it works, we actually swap out the original getBBox() method for our own that does these extra steps whenever getBBox is needed. This helps ensure that performance is optimal (only do all these extra steps when absolutely necessary...most elements don't need it). | ||
var svg = _createElement("svg", this.ownerSVGElement && this.ownerSVGElement.getAttribute("xmlns") || "http://www.w3.org/2000/svg"), | ||
oldParent = this.parentNode, | ||
oldSibling = this.nextSibling, | ||
oldCSS = this.style.cssText, | ||
bbox; | ||
//2D matrix | ||
if (matrix.length === 6) { | ||
scaleX = Math.sqrt(a * a + b * b); | ||
scaleY = Math.sqrt(d * d + c * c); | ||
rotation = (a || b) ? _atan2(b, a) * _RAD2DEG : cache.rotation || 0; //note: if scaleX is 0, we cannot accurately measure rotation. Same for skewX with a scaleY of 0. Therefore, we default to the previously recorded value (or zero if that doesn't exist). | ||
skewX = (c || d) ? _atan2(c, d) * _RAD2DEG + rotation : cache.skewX || 0; | ||
if (cache.svg) { | ||
x -= xOrigin - (xOrigin * a + yOrigin * c); | ||
y -= yOrigin - (xOrigin * b + yOrigin * d); | ||
} | ||
_docElement.appendChild(svg); | ||
//3D matrix | ||
} else { | ||
a32 = matrix[6]; | ||
a42 = matrix[7]; | ||
a13 = matrix[8]; | ||
a23 = matrix[9]; | ||
a33 = matrix[10]; | ||
a43 = matrix[11]; | ||
x = matrix[12]; | ||
y = matrix[13]; | ||
z = matrix[14]; | ||
svg.appendChild(this); | ||
this.style.display = "block"; | ||
angle = _atan2(a32, a33); | ||
rotationX = angle * _RAD2DEG; | ||
//rotationX | ||
if (angle) { | ||
cos = Math.cos(-angle); | ||
sin = Math.sin(-angle); | ||
t1 = a12*cos+a13*sin; | ||
t2 = a22*cos+a23*sin; | ||
t3 = a32*cos+a33*sin; | ||
a13 = a12*-sin+a13*cos; | ||
a23 = a22*-sin+a23*cos; | ||
a33 = a32*-sin+a33*cos; | ||
a43 = a42*-sin+a43*cos; | ||
a12 = t1; | ||
a22 = t2; | ||
a32 = t3; | ||
} | ||
//rotationY | ||
angle = _atan2(-c, a33); | ||
rotationY = angle * _RAD2DEG; | ||
if (angle) { | ||
cos = Math.cos(-angle); | ||
sin = Math.sin(-angle); | ||
t1 = a*cos-a13*sin; | ||
t2 = b*cos-a23*sin; | ||
t3 = c*cos-a33*sin; | ||
a43 = d*sin+a43*cos; | ||
a = t1; | ||
b = t2; | ||
c = t3; | ||
} | ||
//rotationZ | ||
angle = _atan2(b, a); | ||
rotation = angle * _RAD2DEG; | ||
if (angle) { | ||
cos = Math.cos(angle); | ||
sin = Math.sin(angle); | ||
t1 = a*cos+b*sin; | ||
t2 = a12*cos+a22*sin; | ||
b = b*cos-a*sin; | ||
a22 = a22*cos-a12*sin; | ||
a = t1; | ||
a12 = t2; | ||
} | ||
if (swapIfPossible) { | ||
try { | ||
bbox = this.getBBox(); | ||
this._gsapBBox = this.getBBox; //store the original | ||
if (rotationX && Math.abs(rotationX) + Math.abs(rotation) > 359.9) { //when rotationY is set, it will often be parsed as 180 degrees different than it should be, and rotationX and rotation both being 180 (it looks the same), so we adjust for that here. | ||
rotationX = rotation = 0; | ||
rotationY = 180 - rotationY; | ||
} | ||
scaleX = _round(Math.sqrt(a * a + b * b + c * c)); | ||
scaleY = _round(Math.sqrt(a22 * a22 + a32 * a32)); | ||
angle = _atan2(a12, a22); | ||
skewX = (Math.abs(angle) > 0.0002) ? angle * _RAD2DEG : 0; | ||
perspective = a43 ? 1 / ((a43 < 0) ? -a43 : a43) : 0; | ||
} | ||
this.getBBox = _getBBoxHack; | ||
} catch (e) {} | ||
} else if (this._gsapBBox) { | ||
bbox = this._gsapBBox(); | ||
} | ||
} | ||
if (oldSibling) { | ||
oldParent.insertBefore(this, oldSibling); | ||
} else { | ||
oldParent.appendChild(this); | ||
} | ||
if (Math.abs(skewX) > 90 && Math.abs(skewX) < 270) { | ||
if (invertedScaleX) { | ||
scaleX *= -1; | ||
skewX += (rotation <= 0) ? 180 : -180; | ||
rotation += (rotation <= 0) ? 180 : -180; | ||
} else { | ||
scaleY *= -1; | ||
skewX += (skewX <= 0) ? 180 : -180; | ||
} | ||
} | ||
_docElement.removeChild(svg); | ||
cache.x = x + px; | ||
cache.y = y + px; | ||
cache.z = z + px; | ||
cache.scaleX = _round(scaleX); | ||
cache.scaleY = _round(scaleY); | ||
cache.rotation = _round(rotation) + deg; | ||
cache.rotationX = _round(rotationX) + deg; | ||
cache.rotationY = _round(rotationY) + deg; | ||
cache.skewX = skewX + deg; | ||
cache.skewY = skewY + deg; | ||
cache.transformPerspective = perspective + px; | ||
cache.xPercent = cache.yPercent = cache.xOffset = cache.yOffset = 0; | ||
cache.force3D = _config.force3D; | ||
cache.renderTransform = cache.svg ? _renderSVGTransforms : _supports3D ? _renderCSSTransforms : _renderNon3DTransforms; | ||
if (cache.svg && style[_transformProp]) { | ||
gsap.delayedCall(0.001, () => _removeProperty(target, _transformProp)); //if we apply this right away (before anything has rendered), we risk there being no transforms for a brief moment and it also interferes with adjusting the transformOrigin in a tween with immediateRender:true (it'd try reading the matrix and it wouldn't have the appropriate data in place because we just removed it). | ||
} | ||
this.style.cssText = oldCSS; | ||
return bbox; | ||
}, | ||
_getAttributeFallbacks = function _getAttributeFallbacks(target, attributesArray) { | ||
var i = attributesArray.length; | ||
return cache; | ||
}, | ||
_renderNon3DTransforms = (ratio, cache) => { | ||
cache.z = "0px"; | ||
cache.rotationY = cache.rotationX = "0deg"; | ||
cache.force3D = 0; | ||
_renderCSSTransforms(ratio, cache); | ||
}, | ||
_renderCSSTransforms = (ratio, cache) => { | ||
let {xPercent, yPercent, x, y, z, rotation, rotationY, rotationX, skewX, skewY, scaleX, scaleY, transformPerspective, force3D, target} = cache, | ||
transforms = "", | ||
zeroDeg = "0deg", | ||
endParenthesis = ") ", | ||
use3D = (force3D === "auto" && ratio && ratio !== 1), | ||
zeroPx = "0px"; | ||
if (xPercent || yPercent) { | ||
transforms = "translate(" + xPercent + "%, " + yPercent + "%) "; | ||
} | ||
if (use3D || x !== zeroPx || y !== zeroPx || z !== zeroPx) { | ||
transforms += (z !== zeroPx || use3D) ? "translate3d(" + x + ", " + y + ", " + z + ") " : "translate(" + x + ", " + y + endParenthesis; | ||
} | ||
if (transformPerspective !== zeroPx) { | ||
transforms += "perspective(" + transformPerspective + endParenthesis; | ||
} | ||
if (rotation !== zeroDeg) { | ||
transforms += "rotate(" + rotation + endParenthesis; | ||
} | ||
if (rotationY !== zeroDeg) { | ||
transforms += "rotateY(" + rotationY + endParenthesis; | ||
} | ||
if (rotationX !== zeroDeg) { | ||
transforms += "rotateX(" + rotationX + endParenthesis; | ||
} | ||
if (skewX !== zeroDeg || skewY !== zeroDeg) { | ||
transforms += "skew(" + skewX + ", " + skewY + endParenthesis; | ||
} | ||
if (scaleX !== 1 || scaleY !== 1) { | ||
transforms += "scale(" + scaleX + ", " + scaleY + endParenthesis; | ||
} | ||
target.style[_transformProp] = transforms || "translate(0, 0)"; | ||
}, | ||
_renderSVGTransforms = (ratio, cache) => { | ||
let {xPercent, yPercent, x, y, rotation, skewX, skewY, scaleX, scaleY, target, xOrigin, yOrigin, xOffset, yOffset} = cache, | ||
tx = parseFloat(x), | ||
ty = parseFloat(y), | ||
a11, a21, a12, a22, temp; | ||
rotation = parseFloat(rotation); | ||
skewX = parseFloat(skewX); | ||
skewY = parseFloat(skewY); | ||
if (skewY) { //for performance reasons, we combine all skewing into the skewX and rotation values. Remember, a skewY of 10 degrees looks the same as a rotation of 10 degrees plus a skewX of 10 degrees. | ||
skewY = parseFloat(skewY); | ||
skewX += skewY; | ||
rotation += skewY; | ||
} | ||
if (rotation || skewX) { | ||
rotation *= _DEG2RAD; | ||
skewX *= _DEG2RAD; | ||
a11 = Math.cos(rotation) * scaleX; | ||
a21 = Math.sin(rotation) * scaleX; | ||
a12 = Math.sin(rotation - skewX) * -scaleY; | ||
a22 = Math.cos(rotation - skewX) * scaleY; | ||
if (skewX) { | ||
skewY *= _DEG2RAD; | ||
temp = Math.tan(skewX - skewY); | ||
temp = Math.sqrt(1 + temp * temp); | ||
a12 *= temp; | ||
a22 *= temp; | ||
if (skewY) { | ||
temp = Math.tan(skewY); | ||
temp = Math.sqrt(1 + temp * temp); | ||
a11 *= temp; | ||
a21 *= temp; | ||
} | ||
} | ||
a11 = _round(a11); | ||
a21 = _round(a21); | ||
a12 = _round(a12); | ||
a22 = _round(a22); | ||
} else { | ||
a11 = scaleX; | ||
a22 = scaleY; | ||
a21 = a12 = 0; | ||
} | ||
if ((tx && !~x.indexOf("px")) || (ty && !~y.indexOf("px"))) { | ||
tx = _convertToUnit(target, "x", x, "px"); | ||
ty = _convertToUnit(target, "y", y, "px"); | ||
} | ||
if (xOrigin || yOrigin || xOffset || yOffset) { | ||
tx = _round(tx + xOrigin - (xOrigin * a11 + yOrigin * a12) + xOffset); | ||
ty = _round(ty + yOrigin - (xOrigin * a21 + yOrigin * a22) + yOffset); | ||
} | ||
if (xPercent || yPercent) { | ||
//The SVG spec doesn't support percentage-based translation in the "transform" attribute, so we merge it into the translation to simulate it. | ||
temp = target.getBBox(); | ||
tx = _round(tx + xPercent / 100 * temp.width); | ||
ty = _round(ty + yPercent / 100 * temp.height); | ||
} | ||
target.setAttribute("transform", "matrix(" + a11 + "," + a21 + "," + a12 + "," + a22 + "," + tx + "," + ty + ")"); | ||
}, | ||
_addRotationalPropTween = function(plugin, target, property, startNum, endValue, relative) { | ||
let cap = 360, | ||
isString = _isString(endValue), | ||
endNum = parseFloat(endValue) * ((isString && ~endValue.indexOf("rad")) ? _RAD2DEG : 1), | ||
change = relative ? endNum * relative : endNum - startNum, | ||
finalValue = (startNum + change) + "deg", | ||
direction, pt; | ||
if (isString) { | ||
direction = endValue.split("_")[1]; | ||
if (direction === "short") { | ||
change %= cap; | ||
if (change !== change % (cap / 2)) { | ||
change += (change < 0) ? cap : -cap; | ||
} | ||
} | ||
if (direction === "cw" && change < 0) { | ||
change = ((change + cap * _bigNum) % cap) - ~~(change / cap) * cap; | ||
} else if (direction === "ccw" && change > 0) { | ||
change = ((change - cap * _bigNum) % cap) - ~~(change / cap) * cap; | ||
} | ||
} | ||
plugin._pt = pt = new PropTween(plugin._pt, target, property, startNum, change, _renderPropWithEnd); | ||
pt.e = finalValue; | ||
pt.u = "deg"; | ||
plugin._props.push(property); | ||
return pt; | ||
}, | ||
_addRawTransformPTs = (plugin, transforms, target) => { //for handling cases where someone passes in a whole transform string, like transform: "scale(2, 3) rotate(20deg) translateY(30em)" | ||
let style = _tempDivStyler.style, | ||
startCache = target._gsap, | ||
endCache, p, startValue, endValue, startNum, endNum, startUnit, endUnit; | ||
style.cssText = getComputedStyle(target).cssText + ";position:absolute;display:block;"; //%-based translations will fail unless we set the width/height to match the original target (and padding/borders can affect it) | ||
style[_transformProp] = transforms; | ||
_doc.body.appendChild(_tempDivStyler); | ||
endCache = _parseTransform(_tempDivStyler, 1); | ||
for (p in _transformProps) { | ||
startValue = startCache[p]; | ||
endValue = endCache[p]; | ||
if (startValue !== endValue && p !== "perspective") { //tweening to no perspective gives very unintuitive results - just keep the same perspective in that case. | ||
startUnit = _getUnit(startValue); | ||
endUnit = _getUnit(endValue); | ||
startNum = (startUnit !== endUnit) ?_convertToUnit(target, p, startValue, endUnit) : parseFloat(startValue); | ||
endNum = parseFloat(endValue); | ||
plugin._pt = new PropTween(plugin._pt, startCache, p, startNum, endNum - startNum, _renderCSSProp); | ||
plugin._pt.u = endUnit; | ||
plugin._props.push(p); | ||
} | ||
} | ||
_doc.body.removeChild(_tempDivStyler); | ||
}; | ||
while (i--) { | ||
if (target.hasAttribute(attributesArray[i])) { | ||
return target.getAttribute(attributesArray[i]); | ||
} | ||
} | ||
}, | ||
_getBBox = function _getBBox(target) { | ||
var bounds; | ||
try { | ||
bounds = target.getBBox(); //Firefox throws errors if you try calling getBBox() on an SVG element that's not rendered (like in a <symbol> or <defs>). https://bugzilla.mozilla.org/show_bug.cgi?id=612118 | ||
} catch (error) { | ||
bounds = _getBBoxHack.call(target, true); | ||
} //some browsers (like Firefox) misreport the bounds if the element has zero width and height (it just assumes it's at x:0, y:0), thus we need to manually grab the position in that case. | ||
return bounds && !bounds.width && !bounds.x && !bounds.y ? { | ||
x: +_getAttributeFallbacks(target, ["x", "cx", "x1"]), | ||
y: +_getAttributeFallbacks(target, ["y", "cy", "y1"]), | ||
width: 0, | ||
height: 0 | ||
} : bounds; | ||
}, | ||
_isSVG = function _isSVG(e) { | ||
return !!(e.getCTM && (!e.parentNode || e.ownerSVGElement) && _getBBox(e)); | ||
}, | ||
//reports if the element is an SVG on which getBBox() actually works | ||
_removeProperty = function _removeProperty(target, property) { | ||
if (property) { | ||
var style = target.style; | ||
export const CSSPlugin = { | ||
name:"css", | ||
register:_initPlugin, | ||
targetTest(target) { | ||
return target.style && target.nodeType; | ||
}, | ||
init(target, vars, tween, index, targets) { | ||
let props = this._props, | ||
style = target.style, | ||
startValue, endValue, endNum, startNum, type, specialProp, p, startUnit, endUnit, relative, isTransformRelated, transformPropTween, cache, smooth, hasPriority; | ||
if (!_pluginInitted) { | ||
_initPlugin(); | ||
} | ||
for (p in vars) { | ||
if (p === "autoRound") { | ||
continue; | ||
} | ||
endValue = vars[p]; | ||
if (_plugins[p] && _checkPlugin(p, vars, tween, index, target, targets)) { //plugins | ||
continue; | ||
} | ||
type = typeof(endValue); | ||
specialProp = _specialProps[p]; | ||
if (type === "function") { | ||
endValue = endValue.call(tween, index, target, targets); | ||
type = typeof(endValue); | ||
} | ||
if (type === "string" && ~endValue.indexOf("random(")) { | ||
endValue = _replaceRandom(endValue); | ||
} | ||
if (specialProp) { | ||
if (specialProp(this, target, p, endValue, tween)) { | ||
hasPriority = 1; | ||
} | ||
} else if (p.substr(0,2) === "--") { //CSS variable | ||
this.add(style, "setProperty", getComputedStyle(target).getPropertyValue(p) + "", endValue + "", index, targets, 0, 0, p); | ||
} else { | ||
startValue = _get(target, p); | ||
startNum = parseFloat(startValue); | ||
relative = (type === "string" && endValue.charAt(1) === "=") ? +(endValue.charAt(0) + "1") : 0; | ||
if (relative) { | ||
endValue = endValue.substr(2); | ||
} | ||
endNum = parseFloat(endValue); | ||
if (p in _propertyAliases) { | ||
if (p === "autoAlpha") { //special case where we control the visibility along with opacity. We still allow the opacity value to pass through and get tweened. | ||
if (startNum === 1 && _get(target, "visibility") === "hidden" && endNum) { //if visibility is initially set to "hidden", we should interpret that as intent to make opacity 0 (a convenience) | ||
startNum = 0; | ||
} | ||
_addNonTweeningPT(this, style, "visibility", startNum ? "inherit" : "hidden", endNum ? "inherit" : "hidden", !endNum); | ||
} | ||
if (p !== "scale") { | ||
p = _propertyAliases[p]; | ||
if (~p.indexOf(",")) { | ||
p = p.split(",")[0]; | ||
} | ||
} | ||
} | ||
if (property in _transformProps) { | ||
property = _transformProp; | ||
} | ||
isTransformRelated = (p in _transformProps); | ||
if (style.removeProperty) { | ||
if (property.substr(0, 2) === "ms" || property.substr(0, 6) === "webkit") { | ||
//Microsoft and some Webkit browsers don't conform to the standard of capitalizing the first prefix character, so we adjust so that when we prefix the caps with a dash, it's correct (otherwise it'd be "ms-transform" instead of "-ms-transform" for IE9, for example) | ||
property = "-" + property; | ||
} | ||
//--- TRANSFORM-RELATED --- | ||
if (isTransformRelated) { | ||
if (!transformPropTween) { | ||
cache = target._gsap; | ||
smooth = (vars.smoothOrigin !== false && cache.smooth); | ||
transformPropTween = this._pt = new PropTween(this._pt, style, _transformProp, 0, 1, cache.renderTransform, cache); //the first time through, create the rendering PropTween so that it runs LAST (in the linked list, we keep adding to the beginning) | ||
transformPropTween.dep = 1; //flag it as dependent so that if things get killed/overwritten and this is the only PropTween left, we can safely kill the whole tween. | ||
} | ||
if (p === "scale") { | ||
this._pt = new PropTween(this._pt, target, "scale", startNum, relative ? relative * endNum : endNum - startNum, 0, 0, _setterScale); | ||
props.push("scale"); | ||
continue; | ||
} else if (p === "transformOrigin") { | ||
endValue = _convertKeywordsToPercentages(endValue); //in case something like "left top" or "bottom right" is passed in. Convert to percentages. | ||
if (cache.svg) { | ||
_applySVGOrigin(target, endValue, 0, smooth, 0, this); | ||
} else { | ||
_addNonTweeningPT(this, style, p, startValue, endValue); | ||
} | ||
continue; | ||
} else if (p === "svgOrigin") { | ||
_applySVGOrigin(target, endValue, 1, smooth, 0, this); | ||
continue; | ||
} else if (p in _rotationalProperties) { | ||
_addRotationalPropTween(this, cache, p, startNum, endValue, relative); | ||
continue; | ||
style.removeProperty(property.replace(_capsExp, "-$1").toLowerCase()); | ||
} else { | ||
//note: old versions of IE use "removeAttribute()" instead of "removeProperty()" | ||
style.removeAttribute(property); | ||
} | ||
} | ||
}, | ||
_addNonTweeningPT = function _addNonTweeningPT(plugin, target, property, beginning, end, onlySetAtEnd) { | ||
var pt = new PropTween(plugin._pt, target, property, 0, 1, onlySetAtEnd ? _renderNonTweeningValueOnlyAtEnd : _renderNonTweeningValue); | ||
plugin._pt = pt; | ||
pt.b = beginning; | ||
pt.e = end; | ||
} else if (p === "smoothOrigin") { | ||
_addNonTweeningPT(this, cache, "smooth", cache.smooth, endValue); | ||
continue; | ||
} else if (p === "force3D") { | ||
cache[p] = endValue; | ||
continue; | ||
} else if (p === "transform") { | ||
_addRawTransformPTs(this, endValue, target); | ||
continue; | ||
} | ||
} | ||
plugin._props.push(property); | ||
if (isTransformRelated || ((endNum || endNum === 0) && (startNum || startNum === 0) && !_complexExp.test(endValue) && (p in style))) { | ||
startUnit = (startValue + "").substr((startNum + "").length); | ||
endUnit = (endValue + "").substr((endNum + "").length) || ((p in _config.units) ? _config.units[p] : startUnit); | ||
if (startUnit !== endUnit) { | ||
startNum = _convertToUnit(target, p, startValue, endUnit); | ||
} | ||
//console.log(p, startNum, startUnit, "to", endNum, endUnit); | ||
this._pt = new PropTween(this._pt, isTransformRelated ? cache : style, p, startNum, relative ? relative * endNum : endNum - startNum, (endUnit === "px" && vars.autoRound !== false && !isTransformRelated) ? _renderRoundedCSSProp : _renderCSSProp); | ||
this._pt.u = endUnit || 0; | ||
if (startUnit !== endUnit) { //when the tween goes all the way back to the beginning, we need to revert it to the OLD/ORIGINAL value (with those units). We record that as a "b" (beginning) property and point to a render method that handles that. (performance optimization) | ||
this._pt.b = startValue; | ||
this._pt.r = _renderCSSPropWithBeginning; | ||
} | ||
} else if (!(p in style)) { | ||
if (p in target) { //maybe it's not a style - it could be a property added directly to an element in which case we'll try to animate that. | ||
this.add(target, p, target[p], endValue, index, targets); | ||
} else { | ||
_warn("Invalid " + p + " tween " + endValue + ". Missing a plugin? gsap.registerPlugin()"); | ||
continue; | ||
} | ||
} else { | ||
_tweenComplexCSSString.call(this, target, p, startValue, endValue); | ||
} | ||
props.push(p); | ||
} | ||
} | ||
if (hasPriority) { | ||
_sortPropTweensByPriority(this); | ||
} | ||
return pt; | ||
}, | ||
_nonConvertibleUnits = { | ||
deg: 1, | ||
rad: 1, | ||
turn: 1 | ||
}, | ||
//takes a single value like 20px and converts it to the unit specified, like "%", returning only the numeric amount. | ||
_convertToUnit = function _convertToUnit(target, property, value, unit) { | ||
var curValue = parseFloat(value), | ||
curUnit = (value + "").substr((curValue + "").length), | ||
style = _tempDiv.style, | ||
horizontal = _horizontalExp.test(property), | ||
isRootSVG = target.tagName.toLowerCase() === "svg", | ||
measureProperty = (isRootSVG ? "client" : "offset") + (horizontal ? "Width" : "Height"), | ||
amount = 100, | ||
toPixels = unit === "px", | ||
px, | ||
parent, | ||
cache, | ||
isSVG; | ||
}, | ||
get:_get, | ||
aliases:_propertyAliases, | ||
getSetter(target, property, plugin) { //returns a setter function that accepts target, property, value and applies it accordingly. Remember, properties like "x" aren't as simple as target.style.property = value because they've got to be applied to a proxy object and then merged into a transform string in a renderer. | ||
return (property in _transformProps && (target._gsap.x || _get(target, "x"))) ? (plugin && _recentSetterPlugin === plugin ? (property === "scale" ? _setterScale : _setterTransform) : (_recentSetterPlugin = plugin || {}) && (property === "scale" ? _setterScaleWithRender : _setterTransformWithRender)) : target.style && !_isUndefined(target.style[property]) ? _setterCSSStyle : _getSetter(target, property); | ||
} | ||
if (unit === curUnit || _nonConvertibleUnits[unit] || _nonConvertibleUnits[curUnit]) { | ||
return curValue; | ||
} | ||
isSVG = target.getCTM && _isSVG(target); | ||
if (unit === "%" && _transformProps[property]) { | ||
//transforms are relative to the size of the element itself! | ||
return _round(curValue / (isSVG ? target.getBBox()[horizontal ? "width" : "height"] : target[measureProperty]) * amount); | ||
} | ||
style[horizontal ? "width" : "height"] = amount + (toPixels ? curUnit : unit); | ||
parent = unit === "em" && target.appendChild && !isRootSVG ? target : target.parentNode; | ||
if (isSVG) { | ||
parent = (target.ownerSVGElement || {}).parentNode; | ||
} | ||
if (!parent || parent === _doc || !parent.appendChild) { | ||
parent = _doc.body; | ||
} | ||
cache = parent._gsap; | ||
if (cache && unit === "%" && cache.width && horizontal && cache.time === _ticker.time) { | ||
px = cache.width * curValue / amount; | ||
} else { | ||
parent.appendChild(_tempDiv); | ||
px = _tempDiv[measureProperty]; | ||
parent.removeChild(_tempDiv); | ||
if (horizontal && unit === "%") { | ||
cache = parent._gsap = parent._gsap || {}; | ||
cache.time = _ticker.time; | ||
cache.width = px / curValue * amount; | ||
} | ||
} | ||
return _round(toPixels ? px * curValue / amount : amount / px * curValue); | ||
}, | ||
_get = function _get(target, property, unit, uncache) { | ||
var value; | ||
if (!_pluginInitted) { | ||
_initCore(); | ||
} | ||
if (property in _propertyAliases) { | ||
property = _propertyAliases[property]; | ||
if (~property.indexOf(",")) { | ||
property = property.split(",")[0]; | ||
} | ||
} | ||
if (_transformProps[property]) { | ||
value = _parseTransform(target, uncache); | ||
value = property !== "transformOrigin" ? value[property] : _firstTwoOnly(_getComputedProperty(target, _transformOriginProp)) + value.zOrigin + "px"; | ||
} else { | ||
value = target.style[property]; | ||
if (!value || value === "auto" || uncache) { | ||
value = _getComputedProperty(target, property) || _getProperty(target, property); | ||
} | ||
} | ||
return unit ? _convertToUnit(target, property, value, unit) + unit : value; | ||
}, | ||
_tweenComplexCSSString = function _tweenComplexCSSString(target, prop, start, end) { | ||
//note: we call _tweenComplexCSSString.call(pluginInstance...) to ensure that it's scoped properly. We may call it from within a plugin too, thus "this" would refer to the plugin. | ||
var pt = new PropTween(this._pt, target.style, prop, 0, 1, _renderComplexString), | ||
index = 0, | ||
matchIndex = 0, | ||
a, | ||
result, | ||
startValues, | ||
startNum, | ||
color, | ||
startValue, | ||
endValue, | ||
endNum, | ||
chunk, | ||
endUnit, | ||
startUnit, | ||
relative, | ||
endValues; | ||
pt.b = start; | ||
pt.e = end; | ||
start += ""; //ensure values are strings | ||
end += ""; | ||
if (end === "auto") { | ||
target.style[prop] = end; | ||
end = _getComputedProperty(target, prop) || end; | ||
target.style[prop] = start; | ||
} | ||
a = [start, end]; | ||
_colorStringFilter(a); //pass an array with the starting and ending values and let the filter do whatever it needs to the values. | ||
start = a[0]; | ||
end = a[1]; | ||
startValues = start.match(_numWithUnitExp) || []; | ||
endValues = end.match(_numWithUnitExp) || []; | ||
if (endValues.length) { | ||
while (result = _numWithUnitExp.exec(end)) { | ||
endValue = result[0]; | ||
chunk = end.substring(index, result.index); | ||
if (color) { | ||
color = (color + 1) % 5; | ||
} else if (chunk.substr(-5) === "rgba(") { | ||
color = 1; | ||
} | ||
if (endValue !== (startValue = startValues[matchIndex++] || "")) { | ||
startNum = parseFloat(startValue) || 0; | ||
startUnit = startValue.substr((startNum + "").length); | ||
relative = endValue.charAt(1) === "=" ? +(endValue.charAt(0) + "1") : 0; | ||
if (relative) { | ||
endValue = endValue.substr(2); | ||
} | ||
endNum = parseFloat(endValue); | ||
endUnit = endValue.substr((endNum + "").length); | ||
index = _numWithUnitExp.lastIndex - endUnit.length; | ||
if (!endUnit) { | ||
//if something like "perspective:300" is passed in and we must add a unit to the end | ||
endUnit = endUnit || _config.units[prop] || startUnit; | ||
if (index === end.length) { | ||
end += endUnit; | ||
pt.e += endUnit; | ||
} | ||
} | ||
if (startUnit !== endUnit) { | ||
startNum = _convertToUnit(target, prop, startValue, endUnit); | ||
} //these nested PropTweens are handled in a special way - we'll never actually call a render or setter method on them. We'll just loop through them in the parent complex string PropTween's render method. | ||
pt._pt = { | ||
_next: pt._pt, | ||
p: chunk || matchIndex === 1 ? chunk : ",", | ||
//note: SVG spec allows omission of comma/space when a negative sign is wedged between two numbers, like 2.5-5.3 instead of 2.5,-5.3 but when tweening, the negative value may switch to positive, so we insert the comma just in case. | ||
s: startNum, | ||
c: relative ? relative * endNum : endNum - startNum, | ||
m: color && color < 4 ? Math.round : 0 | ||
}; | ||
} | ||
} | ||
pt.c = index < end.length ? end.substring(index, end.length) : ""; //we use the "c" of the PropTween to store the final part of the string (after the last number) | ||
} else { | ||
pt.r = prop === "display" ? _renderNonTweeningValueOnlyAtEnd : _renderNonTweeningValue; | ||
} | ||
if (_relExp.test(end)) { | ||
pt.e = 0; //if the end string contains relative values or dynamic random(...) values, delete the end it so that on the final render we don't actually set it to the string with += or -= characters (forces it to use the calculated value). | ||
} | ||
this._pt = pt; //start the linked list with this new PropTween. Remember, we call _tweenComplexCSSString.call(pluginInstance...) to ensure that it's scoped properly. We may call it from within another plugin too, thus "this" would refer to the plugin. | ||
return pt; | ||
}, | ||
_keywordToPercent = { | ||
top: "0%", | ||
bottom: "100%", | ||
left: "0%", | ||
right: "100%", | ||
center: "50%" | ||
}, | ||
_convertKeywordsToPercentages = function _convertKeywordsToPercentages(value) { | ||
var split = value.split(" "), | ||
x = split[0], | ||
y = split[1] || "50%"; | ||
if (x === "top" || x === "bottom" || y === "left" || y === "right") { | ||
//the user provided them in the wrong order, so flip them | ||
split = x; | ||
x = y; | ||
y = split; | ||
} | ||
split[0] = _keywordToPercent[x] || x; | ||
split[1] = _keywordToPercent[y] || y; | ||
return split.join(" "); | ||
}, | ||
_renderClearProps = function _renderClearProps(ratio, data) { | ||
if (data.tween && data.tween._time === data.tween._dur) { | ||
var target = data.t, | ||
style = target.style, | ||
props = data.u, | ||
prop, | ||
clearTransforms, | ||
i; | ||
if (props === "all" || props === true) { | ||
style.cssText = ""; | ||
clearTransforms = 1; | ||
} else { | ||
props = props.split(","); | ||
i = props.length; | ||
while (--i > -1) { | ||
prop = props[i]; | ||
if (_transformProps[prop]) { | ||
clearTransforms = 1; | ||
prop = prop === "transformOrigin" ? _transformOriginProp : _transformProp; | ||
} | ||
_removeProperty(target, prop); | ||
} | ||
} | ||
if (clearTransforms) { | ||
_removeProperty(target, _transformProp); | ||
clearTransforms = target._gsap; | ||
if (clearTransforms) { | ||
if (clearTransforms.svg) { | ||
target.removeAttribute("transform"); | ||
} | ||
delete clearTransforms.x; | ||
} | ||
} | ||
} | ||
}, | ||
// note: specialProps should return 1 if (and only if) they have a non-zero priority. It indicates we need to sort the linked list. | ||
_specialProps = { | ||
clearProps: function clearProps(plugin, target, property, endValue, tween) { | ||
var pt = plugin._pt = new PropTween(plugin._pt, target, property, 0, 0, _renderClearProps); | ||
pt.u = endValue; | ||
pt.pr = -10; | ||
pt.tween = tween; | ||
plugin._props.push(property); | ||
return 1; | ||
} | ||
/* className feature (about 0.4kb gzipped). | ||
, className(plugin, target, property, endValue, tween) { | ||
let _renderClassName = (ratio, data) => { | ||
data.css.render(ratio, data.css); | ||
if (!ratio || ratio === 1) { | ||
let inline = data.rmv, | ||
target = data.t, | ||
p; | ||
target.setAttribute("class", ratio ? data.e : data.b); | ||
for (p in inline) { | ||
_removeProperty(target, p); | ||
} | ||
} | ||
}, | ||
_getAllStyles = (target) => { | ||
let styles = {}, | ||
computed = getComputedStyle(target), | ||
p; | ||
for (p in computed) { | ||
if (isNaN(p) && p !== "cssText" && p !== "length") { | ||
styles[p] = computed[p]; | ||
} | ||
} | ||
_setDefaults(styles, _parseTransform(target, 1)); | ||
return styles; | ||
}, | ||
startClassList = target.getAttribute("class"), | ||
style = target.style, | ||
cssText = style.cssText, | ||
cache = target._gsap, | ||
classPT = cache.classPT, | ||
inlineToRemoveAtEnd = {}, | ||
data = {t:target, plugin:plugin, rmv:inlineToRemoveAtEnd, b:startClassList, e:(endValue.charAt(1) !== "=") ? endValue : startClassList.replace(new RegExp("(?:\\s|^)" + endValue.substr(2) + "(?![\\w-])"), "") + ((endValue.charAt(0) === "+") ? " " + endValue.substr(2) : "")}, | ||
changingVars = {}, | ||
startVars = _getAllStyles(target), | ||
transformRelated = /(transform|perspective)/i, | ||
endVars, p; | ||
if (classPT) { | ||
classPT.r(1, classPT.d); | ||
_removeLinkedListItem(classPT.d.plugin, classPT, "_pt"); | ||
} | ||
target.setAttribute("class", data.e); | ||
endVars = _getAllStyles(target, true); | ||
target.setAttribute("class", startClassList); | ||
for (p in endVars) { | ||
if (endVars[p] !== startVars[p] && !transformRelated.test(p)) { | ||
changingVars[p] = endVars[p]; | ||
if (!style[p] && style[p] !== "0") { | ||
inlineToRemoveAtEnd[p] = 1; | ||
} | ||
} | ||
} | ||
cache.classPT = plugin._pt = new PropTween(plugin._pt, target, "className", 0, 0, _renderClassName, data, 0, -11); | ||
if (style.cssText !== cssText) { //only apply if things change. Otherwise, in cases like a background-image that's pulled dynamically, it could cause a refresh. See https://greensock.com/forums/topic/20368-possible-gsap-bug-switching-classnames-in-chrome/. | ||
style.cssText = cssText; //we recorded cssText before we swapped classes and ran _getAllStyles() because in cases when a className tween is overwritten, we remove all the related tweening properties from that class change (otherwise class-specific stuff can't override properties we've directly set on the target's style object due to specificity). | ||
} | ||
_parseTransform(target, true); //to clear the caching of transforms | ||
data.css = new gsap.plugins.css(); | ||
data.css.init(target, changingVars, tween); | ||
plugin._props.push(...data.css._props); | ||
return 1; | ||
} | ||
*/ | ||
}, | ||
/* | ||
* -------------------------------------------------------------------------------------- | ||
* TRANSFORMS | ||
* -------------------------------------------------------------------------------------- | ||
*/ | ||
_identity2DMatrix = [1, 0, 0, 1, 0, 0], | ||
_rotationalProperties = {}, | ||
_getComputedTransformMatrixAsArray = function _getComputedTransformMatrixAsArray(target) { | ||
var matrixString = _getComputedProperty(target, _transformProp); | ||
return matrixString === "matrix(1, 0, 0, 1, 0, 0)" || matrixString === "none" || !matrixString ? _identity2DMatrix : matrixString.substr(7).match(_numExp).map(_round); | ||
}, | ||
_getMatrix = function _getMatrix(target, force2D) { | ||
var cache = target._gsap, | ||
style = target.style, | ||
matrix = _getComputedTransformMatrixAsArray(target), | ||
parent, | ||
nextSibling, | ||
temp, | ||
addedToDOM; | ||
if (cache.svg && target.getAttribute("transform")) { | ||
temp = target.transform.baseVal.consolidate().matrix; //ensures that even complex values like "translate(50,60) rotate(135,0,0)" are parsed because it mashes it into a matrix. | ||
matrix = [temp.a, temp.b, temp.c, temp.d, temp.e, temp.f]; | ||
return matrix.join(",") === "1,0,0,1,0,0" ? _identity2DMatrix : matrix; | ||
} else if (matrix === _identity2DMatrix && !target.offsetParent && target !== _docElement && !cache.svg) { | ||
//note: if offsetParent is null, that means the element isn't in the normal document flow, like if it has display:none or one of its ancestors has display:none). Firefox returns null for getComputedStyle() if the element is in an iframe that has display:none. https://bugzilla.mozilla.org/show_bug.cgi?id=548397 | ||
//browsers don't report transforms accurately unless the element is in the DOM and has a display value that's not "none". Firefox and Microsoft browsers have a partial bug where they'll report transforms even if display:none BUT not any percentage-based values like translate(-50%, 8px) will be reported as if it's translate(0, 8px). | ||
temp = style.display; | ||
style.display = "block"; | ||
parent = target.parentNode; | ||
if (!parent || !target.offsetParent) { | ||
addedToDOM = 1; //flag | ||
nextSibling = target.nextSibling; | ||
_docElement.appendChild(target); //we must add it to the DOM in order to get values properly | ||
} | ||
matrix = _getComputedTransformMatrixAsArray(target); | ||
if (temp) { | ||
style.display = temp; | ||
} else { | ||
_removeProperty(target, "display"); | ||
} | ||
if (addedToDOM) { | ||
if (nextSibling) { | ||
parent.insertBefore(target, nextSibling); | ||
} else if (parent) { | ||
parent.appendChild(target); | ||
} else { | ||
_docElement.removeChild(target); | ||
} | ||
} | ||
} | ||
return force2D && matrix.length > 6 ? [matrix[0], matrix[1], matrix[4], matrix[5], matrix[12], matrix[13]] : matrix; | ||
}, | ||
_applySVGOrigin = function _applySVGOrigin(target, origin, originIsAbsolute, smooth, matrixArray, pluginToAddPropTweensTo) { | ||
var cache = target._gsap, | ||
matrix = matrixArray || _getMatrix(target, true), | ||
xOriginOld = cache.xOrigin || 0, | ||
yOriginOld = cache.yOrigin || 0, | ||
xOffsetOld = cache.xOffset || 0, | ||
yOffsetOld = cache.yOffset || 0, | ||
a = matrix[0], | ||
b = matrix[1], | ||
c = matrix[2], | ||
d = matrix[3], | ||
tx = matrix[4], | ||
ty = matrix[5], | ||
originSplit = origin.split(" "), | ||
xOrigin = parseFloat(originSplit[0]) || 0, | ||
yOrigin = parseFloat(originSplit[1]) || 0, | ||
bounds, | ||
determinant, | ||
x, | ||
y; | ||
if (!originIsAbsolute) { | ||
bounds = _getBBox(target); | ||
xOrigin = bounds.x + (~originSplit[0].indexOf("%") ? xOrigin / 100 * bounds.width : xOrigin); | ||
yOrigin = bounds.y + (~(originSplit[1] || originSplit[0]).indexOf("%") ? yOrigin / 100 * bounds.height : yOrigin); | ||
} else if (matrix !== _identity2DMatrix && (determinant = a * d - b * c)) { | ||
//if it's zero (like if scaleX and scaleY are zero), skip it to avoid errors with dividing by zero. | ||
x = xOrigin * (d / determinant) + yOrigin * (-c / determinant) + (c * ty - d * tx) / determinant; | ||
y = xOrigin * (-b / determinant) + yOrigin * (a / determinant) - (a * ty - b * tx) / determinant; | ||
xOrigin = x; | ||
yOrigin = y; | ||
} | ||
if (smooth || smooth !== false && cache.smooth) { | ||
tx = xOrigin - xOriginOld; | ||
ty = yOrigin - yOriginOld; | ||
cache.xOffset += tx * a + ty * c - tx; | ||
cache.yOffset += tx * b + ty * d - ty; | ||
} else { | ||
cache.xOffset = cache.yOffset = 0; | ||
} | ||
cache.xOrigin = xOrigin; | ||
cache.yOrigin = yOrigin; | ||
cache.smooth = !!smooth; | ||
cache.origin = origin; | ||
cache.originIsAbsolute = !!originIsAbsolute; | ||
if (pluginToAddPropTweensTo) { | ||
_addNonTweeningPT(pluginToAddPropTweensTo, cache, "xOrigin", xOriginOld, xOrigin); | ||
_addNonTweeningPT(pluginToAddPropTweensTo, cache, "yOrigin", yOriginOld, yOrigin); | ||
_addNonTweeningPT(pluginToAddPropTweensTo, cache, "xOffset", xOffsetOld, cache.xOffset); | ||
_addNonTweeningPT(pluginToAddPropTweensTo, cache, "yOffset", yOffsetOld, cache.yOffset); | ||
} | ||
}, | ||
_parseTransform = function _parseTransform(target, uncache) { | ||
var cache = target._gsap || new GSCache(target); | ||
if ("x" in cache && !uncache) { | ||
return cache; | ||
} | ||
var style = target.style, | ||
invertedScaleX = cache.scaleX < 0, | ||
xOrigin = cache.xOrigin || 0, | ||
yOrigin = cache.yOrigin || 0, | ||
px = "px", | ||
deg = "deg", | ||
origin = _getComputedProperty(target, _transformOriginProp) || "0", | ||
x, | ||
y, | ||
z, | ||
scaleX, | ||
scaleY, | ||
rotation, | ||
rotationX, | ||
rotationY, | ||
skewX, | ||
skewY, | ||
perspective, | ||
matrix, | ||
angle, | ||
cos, | ||
sin, | ||
a, | ||
b, | ||
c, | ||
d, | ||
a12, | ||
a22, | ||
t1, | ||
t2, | ||
t3, | ||
a13, | ||
a23, | ||
a33, | ||
a42, | ||
a43, | ||
a32; | ||
x = y = z = rotation = rotationX = rotationY = skewX = skewY = perspective = 0; | ||
scaleX = scaleY = 1; | ||
cache.svg = !!(target.getCTM && _isSVG(target)); | ||
matrix = _getMatrix(target, cache.svg); | ||
if (cache.svg) { | ||
_applySVGOrigin(target, origin, cache.originIsAbsolute, cache.smooth !== false, matrix); | ||
} | ||
if (matrix !== _identity2DMatrix) { | ||
a = matrix[0]; //a11 | ||
b = matrix[1]; //a21 | ||
c = matrix[2]; //a31 | ||
d = matrix[3]; //a41 | ||
x = a12 = matrix[4]; | ||
y = a22 = matrix[5]; //2D matrix | ||
if (matrix.length === 6) { | ||
scaleX = Math.sqrt(a * a + b * b); | ||
scaleY = Math.sqrt(d * d + c * c); | ||
rotation = a || b ? _atan2(b, a) * _RAD2DEG : cache.rotation || 0; //note: if scaleX is 0, we cannot accurately measure rotation. Same for skewX with a scaleY of 0. Therefore, we default to the previously recorded value (or zero if that doesn't exist). | ||
skewX = c || d ? _atan2(c, d) * _RAD2DEG + rotation : cache.skewX || 0; | ||
if (cache.svg) { | ||
x -= xOrigin - (xOrigin * a + yOrigin * c); | ||
y -= yOrigin - (xOrigin * b + yOrigin * d); | ||
} //3D matrix | ||
} else { | ||
a32 = matrix[6]; | ||
a42 = matrix[7]; | ||
a13 = matrix[8]; | ||
a23 = matrix[9]; | ||
a33 = matrix[10]; | ||
a43 = matrix[11]; | ||
x = matrix[12]; | ||
y = matrix[13]; | ||
z = matrix[14]; | ||
angle = _atan2(a32, a33); | ||
rotationX = angle * _RAD2DEG; //rotationX | ||
if (angle) { | ||
cos = Math.cos(-angle); | ||
sin = Math.sin(-angle); | ||
t1 = a12 * cos + a13 * sin; | ||
t2 = a22 * cos + a23 * sin; | ||
t3 = a32 * cos + a33 * sin; | ||
a13 = a12 * -sin + a13 * cos; | ||
a23 = a22 * -sin + a23 * cos; | ||
a33 = a32 * -sin + a33 * cos; | ||
a43 = a42 * -sin + a43 * cos; | ||
a12 = t1; | ||
a22 = t2; | ||
a32 = t3; | ||
} //rotationY | ||
angle = _atan2(-c, a33); | ||
rotationY = angle * _RAD2DEG; | ||
if (angle) { | ||
cos = Math.cos(-angle); | ||
sin = Math.sin(-angle); | ||
t1 = a * cos - a13 * sin; | ||
t2 = b * cos - a23 * sin; | ||
t3 = c * cos - a33 * sin; | ||
a43 = d * sin + a43 * cos; | ||
a = t1; | ||
b = t2; | ||
c = t3; | ||
} //rotationZ | ||
angle = _atan2(b, a); | ||
rotation = angle * _RAD2DEG; | ||
if (angle) { | ||
cos = Math.cos(angle); | ||
sin = Math.sin(angle); | ||
t1 = a * cos + b * sin; | ||
t2 = a12 * cos + a22 * sin; | ||
b = b * cos - a * sin; | ||
a22 = a22 * cos - a12 * sin; | ||
a = t1; | ||
a12 = t2; | ||
} | ||
if (rotationX && Math.abs(rotationX) + Math.abs(rotation) > 359.9) { | ||
//when rotationY is set, it will often be parsed as 180 degrees different than it should be, and rotationX and rotation both being 180 (it looks the same), so we adjust for that here. | ||
rotationX = rotation = 0; | ||
rotationY = 180 - rotationY; | ||
} | ||
scaleX = _round(Math.sqrt(a * a + b * b + c * c)); | ||
scaleY = _round(Math.sqrt(a22 * a22 + a32 * a32)); | ||
angle = _atan2(a12, a22); | ||
skewX = Math.abs(angle) > 0.0002 ? angle * _RAD2DEG : 0; | ||
perspective = a43 ? 1 / (a43 < 0 ? -a43 : a43) : 0; | ||
} | ||
} | ||
if (Math.abs(skewX) > 90 && Math.abs(skewX) < 270) { | ||
if (invertedScaleX) { | ||
scaleX *= -1; | ||
skewX += rotation <= 0 ? 180 : -180; | ||
rotation += rotation <= 0 ? 180 : -180; | ||
} else { | ||
scaleY *= -1; | ||
skewX += skewX <= 0 ? 180 : -180; | ||
} | ||
} | ||
cache.x = ((cache.xPercent = x && Math.round(target.offsetWidth / 2) === Math.round(-x) ? -50 : 0) ? 0 : x) + px; | ||
cache.y = ((cache.yPercent = y && Math.round(target.offsetHeight / 2) === Math.round(-y) ? -50 : 0) ? 0 : y) + px; | ||
cache.z = z + px; | ||
cache.scaleX = _round(scaleX); | ||
cache.scaleY = _round(scaleY); | ||
cache.rotation = _round(rotation) + deg; | ||
cache.rotationX = _round(rotationX) + deg; | ||
cache.rotationY = _round(rotationY) + deg; | ||
cache.skewX = skewX + deg; | ||
cache.skewY = skewY + deg; | ||
cache.transformPerspective = perspective + px; | ||
if (cache.zOrigin = parseFloat(origin.split(" ")[2]) || 0) { | ||
style[_transformOriginProp] = _firstTwoOnly(origin); | ||
} | ||
cache.xOffset = cache.yOffset = 0; | ||
cache.force3D = _config.force3D; | ||
cache.renderTransform = cache.svg ? _renderSVGTransforms : _supports3D ? _renderCSSTransforms : _renderNon3DTransforms; | ||
if (cache.svg && style[_transformProp]) { | ||
gsap.delayedCall(0.001, function () { | ||
return _removeProperty(target, _transformProp); | ||
}); //if we apply this right away (before anything has rendered), we risk there being no transforms for a brief moment and it also interferes with adjusting the transformOrigin in a tween with immediateRender:true (it'd try reading the matrix and it wouldn't have the appropriate data in place because we just removed it). | ||
} | ||
return cache; | ||
}, | ||
_firstTwoOnly = function _firstTwoOnly(value) { | ||
return (value = value.split(" "))[0] + " " + value[1]; | ||
}, | ||
//for handling transformOrigin values, stripping out the 3rd dimension | ||
_addPxTranslate = function _addPxTranslate(target, start, value) { | ||
var unit = getUnit(start); | ||
return _round(parseFloat(start) + parseFloat(_convertToUnit(target, "x", value + "px", unit))) + unit; | ||
}, | ||
_renderNon3DTransforms = function _renderNon3DTransforms(ratio, cache) { | ||
cache.z = "0px"; | ||
cache.rotationY = cache.rotationX = "0deg"; | ||
cache.force3D = 0; | ||
_renderCSSTransforms(ratio, cache); | ||
}, | ||
_zeroDeg = "0deg", | ||
_zeroPx = "0px", | ||
_endParenthesis = ") ", | ||
_renderCSSTransforms = function _renderCSSTransforms(ratio, cache) { | ||
var _ref = cache || this, | ||
xPercent = _ref.xPercent, | ||
yPercent = _ref.yPercent, | ||
x = _ref.x, | ||
y = _ref.y, | ||
z = _ref.z, | ||
rotation = _ref.rotation, | ||
rotationY = _ref.rotationY, | ||
rotationX = _ref.rotationX, | ||
skewX = _ref.skewX, | ||
skewY = _ref.skewY, | ||
scaleX = _ref.scaleX, | ||
scaleY = _ref.scaleY, | ||
transformPerspective = _ref.transformPerspective, | ||
force3D = _ref.force3D, | ||
target = _ref.target, | ||
zOrigin = _ref.zOrigin, | ||
transforms = "", | ||
use3D = force3D === "auto" && ratio && ratio !== 1 || force3D === true; // Safari has a bug that causes it not to render 3D transform-origin values properly, so we force the z origin to 0, record it in the cache, and then do the math here to offset the translate values accordingly (basically do the 3D transform-origin part manually) | ||
if (zOrigin && (rotationX !== _zeroDeg || rotationY !== _zeroDeg)) { | ||
var angle = parseFloat(rotationY) * _DEG2RAD, | ||
a13 = Math.sin(angle), | ||
a33 = Math.cos(angle), | ||
cos; | ||
angle = parseFloat(rotationX) * _DEG2RAD; | ||
cos = Math.cos(angle); | ||
x = _addPxTranslate(target, x, a13 * cos * -zOrigin); | ||
y = _addPxTranslate(target, y, -Math.sin(angle) * -zOrigin); | ||
z = _addPxTranslate(target, z, a33 * cos * -zOrigin + zOrigin); | ||
} | ||
if (xPercent || yPercent) { | ||
transforms = "translate(" + xPercent + "%, " + yPercent + "%) "; | ||
} | ||
if (use3D || x !== _zeroPx || y !== _zeroPx || z !== _zeroPx) { | ||
transforms += z !== _zeroPx || use3D ? "translate3d(" + x + ", " + y + ", " + z + ") " : "translate(" + x + ", " + y + _endParenthesis; | ||
} | ||
if (transformPerspective !== _zeroPx) { | ||
transforms += "perspective(" + transformPerspective + _endParenthesis; | ||
} | ||
if (rotation !== _zeroDeg) { | ||
transforms += "rotate(" + rotation + _endParenthesis; | ||
} | ||
if (rotationY !== _zeroDeg) { | ||
transforms += "rotateY(" + rotationY + _endParenthesis; | ||
} | ||
if (rotationX !== _zeroDeg) { | ||
transforms += "rotateX(" + rotationX + _endParenthesis; | ||
} | ||
if (skewX !== _zeroDeg || skewY !== _zeroDeg) { | ||
transforms += "skew(" + skewX + ", " + skewY + _endParenthesis; | ||
} | ||
if (scaleX !== 1 || scaleY !== 1) { | ||
transforms += "scale(" + scaleX + ", " + scaleY + _endParenthesis; | ||
} | ||
target.style[_transformProp] = transforms || "translate(0, 0)"; | ||
}, | ||
_renderSVGTransforms = function _renderSVGTransforms(ratio, cache) { | ||
var _ref2 = cache || this, | ||
xPercent = _ref2.xPercent, | ||
yPercent = _ref2.yPercent, | ||
x = _ref2.x, | ||
y = _ref2.y, | ||
rotation = _ref2.rotation, | ||
skewX = _ref2.skewX, | ||
skewY = _ref2.skewY, | ||
scaleX = _ref2.scaleX, | ||
scaleY = _ref2.scaleY, | ||
target = _ref2.target, | ||
xOrigin = _ref2.xOrigin, | ||
yOrigin = _ref2.yOrigin, | ||
xOffset = _ref2.xOffset, | ||
yOffset = _ref2.yOffset, | ||
tx = parseFloat(x), | ||
ty = parseFloat(y), | ||
a11, | ||
a21, | ||
a12, | ||
a22, | ||
temp; | ||
rotation = parseFloat(rotation); | ||
skewX = parseFloat(skewX); | ||
skewY = parseFloat(skewY); | ||
if (skewY) { | ||
//for performance reasons, we combine all skewing into the skewX and rotation values. Remember, a skewY of 10 degrees looks the same as a rotation of 10 degrees plus a skewX of 10 degrees. | ||
skewY = parseFloat(skewY); | ||
skewX += skewY; | ||
rotation += skewY; | ||
} | ||
if (rotation || skewX) { | ||
rotation *= _DEG2RAD; | ||
skewX *= _DEG2RAD; | ||
a11 = Math.cos(rotation) * scaleX; | ||
a21 = Math.sin(rotation) * scaleX; | ||
a12 = Math.sin(rotation - skewX) * -scaleY; | ||
a22 = Math.cos(rotation - skewX) * scaleY; | ||
if (skewX) { | ||
skewY *= _DEG2RAD; | ||
temp = Math.tan(skewX - skewY); | ||
temp = Math.sqrt(1 + temp * temp); | ||
a12 *= temp; | ||
a22 *= temp; | ||
if (skewY) { | ||
temp = Math.tan(skewY); | ||
temp = Math.sqrt(1 + temp * temp); | ||
a11 *= temp; | ||
a21 *= temp; | ||
} | ||
} | ||
a11 = _round(a11); | ||
a21 = _round(a21); | ||
a12 = _round(a12); | ||
a22 = _round(a22); | ||
} else { | ||
a11 = scaleX; | ||
a22 = scaleY; | ||
a21 = a12 = 0; | ||
} | ||
if (tx && !~x.indexOf("px") || ty && !~y.indexOf("px")) { | ||
tx = _convertToUnit(target, "x", x, "px"); | ||
ty = _convertToUnit(target, "y", y, "px"); | ||
} | ||
if (xOrigin || yOrigin || xOffset || yOffset) { | ||
tx = _round(tx + xOrigin - (xOrigin * a11 + yOrigin * a12) + xOffset); | ||
ty = _round(ty + yOrigin - (xOrigin * a21 + yOrigin * a22) + yOffset); | ||
} | ||
if (xPercent || yPercent) { | ||
//The SVG spec doesn't support percentage-based translation in the "transform" attribute, so we merge it into the translation to simulate it. | ||
temp = target.getBBox(); | ||
tx = _round(tx + xPercent / 100 * temp.width); | ||
ty = _round(ty + yPercent / 100 * temp.height); | ||
} | ||
target.setAttribute("transform", "matrix(" + a11 + "," + a21 + "," + a12 + "," + a22 + "," + tx + "," + ty + ")"); | ||
}, | ||
_addRotationalPropTween = function _addRotationalPropTween(plugin, target, property, startNum, endValue, relative) { | ||
var cap = 360, | ||
isString = _isString(endValue), | ||
endNum = parseFloat(endValue) * (isString && ~endValue.indexOf("rad") ? _RAD2DEG : 1), | ||
change = relative ? endNum * relative : endNum - startNum, | ||
finalValue = startNum + change + "deg", | ||
direction, | ||
pt; | ||
if (isString) { | ||
direction = endValue.split("_")[1]; | ||
if (direction === "short") { | ||
change %= cap; | ||
if (change !== change % (cap / 2)) { | ||
change += change < 0 ? cap : -cap; | ||
} | ||
} | ||
if (direction === "cw" && change < 0) { | ||
change = (change + cap * _bigNum) % cap - ~~(change / cap) * cap; | ||
} else if (direction === "ccw" && change > 0) { | ||
change = (change - cap * _bigNum) % cap - ~~(change / cap) * cap; | ||
} | ||
} | ||
plugin._pt = pt = new PropTween(plugin._pt, target, property, startNum, change, _renderPropWithEnd); | ||
pt.e = finalValue; | ||
pt.u = "deg"; | ||
plugin._props.push(property); | ||
return pt; | ||
}, | ||
_addRawTransformPTs = function _addRawTransformPTs(plugin, transforms, target) { | ||
//for handling cases where someone passes in a whole transform string, like transform: "scale(2, 3) rotate(20deg) translateY(30em)" | ||
var style = _tempDivStyler.style, | ||
startCache = target._gsap, | ||
endCache, | ||
p, | ||
startValue, | ||
endValue, | ||
startNum, | ||
endNum, | ||
startUnit, | ||
endUnit; | ||
style.cssText = getComputedStyle(target).cssText + ";position:absolute;display:block;"; //%-based translations will fail unless we set the width/height to match the original target (and padding/borders can affect it) | ||
style[_transformProp] = transforms; | ||
_doc.body.appendChild(_tempDivStyler); | ||
endCache = _parseTransform(_tempDivStyler, 1); | ||
for (p in _transformProps) { | ||
startValue = startCache[p]; | ||
endValue = endCache[p]; | ||
if (startValue !== endValue && p !== "perspective") { | ||
//tweening to no perspective gives very unintuitive results - just keep the same perspective in that case. | ||
startUnit = getUnit(startValue); | ||
endUnit = getUnit(endValue); | ||
startNum = startUnit !== endUnit ? _convertToUnit(target, p, startValue, endUnit) : parseFloat(startValue); | ||
endNum = parseFloat(endValue); | ||
plugin._pt = new PropTween(plugin._pt, startCache, p, startNum, endNum - startNum, _renderCSSProp); | ||
plugin._pt.u = endUnit; | ||
plugin._props.push(p); | ||
} | ||
} | ||
_doc.body.removeChild(_tempDivStyler); | ||
}; | ||
export var CSSPlugin = { | ||
name: "css", | ||
register: _initCore, | ||
targetTest: function targetTest(target) { | ||
return target.style && target.nodeType; | ||
}, | ||
init: function init(target, vars, tween, index, targets) { | ||
var props = this._props, | ||
style = target.style, | ||
startValue, | ||
endValue, | ||
endNum, | ||
startNum, | ||
type, | ||
specialProp, | ||
p, | ||
startUnit, | ||
endUnit, | ||
relative, | ||
isTransformRelated, | ||
transformPropTween, | ||
cache, | ||
smooth, | ||
hasPriority; | ||
if (!_pluginInitted) { | ||
_initCore(); | ||
} | ||
for (p in vars) { | ||
if (p === "autoRound") { | ||
continue; | ||
} | ||
endValue = vars[p]; | ||
if (_plugins[p] && _checkPlugin(p, vars, tween, index, target, targets)) { | ||
//plugins | ||
continue; | ||
} | ||
type = typeof endValue; | ||
specialProp = _specialProps[p]; | ||
if (type === "function") { | ||
endValue = endValue.call(tween, index, target, targets); | ||
type = typeof endValue; | ||
} | ||
if (type === "string" && ~endValue.indexOf("random(")) { | ||
endValue = _replaceRandom(endValue); | ||
} | ||
if (specialProp) { | ||
if (specialProp(this, target, p, endValue, tween)) { | ||
hasPriority = 1; | ||
} | ||
} else if (p.substr(0, 2) === "--") { | ||
//CSS variable | ||
this.add(style, "setProperty", getComputedStyle(target).getPropertyValue(p) + "", endValue + "", index, targets, 0, 0, p); | ||
} else { | ||
startValue = _get(target, p); | ||
startNum = parseFloat(startValue); | ||
relative = type === "string" && endValue.charAt(1) === "=" ? +(endValue.charAt(0) + "1") : 0; | ||
if (relative) { | ||
endValue = endValue.substr(2); | ||
} | ||
endNum = parseFloat(endValue); | ||
if (p in _propertyAliases) { | ||
if (p === "autoAlpha") { | ||
//special case where we control the visibility along with opacity. We still allow the opacity value to pass through and get tweened. | ||
if (startNum === 1 && _get(target, "visibility") === "hidden" && endNum) { | ||
//if visibility is initially set to "hidden", we should interpret that as intent to make opacity 0 (a convenience) | ||
startNum = 0; | ||
} | ||
_addNonTweeningPT(this, style, "visibility", startNum ? "inherit" : "hidden", endNum ? "inherit" : "hidden", !endNum); | ||
} | ||
if (p !== "scale") { | ||
p = _propertyAliases[p]; | ||
if (~p.indexOf(",")) { | ||
p = p.split(",")[0]; | ||
} | ||
} | ||
} | ||
isTransformRelated = p in _transformProps; //--- TRANSFORM-RELATED --- | ||
if (isTransformRelated) { | ||
if (!transformPropTween) { | ||
cache = target._gsap; | ||
smooth = vars.smoothOrigin !== false && cache.smooth; | ||
transformPropTween = this._pt = new PropTween(this._pt, style, _transformProp, 0, 1, cache.renderTransform, cache); //the first time through, create the rendering PropTween so that it runs LAST (in the linked list, we keep adding to the beginning) | ||
transformPropTween.dep = 1; //flag it as dependent so that if things get killed/overwritten and this is the only PropTween left, we can safely kill the whole tween. | ||
} | ||
if (p === "scale") { | ||
this._pt = new PropTween(this._pt, target, "scale", startNum, relative ? relative * endNum : endNum - startNum, 0, 0, _setterScale); | ||
props.push("scale"); | ||
continue; | ||
} else if (p === "transformOrigin") { | ||
endValue = _convertKeywordsToPercentages(endValue); //in case something like "left top" or "bottom right" is passed in. Convert to percentages. | ||
if (cache.svg) { | ||
_applySVGOrigin(target, endValue, 0, smooth, 0, this); | ||
} else { | ||
endUnit = parseFloat(endValue.split(" ")[2]); //handle the zOrigin separately! | ||
if (endUnit !== cache.zOrigin) { | ||
_addNonTweeningPT(this, cache, "zOrigin", cache.zOrigin, endUnit); | ||
} | ||
_addNonTweeningPT(this, style, p, _firstTwoOnly(startValue), _firstTwoOnly(endValue)); | ||
} | ||
continue; | ||
} else if (p === "svgOrigin") { | ||
_applySVGOrigin(target, endValue, 1, smooth, 0, this); | ||
continue; | ||
} else if (p in _rotationalProperties) { | ||
_addRotationalPropTween(this, cache, p, startNum, endValue, relative); | ||
continue; | ||
} else if (p === "smoothOrigin") { | ||
_addNonTweeningPT(this, cache, "smooth", cache.smooth, endValue); | ||
continue; | ||
} else if (p === "force3D") { | ||
cache[p] = endValue; | ||
continue; | ||
} else if (p === "transform") { | ||
_addRawTransformPTs(this, endValue, target); | ||
continue; | ||
} | ||
} | ||
if (isTransformRelated || (endNum || endNum === 0) && (startNum || startNum === 0) && !_complexExp.test(endValue) && p in style) { | ||
startUnit = (startValue + "").substr((startNum + "").length); | ||
endUnit = (endValue + "").substr((endNum + "").length) || (p in _config.units ? _config.units[p] : startUnit); | ||
if (startUnit !== endUnit) { | ||
startNum = _convertToUnit(target, p, startValue, endUnit); | ||
} //console.log(p, startNum, startUnit, "to", endNum, endUnit); | ||
this._pt = new PropTween(this._pt, isTransformRelated ? cache : style, p, startNum, relative ? relative * endNum : endNum - startNum, endUnit === "px" && vars.autoRound !== false && !isTransformRelated ? _renderRoundedCSSProp : _renderCSSProp); | ||
this._pt.u = endUnit || 0; | ||
if (startUnit !== endUnit) { | ||
//when the tween goes all the way back to the beginning, we need to revert it to the OLD/ORIGINAL value (with those units). We record that as a "b" (beginning) property and point to a render method that handles that. (performance optimization) | ||
this._pt.b = startValue; | ||
this._pt.r = _renderCSSPropWithBeginning; | ||
} | ||
} else if (!(p in style)) { | ||
if (p in target) { | ||
//maybe it's not a style - it could be a property added directly to an element in which case we'll try to animate that. | ||
this.add(target, p, target[p], endValue, index, targets); | ||
} else { | ||
_warn("Invalid " + p + " tween " + endValue + ". Missing a plugin? gsap.registerPlugin()"); | ||
continue; | ||
} | ||
} else { | ||
_tweenComplexCSSString.call(this, target, p, startValue, endValue); | ||
} | ||
props.push(p); | ||
} | ||
} | ||
if (hasPriority) { | ||
_sortPropTweensByPriority(this); | ||
} | ||
}, | ||
get: _get, | ||
aliases: _propertyAliases, | ||
getSetter: function getSetter(target, property, plugin) { | ||
//returns a setter function that accepts target, property, value and applies it accordingly. Remember, properties like "x" aren't as simple as target.style.property = value because they've got to be applied to a proxy object and then merged into a transform string in a renderer. | ||
return property in _transformProps && property !== _transformOriginProp && (target._gsap.x || _get(target, "x")) ? plugin && _recentSetterPlugin === plugin ? property === "scale" ? _setterScale : _setterTransform : (_recentSetterPlugin = plugin || {}) && (property === "scale" ? _setterScaleWithRender : _setterTransformWithRender) : target.style && !_isUndefined(target.style[property]) ? _setterCSSStyle : ~property.indexOf("-") ? _setterCSSProp : _getSetter(target, property); | ||
} | ||
}; | ||
gsap.utils.checkPrefix = _checkPropPrefix; | ||
(function(positionAndScale, rotation, others, aliases) { | ||
let all = _forEachName(positionAndScale + "," + rotation + "," + others, name => {_transformProps[name] = 1}); | ||
_forEachName(rotation, name => {_config.units[name] = "deg"; _rotationalProperties[name] = 1}); | ||
_propertyAliases[all[13]] = positionAndScale + "," + rotation; | ||
_forEachName(aliases, name => { | ||
let split = name.split(":"); | ||
_propertyAliases[split[1]] = all[split[0]]; | ||
}); | ||
(function (positionAndScale, rotation, others, aliases) { | ||
var all = _forEachName(positionAndScale + "," + rotation + "," + others, function (name) { | ||
_transformProps[name] = 1; | ||
}); | ||
_forEachName(rotation, function (name) { | ||
_config.units[name] = "deg"; | ||
_rotationalProperties[name] = 1; | ||
}); | ||
_propertyAliases[all[13]] = positionAndScale + "," + rotation; | ||
_forEachName(aliases, function (name) { | ||
var split = name.split(":"); | ||
_propertyAliases[split[1]] = all[split[0]]; | ||
}); | ||
})("x,y,z,scale,scaleX,scaleY,xPercent,yPercent", "rotation,rotationX,rotationY,skewX,skewY", "transform,transformOrigin,svgOrigin,force3D,smoothOrigin,transformPerspective", "0:translateX,1:translateY,2:translateZ,8:rotate,8:rotationZ,9:rotateX,10:rotateY"); | ||
_forEachName("x,y,z,top,right,bottom,left,width,height,fontSize,padding,margin,perspective", name => {_config.units[name] = "px"}); | ||
_forEachName("x,y,z,top,right,bottom,left,width,height,fontSize,padding,margin,perspective", function (name) { | ||
_config.units[name] = "px"; | ||
}); | ||
gsap.registerPlugin(CSSPlugin); | ||
export { CSSPlugin as default, _getBBox, _createElement }; | ||
export { CSSPlugin as default, _getBBox, _createElement, _checkPropPrefix as checkPrefix }; |
@@ -1,13 +0,2 @@ | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e=e||self).window=e.window||{})}(this,function(e){"use strict";function n(e,t){if(e.parentNode&&(u||function _setDoc(e){var t=e.ownerDocument||e;!(g in e.style)&&"msTransform"in e.style&&(x=(g="msTransform")+"Origin");for(;t.parentNode&&(t=t.parentNode););return f=window,u=t}(e))){var o=m(e),r=o?o.getAttribute("xmlns")||"http://www.w3.org/2000/svg":"http://www.w3.org/1999/xhtml",a=o?t?"rect":"g":"div",i=2!==t?0:100,l=3===t?100:0,s="position:absolute;display:block;",c=u.createElementNS?u.createElementNS(r.replace(/^https/,"http"),a):u.createElement(a);return t&&(o?(h=h||n(e),c.setAttribute("width",1),c.setAttribute("height",1),c.setAttribute("transform","translate("+i+","+l+")"),h.appendChild(c)):(d||((d=n(e)).style.cssText=s),c.style.cssText=s+"width:1px;height:1px;top:"+l+"px;left:"+i+"px",d.appendChild(c))),c}throw"Need document and parent."}function p(e,t,n,o,r,a,i){return e.a=t,e.b=n,e.c=o,e.d=r,e.e=a,e.f=i,e} | ||
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-10-03 | ||
* http://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/ | ||
var u,f,d,h,g="transform",x=g+"Origin",y=[],v=[],m=function _svgOwner(e){return e.ownerSVGElement||("svg"===(e.tagName+"").toLowerCase()?e:null)},c=function _placeSiblings(e){var t,o,r,a,i,l=m(e),s=e===l,c=l?y:v;return e===f?e:(c.length||c.push(n(e,1),n(e,2),n(e,3)),t=l?h:d,l?(r=s?{x:0,y:0}:e.getBBox(),i=(o=e.transform.baseVal).length?(a=(o=o.consolidate().matrix).a*r.x+o.c*r.y,o.b*r.x+o.d*r.y):(o=new ue,a=r.x,r.y),t.setAttribute("transform","matrix("+o.a+","+o.b+","+o.c+","+o.d+","+(o.e+a)+","+(o.f+i)+")"),(s?l:e.parentNode).appendChild(t)):(t.style.top=e.offsetTop+"px",t.style.left=e.offsetLeft+"px",o=f.getComputedStyle(e),t.style[g]=o[g],t.style[x]=o[x],e.parentNode.appendChild(t)),t)},ue=function(){function Matrix2D(e,t,n,o,r,a){void 0===e&&(e=1),void 0===t&&(t=0),void 0===n&&(n=0),void 0===o&&(o=1),void 0===r&&(r=0),void 0===a&&(a=0),p(this,e,t,n,o,r,a)}var e=Matrix2D.prototype;return e.inverse=function inverse(){var e=this.a,t=this.b,n=this.c,o=this.d,r=this.e,a=this.f,i=e*o-t*n;return p(this,o/i,-t/i,-n/i,e/i,(n*a-o*r)/i,-(e*a-t*r)/i)},e.multiply=function multiply(e){var t=this.a,n=this.b,o=this.c,r=this.d,a=this.e,i=this.f,l=e.a,s=e.c,c=e.b,u=e.d,f=e.e,d=e.f;return p(this,l*t+c*o,l*n+c*r,s*t+u*o,s*n+u*r,a+f*t+d*o,i+f*n+d*r)},e.equals=function equals(e){var t=this.a,n=this.b,o=this.c,r=this.d,a=this.e,i=this.f;return t===e.a&&n===e.b&&o===e.c&&r===e.d&&a===e.e&&i===e.f},e.apply=function apply(e,t){void 0===t&&(t={});var n=e.x,o=e.y,r=this.a,a=this.b,i=this.c,l=this.d,s=this.e,c=this.f;return t.x=n*r+o*i+s,t.y=n*a+o*l+c,t},Matrix2D}();function getGlobalMatrix(e,t){if(!e.parentNode)return new ue;var n=m(e)?y:v,o=c(e),r=n[0].getBoundingClientRect(),a=n[1].getBoundingClientRect(),i=n[2].getBoundingClientRect(),l=o.parentNode,s=new ue((a.left-r.left)/100,(a.top-r.top)/100,(i.left-r.left)/100,(i.top-r.top)/100,r.left,r.top);return l.removeChild(o),t?s.inverse():s}function H(){return"undefined"!=typeof window}function I(){return fe||H()&&(fe=window.gsap)}function J(e){return"function"==typeof e}function K(e){return"object"==typeof e}function L(e){return void 0===e}function M(){return 0}function P(e){return Math.round(1e4*e)/1e4}function ba(e,t){var n,o={};for(n in e)o[n]=t?e[n]*t:e[n];return o}function ca(){return Se.forEach(function(e){return e()})}function ea(){return!Se.length&&fe.ticker.remove(ca)}function fa(e){for(var t=Se.length;t--;)Se[t]===e&&Se.splice(t,1);fe.to(ea,{overwrite:!0,delay:15,duration:0,onComplete:ea,data:"_draggable"})}function ha(e,t,n,o){if(e.addEventListener){var r=ye[t];o=o||(l?{passive:!1}:null),e.addEventListener(r||t,n,o),r&&t!==r&&e.addEventListener(t,n,o)}}function ia(e,t,n){if(e.removeEventListener){var o=ye[t];e.removeEventListener(o||t,n),o&&t!==o&&e.removeEventListener(t,n)}}function ja(e){e.preventDefault&&(e.preventDefault(),e.preventManipulation&&e.preventManipulation())}function la(e){me=e.touches&&ve<e.touches.length,ia(e.target,"touchend",la)}function ma(e){me=e.touches&&ve<e.touches.length,ha(e.target,"touchend",la)}function na(){return pe.pageYOffset||de.scrollTop||he.scrollTop||ge.scrollTop||0}function oa(){return pe.pageXOffset||de.scrollLeft||he.scrollLeft||ge.scrollLeft||0}function pa(e,t){ha(e,"scroll",t),Ce(e.parentNode)||pa(e.parentNode,t)}function qa(e,t){ia(e,"scroll",t),Ce(e.parentNode)||qa(e.parentNode,t)}function sa(e,t){var n="x"===t?"Width":"Height",o="scroll"+n,r="client"+n;return Math.max(0,Ce(e)?Math.max(he[o],ge[o])-(pe["inner"+n]||he[r]||ge[r]):e[o]-e[r])}function ta(e){var t=sa(e,"x"),n=sa(e,"y");Ce(e)?e=_e:ta(e.parentNode),e._gsMaxScrollX=t,e._gsMaxScrollY=n,e._gsScrollX=e.scrollLeft||0,e._gsScrollY=e.scrollTop||0}function ua(e,t,n){var o=e.style;o&&(L(o[t])&&(t=r(t,e)||t),null==n?o.removeProperty&&o.removeProperty(t.replace(/([A-Z])/g,"-$1").toLowerCase()):o[t]=n)}function va(e){return pe.getComputedStyle(e instanceof Element?e:e.host||(e.parentNode||{}).host||e)}function xa(e){if(e===pe)return s.left=s.top=0,s.width=s.right=he.clientWidth||e.innerWidth||ge.clientWidth||0,s.height=s.bottom=(e.innerHeight||0)-20<he.clientHeight?he.clientHeight:e.innerHeight||ge.clientHeight||0,s;var t=L(e.pageX)?e.nodeType||L(e.left)||L(e.top)?xe(e)[0].getBoundingClientRect():e:{left:e.pageX-oa(),top:e.pageY-na(),right:e.pageX-oa()+1,bottom:e.pageY-na()+1};return L(t.right)&&!L(t.width)?(t.right=t.left+t.width,t.bottom=t.top+t.height):L(t.width)&&(t={width:t.right-t.left,height:t.bottom-t.top,right:t.right,left:t.left,bottom:t.bottom,top:t.top}),t}function ya(e,t,n){var o,r=e.vars,a=r[n],i=e._listeners[t];return J(a)&&(o=a.apply(r.callbackScope||e,r[n+"Params"]||[e.pointerEvent])),i&&!1===e.dispatchEvent(t)&&(o=!1),o}function za(e,t){var n,o,r,a=xe(e)[0];return a.nodeType||a===pe?w(a,t):L(e.left)?{left:o=e.min||e.minX||e.minRotation||0,top:n=e.min||e.minY||0,width:(e.max||e.maxX||e.maxRotation||0)-o,height:(e.max||e.maxY||0)-n}:(r={x:0,y:0},{left:e.left-r.x,top:e.top-r.y,width:e.width,height:e.height})}function Ca(r,a,e,t,i,n){var o,l,s,c={};if(a)if(1!==i&&a instanceof Array){if(c.end=o=[],s=a.length,K(a[0]))for(l=0;l<s;l++)o[l]=ba(a[l],i);else for(l=0;l<s;l++)o[l]=a[l]*i;e+=1.1,t-=1.1}else J(a)?c.end=function(e){var t,n,o=a.call(r,e);if(1!==i)if(K(o)){for(n in t={},o)t[n]=o[n]*i;o=t}else o*=i;return o}:c.end=a;return!e&&0!==e||(c.max=e),!t&&0!==t||(c.min=t),n&&(c.velocity=0),c}function Da(e){var t;return!(!e||!e.getAttribute||e===ge)&&(!("true"!==(t=e.getAttribute("data-clickable"))&&("false"===t||!e.onclick&&!o.test(e.nodeName+"")&&"true"!==e.getAttribute("contentEditable")))||Da(e.parentNode))}function Ea(e,t){for(var n,o=e.length;o--;)(n=e[o]).ondragstart=n.onselectstart=t?null:M,ua(n,"userSelect",t?"text":"none")}function Fa(e){H()&&(pe=window,de=document,he=de.documentElement,ge=de.body,a=function _createElement(e,t){var n=de.createElementNS?de.createElementNS((t||"http://www.w3.org/1999/xhtml").replace(/^https/,"http"),e):de.createElement(e);return n.style?n:de.createElement(e)}("div"),(i=de.createElement("div")).style.cssText="visibility:hidden;height:1px;top:-1px;pointer-events:none;position:relative;clear:both;",we=pe.navigator&&-1!==pe.navigator.userAgent.toLowerCase().indexOf("android"),ye=function(e){for(var t=e.split(","),n=(L(a.onpointerdown)?L(a.onmspointerdown)?e:"MSPointerDown,MSPointerMove,MSPointerUp,MSPointerCancel":"pointerdown,pointermove,pointerup,pointercancel").split(","),o={},r=4;-1<--r;)o[t[r]]=n[r],o[n[r]]=t[r];try{he.addEventListener("test",null,Object.defineProperty({},"passive",{get:function get(){l=1}}))}catch(e){}return o}("touchstart,touchmove,touchend,touchcancel"),ha(de,"touchcancel",function(){}),ha(de,"contextmenu",function(){for(var e in Ye)Ye[e].isPressed&&Ye[e].endDrag()}),fe=I()),fe?(be=fe.plugins.inertia,r=fe.utils.checkPrefix,t=r(t),Me=r(Me),xe=fe.utils.toArray):e&&console.warn("Please gsap.registerPlugin(Draggable)")}var fe,pe,de,he,ge,a,i,r,xe,l,ye,ve,me,we,be,t="transform",Me="transformOrigin",De=Array.isArray,Ee=180/Math.PI,Te=1e20,Xe=new ue,Le=Date.now||function(){return(new Date).getTime()},Se=[],Ye={},Ne=0,o=/^(?:a|input|textarea|button|select)$/i,Pe=0,ke={},_e={},Ce=function _isRoot(e){return!(e&&e!==he&&e!==de&&e!==de.body&&e!==pe&&e.nodeType&&e.parentNode)},s={},Re={},w=function _getElementBounds(e,t){t=xe(t)[0];var n,o,r,a,i,l,s,c,u,f,p,d,h,g,x=e.getBBox&&e.ownerSVGElement;if(e===pe)r=na(),o=(n=oa())+(he.clientWidth||e.innerWidth||de.body.clientWidth||0),a=r+((e.innerHeight||0)-20<he.clientHeight?he.clientHeight:e.innerHeight||ge.clientHeight||0);else{if(t===pe||L(t))return e.getBoundingClientRect();n=r=0,d=x?(p=(f=e.getBBox()).width,f.height):e.viewBox&&(f=e.viewBox.baseVal)?(n=f.x||0,r=f.y||0,p=f.width,f.height):(h=va(e),p=parseFloat(h.width)||e.clientWidth||0,parseFloat(h.height)||e.clientHeight||0),o=p,a=d}return e===t?{left:n,top:r,width:o-n,height:a-r}:(l=(i=getGlobalMatrix(t,!0).multiply(getGlobalMatrix(e))).apply({x:n,y:r}),s=i.apply({x:o,y:r}),c=i.apply({x:o,y:a}),u=i.apply({x:n,y:a}),n=Math.min(l.x,s.x,c.x,u.x),r=Math.min(l.y,s.y,c.y,u.y),{left:n+((g=t.parentNode||{}).scrollLeft||0),top:r+(g.scrollTop||0),width:Math.max(l.x,s.x,c.x,u.x)-n,height:Math.max(l.y,s.y,c.y,u.y)-r})},b=function(r){function Draggable(d,f){var e;e=r.call(this)||this,fe||Fa(1),d=xe(d)[0],be=be||fe.plugins.inertia,e.vars=f=ba(f||{}),e.target=d,e.x=e.y=e.rotation=0,e.dragResistance=parseFloat(f.dragResistance)||0,e.edgeResistance=isNaN(f.edgeResistance)?1:parseFloat(f.edgeResistance)||0,e.lockAxis=f.lockAxis,e.autoScroll=f.autoScroll||0,e.lockedAxis=null,e.allowEventDefault=!!f.allowEventDefault;function Ze(e,t){return parseFloat(ae.get(d,e,t))}function Ef(e){if(!(q.isPressed&&e.which<2))return ja(e),e.stopPropagation(),!1;q.endDrag()}function Ff(e){if(q.autoScroll&&q.isDragging&&(Q||X)){var t,n,o,r,a,i,l,s,c=d,u=15*q.autoScroll;for(Q=!1,_e.scrollTop=null!=pe.pageYOffset?pe.pageYOffset:null!=he.scrollTop?he.scrollTop:ge.scrollTop,_e.scrollLeft=null!=pe.pageXOffset?pe.pageXOffset:null!=he.scrollLeft?he.scrollLeft:ge.scrollLeft,r=q.pointerX-_e.scrollLeft,a=q.pointerY-_e.scrollTop;c&&!n;)t=(n=Ce(c.parentNode))?_e:c.parentNode,o=n?{bottom:Math.max(he.clientHeight,pe.innerHeight||0),right:Math.max(he.clientWidth,pe.innerWidth||0),left:0,top:0}:t.getBoundingClientRect(),i=l=0,j&&((s=t._gsMaxScrollY-t.scrollTop)<0?l=s:a>o.bottom-te&&s?(Q=!0,l=Math.min(s,u*(1-Math.max(0,o.bottom-a)/te)|0)):a<o.top+$&&t.scrollTop&&(Q=!0,l=-Math.min(t.scrollTop,u*(1-Math.max(0,a-o.top)/$)|0)),l&&(t.scrollTop+=l)),W&&((s=t._gsMaxScrollX-t.scrollLeft)<0?i=s:r>o.right-ee&&s?(Q=!0,i=Math.min(s,u*(1-Math.max(0,o.right-r)/ee)|0)):r<o.left+ne&&t.scrollLeft&&(Q=!0,i=-Math.min(t.scrollLeft,u*(1-Math.max(0,r-o.left)/ne)|0)),i&&(t.scrollLeft+=i)),n&&(i||l)&&(pe.scrollTo(t.scrollLeft,t.scrollTop),se(q.pointerX+i,q.pointerY+l)),c=t}if(X){var f=q.x,p=q.y;H?(q.deltaX=f-parseFloat(ae.rotation),q.rotation=f,ae.rotation=f+"deg",ae.renderTransform(1,ae)):I?(j&&(q.deltaY=p-parseFloat(ae.y),ae.y=p+"px"),W&&(q.deltaX=f-parseFloat(ae.x),ae.x=f+"px"),ae.renderTransform(1,ae)):(j&&(q.deltaY=p-parseFloat(d.style.top||0),d.style.top=p+"px"),W&&(q.deltaY=f-parseFloat(d.style.left||0),d.style.left=f+"px")),!v||e||F||(!(F=!0)===ya(q,"drag","onDrag")&&(W&&(q.x-=q.deltaX),j&&(q.y-=q.deltaY),Ff(!0)),F=!1)}X=!1}function Gf(e,t){var n,o,r=q.x,a=q.y;d._gsap||(ae=fe.core.getCache(d)),I?(q.x=parseFloat(ae.x),q.y=parseFloat(ae.y)):H?q.x=q.rotation=parseFloat(ae.rotation):(q.y=parseInt(d.style.top||(o=va(d))&&o.top,10)||0,q.x=parseInt(d.style.left||(o||{}).left,10)||0),(S||Y||N)&&!t&&(q.isDragging||q.isThrowing)&&(N&&(ke.x=q.x,ke.y=q.y,(n=N(ke)).x!==q.x&&(q.x=n.x,X=!0),n.y!==q.y&&(q.y=n.y,X=!0)),S&&(n=S(q.x))!==q.x&&(q.x=n,H&&(q.rotation=n),X=!0),Y&&((n=Y(q.y))!==q.y&&(q.y=n),X=!0)),X&&Ff(!0),e||(q.deltaX=q.x-r,q.deltaY=q.y-a,ya(q,"throwupdate","onThrowUpdate"))}function Hf(i,l,s,n){return null==l&&(l=-Te),null==s&&(s=Te),J(i)?function(e){var t=q.isPressed?1-q.edgeResistance:1;return i.call(q,s<e?s+(e-s)*t:e<l?l+(e-l)*t:e)*n}:De(i)?function(e){for(var t,n,o=i.length,r=0,a=Te;-1<--o;)(n=(t=i[o])-e)<0&&(n=-n),n<a&&l<=t&&t<=s&&(r=o,a=n);return i[r]}:isNaN(i)?function(e){return e}:function(){return i*n}}function Jf(){var e,t,n,o;y=!1,f.bounds&&(e=za(f.bounds,d.parentNode),H?(q.minX=w=e.left,q.maxX=m=e.left+e.width,q.minY=M=q.maxY=b=0):L(f.bounds.maxX)&&L(f.bounds.maxY)?(t=za(d,d.parentNode),q.minX=w=Ze(G)+e.left-t.left,q.minY=M=Ze(V)+e.top-t.top,q.maxX=m=w+(e.width-t.width),q.maxY=b=M+(e.height-t.height)):(e=f.bounds,q.minX=w=e.minX,q.minY=M=e.minY,q.maxX=m=e.maxX,q.maxY=b=e.maxY),m<w&&(q.minX=m,q.maxX=m=w,w=q.minX),b<M&&(q.minY=b,q.maxY=b=M,M=q.minY),H&&(q.minRotation=w,q.maxRotation=m),y=!0),f.liveSnap&&(n=!0===f.liveSnap?f.snap||{}:f.liveSnap,o=De(n)||J(n),H?(S=Hf(o?n:n.rotation,w,m,1),Y=null):n.points?N=function buildPointSnapFunc(s,l,c,u,f,p,d){return p=p&&p<Te?p*p:Te,J(s)?function(e){var t,n,o,r=q.isPressed?1-q.edgeResistance:1,a=e.x,i=e.y;return e.x=a=c<a?c+(a-c)*r:a<l?l+(a-l)*r:a,e.y=i=f<i?f+(i-f)*r:i<u?u+(i-u)*r:i,(t=s.call(q,e))!==e&&(e.x=t.x,e.y=t.y),1!==d&&(e.x*=d,e.y*=d),p<Te&&(n=e.x-a,o=e.y-i,p<n*n+o*o&&(e.x=a,e.y=i)),e}:De(s)?function(e){for(var t,n,o,r,a=s.length,i=0,l=Te;-1<--a;)(r=(t=(o=s[a]).x-e.x)*t+(n=o.y-e.y)*n)<l&&(i=a,l=r);return l<=p?s[i]:e}:function(e){return e}}(o?n:n.points,w,m,M,b,n.radius,1):(W&&(S=Hf(o?n:n.x||n.left||n.scrollLeft,w,m,1)),j&&(Y=Hf(o?n:n.y||n.top||n.scrollTop,M,b,1))))}function Kf(){q.isThrowing=!1,ya(q,"throwcomplete","onThrowComplete")}function Lf(){q.isThrowing=!1}function Mf(e,t){var n,o,r,a;e&&be?(!0===e&&(n=f.snap||f.liveSnap||{},o=De(n)||J(n),e={resistance:(f.throwResistance||f.resistance||1e3)/(H?10:1)},H?e.rotation=Ca(q,o?n:n.rotation,m,w,1,t):(W&&(e[G]=Ca(q,o?n:n.points||n.x||n.left,m,w,1,t||"x"===q.lockedAxis)),j&&(e[V]=Ca(q,o?n:n.points||n.y||n.top,b,M,1,t||"y"===q.lockedAxis)),(n.points||De(n)&&K(n[0]))&&(e.linkedProps=G+","+V,e.radius=n.radius))),q.isThrowing=!0,a=isNaN(f.overshootTolerance)?1===f.edgeResistance?0:1-q.edgeResistance+.2:f.overshootTolerance,e.duration={max:Math.max(f.minDuration||0,f.maxDuration||0)||2,min:isNaN(f.minDuration)?0===a||K(e)&&1e3<e.resistance?0:.5:f.minDuration,overshoot:a},q.tween=r=fe.to(d,{inertia:e,data:"_draggable",onComplete:Kf,onInterrupt:Lf,onUpdate:f.fastMode?ya:Gf,onUpdateParams:f.fastMode?[q,"onthrowupdate","onThrowUpdate"]:n&&n.radius?[!1,!0]:[]}),f.fastMode||(r.render(r.duration(),!0,!0),Gf(!0,!0),q.endX=q.x,q.endY=q.y,H&&(q.endRotation=q.x),r.play(0),Gf(!0,!0))):y&&q.applyBounds()}function Nf(e){var t,n=C||new ue;C=getGlobalMatrix(d.parentNode,!0),e&&q.isPressed&&!C.equals(n)&&(t=n.inverse().apply({x:u,y:h}),C.apply(t,t),u=t.x,h=t.y),C.equals(Xe)&&(C=null)}function Of(){var e,t=1-q.edgeResistance;Nf(!1),C&&(Re.x=q.pointerX,Re.y=q.pointerY,C.apply(Re,Re),u=Re.x,h=Re.y),X&&(se(q.pointerX,q.pointerY),Ff(!0)),ie()?(Gf(!0,!0),Jf()):q.applyBounds(),H?(e=d.ownerSVGElement?[ae.xOrigin-d.getBBox().x,ae.yOrigin-d.getBBox().y]:(va(d)[Me]||"0 0").split(" "),T=q.rotationOrigin=getGlobalMatrix(d).apply({x:parseFloat(e[0])||0,y:parseFloat(e[1])||0}),Gf(!0,!0),g=q.x,x=q.y=Math.atan2(T.y-q.pointerY,q.pointerX-T.x)*Ee):(d.parentNode&&d.parentNode.scrollTop,d.parentNode&&d.parentNode.scrollLeft,x=Ze(V),g=Ze(G)),y&&t&&(m<g?g=m+(g-m)/t:g<w&&(g=w-(w-g)/t),H||(b<x?x=b+(x-b)/t:x<M&&(x=M-(M-x)/t))),q.startX=g,q.startY=x}function Qf(){!i.parentNode||ie()||q.isDragging||i.parentNode.removeChild(i)}function Rf(e,t){var n;if(p&&!q.isPressed&&e&&("mousedown"!==e.type&&"pointerdown"!==e.type||t||!(Le()-re<30)||!ye[q.pointerEvent.type])){if(R=ie(),q.pointerEvent=e,ye[e.type]?(_=~e.type.indexOf("touch")?e.currentTarget||e.target:de,ha(_,"touchend",ce),ha(_,"touchmove",le),ha(_,"touchcancel",ce),ha(de,"touchstart",ma)):(_=null,ha(de,"mousemove",le)),A=null,ha(de,"mouseup",ce),e&&e.target&&ha(e.target,"mouseup",ce),k=oe.call(q,e.target)&&!1===f.dragClickables&&!t)return ha(e.target,"change",ce),ya(q,"pressInit","onPressInit"),ya(q,"press","onPress"),void Ea(Z,!0);if((O=!(!_||W==j||!1===q.vars.allowNativeTouchScrolling||q.vars.allowContextMenu&&e&&(e.ctrlKey||2<e.which))&&(W?"y":"x"))||q.allowEventDefault||ja(e),e.changedTouches?(e=D=e.changedTouches[0],E=e.identifier):e.pointerId?E=e.pointerId:D=E=null,ve++,function _addToRenderQueue(e){Se.push(e),1===Se.length&&fe.ticker.add(ca)}(Ff),h=q.pointerY=e.pageY,u=q.pointerX=e.pageX,ya(q,"pressInit","onPressInit"),(O||q.autoScroll)&&ta(d.parentNode),d.parentNode&&q.autoScroll&&!H&&d.parentNode._gsMaxScrollX&&!i.parentNode&&!d.getBBox&&(i.style.width=d.parentNode.scrollWidth+"px",d.parentNode.appendChild(i)),Of(),q.tween&&q.tween.kill(),q.isThrowing=!1,fe.killTweensOf(d,o,!0),q.tween=q.lockedAxis=null,(f.zIndexBoost||!H&&!1!==f.zIndexBoost)&&(d.style.zIndex=Draggable.zIndex++),q.isPressed=!0,v=!(!f.onDrag&&!q._listeners.drag),s=!(!f.onMove&&!q._listeners.move),!H&&(!1!==f.cursor||f.activeCursor))for(n=Z.length;-1<--n;)ua(Z[n],"cursor",f.activeCursor||f.cursor||"move");ya(q,"press","onPress")}}function Vf(e){if(e&&q.isDragging){var t=e.target||d.parentNode,n=t.scrollLeft-t._gsScrollX,o=t.scrollTop-t._gsScrollY;(n||o)&&(C?(u-=n*C.a+o*C.c,h-=o*C.d+n*C.b):(u-=n,h-=o),t._gsScrollX+=n,t._gsScrollY+=o,se(q.pointerX,q.pointerY))}}function Wf(e){var t=Le(),n=t-re<40,o=t-U<40,r=n&&B===re,a=q.pointerEvent&&q.pointerEvent.defaultPrevented,i=n&&c===re,l=e.isTrusted||null==e.isTrusted&&n&&r;if((r||o&&!1!==q.vars.suppressClickOnDrag)&&e.stopImmediatePropagation&&e.stopImmediatePropagation(),n&&(!q.pointerEvent||!q.pointerEvent.defaultPrevented)&&(!r||l&&!i))return l&&r&&(c=re),void(B=re);(q.isPressed||o||n)&&(l&&e.detail&&n&&!a||ja(e))}function Xf(e){return C?{x:e.x*C.a+e.y*C.c+C.e,y:e.x*C.b+e.y*C.d+C.f}:{x:e.x,y:e.y}}var p,u,h,g,x,y,v,s,m,w,b,M,D,E,T,X,t,S,Y,N,k,_,C,R,O,A,F,B,c,n=(f.type||"x,y").toLowerCase(),I=~n.indexOf("x")||~n.indexOf("y"),H=-1!==n.indexOf("rotation"),G=H?"rotation":I?"x":"left",V=I?"y":"top",W=!(!~n.indexOf("x")&&!~n.indexOf("left")),j=!(!~n.indexOf("y")&&!~n.indexOf("top")),z=f.minimumMovement||2,q=function _assertThisInitialized(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e),Z=xe(f.trigger||f.handle||d),o={},U=0,Q=!1,$=f.autoScrollMarginTop||40,ee=f.autoScrollMarginRight||40,te=f.autoScrollMarginBottom||40,ne=f.autoScrollMarginLeft||40,oe=f.clickableTest||Da,re=0,ae=d._gsap||fe.core.getCache(d),ie=function isTweening(){return q.tween&&q.tween.isActive()},le=function onMove(e){var t,n,o,r,a,i,l=e;if(p&&!me&&q.isPressed&&e){if(t=(q.pointerEvent=e).changedTouches){if((e=t[0])!==D&&e.identifier!==E){for(r=t.length;-1<--r&&(e=t[r]).identifier!==E;);if(r<0)return}}else if(e.pointerId&&E&&e.pointerId!==E)return;_&&O&&!A&&(Re.x=e.pageX,Re.y=e.pageY,C&&C.apply(Re,Re),n=Re.x,o=Re.y,((a=Math.abs(n-u))!==(i=Math.abs(o-h))&&(z<a||z<i)||we&&O===A)&&(A=i<a&&W?"x":"y",!1!==q.vars.lockAxisOnTouchScroll&&(q.lockedAxis="x"===A?"y":"x",J(q.vars.onLockAxis)&&q.vars.onLockAxis.call(q,l)),we&&O===A))?ce(l):(q.allowEventDefault||O&&(!A||O===A)||!1===l.cancelable||ja(l),q.autoScroll&&(Q=!0),s&&!1===ya(q,"move","onMove")||se(e.pageX,e.pageY))}},se=function setPointerPosition(e,t){var n,o,r,a,i,l,s=1-q.dragResistance,c=1-q.edgeResistance;q.pointerX=e,q.pointerY=t,H?(a=Math.atan2(T.y-t,e-T.x)*Ee,180<(i=q.y-a)?(x-=360,q.y=a):i<-180&&(x+=360,q.y=a),r=q.x!==g||Math.abs(x-a)>z?(q.y=a,g+(x-a)*s):g):(C&&(l=e*C.a+t*C.c+C.e,t=e*C.b+t*C.d+C.f,e=l),(o=t-h)<z&&-z<o&&(o=0),(n=e-u)<z&&-z<n&&(n=0),(q.lockAxis||q.lockedAxis)&&(n||o)&&((l=q.lockedAxis)||(q.lockedAxis=l=W&&Math.abs(n)>Math.abs(o)?"y":j?"x":null,l&&J(q.vars.onLockAxis)&&q.vars.onLockAxis.call(q,q.pointerEvent)),"y"===l?o=0:"x"===l&&(n=0)),r=P(g+n*s),a=P(x+o*s)),(S||Y||N)&&(q.x!==r||q.y!==a&&!H)?(N&&(ke.x=r,ke.y=a,l=N(ke),r=P(l.x),a=P(l.y)),S&&(r=P(S(r))),Y&&(a=P(Y(a)))):y&&(m<r?r=m+Math.round((r-m)*c):r<w&&(r=w+Math.round((r-w)*c)),H||(b<a?a=Math.round(b+(a-b)*c):a<M&&(a=Math.round(M+(a-M)*c)))),H||C||(r=Math.round(r),a=Math.round(a)),q.x===r&&(q.y===a||H)||(H?(q.endRotation=q.x=q.endX=r,X=!0):(j&&(q.y=q.endY=a,X=!0),W&&(q.x=q.endX=r,X=!0)),!q.isDragging&&q.isPressed&&(q.isDragging=!0,ya(q,"dragstart","onDragStart")))},ce=function onRelease(e,t){if(p&&q.isPressed&&(!e||null==E||t||!(e.pointerId&&e.pointerId!==E||e.changedTouches&&!function _hasTouchID(e,t){for(var n=e.length;n--;)if(e[n].identifier===t)return!0}(e.changedTouches,E)))){q.isPressed=!1;var n,o,r,a,i,l=e,s=q.isDragging,c=q.vars.allowContextMenu&&e&&(e.ctrlKey||2<e.which),u=fe.delayedCall(.001,Qf);if(_?(ia(_,"touchend",onRelease),ia(_,"touchmove",le),ia(_,"touchcancel",onRelease),ia(de,"touchstart",ma)):ia(de,"mousemove",le),ia(de,"mouseup",onRelease),e&&e.target&&ia(e.target,"mouseup",onRelease),X=!1,k&&!c)return e&&(ia(e.target,"change",onRelease),q.pointerEvent=l),Ea(Z,!1),ya(q,"release","onRelease"),ya(q,"click","onClick"),void(k=!1);if(fa(Ff),!H)for(o=Z.length;-1<--o;)ua(Z[o],"cursor",f.cursor||(!1!==f.cursor?"move":null));if(s&&(U=Pe=Le(),q.isDragging=!1),ve--,e){if((n=e.changedTouches)&&(e=n[0])!==D&&e.identifier!==E){for(o=n.length;-1<--o&&(e=n[o]).identifier!==E;);if(o<0)return}q.pointerEvent=l,q.pointerX=e.pageX,q.pointerY=e.pageY}return c&&l?(ja(l),ya(q,"release","onRelease")):l&&!s?(R&&(f.snap||f.bounds)&&Mf(f.inertia||f.throwProps),ya(q,"release","onRelease"),we&&"touchmove"===l.type||-1!==l.type.indexOf("cancel")||(ya(q,"click","onClick"),Le()-re<300&&ya(q,"doubleclick","onDoubleClick"),a=l.target||d,re=Le(),i=function syntheticClick(){re===B||!q.enabled()||q.isPressed||l.defaultPrevented||(a.click?a.click():de.createEvent&&((r=de.createEvent("MouseEvents")).initMouseEvent("click",!0,!0,pe,1,q.pointerEvent.screenX,q.pointerEvent.screenY,q.pointerX,q.pointerY,!1,!1,!1,!1,0,null),a.dispatchEvent(r)))},we||l.defaultPrevented||fe.delayedCall(.05,i))):(Mf(f.inertia||f.throwProps),q.allowEventDefault||!l||!1===f.dragClickables&&oe.call(q,l.target)||!s||O&&(!A||O!==A)||!1===l.cancelable||ja(l),ya(q,"release","onRelease")),ie()&&u.duration(q.tween.duration()),s&&ya(q,"dragend","onDragEnd"),!0}};return(t=Draggable.get(d))&&t.kill(),e.startDrag=function(e,t){var n,o,r,a;Rf(e||q.pointerEvent,!0),t&&!q.hitTest(e||q.pointerEvent)&&(n=xa(e||q.pointerEvent),o=xa(d),r=Xf({x:n.left+n.width/2,y:n.top+n.height/2}),a=Xf({x:o.left+o.width/2,y:o.top+o.height/2}),u-=r.x-a.x,h-=r.y-a.y),q.isDragging||(q.isDragging=!0,ya(q,"dragstart","onDragStart"))},e.drag=le,e.endDrag=function(e){return ce(e||q.pointerEvent,!0)},e.timeSinceDrag=function(){return q.isDragging?0:(Le()-U)/1e3},e.timeSinceClick=function(){return(Le()-re)/1e3},e.hitTest=function(e,t){return Draggable.hitTest(q.target,e,t)},e.getDirection=function(e,t){var n,o,r,a,i,l,s="velocity"===e&&be?e:K(e)&&!H?"element":"start";return"element"===s&&(i=xa(q.target),l=xa(e)),n="start"===s?q.x-g:"velocity"===s?be.getVelocity(d,G):i.left+i.width/2-(l.left+l.width/2),H?n<0?"counter-clockwise":"clockwise":(t=t||2,o="start"===s?q.y-x:"velocity"===s?be.getVelocity(d,V):i.top+i.height/2-(l.top+l.height/2),a=(r=Math.abs(n/o))<1/t?"":n<0?"left":"right",r<t&&(""!==a&&(a+="-"),a+=o<0?"up":"down"),a)},e.applyBounds=function(e){var t,n,o,r,a,i;if(e&&f.bounds!==e)return f.bounds=e,q.update(!0);if(Gf(!0),Jf(),y){if(t=q.x,n=q.y,m<t?t=m:t<w&&(t=w),b<n?n=b:n<M&&(n=M),(q.x!==t||q.y!==n)&&(o=!0,q.x=q.endX=t,H?q.endRotation=t:q.y=q.endY=n,Ff(X=!0),q.autoScroll&&!q.isDragging))for(ta(d.parentNode),r=d,_e.scrollTop=null!=pe.pageYOffset?pe.pageYOffset:null!=he.scrollTop?he.scrollTop:ge.scrollTop,_e.scrollLeft=null!=pe.pageXOffset?pe.pageXOffset:null!=he.scrollLeft?he.scrollLeft:ge.scrollLeft;r&&!i;)a=(i=Ce(r.parentNode))?_e:r.parentNode,j&&a.scrollTop>a._gsMaxScrollY&&(a.scrollTop=a._gsMaxScrollY),W&&a.scrollLeft>a._gsMaxScrollX&&(a.scrollLeft=a._gsMaxScrollX),r=a;q.isThrowing&&(o||q.endX>m||q.endX<w||q.endY>b||q.endY<M)&&Mf(f.inertia||f.throwProps,o)}return q},e.update=function(e,t,n){var o=q.x,r=q.y;return Nf(!t),e?q.applyBounds():(X&&n&&Ff(!0),Gf(!0)),t&&(se(q.pointerX,q.pointerY),X&&Ff(!0)),q.isPressed&&!t&&(W&&.01<Math.abs(o-q.x)||j&&.01<Math.abs(r-q.y)&&!H)&&Of(),q.autoScroll&&(ta(d.parentNode),Q=q.isDragging,Ff(!0)),q.autoScroll&&(qa(d,Vf),pa(d,Vf)),q},e.enable=function(e){var t,n,o;if("soft"!==e){for(n=Z.length;-1<--n;)o=Z[n],ha(o,"mousedown",Rf),ha(o,"touchstart",Rf),ha(o,"touchforcechange",ja),ha(o,"click",Wf,!0),H||!1===f.cursor||ua(o,"cursor",f.cursor||"move"),ua(o,"touchCallout","none"),ua(o,"touchAction",W==j?"none":W?"pan-y":"pan-x"),o.getBBox&&o.ownerSVGElement&&ua(o.ownerSVGElement||o,"touchAction",W==j?"none":W?"pan-y":"pan-x"),q.vars.allowContextMenu||ha(o,"contextmenu",Ef);Ea(Z,!1)}return pa(d,Vf),p=!0,be&&"soft"!==e&&be.track(d,I?"x,y":H?"rotation":"top,left"),d._gsDragID=t="d"+Ne++,Ye[t]=q,Of(),q.update(!0),q},e.disable=function(e){var t,n,o=q.isDragging;if(!H)for(t=Z.length;-1<--t;)ua(Z[t],"cursor",null);if("soft"!==e){for(t=Z.length;-1<--t;)n=Z[t],ua(n,"touchCallout",null),ua(n,"touchAction",null),ia(n,"mousedown",Rf),ia(n,"touchstart",Rf),ia(n,"click",Wf),ia(n,"contextmenu",Ef);Ea(Z,!0),_&&(ia(_,"touchcancel",ce),ia(_,"touchend",ce),ia(_,"touchmove",le)),ia(de,"mouseup",ce),ia(de,"mousemove",le)}return qa(d,Vf),p=!1,be&&"soft"!==e&&be.untrack(d,I?"x,y":H?"rotation":"top,left"),fa(Ff),q.isDragging=q.isPressed=k=!1,o&&ya(q,"dragend","onDragEnd"),q},e.enabled=function(e,t){return arguments.length?e?q.enable(t):q.disable(t):p},e.kill=function(){return q.isThrowing=!1,fe.killTweensOf(d,o,!0),q.disable(),fe.set(Z,{clearProps:"userSelect"}),delete Ye[d._gsDragID],q},H?o.rotation=1:(W&&(o[G]=1),j&&(o[V]=1)),e.enable(),e}return function _inheritsLoose(e,t){e.prototype=Object.create(t.prototype),(e.prototype.constructor=e).__proto__=t}(Draggable,r),Draggable.register=function register(e){fe=e,Fa()},Draggable.create=function create(e,t){return xe(e).map(function(e){return new Draggable(e,t)})},Draggable.get=function get(e){return Ye[(xe(e)[0]||{})._gsDragID]},Draggable.timeSinceDrag=function timeSinceDrag(){return(Le()-Pe)/1e3},Draggable.hitTest=function hitTest(e,t,n){if(e===t)return!1;var o,r,a,i=xa(e),l=xa(t),s=i.top,c=i.left,u=i.right,f=i.bottom,p=i.width,d=i.height,h=l.left>u||l.right<c||l.top>f||l.bottom<s;return h||!n?!h:(a=-1!==(n+"").indexOf("%"),n=parseFloat(n)||0,(o={left:Math.max(c,l.left),top:Math.max(s,l.top)}).width=Math.min(u,l.right)-o.left,o.height=Math.min(f,l.bottom)-o.top,!(o.width<0||o.height<0)&&(a?p*d*(n*=.01)<=(r=o.width*o.height)||r>=l.width*l.height*n:o.width>n&&o.height>n))},Draggable}(function(){function EventDispatcher(e){this._listeners={},this.target=e||this}var e=EventDispatcher.prototype;return e.addEventListener=function addEventListener(e,t){var n=this._listeners[e]||(this._listeners[e]=[]);~n.indexOf(t)||n.push(t)},e.removeEventListener=function removeEventListener(e,t){var n=this._listeners[e],o=n&&n.indexOf(t)||-1;-1<o&&n.splice(o,1)},e.dispatchEvent=function dispatchEvent(t){var n,o=this;return(this._listeners[t]||[]).forEach(function(e){return!1===e.call(o,{type:t,target:o.target})&&(n=!1)}),n},EventDispatcher}());!function _setDefaults(e,t){for(var n in t)n in e||(e[n]=t[n])}(b.prototype,{pointerX:0,pointerY:0,startX:0,startY:0,deltaX:0,deltaY:0,isDragging:!1,isPressed:!1}),b.zIndex=1e3,b.version="3.0.0",I()&&fe.registerPlugin(b),e.Draggable=b,e.default=b,Object.defineProperty(e,"__esModule",{value:!0})}); | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e=e||self).window=e.window||{})}(this,function(e){"use strict";function n(e,t){if(e.parentNode&&(u||function _setDoc(e){var t=e.ownerDocument||e;!(h in e.style)&&"msTransform"in e.style&&(x=(h="msTransform")+"Origin");for(;t.parentNode&&(t=t.parentNode););return f=window,u=t}(e))){var o=m(e),r=o?o.getAttribute("xmlns")||"http://www.w3.org/2000/svg":"http://www.w3.org/1999/xhtml",a=o?t?"rect":"g":"div",i=2!==t?0:100,l=3===t?100:0,s="position:absolute;display:block;",c=u.createElementNS?u.createElementNS(r.replace(/^https/,"http"),a):u.createElement(a);return t&&(o?(g=g||n(e),c.setAttribute("width",1),c.setAttribute("height",1),c.setAttribute("transform","translate("+i+","+l+")"),g.appendChild(c)):(d||((d=n(e)).style.cssText=s),c.style.cssText=s+"width:1px;height:1px;top:"+l+"px;left:"+i+"px",d.appendChild(c))),c}throw"Need document and parent."}function p(e,t,n,o,r,a,i){return e.a=t,e.b=n,e.c=o,e.d=r,e.e=a,e.f=i,e}var u,f,d,g,t,h="transform",x=h+"Origin",v=[],y=[],m=function _svgOwner(e){return e.ownerSVGElement||("svg"===(e.tagName+"").toLowerCase()?e:null)},c=function _placeSiblings(e){var t,o,r,a,i,l=m(e),s=e===l,c=l?v:y;return e===f?e:(c.length||c.push(n(e,1),n(e,2),n(e,3)),t=l?g:d,l?(r=s||"g"===e.tagName.toLowerCase()?{x:0,y:0}:e.getBBox(),i=(o=e.transform.baseVal).length?(a=(o=o.consolidate().matrix).a*r.x+o.c*r.y,o.b*r.x+o.d*r.y):(o=new fe,a=r.x,r.y),t.setAttribute("transform","matrix("+o.a+","+o.b+","+o.c+","+o.d+","+(o.e+a)+","+(o.f+i)+")"),(s?l:e.parentNode).appendChild(t)):(t.style.top=e.offsetTop+"px",t.style.left=e.offsetLeft+"px",o=f.getComputedStyle(e),t.style[h]=o[h],t.style[x]=o[x],e.parentNode.appendChild(t)),t)},fe=((t=Matrix2D.prototype).inverse=function inverse(){var e=this.a,t=this.b,n=this.c,o=this.d,r=this.e,a=this.f,i=e*o-t*n;return p(this,o/i,-t/i,-n/i,e/i,(n*a-o*r)/i,-(e*a-t*r)/i)},t.multiply=function multiply(e){var t=this.a,n=this.b,o=this.c,r=this.d,a=this.e,i=this.f,l=e.a,s=e.c,c=e.b,u=e.d,f=e.e,d=e.f;return p(this,l*t+c*o,l*n+c*r,s*t+u*o,s*n+u*r,a+f*t+d*o,i+f*n+d*r)},t.equals=function equals(e){var t=this.a,n=this.b,o=this.c,r=this.d,a=this.e,i=this.f;return t===e.a&&n===e.b&&o===e.c&&r===e.d&&a===e.e&&i===e.f},t.apply=function apply(e,t){void 0===t&&(t={});var n=e.x,o=e.y,r=this.a,a=this.b,i=this.c,l=this.d,s=this.e,c=this.f;return t.x=n*r+o*i+s,t.y=n*a+o*l+c,t},Matrix2D);function Matrix2D(e,t,n,o,r,a){void 0===e&&(e=1),void 0===t&&(t=0),void 0===n&&(n=0),void 0===o&&(o=1),void 0===r&&(r=0),void 0===a&&(a=0),p(this,e,t,n,o,r,a)}function getGlobalMatrix(e,t){if(!e.parentNode)return new fe;var n=m(e)?v:y,o=c(e),r=n[0].getBoundingClientRect(),a=n[1].getBoundingClientRect(),i=n[2].getBoundingClientRect(),l=o.parentNode,s=new fe((a.left-r.left)/100,(a.top-r.top)/100,(i.left-r.left)/100,(i.top-r.top)/100,r.left,r.top);return l.removeChild(o),t?s.inverse():s}function J(){return"undefined"!=typeof window}function K(){return pe||J()&&(pe=window.gsap)&&pe.registerPlugin&&pe}function L(e){return"function"==typeof e}function M(e){return"object"==typeof e}function N(e){return void 0===e}function O(){return 0}function R(e){return Math.round(1e4*e)/1e4}function da(e,t){var n,o={};for(n in e)o[n]=t?e[n]*t:e[n];return o}function ea(){return Ye.forEach(function(e){return e()})}function ga(){return!Ye.length&&pe.ticker.remove(ea)}function ha(e){for(var t=Ye.length;t--;)Ye[t]===e&&Ye.splice(t,1);pe.to(ga,{overwrite:!0,delay:15,duration:0,onComplete:ga,data:"_draggable"})}function ja(e,t,n,o){if(e.addEventListener){var r=ye[t];o=o||(l?{passive:!1}:null),e.addEventListener(r||t,n,o),r&&t!==r&&"pointer"!==r.substr(0,7)&&e.addEventListener(t,n,o)}}function ka(e,t,n){if(e.removeEventListener){var o=ye[t];e.removeEventListener(o||t,n),o&&t!==o&&"pointer"!==o.substr(0,7)&&e.removeEventListener(t,n)}}function la(e){e.preventDefault&&(e.preventDefault(),e.preventManipulation&&e.preventManipulation())}function na(e){we=e.touches&&me<e.touches.length,ka(e.target,"touchend",na)}function oa(e){we=e.touches&&me<e.touches.length,ja(e.target,"touchend",na)}function pa(){return de.pageYOffset||ge.scrollTop||he.scrollTop||xe.scrollTop||0}function qa(){return de.pageXOffset||ge.scrollLeft||he.scrollLeft||xe.scrollLeft||0}function ra(e,t){ja(e,"scroll",t),Ce(e.parentNode)||ra(e.parentNode,t)}function sa(e,t){ka(e,"scroll",t),Ce(e.parentNode)||sa(e.parentNode,t)}function ua(e,t){var n="x"===t?"Width":"Height",o="scroll"+n,r="client"+n;return Math.max(0,Ce(e)?Math.max(he[o],xe[o])-(de["inner"+n]||he[r]||xe[r]):e[o]-e[r])}function va(e){var t=ua(e,"x"),n=ua(e,"y");Ce(e)?e=Oe:va(e.parentNode),e._gsMaxScrollX=t,e._gsMaxScrollY=n,e._gsScrollX=e.scrollLeft||0,e._gsScrollY=e.scrollTop||0}function wa(e,t,n){var o=e.style;o&&(N(o[t])&&(t=i(t,e)||t),null==n?o.removeProperty&&o.removeProperty(t.replace(/([A-Z])/g,"-$1").toLowerCase()):o[t]=n)}function xa(e){return de.getComputedStyle(e instanceof Element?e:e.host||(e.parentNode||{}).host||e)}function za(e){if(e===de)return T.left=T.top=0,T.width=T.right=he.clientWidth||e.innerWidth||xe.clientWidth||0,T.height=T.bottom=(e.innerHeight||0)-20<he.clientHeight?he.clientHeight:e.innerHeight||xe.clientHeight||0,T;var t=N(e.pageX)?e.nodeType||N(e.left)||N(e.top)?ve(e)[0].getBoundingClientRect():e:{left:e.pageX-qa(),top:e.pageY-pa(),right:e.pageX-qa()+1,bottom:e.pageY-pa()+1};return N(t.right)&&!N(t.width)?(t.right=t.left+t.width,t.bottom=t.top+t.height):N(t.width)&&(t={width:t.right-t.left,height:t.bottom-t.top,right:t.right,left:t.left,bottom:t.bottom,top:t.top}),t}function Aa(e,t,n){var o,r=e.vars,a=r[n],i=e._listeners[t];return L(a)&&(o=a.apply(r.callbackScope||e,r[n+"Params"]||[e.pointerEvent])),i&&!1===e.dispatchEvent(t)&&(o=!1),o}function Ba(e,t){var n,o,r,a=ve(e)[0];return a.nodeType||a===de?D(a,t):N(e.left)?{left:o=e.min||e.minX||e.minRotation||0,top:n=e.min||e.minY||0,width:(e.max||e.maxX||e.maxRotation||0)-o,height:(e.max||e.maxY||0)-n}:(r={x:0,y:0},{left:e.left-r.x,top:e.top-r.y,width:e.width,height:e.height})}function Ea(r,a,e,t,i,n){var o,l,s,c={};if(a)if(1!==i&&a instanceof Array){if(c.end=o=[],s=a.length,M(a[0]))for(l=0;l<s;l++)o[l]=da(a[l],i);else for(l=0;l<s;l++)o[l]=a[l]*i;e+=1.1,t-=1.1}else L(a)?c.end=function(e){var t,n,o=a.call(r,e);if(1!==i)if(M(o)){for(n in t={},o)t[n]=o[n]*i;o=t}else o*=i;return o}:c.end=a;return!e&&0!==e||(c.max=e),!t&&0!==t||(c.min=t),n&&(c.velocity=0),c}function Fa(e){var t;return!(!e||!e.getAttribute||e===xe)&&(!("true"!==(t=e.getAttribute("data-clickable"))&&("false"===t||!e.onclick&&!b.test(e.nodeName+"")&&"true"!==e.getAttribute("contentEditable")))||Fa(e.parentNode))}function Ga(e,t){for(var n,o=e.length;o--;)(n=e[o]).ondragstart=n.onselectstart=t?null:O,wa(n,"userSelect",t?"text":"none")}function Ia(e){J()&&(de=window,ge=document,he=ge.documentElement,xe=ge.body,a=function _createElement(e,t){var n=ge.createElementNS?ge.createElementNS((t||"http://www.w3.org/1999/xhtml").replace(/^https/,"http"),e):ge.createElement(e);return n.style?n:ge.createElement(e)}("div"),De=!!window.PointerEvent,(r=ge.createElement("div")).style.cssText="visibility:hidden;height:1px;top:-1px;pointer-events:none;position:relative;clear:both;cursor:grab",Te="grab"===r.style.cursor?"grab":"move",be=de.navigator&&-1!==de.navigator.userAgent.toLowerCase().indexOf("android"),ye=function(e){for(var t=e.split(","),n=(N(a.onpointerdown)?N(a.onmspointerdown)?e:"MSPointerDown,MSPointerMove,MSPointerUp,MSPointerCancel":"pointerdown,pointermove,pointerup,pointercancel").split(","),o={},r=4;-1<--r;)o[t[r]]=n[r],o[n[r]]=t[r];try{he.addEventListener("test",null,Object.defineProperty({},"passive",{get:function get(){l=1}}))}catch(e){}return o}("touchstart,touchmove,touchend,touchcancel"),ja(ge,"touchcancel",O),ja(de,"touchmove",O),xe&&xe.addEventListener("touchstart",O),ja(ge,"contextmenu",function(){for(var e in Ae)Ae[e].isPressed&&Ae[e].endDrag()}),pe=o=K()),pe?(Me=pe.plugins.inertia,i=pe.utils.checkPrefix,w=i(w),Ee=i(Ee),ve=pe.utils.toArray):e&&console.warn("Please gsap.registerPlugin(Draggable)")}var pe,de,ge,he,xe,a,r,o,i,ve,l,ye,me,we,be,Me,Te,De,s,w="transform",Ee="transformOrigin",ke=Array.isArray,Ne=180/Math.PI,Se=1e20,Le=new fe,Xe=Date.now||function(){return(new Date).getTime()},Ye=[],Ae={},Pe=0,b=/^(?:a|input|textarea|button|select)$/i,Re=0,_e={},Oe={},Ce=function _isRoot(e){return!(e&&e!==he&&e!==ge&&e!==ge.body&&e!==de&&e.nodeType&&e.parentNode)},T={},Be={},D=function _getElementBounds(e,t){t=ve(t)[0];var n,o,r,a,i,l,s,c,u,f,p,d,g,h,x=e.getBBox&&e.ownerSVGElement;if(e===de)r=pa(),o=(n=qa())+(he.clientWidth||e.innerWidth||ge.body.clientWidth||0),a=r+((e.innerHeight||0)-20<he.clientHeight?he.clientHeight:e.innerHeight||xe.clientHeight||0);else{if(t===de||N(t))return e.getBoundingClientRect();n=r=0,d=x?(p=(f=e.getBBox()).width,f.height):e.viewBox&&(f=e.viewBox.baseVal)?(n=f.x||0,r=f.y||0,p=f.width,f.height):(g=xa(e),p=parseFloat(g.width)||e.clientWidth||0,parseFloat(g.height)||e.clientHeight||0),o=p,a=d}return e===t?{left:n,top:r,width:o-n,height:a-r}:(l=(i=getGlobalMatrix(t,!0).multiply(getGlobalMatrix(e))).apply({x:n,y:r}),s=i.apply({x:o,y:r}),c=i.apply({x:o,y:a}),u=i.apply({x:n,y:a}),n=Math.min(l.x,s.x,c.x,u.x),r=Math.min(l.y,s.y,c.y,u.y),{left:n+((h=t.parentNode||{}).scrollLeft||0),top:r+(h.scrollTop||0),width:Math.max(l.x,s.x,c.x,u.x)-n,height:Math.max(l.y,s.y,c.y,u.y)-r})},E=((s=EventDispatcher.prototype).addEventListener=function addEventListener(e,t){var n=this._listeners[e]||(this._listeners[e]=[]);~n.indexOf(t)||n.push(t)},s.removeEventListener=function removeEventListener(e,t){var n=this._listeners[e],o=n&&n.indexOf(t)||-1;-1<o&&n.splice(o,1)},s.dispatchEvent=function dispatchEvent(t){var n,o=this;return(this._listeners[t]||[]).forEach(function(e){return!1===e.call(o,{type:t,target:o.target})&&(n=!1)}),n},EventDispatcher);function EventDispatcher(e){this._listeners={},this.target=e||this}var Ie,k=(function _inheritsLoose(e,t){e.prototype=Object.create(t.prototype),(e.prototype.constructor=e).__proto__=t}(Draggable,Ie=E),Draggable.register=function register(e){pe=e,Ia()},Draggable.create=function create(e,t){return o||Ia(!0),ve(e).map(function(e){return new Draggable(e,t)})},Draggable.get=function get(e){return Ae[(ve(e)[0]||{})._gsDragID]},Draggable.timeSinceDrag=function timeSinceDrag(){return(Xe()-Re)/1e3},Draggable.hitTest=function hitTest(e,t,n){if(e===t)return!1;var o,r,a,i=za(e),l=za(t),s=i.top,c=i.left,u=i.right,f=i.bottom,p=i.width,d=i.height,g=l.left>u||l.right<c||l.top>f||l.bottom<s;return g||!n?!g:(a=-1!==(n+"").indexOf("%"),n=parseFloat(n)||0,(o={left:Math.max(c,l.left),top:Math.max(s,l.top)}).width=Math.min(u,l.right)-o.left,o.height=Math.min(f,l.bottom)-o.top,!(o.width<0||o.height<0)&&(a?p*d*(n*=.01)<=(r=o.width*o.height)||r>=l.width*l.height*n:o.width>n&&o.height>n))},Draggable);function Draggable(d,f){var e;e=Ie.call(this)||this,pe||Ia(1),d=ve(d)[0],Me=Me||pe.plugins.inertia,e.vars=f=da(f||{}),e.target=d,e.x=e.y=e.rotation=0,e.dragResistance=parseFloat(f.dragResistance)||0,e.edgeResistance=isNaN(f.edgeResistance)?1:parseFloat(f.edgeResistance)||0,e.lockAxis=f.lockAxis,e.autoScroll=f.autoScroll||0,e.lockedAxis=null,e.allowEventDefault=!!f.allowEventDefault,pe.set(d,{x:"+=0"});function cf(e,t){return parseFloat(ae.get(d,e,t))}function Jf(e){if(!($.isPressed&&e.which<2))return la(e),e.stopPropagation(),!1;$.endDrag()}function Kf(e){if($.autoScroll&&$.isDragging&&(Q||A)){var t,n,o,r,a,i,l,s,c=d,u=15*$.autoScroll;for(Q=!1,Oe.scrollTop=null!=de.pageYOffset?de.pageYOffset:null!=he.scrollTop?he.scrollTop:xe.scrollTop,Oe.scrollLeft=null!=de.pageXOffset?de.pageXOffset:null!=he.scrollLeft?he.scrollLeft:xe.scrollLeft,r=$.pointerX-Oe.scrollLeft,a=$.pointerY-Oe.scrollTop;c&&!n;)t=(n=Ce(c.parentNode))?Oe:c.parentNode,o=n?{bottom:Math.max(he.clientHeight,de.innerHeight||0),right:Math.max(he.clientWidth,de.innerWidth||0),left:0,top:0}:t.getBoundingClientRect(),i=l=0,V&&((s=t._gsMaxScrollY-t.scrollTop)<0?l=s:a>o.bottom-te&&s?(Q=!0,l=Math.min(s,u*(1-Math.max(0,o.bottom-a)/te)|0)):a<o.top+Z&&t.scrollTop&&(Q=!0,l=-Math.min(t.scrollTop,u*(1-Math.max(0,a-o.top)/Z)|0)),l&&(t.scrollTop+=l)),z&&((s=t._gsMaxScrollX-t.scrollLeft)<0?i=s:r>o.right-ee&&s?(Q=!0,i=Math.min(s,u*(1-Math.max(0,o.right-r)/ee)|0)):r<o.left+ne&&t.scrollLeft&&(Q=!0,i=-Math.min(t.scrollLeft,u*(1-Math.max(0,r-o.left)/ne)|0)),i&&(t.scrollLeft+=i)),n&&(i||l)&&(de.scrollTo(t.scrollLeft,t.scrollTop),ce($.pointerX+i,$.pointerY+l)),c=t}if(A){var f=$.x,p=$.y;G?($.deltaX=f-parseFloat(ae.rotation),$.rotation=f,ae.rotation=f+"deg",ae.renderTransform(1,ae)):K?(V&&($.deltaY=p-parseFloat(ae.y),ae.y=p+"px"),z&&($.deltaX=f-parseFloat(ae.x),ae.x=f+"px"),ae.renderTransform(1,ae)):(V&&($.deltaY=p-parseFloat(d.style.top||0),d.style.top=p+"px"),z&&($.deltaY=f-parseFloat(d.style.left||0),d.style.left=f+"px")),!g||e||F||(!(F=!0)===Aa($,"drag","onDrag")&&(z&&($.x-=$.deltaX),V&&($.y-=$.deltaY),Kf(!0)),F=!1)}A=!1}function Lf(e,t){var n,o,r=$.x,a=$.y;d._gsap||(ae=pe.core.getCache(d)),K?($.x=parseFloat(ae.x),$.y=parseFloat(ae.y)):G?$.x=$.rotation=parseFloat(ae.rotation):($.y=parseInt(d.style.top||(o=xa(d))&&o.top,10)||0,$.x=parseInt(d.style.left||(o||{}).left,10)||0),(P||_||O)&&!t&&($.isDragging||$.isThrowing)&&(O&&(_e.x=$.x,_e.y=$.y,(n=O(_e)).x!==$.x&&($.x=n.x,A=!0),n.y!==$.y&&($.y=n.y,A=!0)),P&&(n=P($.x))!==$.x&&($.x=n,G&&($.rotation=n),A=!0),_&&((n=_($.y))!==$.y&&($.y=n),A=!0)),A&&Kf(!0),e||($.deltaX=$.x-r,$.deltaY=$.y-a,Aa($,"throwupdate","onThrowUpdate"))}function Mf(i,l,s,n){return null==l&&(l=-Se),null==s&&(s=Se),L(i)?function(e){var t=$.isPressed?1-$.edgeResistance:1;return i.call($,s<e?s+(e-s)*t:e<l?l+(e-l)*t:e)*n}:ke(i)?function(e){for(var t,n,o=i.length,r=0,a=Se;-1<--o;)(n=(t=i[o])-e)<0&&(n=-n),n<a&&l<=t&&t<=s&&(r=o,a=n);return i[r]}:isNaN(i)?function(e){return e}:function(){return i*n}}function Of(){var e,t,n,o;D=!1,f.bounds&&(e=Ba(f.bounds,d.parentNode),G?($.minX=k=e.left,$.maxX=E=e.left+e.width,$.minY=X=$.maxY=S=0):N(f.bounds.maxX)&&N(f.bounds.maxY)?(t=Ba(d,d.parentNode),$.minX=k=cf(u)+e.left-t.left,$.minY=X=cf(H)+e.top-t.top,$.maxX=E=k+(e.width-t.width),$.maxY=S=X+(e.height-t.height)):(e=f.bounds,$.minX=k=e.minX,$.minY=X=e.minY,$.maxX=E=e.maxX,$.maxY=S=e.maxY),E<k&&($.minX=E,$.maxX=E=k,k=$.minX),S<X&&($.minY=S,$.maxY=S=X,X=$.minY),G&&($.minRotation=k,$.maxRotation=E),D=!0),f.liveSnap&&(n=!0===f.liveSnap?f.snap||{}:f.liveSnap,o=ke(n)||L(n),G?(P=Mf(o?n:n.rotation,k,E,1),_=null):n.points?O=function buildPointSnapFunc(s,l,c,u,f,p,d){return p=p&&p<Se?p*p:Se,L(s)?function(e){var t,n,o,r=$.isPressed?1-$.edgeResistance:1,a=e.x,i=e.y;return e.x=a=c<a?c+(a-c)*r:a<l?l+(a-l)*r:a,e.y=i=f<i?f+(i-f)*r:i<u?u+(i-u)*r:i,(t=s.call($,e))!==e&&(e.x=t.x,e.y=t.y),1!==d&&(e.x*=d,e.y*=d),p<Se&&(n=e.x-a,o=e.y-i,p<n*n+o*o&&(e.x=a,e.y=i)),e}:ke(s)?function(e){for(var t,n,o,r,a=s.length,i=0,l=Se;-1<--a;)(r=(t=(o=s[a]).x-e.x)*t+(n=o.y-e.y)*n)<l&&(i=a,l=r);return l<=p?s[i]:e}:function(e){return e}}(o?n:n.points,k,E,X,S,n.radius,1):(z&&(P=Mf(o?n:n.x||n.left||n.scrollLeft,k,E,1)),V&&(_=Mf(o?n:n.y||n.top||n.scrollTop,X,S,1))))}function Pf(){$.isThrowing=!1,Aa($,"throwcomplete","onThrowComplete")}function Qf(){$.isThrowing=!1}function Rf(e,t){var n,o,r,a;e&&Me?(!0===e&&(n=f.snap||f.liveSnap||{},o=ke(n)||L(n),e={resistance:(f.throwResistance||f.resistance||1e3)/(G?10:1)},G?e.rotation=Ea($,o?n:n.rotation,E,k,1,t):(z&&(e[u]=Ea($,o?n:n.points||n.x||n.left,E,k,1,t||"x"===$.lockedAxis)),V&&(e[H]=Ea($,o?n:n.points||n.y||n.top,S,X,1,t||"y"===$.lockedAxis)),(n.points||ke(n)&&M(n[0]))&&(e.linkedProps=u+","+H,e.radius=n.radius))),$.isThrowing=!0,a=isNaN(f.overshootTolerance)?1===f.edgeResistance?0:1-$.edgeResistance+.2:f.overshootTolerance,e.duration={max:Math.max(f.minDuration||0,f.maxDuration||0)||2,min:isNaN(f.minDuration)?0===a||M(e)&&1e3<e.resistance?0:.5:f.minDuration,overshoot:a},$.tween=r=pe.to(d,{inertia:e,data:"_draggable",onComplete:Pf,onInterrupt:Qf,onUpdate:f.fastMode?Aa:Lf,onUpdateParams:f.fastMode?[$,"onthrowupdate","onThrowUpdate"]:n&&n.radius?[!1,!0]:[]}),f.fastMode||(r.render(r.duration(),!0,!0),Lf(!0,!0),$.endX=$.x,$.endY=$.y,G&&($.endRotation=$.x),r.play(0),Lf(!0,!0))):D&&$.applyBounds()}function Sf(e){var t,n=C||new fe;C=getGlobalMatrix(d.parentNode,!0),e&&$.isPressed&&!C.equals(n)&&(t=n.inverse().apply({x:m,y:w}),C.apply(t,t),m=t.x,w=t.y),C.equals(Le)&&(C=null)}function Tf(){var e,t,n=1-$.edgeResistance;Sf(!1),C&&(Be.x=$.pointerX,Be.y=$.pointerY,C.apply(Be,Be),m=Be.x,w=Be.y),A&&(ce($.pointerX,$.pointerY),Kf(!0)),le()?(Lf(!0,!0),Of()):$.applyBounds(),G?(e=d.ownerSVGElement?[ae.xOrigin-d.getBBox().x,ae.yOrigin-d.getBBox().y]:(xa(d)[Ee]||"0 0").split(" "),Y=$.rotationOrigin=getGlobalMatrix(d).apply({x:parseFloat(e[0])||0,y:parseFloat(e[1])||0}),Lf(!0,!0),b=$.x,T=$.y=Math.atan2(Y.y-$.pointerY,$.pointerX-Y.x)*Ne):((t=!ie&&d.parentNode)&&t.scrollTop,t&&t.scrollLeft,T=cf(H),b=cf(u)),D&&n&&(E<b?b=E+(b-E)/n:b<k&&(b=k-(k-b)/n),G||(S<T?T=S+(T-S)/n:T<X&&(T=X-(X-T)/n))),$.startX=b,$.startY=T}function Vf(){!r.parentNode||le()||$.isDragging||r.parentNode.removeChild(r)}function Wf(e,t){var n;if(p&&!$.isPressed&&e&&("mousedown"!==e.type&&"pointerdown"!==e.type||t||!(Xe()-re<30)||!ye[$.pointerEvent.type])){if(B=le(),$.pointerEvent=e,ye[e.type]?(y=~e.type.indexOf("touch")?e.currentTarget||e.target:ge,ja(y,"touchend",ue),ja(y,"touchmove",se),ja(y,"touchcancel",ue),ja(ge,"touchstart",oa)):(y=null,ja(ge,"mousemove",se)),j=null,De||(ja(ge,"mouseup",ue),e&&e.target&&ja(e.target,"mouseup",ue)),v=oe.call($,e.target)&&!1===f.dragClickables&&!t)return ja(e.target,"change",ue),Aa($,"pressInit","onPressInit"),Aa($,"press","onPress"),void Ga(J,!0);if((I=!(!y||z==V||!1===$.vars.allowNativeTouchScrolling||$.vars.allowContextMenu&&e&&(e.ctrlKey||2<e.which))&&(z?"y":"x"))||$.allowEventDefault||(la(e),ja(de,"touchforcechange",la)),e.changedTouches?(e=h=e.changedTouches[0],x=e.identifier):e.pointerId?x=e.pointerId:h=x=null,me++,function _addToRenderQueue(e){Ye.push(e),1===Ye.length&&pe.ticker.add(ea)}(Kf),w=$.pointerY=e.pageY,m=$.pointerX=e.pageX,Aa($,"pressInit","onPressInit"),(I||$.autoScroll)&&va(d.parentNode),d.parentNode&&$.autoScroll&&!G&&d.parentNode._gsMaxScrollX&&!r.parentNode&&!d.getBBox&&(r.style.width=d.parentNode.scrollWidth+"px",d.parentNode.appendChild(r)),Tf(),$.tween&&$.tween.kill(),$.isThrowing=!1,pe.killTweensOf(d,o,!0),$.tween=$.lockedAxis=null,(f.zIndexBoost||!G&&!1!==f.zIndexBoost)&&(d.style.zIndex=Draggable.zIndex++),$.isPressed=!0,g=!(!f.onDrag&&!$._listeners.drag),s=!(!f.onMove&&!$._listeners.move),!G&&(!1!==f.cursor||f.activeCursor))for(n=J.length;-1<--n;)wa(J[n],"cursor",f.activeCursor||f.cursor||("grab"===Te?"grabbing":Te));Aa($,"press","onPress")}}function $f(e){if(e&&$.isDragging){var t=e.target||d.parentNode,n=t.scrollLeft-t._gsScrollX,o=t.scrollTop-t._gsScrollY;(n||o)&&(C?(m-=n*C.a+o*C.c,w-=o*C.d+n*C.b):(m-=n,w-=o),t._gsScrollX+=n,t._gsScrollY+=o,ce($.pointerX,$.pointerY))}}function _f(e){var t=Xe(),n=t-re<40,o=t-U<40,r=n&&W===re,a=$.pointerEvent&&$.pointerEvent.defaultPrevented,i=n&&c===re,l=e.isTrusted||null==e.isTrusted&&n&&r;if((r||o&&!1!==$.vars.suppressClickOnDrag)&&e.stopImmediatePropagation&&e.stopImmediatePropagation(),n&&(!$.pointerEvent||!$.pointerEvent.defaultPrevented)&&(!r||l&&!i))return l&&r&&(c=re),void(W=re);($.isPressed||o||n)&&(l&&e.detail&&n&&!a||la(e))}function ag(e){return C?{x:e.x*C.a+e.y*C.c+C.e,y:e.x*C.b+e.y*C.d+C.f}:{x:e.x,y:e.y}}var p,m,w,b,T,D,g,s,E,k,S,X,h,x,Y,A,t,P,_,O,v,y,C,B,I,j,F,W,c,n=(f.type||"x,y").toLowerCase(),K=~n.indexOf("x")||~n.indexOf("y"),G=-1!==n.indexOf("rotation"),u=G?"rotation":K?"x":"left",H=K?"y":"top",z=!(!~n.indexOf("x")&&!~n.indexOf("left")),V=!(!~n.indexOf("y")&&!~n.indexOf("top")),q=f.minimumMovement||2,$=function _assertThisInitialized(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e),J=ve(f.trigger||f.handle||d),o={},U=0,Q=!1,Z=f.autoScrollMarginTop||40,ee=f.autoScrollMarginRight||40,te=f.autoScrollMarginBottom||40,ne=f.autoScrollMarginLeft||40,oe=f.clickableTest||Fa,re=0,ae=d._gsap||pe.core.getCache(d),ie=function _isFixed(e){return"fixed"===xa(e).position||((e=e.parentNode)&&e!==he?_isFixed(e):void 0)}(d),le=function isTweening(){return $.tween&&$.tween.isActive()},se=function onMove(e){var t,n,o,r,a,i,l=e;if(p&&!we&&$.isPressed&&e){if(t=($.pointerEvent=e).changedTouches){if((e=t[0])!==h&&e.identifier!==x){for(r=t.length;-1<--r&&(e=t[r]).identifier!==x;);if(r<0)return}}else if(e.pointerId&&x&&e.pointerId!==x)return;y&&I&&!j&&(Be.x=e.pageX,Be.y=e.pageY,C&&C.apply(Be,Be),n=Be.x,o=Be.y,((a=Math.abs(n-m))!==(i=Math.abs(o-w))&&(q<a||q<i)||be&&I===j)&&(j=i<a&&z?"x":"y",I&&j!==I&&ja(de,"touchforcechange",la),!1!==$.vars.lockAxisOnTouchScroll&&($.lockedAxis="x"===j?"y":"x",L($.vars.onLockAxis)&&$.vars.onLockAxis.call($,l)),be&&I===j))?ue(l):($.allowEventDefault||I&&(!j||I===j)||!1===l.cancelable||la(l),$.autoScroll&&(Q=!0),ce(e.pageX-(ie?qa():0),e.pageY-(ie?pa():0),s))}},ce=function setPointerPosition(e,t,n){var o,r,a,i,l,s,c=1-$.dragResistance,u=1-$.edgeResistance,f=$.pointerX,p=$.pointerY,d=T,g=$.x,h=$.y,x=$.endX,v=$.endY,y=$.endRotation;$.pointerX=e,$.pointerY=t,G?(i=Math.atan2(Y.y-t,e-Y.x)*Ne,180<(l=$.y-i)?(T-=360,$.y=i):l<-180&&(T+=360,$.y=i),a=$.x!==b||Math.abs(T-i)>q?($.y=i,b+(T-i)*c):b):(C&&(s=e*C.a+t*C.c+C.e,t=e*C.b+t*C.d+C.f,e=s),(r=t-w)<q&&-q<r&&(r=0),(o=e-m)<q&&-q<o&&(o=0),($.lockAxis||$.lockedAxis)&&(o||r)&&((s=$.lockedAxis)||($.lockedAxis=s=z&&Math.abs(o)>Math.abs(r)?"y":V?"x":null,s&&L($.vars.onLockAxis)&&$.vars.onLockAxis.call($,$.pointerEvent)),"y"===s?r=0:"x"===s&&(o=0)),a=R(b+o*c),i=R(T+r*c)),(P||_||O)&&($.x!==a||$.y!==i&&!G)?(O&&(_e.x=a,_e.y=i,s=O(_e),a=R(s.x),i=R(s.y)),P&&(a=R(P(a))),_&&(i=R(_(i)))):D&&(E<a?a=E+Math.round((a-E)*u):a<k&&(a=k+Math.round((a-k)*u)),G||(S<i?i=Math.round(S+(i-S)*u):i<X&&(i=Math.round(X+(i-X)*u)))),$.x===a&&($.y===i||G)||(G?($.endRotation=$.x=$.endX=a,A=!0):(V&&($.y=$.endY=i,A=!0),z&&($.x=$.endX=a,A=!0)),n&&!1===Aa($,"move","onMove")?($.pointerX=f,$.pointerY=p,T=d,$.x=g,$.y=h,$.endX=x,$.endY=v,$.endRotation=y):!$.isDragging&&$.isPressed&&($.isDragging=!0,Aa($,"dragstart","onDragStart")))},ue=function onRelease(e,t){if(p&&$.isPressed&&(!e||null==x||t||!(e.pointerId&&e.pointerId!==x||e.changedTouches&&!function _hasTouchID(e,t){for(var n=e.length;n--;)if(e[n].identifier===t)return!0}(e.changedTouches,x)))){$.isPressed=!1;var n,o,r,a,i,l=e,s=$.isDragging,c=$.vars.allowContextMenu&&e&&(e.ctrlKey||2<e.which),u=pe.delayedCall(.001,Vf);if(y?(ka(y,"touchend",onRelease),ka(y,"touchmove",se),ka(y,"touchcancel",onRelease),ka(ge,"touchstart",oa)):ka(ge,"mousemove",se),ka(de,"touchforcechange",la),De||(ka(ge,"mouseup",onRelease),e&&e.target&&ka(e.target,"mouseup",onRelease)),A=!1,v&&!c)return e&&(ka(e.target,"change",onRelease),$.pointerEvent=l),Ga(J,!1),Aa($,"release","onRelease"),Aa($,"click","onClick"),void(v=!1);if(ha(Kf),!G)for(o=J.length;-1<--o;)wa(J[o],"cursor",f.cursor||(!1!==f.cursor?Te:null));if(s&&(U=Re=Xe(),$.isDragging=!1),me--,e){if((n=e.changedTouches)&&(e=n[0])!==h&&e.identifier!==x){for(o=n.length;-1<--o&&(e=n[o]).identifier!==x;);if(o<0)return}$.pointerEvent=l,$.pointerX=e.pageX,$.pointerY=e.pageY}return c&&l?(la(l),Aa($,"release","onRelease")):l&&!s?(B&&(f.snap||f.bounds)&&Rf(f.inertia||f.throwProps),Aa($,"release","onRelease"),be&&"touchmove"===l.type||-1!==l.type.indexOf("cancel")||(Aa($,"click","onClick"),Xe()-re<300&&Aa($,"doubleclick","onDoubleClick"),a=l.target||d,re=Xe(),i=function syntheticClick(){re===W||!$.enabled()||$.isPressed||l.defaultPrevented||(a.click?a.click():ge.createEvent&&((r=ge.createEvent("MouseEvents")).initMouseEvent("click",!0,!0,de,1,$.pointerEvent.screenX,$.pointerEvent.screenY,$.pointerX,$.pointerY,!1,!1,!1,!1,0,null),a.dispatchEvent(r)))},be||l.defaultPrevented||pe.delayedCall(.05,i))):(Rf(f.inertia||f.throwProps),$.allowEventDefault||!l||!1===f.dragClickables&&oe.call($,l.target)||!s||I&&(!j||I!==j)||!1===l.cancelable||la(l),Aa($,"release","onRelease")),le()&&u.duration($.tween.duration()),s&&Aa($,"dragend","onDragEnd"),!0}};return(t=Draggable.get(d))&&t.kill(),e.startDrag=function(e,t){var n,o,r,a;Wf(e||$.pointerEvent,!0),t&&!$.hitTest(e||$.pointerEvent)&&(n=za(e||$.pointerEvent),o=za(d),r=ag({x:n.left+n.width/2,y:n.top+n.height/2}),a=ag({x:o.left+o.width/2,y:o.top+o.height/2}),m-=r.x-a.x,w-=r.y-a.y),$.isDragging||($.isDragging=!0,Aa($,"dragstart","onDragStart"))},e.drag=se,e.endDrag=function(e){return ue(e||$.pointerEvent,!0)},e.timeSinceDrag=function(){return $.isDragging?0:(Xe()-U)/1e3},e.timeSinceClick=function(){return(Xe()-re)/1e3},e.hitTest=function(e,t){return Draggable.hitTest($.target,e,t)},e.getDirection=function(e,t){var n,o,r,a,i,l,s="velocity"===e&&Me?e:M(e)&&!G?"element":"start";return"element"===s&&(i=za($.target),l=za(e)),n="start"===s?$.x-b:"velocity"===s?Me.getVelocity(d,u):i.left+i.width/2-(l.left+l.width/2),G?n<0?"counter-clockwise":"clockwise":(t=t||2,o="start"===s?$.y-T:"velocity"===s?Me.getVelocity(d,H):i.top+i.height/2-(l.top+l.height/2),a=(r=Math.abs(n/o))<1/t?"":n<0?"left":"right",r<t&&(""!==a&&(a+="-"),a+=o<0?"up":"down"),a)},e.applyBounds=function(e){var t,n,o,r,a,i;if(e&&f.bounds!==e)return f.bounds=e,$.update(!0);if(Lf(!0),Of(),D){if(t=$.x,n=$.y,E<t?t=E:t<k&&(t=k),S<n?n=S:n<X&&(n=X),($.x!==t||$.y!==n)&&(o=!0,$.x=$.endX=t,G?$.endRotation=t:$.y=$.endY=n,Kf(A=!0),$.autoScroll&&!$.isDragging))for(va(d.parentNode),r=d,Oe.scrollTop=null!=de.pageYOffset?de.pageYOffset:null!=he.scrollTop?he.scrollTop:xe.scrollTop,Oe.scrollLeft=null!=de.pageXOffset?de.pageXOffset:null!=he.scrollLeft?he.scrollLeft:xe.scrollLeft;r&&!i;)a=(i=Ce(r.parentNode))?Oe:r.parentNode,V&&a.scrollTop>a._gsMaxScrollY&&(a.scrollTop=a._gsMaxScrollY),z&&a.scrollLeft>a._gsMaxScrollX&&(a.scrollLeft=a._gsMaxScrollX),r=a;$.isThrowing&&(o||$.endX>E||$.endX<k||$.endY>S||$.endY<X)&&Rf(f.inertia||f.throwProps,o)}return $},e.update=function(e,t,n){var o=$.x,r=$.y;return Sf(!t),e?$.applyBounds():(A&&n&&Kf(!0),Lf(!0)),t&&(ce($.pointerX,$.pointerY),A&&Kf(!0)),$.isPressed&&!t&&(z&&.01<Math.abs(o-$.x)||V&&.01<Math.abs(r-$.y)&&!G)&&Tf(),$.autoScroll&&(va(d.parentNode),Q=$.isDragging,Kf(!0)),$.autoScroll&&(sa(d,$f),ra(d,$f)),$},e.enable=function(e){var t,n,o;if("soft"!==e){for(n=J.length;-1<--n;)o=J[n],De||ja(o,"mousedown",Wf),ja(o,"touchstart",Wf),ja(o,"click",_f,!0),G||!1===f.cursor||wa(o,"cursor",f.cursor||Te),wa(o,"touchCallout","none"),wa(o,"touchAction",z==V?"none":f.allowNativeTouchScrolling||f.allowEventDefault?"manipulation":z?"pan-y":"pan-x"),o.getBBox&&o.ownerSVGElement&&wa(o.ownerSVGElement,"touchAction",z==V?"none":f.allowNativeTouchScrolling||f.allowEventDefault?"manipulation":z?"pan-y":"pan-x"),$.vars.allowContextMenu||ja(o,"contextmenu",Jf);Ga(J,!1)}return ra(d,$f),p=!0,Me&&"soft"!==e&&Me.track(d,K?"x,y":G?"rotation":"top,left"),d._gsDragID=t="d"+Pe++,Ae[t]=$,Tf(),$.update(!0),$},e.disable=function(e){var t,n,o=$.isDragging;if(!G)for(t=J.length;-1<--t;)wa(J[t],"cursor",null);if("soft"!==e){for(t=J.length;-1<--t;)n=J[t],wa(n,"touchCallout",null),wa(n,"touchAction",null),ka(n,"mousedown",Wf),ka(n,"touchstart",Wf),ka(n,"click",_f),ka(n,"contextmenu",Jf);Ga(J,!0),y&&(ka(y,"touchcancel",ue),ka(y,"touchend",ue),ka(y,"touchmove",se)),ka(ge,"mouseup",ue),ka(ge,"mousemove",se)}return sa(d,$f),p=!1,Me&&"soft"!==e&&Me.untrack(d,K?"x,y":G?"rotation":"top,left"),ha(Kf),$.isDragging=$.isPressed=v=!1,o&&Aa($,"dragend","onDragEnd"),$},e.enabled=function(e,t){return arguments.length?e?$.enable(t):$.disable(t):p},e.kill=function(){return $.isThrowing=!1,pe.killTweensOf(d,o,!0),$.disable(),pe.set(J,{clearProps:"userSelect"}),delete Ae[d._gsDragID],$},G?o.rotation=1:(z&&(o[u]=1),V&&(o[H]=1)),e.enable(),e}!function _setDefaults(e,t){for(var n in t)n in e||(e[n]=t[n])}(k.prototype,{pointerX:0,pointerY:0,startX:0,startY:0,deltaX:0,deltaY:0,isDragging:!1,isPressed:!1}),k.zIndex=1e3,k.version="3.0.0",K()&&pe.registerPlugin(k),e.Draggable=k,e.default=k,Object.defineProperty(e,"__esModule",{value:!0})}); | ||
//# sourceMappingURL=Draggable.min.js.map |
@@ -8,18 +8,18 @@ (function (global, factory) { | ||
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-10-06 | ||
* http://greensock.com | ||
* EasePack 3.0.0 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @license Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/ | ||
/* eslint-disable */ | ||
var gsap, | ||
_registerEase, | ||
_getGSAP = function _getGSAP() { | ||
return gsap || typeof window !== "undefined" && (gsap = window.gsap); | ||
return gsap || typeof window !== "undefined" && (gsap = window.gsap) && gsap.registerPlugin && gsap; | ||
}, | ||
_boolean = function _boolean(value, defaultValue) { | ||
return !!(typeof value === "undefined" ? defaultValue : value && !~(value + "").indexOf("false")); | ||
}, | ||
_initCore = function _initCore(core) { | ||
@@ -31,2 +31,20 @@ gsap = core || _getGSAP(); | ||
var eases = gsap.parseEase(), | ||
createConfig = function createConfig(ease) { | ||
return function (ratio) { | ||
var y = 0.5 + ratio / 2; | ||
ease.config = function (p) { | ||
return ease(2 * (1 - p) * p * y + p * p); | ||
}; | ||
}; | ||
}, | ||
p; | ||
for (p in eases) { | ||
if (!eases[p].config) { | ||
createConfig(eases[p]); | ||
} | ||
} | ||
_registerEase("slow", SlowMo); | ||
@@ -38,3 +56,3 @@ | ||
for (var p in EasePack) { | ||
for (p in EasePack) { | ||
p !== "version" && gsap.core.globals(p, EasePack[p]); | ||
@@ -46,6 +64,8 @@ } | ||
linearRatio = Math.min(1, linearRatio || 0.7); | ||
var pow = linearRatio < 1 ? power || power === 0 ? power : 0.7 : 0, | ||
p1 = (1 - linearRatio) / 2, | ||
p3 = p1 + linearRatio, | ||
calcEnd = !!yoyoMode; | ||
calcEnd = _boolean(yoyoMode); | ||
return function (p) { | ||
@@ -77,3 +97,2 @@ var r = p + (0.5 - p) * pow; | ||
if (typeof vars !== "object") { | ||
//users may pass in via a string, like "rough(30)" | ||
vars = { | ||
@@ -89,4 +108,4 @@ points: +vars || 20 | ||
i = points, | ||
randomize = vars.randomize + "" !== "false", | ||
clamp = vars.clamp + "" === "true", | ||
randomize = _boolean(vars.randomize, true), | ||
clamp = _boolean(vars.clamp), | ||
template = gsap ? gsap.parseEase(vars.template) : 0, | ||
@@ -114,7 +133,5 @@ strength = (+vars.strength || 1) * 0.4, | ||
} else if (x < 0.5) { | ||
//"both" (start) | ||
invX = x * 2; | ||
bump = invX * invX * 0.5 * strength; | ||
} else { | ||
//"both" (end) | ||
invX = (1 - x) * 2; | ||
@@ -179,2 +196,3 @@ bump = invX * invX * 0.5 * strength; | ||
var SlowMo = _createSlowMo(0.7); | ||
SlowMo.ease = SlowMo; | ||
SlowMo.config = _createSlowMo; | ||
@@ -184,2 +202,3 @@ var ExpoScaleEase = _createExpoScale(1, 2); | ||
var RoughEase = _createRoughEase(); | ||
RoughEase.ease = RoughEase; | ||
RoughEase.config = _createRoughEase; | ||
@@ -186,0 +205,0 @@ var EasePack = { |
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n((e=e||self).window=e.window||{})}(this,function(e){"use strict"; | ||
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-10-06 | ||
* http://greensock.com | ||
* EasePack 3.0.0 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @license Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/function f(){return x||"undefined"!=typeof window&&(x=window.gsap)}function g(e){if(x=e||f())for(var n in(t=x.registerEase)("slow",o),t("expoScale",r),t("rough",a),s)"version"!==n&&x.core.globals(n,s[n])}function h(e,n,t){var o=(e=Math.min(1,e||.7))<1?n||0===n?n:.7:0,r=(1-e)/2,i=r+e,a=!!t;return function(e){var n=e+(.5-e)*o;return e<r?a?1-(e=1-e/r)*e:n-(e=1-e/r)*e*e*e*n:i<e?a?1===e?0:1-(e=(e-i)/r)*e:n+(e-n)*(e=(e-i)/r)*e*e*e:a?1:n}}function i(n,e,t){var o=Math.log(e/n),r=e-n;return t=t&&x.parseEase(t),function(e){return(n*Math.exp(o*(t?t(e):e))-n)/r}}function j(e,n,t){this.t=e,this.v=n,t&&(((this.next=t).prev=this).c=t.v-n,this.gap=t.t-e)}function k(e){"object"!=typeof e&&(e={points:+e||20});for(var n,t,o,r,i,a,f,s=e.taper||"none",u=[],c=0,p=0|(+e.points||20),l=p,v=e.randomize+""!="false",d=e.clamp+""=="true",g=x?x.parseEase(e.template):0,h=.4*(+e.strength||1);-1<--l;)n=v?Math.random():1/p*l,t=g?g(n):n,o="none"===s?h:"out"===s?(r=1-n)*r*h:"in"===s?n*n*h:n<.5?(r=2*n)*r*.5*h:(r=2*(1-n))*r*.5*h,v?t+=Math.random()*o-.5*o:l%2?t+=.5*o:t-=.5*o,d&&(1<t?t=1:t<0&&(t=0)),u[c++]={x:n,y:t};for(u.sort(function(e,n){return e.x-n.x}),a=new j(1,1,null),l=p;l--;)i=u[l],a=new j(i.x,i.y,a);return f=new j(0,0,a.t?a:a.next),function(e){var n=f;if(e>n.t){for(;n.next&&e>=n.t;)n=n.next;n=n.prev}else for(;n.prev&&e<=n.t;)n=n.prev;return(f=n).v+(e-n.t)/n.gap*n.c}}var x,t,o=h(.7);o.config=h;var r=i(1,2);r.config=i;var a=k();a.config=k;var s={SlowMo:o,RoughEase:a,ExpoScaleEase:r};for(var n in s)s[n].register=g,s[n].version="3.0.0";f()&&x.registerPlugin(o),e.EasePack=s,e.ExpoScaleEase=r,e.RoughEase=a,e.SlowMo=o,e.default=s,Object.defineProperty(e,"__esModule",{value:!0})}); | ||
*/function f(){return w||"undefined"!=typeof window&&(w=window.gsap)&&w.registerPlugin&&w}function g(e,n){return!!(void 0===e?n:e&&!~(e+"").indexOf("false"))}function h(e){if(w=e||f()){r=w.registerEase;var n,t=w.parseEase(),o=function createConfig(t){return function(e){var n=.5+e/2;t.config=function(e){return t(2*(1-e)*e*n+e*e)}}};for(n in t)t[n].config||o(t[n]);for(n in r("slow",a),r("expoScale",s),r("rough",u),c)"version"!==n&&w.core.globals(n,c[n])}}function i(e,n,t){var o=(e=Math.min(1,e||.7))<1?n||0===n?n:.7:0,r=(1-e)/2,i=r+e,a=g(t);return function(e){var n=e+(.5-e)*o;return e<r?a?1-(e=1-e/r)*e:n-(e=1-e/r)*e*e*e*n:i<e?a?1===e?0:1-(e=(e-i)/r)*e:n+(e-n)*(e=(e-i)/r)*e*e*e:a?1:n}}function j(n,e,t){var o=Math.log(e/n),r=e-n;return t=t&&w.parseEase(t),function(e){return(n*Math.exp(o*(t?t(e):e))-n)/r}}function k(e,n,t){this.t=e,this.v=n,t&&(((this.next=t).prev=this).c=t.v-n,this.gap=t.t-e)}function l(e){"object"!=typeof e&&(e={points:+e||20});for(var n,t,o,r,i,a,f,s=e.taper||"none",u=[],c=0,p=0|(+e.points||20),l=p,v=g(e.randomize,!0),d=g(e.clamp),h=w?w.parseEase(e.template):0,x=.4*(+e.strength||1);-1<--l;)n=v?Math.random():1/p*l,t=h?h(n):n,o="none"===s?x:"out"===s?(r=1-n)*r*x:"in"===s?n*n*x:n<.5?(r=2*n)*r*.5*x:(r=2*(1-n))*r*.5*x,v?t+=Math.random()*o-.5*o:l%2?t+=.5*o:t-=.5*o,d&&(1<t?t=1:t<0&&(t=0)),u[c++]={x:n,y:t};for(u.sort(function(e,n){return e.x-n.x}),a=new k(1,1,null),l=p;l--;)i=u[l],a=new k(i.x,i.y,a);return f=new k(0,0,a.t?a:a.next),function(e){var n=f;if(e>n.t){for(;n.next&&e>=n.t;)n=n.next;n=n.prev}else for(;n.prev&&e<=n.t;)n=n.prev;return(f=n).v+(e-n.t)/n.gap*n.c}}var w,r,a=i(.7);(a.ease=a).config=i;var s=j(1,2);s.config=j;var u=l();(u.ease=u).config=l;var c={SlowMo:a,RoughEase:u,ExpoScaleEase:s};for(var n in c)c[n].register=h,c[n].version="3.0.0";f()&&w.registerPlugin(a),e.EasePack=c,e.ExpoScaleEase=s,e.RoughEase=u,e.SlowMo=a,e.default=c,Object.defineProperty(e,"__esModule",{value:!0})}); | ||
//# sourceMappingURL=EasePack.min.js.map |
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t=t||self).window=t.window||{})}(this,function(e){"use strict";function _inheritsLoose(t,e){t.prototype=Object.create(e.prototype),(t.prototype.constructor=t).__proto__=e}function _assertThisInitialized(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t} | ||
/*! | ||
* VERSION: 3.0.0-beta.8 | ||
* DATE: 2019-10-06 | ||
* GSAP 3.0.0-beta.10 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @license Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/function n(t){return"string"==typeof t}function o(t){return"function"==typeof t}function p(t){return"number"==typeof t}function q(t){return void 0===t}function r(t){return"object"==typeof t}function s(t){return!1!==t}function t(){return"undefined"!=typeof window}function I(t){return(h=dt(t,it))&&Zt}function J(t){return"undefined"!=typeof console&&console.warn(t)}function K(t,e){return t&&(it[t]=e)&&h&&(h[t]=e)||it}function L(){return 0}function U(t){var e,n,i=t[0];if(!r(i)&&!o(i))return Z(t)?t:[t];if(!(e=(i._gsap||{}).harness)){for(n=ft.length;n--&&!ft[n].targetTest(i););e=ft[n]}for(n=t.length;n--;)t[n]._gsap||(t[n]._gsap=new Mt(t[n],e));return t}function V(t){return t._gsap||U(pt(t))[0]._gsap}function W(t){return(t+"").substr((parseFloat(t)+"").length)}function X(t,e){var r=t[e];return o(r)?t[e]():q(r)&&t.getAttribute(e)||r}function Y(t,e,r){return r<t?t:e<r?e:r}function $(t,e){return(t=t.split(",")).forEach(e)||t}function _(t){return Math.round(1e4*t)/1e4}function ca(t,e){for(var r=e.length,n=0;t.indexOf(e[n])<0&&++n<r;);return n<r}function da(t,e,r){var n,i=p(t[1]),a=(i?2:1)+(e<2?0:1),o=t[a];return i&&(o.duration=t[1]),1===e?(o.runBackwards=1,o.immediateRender=s(o.immediateRender)):2===e&&(n=t[a-1],o.startAt=n,o.immediateRender=s(o.immediateRender)),o.parent=r,o}function ea(t){if(o(t))return t;var d=r(t)?t:{each:t},m=n(d.ease)?Pt(d.ease):d.ease,g=d.from||0,v=parseFloat(d.base)||0,y={},e=0<g&&g<1,w=isNaN(g)||e,b=d.axis,T=g,x=g;return n(g)?T=x={center:.5,end:1}[g]||0:!e&&w&&(T=g[0],x=g[1]),function(t,e,r){var n,i,a,s,o,u,h,l,f,c=(r||d).length,p=y[c];if(!p){if(!(f="auto"===d.grid?0:(d.grid||[A])[0])){for(h=-A;h<(h=r[f++].getBoundingClientRect().left)&&f<c;);f--}for(p=y[c]=[],n=w?Math.min(f,c)*T-.5:g%f,i=w?c*x/f-.5:g/f|0,l=A,u=h=0;u<c;u++)a=u%f-n,s=i-(u/f|0),p[u]=o=b?Math.abs("y"===b?s:a):B(a*a+s*s),h<o&&(h=o),o<l&&(l=o);p.max=h-l,p.min=l,p.v=c=parseFloat(d.amount)||parseFloat(d.each)*(c<f?c-1:b?"y"===b?c/f:f:Math.max(f,c/f))||0,p.b=c<0?v-c:v,p.u=W(d.amount||d.each)||0}return c=(p[t]-p.min)/p.max||0,_(p.b+(m?m(c):c)*p.v)+p.u}}function fa(){var t,e,r=st.length,n=st.slice(0);for(ot={},t=st.length=0;t<r;t++)(e=n[t])&&e._lazy&&(e.render(e._lazy[0],e._lazy[1],!0)._lazy=0)}function ga(t,e,r,n){st.length&&fa(),t.render(e,r,n),st.length&&fa()}function ha(t){var e=parseFloat(t);return e||0===e?e:t}function ia(t){return t}function ja(t,e){for(var r in e)r in t||(t[r]=e[r]);return t}function ka(t,e){for(var r in e)r in t||"duration"===r||"ease"===r||(t[r]=e[r])}function ma(t,e){for(var n in e)t[n]=r(e[n])?ma(t[n]||(t[n]={}),e[n]):e[n];return t}function na(t,e){var r,n={};for(r in t)r in e||(n[r]=t[r]);return n}function ra(t,e,r,n){void 0===r&&(r="_first"),void 0===n&&(n="_last");var i=e._prev,a=e._next;i?i._next=a:t[r]===e&&(t[r]=a),a?a._prev=i:t[n]===e&&(t[n]=i),e._gc=t,e._next=e._prev=e.parent=null}function sa(t,e){!t.parent||e&&!t.parent.autoRemoveChildren||t.parent.remove(t),t._act=0}function ta(t){for(var e=t;e;)e._dirty=1,e=e.parent;return t}function va(t){var e;return t._repeat?(e=t.duration()+t._rDelay)*~~(t._tTime/e):0}function xa(t,e,r){if(e.parent&&sa(e),e._start=r+e._delay,e._end=e._start+(e.totalDuration()/e._ts||0),function _addLinkedListItem(t,e,r,n,i){void 0===r&&(r="_first"),void 0===n&&(n="_last");var a,s=t[n];if(i)for(a=e[i];s&&s[i]>a;)s=s._prev;s?(e._next=s._next,s._next=e):(e._next=t[r],t[r]=e),e._next?e._next._prev=e:t[n]=e,e._prev=s,e.parent=t}(t,e,"_first","_last",t._sort?"_start":0),(t._recent=e)._time||!e._dur&&e._initted){var n=(t.rawTime()-e._start)*e._ts;(!e._dur||Y(0,e.totalDuration(),n)-e._tTime>S)&&e.render(n,!1,!1)}if(ta(t),t._gc&&t._time>=t._dur&&t._ts&&t._dur<t.duration())for(var i=t;i._gc;)i.totalTime(i._tTime,!0),i=i._gc;return t}function Aa(t){if(t instanceof St)return ta(t);var e=t._repeat;return t._tDur=e?e<0?1e20:_(t._dur*(e+1)+t._rDelay*e):t._dur,ta(t.parent),t}function Ca(t,e){var r,i,a=t.labels,s=t._recent||mt,o=t.duration()>=A?s.endTime(!1):t._dur;return n(e)&&(isNaN(e)||e in a)?"<"===(r=e.charAt(0))||">"===r?("<"===r?s._start:s.endTime(0<=s._repeat))+(parseFloat(e.substr(1))||0):(r=e.indexOf("="))<0?(e in a||(a[e]=o),a[e]):(i=+(e.charAt(r-1)+e.substr(r+1)),1<r?Ca(t,e.substr(0,r-1))+i:o+i):null==e?o:+e}function Da(e){var r=e<1?Math.pow(10,(e+"").length-2):1;return function(t){return~~(Math.round(parseFloat(t)/e)*e*r)/r+(p(t)?0:W(t))}}function Ea(u,t){if(t||0===t)return Ea(u)(t);var h,l,e=Z(u);return!e&&r(u)&&(h=e=u.radius||A,u=pt(u.values),(l=!p(u[0]))&&(h*=h)),e?function(t){for(var e,r,n=parseFloat(l?t.x:t),i=parseFloat(l?t.y:0),a=A,s=0,o=u.length;o--;)(e=l?(e=u[o].x-n)*e+(r=u[o].y-i)*r:Math.abs(u[o]-n))<a&&(a=e,s=o);return s=!h||a<=h?u[s]:t,l||s===t||p(t)?s:s+W(t)}:Da(u)}function Fa(t,e,r,n){return n?function(){return Fa(t,e,r)}:Z(t)?t[~~(Math.random()*t.length)]:(r=r||1e-5)&&(n=r<1?Math.pow(10,(r+"").length-2):1)&&~~(Math.round((t+Math.random()*(e-t))/r)*r*n)/n}function Ha(e,r,t){return isNaN(t)?function(t){return e[~~r(t)]}:Ha(e,r)(t)}function Ka(t){for(var e,r,n,i,a=0,s="";~(e=t.indexOf("random(",a));)n=t.indexOf(")",e),i="["===t.charAt(e+7),r=t.substr(e+7,n-e-7).match(i?nt:G),s+=t.substr(a,e-a)+Fa(i?r:+r[0],+r[1],+r[2]||1e-5),a=n+1;return s+t.substr(a,t.length-a)}function La(e,t,r,n,i){var a=t-e,s=n-r;return isNaN(i)?function(t){return r+(t-e)/a*s}:La(e,t,r,n)(i)}function Na(t,e,r){var n,i,a,s=t.labels,o=A;for(n in s)(i=s[n]-e)<0==!!r&&i&&o>(i=Math.abs(i))&&(a=n,o=i);return a}function Pa(t){return sa(t),t.progress()<1&>(t,"onInterrupt"),t}function Ua(t,e,r){return(6*(t=t<0?t+1:1<t?t-1:t)<1?e+(r-e)*t*6:t<.5?r:3*t<2?e+(r-e)*(2/3-t)*6:e)*vt+.5|0}function Va(t,e){var r,n,i,a,s,o,u,h,l,f,c=t?p(t)?[t>>16,t>>8&vt,t&vt]:0:yt.black;if(!c){if(","===t.substr(-1)&&(t=t.substr(0,t.length-1)),yt[t])c=yt[t];else if("#"===t.charAt(0))4===t.length&&(t="#"+(r=t.charAt(1))+r+(n=t.charAt(2))+n+(i=t.charAt(3))+i),c=[(t=parseInt(t.substr(1),16))>>16,t>>8&vt,t&vt];else if("hsl"===t.substr(0,3))if(c=f=t.match(G),e){if(~t.indexOf("="))return t.match(H)}else a=+c[0]%360/360,s=+c[1]/100,r=2*(o=+c[2]/100)-(n=o<=.5?o*(s+1):o+s-o*s),3<c.length&&(c[3]*=1),c[0]=Ua(a+1/3,r,n),c[1]=Ua(a,r,n),c[2]=Ua(a-1/3,r,n);else c=t.match(G)||yt.transparent;c=c.map(Number)}return e&&!f&&(r=c[0]/vt,n=c[1]/vt,i=c[2]/vt,o=((u=Math.max(r,n,i))+(h=Math.min(r,n,i)))/2,u===h?a=s=0:(l=u-h,s=.5<o?l/(2-u-h):l/(u+h),a=u===r?(n-i)/l+(n<i?6:0):u===n?(i-r)/l+2:(r-n)/l+4,a*=60),c[0]=a+.5|0,c[1]=100*s+.5|0,c[2]=100*o+.5|0),c}function Wa(t,e){var r,n,i,a=(t+"").match(wt),s=0,o="";if(!a)return t;for(r=0;r<a.length;r++)n=a[r],s+=(i=t.substr(s,t.indexOf(n,s)-s)).length+n.length,3===(n=Va(n,e)).length&&n.push(1),o+=i+(e?"hsla("+n[0]+","+n[1]+"%,"+n[2]+"%,"+n[3]:"rgba("+n.join(","))+")";return o+t.substr(s)}function Za(t){var e,r=t.join(" ");wt.lastIndex=0,wt.test(r)&&(e=bt.test(r),t[0]=Wa(t[0],e),t[1]=Wa(t[1],e))}function fb(t){var e=(t+"").split("("),r=kt[e[0]];return r&&1<e.length&&r.config?r.config.apply(null,~t.indexOf("{")?[function _parseObjectInString(t){for(var e,r,n,i={},a=t.substr(1,t.length-3).split(":"),s=a[0],o=1,u=a.length;o<u;o++)r=a[o],e=o!==u-1?r.lastIndexOf(","):r.length,n=r.substr(0,e),i[s]=isNaN(n)?n.replace(Ot,"").trim():+n,s=r.substr(e+1).trim();return i}(e[1])]:et.exec(t)[1].split(",").map(ha)):kt._CE&&Ct.test(t)?kt._CE("",t):r}function hb(t,e){for(var r,n=t._first;n;)n instanceof St?hb(n,e):!n.vars.yoyoEase||n._yoyo&&n._repeat||n._yoyo===e||(n.timeline?hb(n.timeline,e):(r=n._ease,n._ease=n._yEase,n._yEase=r,n._yoyo=e)),n=n._next}function jb(t,e,r,n){void 0===r&&(r=function easeOut(t){return 1-e(1-t)}),void 0===n&&(n=function easeInOut(t){return t<.5?e(2*t)/2:1-e(2*(1-t))/2});var i,a={easeIn:e,easeOut:r,easeInOut:n};return $(t,function(t){for(var e in kt[t]=it[t]=a,kt[i=t.toLowerCase()]=r,a)kt[i+("easeIn"===e?".in":"easeOut"===e?".out":".inOut")]=kt[t+"."+e]=a[e]}),a}function kb(e){return function(t){return t<.5?(1-e(1-2*t))/2:.5+e(2*(t-.5))/2}}function lb(r,t,e){function Mj(t){return 1===t?1:n*Math.pow(2,-10*t)*Q((t-a)*i)+1}var n=1<=t?t:1,i=(e||(r?.3:.45))/(t<1?t:1),a=i/D*(Math.asin(1/n)||0),s="out"===r?Mj:"in"===r?function(t){return 1-Mj(1-t)}:kb(Mj);return i=D/i,s.config=function(t,e){return lb(r,t,e)},s}function mb(e,r){function Uj(t){return--t*t*((r+1)*t+r)+1}void 0===r&&(r=1.70158);var t="out"===e?Uj:"in"===e?function(t){return 1-Uj(1-t)}:kb(Uj);return t.config=function(t){return mb(e,t)},t}var F,i,a,u,h,l,c,f,d,m,g,v,y,w,b,T,x,k,C,O,P,M,N={autoSleep:120,force3D:"auto",units:{lineHeight:""}},R={duration:.5,overwrite:!1,delay:0},A=1e8,S=1/A,D=2*Math.PI,E=D/4,z=0,B=Math.sqrt,j=Math.cos,Q=Math.sin,Z=Array.isArray,G=/(?:-?\.?\d|\.)+/gi,H=/[-+=\.]*\d+[\.e\-\+]*\d*[e\-\+]*\d*/gi,tt=/[-+=\.]*\d+(?:\.|e-|e)*\d*/gi,et=/\(([^()]+)\)/i,rt=/[\+-]=-?[\.\d]+/,nt=/[#\-+\.]*\b[a-z\d-=+%.]+/gi,it={},at={},st=[],ot={},ut={},ht={},lt=30,ft=[],ct="onComplete,onUpdate,onStart,onRepeat,onReverseComplete,onInterrupt",_t=[].slice,pt=function _toArray(t,e){var r;return Z(t)?n(t[0])&&!e?_toArray(t.join(", ")):t:"string"!=(r=typeof t)||e||!a&&xt()?t&&"object"==r&&"length"in t&&t!==i?_t.call(t,0):t?[t]:[]:_t.call(u.querySelectorAll(t),0)},dt=function _merge(t,e){for(var r in e)t[r]=e[r];return t},mt={_start:0,endTime:L},gt=function _callback(t,e,r){var n,i,a=t.vars,s=a[e];if(s)return n=a[e+"Params"],i=a.callbackScope||t,r&&st.length&&fa(),n?1===n.length?s.call(i,n[0]):s.apply(i,n):s.call(i,t)},vt=255,yt={aqua:[0,vt,vt],lime:[0,vt,0],silver:[192,192,192],black:[0,0,0],maroon:[128,0,0],teal:[0,128,128],blue:[0,0,vt],navy:[0,0,128],white:[vt,vt,vt],olive:[128,128,0],yellow:[vt,vt,0],orange:[vt,165,0],gray:[128,128,128],purple:[128,0,128],green:[0,128,0],red:[vt,0,0],pink:[vt,192,203],cyan:[0,vt,vt],transparent:[vt,vt,vt,0]},wt=function(){var t,e="(?:\\b(?:(?:rgb|rgba|hsl|hsla)\\(.+?\\))|\\B#(?:[0-9a-f]{3}){1,2}\\b";for(t in yt)e+="|"+t+"\\b";return new RegExp(e+")","gi")}(),bt=/hsl[a]?\(/,Tt=(y=Date.now,w=500,b=33,T=y(),x=T,C=k=1/60,v={time:0,frame:0,tick:function tick(){Oi(!0)},wake:function wake(){l&&(!a&&t()&&(i=a=window||global||{},u=i.document||{},it.gsap=Zt,I(h||i.GreenSockGlobals||i),g=i.requestAnimationFrame),d&&v.sleep(),m=g||function(t){return setTimeout(t,1e3*(C-v.time)+1|0)},f=1,Oi(2))},sleep:function sleep(){(g?i.cancelAnimationFrame:clearTimeout)(d),f=0,m=L},lagSmoothing:function lagSmoothing(t,e){w=t||1e8,b=Math.min(e,w,0)},fps:function fps(t){k=1/(t||60),C=v.time+k},add:function add(t){O.indexOf(t)<0&&O.push(t),xt()},remove:function remove(t){var e;~(e=O.indexOf(t))&&O.splice(e,1)},_listeners:O=[]}),xt=function _wake(){return!f&&Tt.wake()},kt={},Ct=/^[\d.\-M][\d.\-,\s]/,Ot=/["']/g,Pt=function _parseEase(t,e){return t&&(o(t)?t:kt[t]||fb(t))||e};function Oi(e){var t,r,n=y()-x,i=!0===e;w<n&&(T+=n-b),x+=n,v.time=(x-T)/1e3,(0<(t=v.time-C)||i)&&(v.frame++,C+=t+(k<=t?.004:k-t),r=1),i||(d=m(Oi)),r&&O.forEach(function(t){return t(v.time,n,v.frame,e)})}function jk(t){return t<M?P*t*t:t<.7272727272727273?P*Math.pow(t-1.5/2.75,2)+.75:t<.9090909090909092?P*(t-=2.25/2.75)*t+.9375:P*Math.pow(t-2.625/2.75,2)+.984375}$("Linear,Quad,Cubic,Quart,Quint,Strong",function(t,e){var r=e<5?e+1:e;jb(t+",Power"+(r-1),e?function(t){return Math.pow(t,r)}:function(t){return t},function(t){return 1-Math.pow(1-t,r)},function(t){return t<.5?Math.pow(2*t,r)/2:1-Math.pow(2*(1-t),r)/2})}),kt.Linear.easeNone=kt.none=kt.Linear.easeIn,jb("Elastic",lb("in"),lb("out"),lb()),P=7.5625,M=1/2.75,jb("Bounce",function(t){return 1-jk(1-t)},jk),jb("Expo",function(t){return t?Math.pow(2,10*(t-1)):0}),jb("Circ",function(t){return-(B(1-t*t)-1)}),jb("Sine",function(t){return 1-j(t*E)}),jb("Back",mb("in"),mb("out"),mb()),kt.SteppedEase=kt.steps=it.SteppedEase={config:function config(t,e){void 0===t&&(t=1);var r=1/t,n=t+(e?0:1),i=e?1:0;return function(t){return((n*Y(0,.99999999,t)|0)+i)*r}}},R.ease=kt["quad.out"];var Mt=function GSCache(t,e){this.id=z++,(t._gsap=this).target=t,this.harness=e,this.get=e?e.get:X,this.set=e?e.getSetter:Nt},At=function(){function Animation(t,e){var r=t.parent||F;this.vars=t,this._dur=this._tDur=+t.duration||0,this._delay=+t.delay||0,(this._repeat=t.repeat||0)&&(this._rDelay=t.repeatDelay||0,this._yoyo=!!t.yoyo||!!t.yoyoEase,Aa(this)),this._ts=1,this.data=t.data,f||Tt.wake(),r&&xa(r,this,e||0===e?e:r._time),t.reversed&&this.reversed(!0),t.paused&&this.paused(!0)}var t=Animation.prototype;return t.delay=function delay(t){return t||0===t?(this._delay=t,this):this._delay},t.duration=function duration(t){var e=arguments.length,r=this._repeat,n=0<r?r*((e?t:this._dur)+this._rDelay):0;return e?this.totalDuration(r<0?t:t+n):this.totalDuration()&&this._dur},t.totalDuration=function totalDuration(t){if(!arguments.length)return this._tDur;var e=this._repeat,r=(t||this._rDelay)&&e<0;return this._tDur=r?1e20:t,this._dur=r?t:(t-e*this._rDelay)/(e+1),this._dirty=0,ta(this.parent)},t.totalTime=function totalTime(t,e){if(xt(),!arguments.length)return this._tTime;var r,n=this.parent||this._gc;if(n&&n.smoothChildTiming&&this._ts){for(r=this._start,this._start=n._time-(0<this._ts?t/this._ts:((this._dirty?this.totalDuration():this._tDur)-t)/-this._ts),this._end+=this._start-r,n._dirty||ta(n);n.parent;)n.parent._time!==n._start+(0<n._ts?n._tTime/n._ts:(n.totalDuration()-n._tTime)/-n._ts)&&n.totalTime(n._tTime,!0),n=n.parent;this.parent||xa(this._gc,this,this._start-this._delay)}return this._tTime===t&&this._dur||ga(this,t,e),this},t.time=function time(t,e){return arguments.length?this.totalTime(t+va(this),e):this._time},t.totalProgress=function totalProgress(t,e){return arguments.length?this.totalTime(this.totalDuration()*t,e):this._tTime/this.totalDuration()},t.progress=function progress(t,e){return arguments.length?this.totalTime(this.duration()*t+va(this),e):this.duration()?this._time/this._dur:this.ratio},t.iteration=function iteration(t,e){var r=this.duration()+this._rDelay;return arguments.length?this.totalTime(this._time+(t-1)*r,e):this._repeat?1+~~(this._tTime/r):1},t.timeScale=function timeScale(t){if(!arguments.length)return this._ts||this._pauseTS;var e=this._ts;return this._ts=t||S,t?(this._end=this._start+(this._tDur/(t||this._pauseTS)||0),e||this.resume(),function _recacheAncestors(t){for(var e=t.parent;e&&e.parent;)e._dirty=1,e.totalDuration(),e=e.parent;return t}(this).totalTime(this._tTime,!0)):this.pause()},t.paused=function paused(t){var e=0===this._ts;return arguments.length?(e!==t&&(t?(this._pauseTS=this._ts,this._ts=this._act=0):(this._ts=this._pauseTS,this.totalTime(this._tTime,!0))),this):e},t.startTime=function startTime(t){return arguments.length?(this.parent&&this.parent._sort&&xa(this.parent,this,t-this._delay),this):this._start},t.endTime=function endTime(t){return this._start+(s(t)?this.totalDuration():this.duration())/this._ts},t.rawTime=function rawTime(t){var e=this.parent||this._gc;return e?t&&(!this._ts||this._repeat&&this._time&&this.totalProgress()<1)?this._tTime%(this._dur+this._rDelay):this._ts?(e.rawTime(t)-this._start)*this._ts:this._tTime:this._tTime},t.repeat=function repeat(t){return arguments.length?(this._repeat=t,Aa(this)):this._repeat},t.repeatDelay=function repeatDelay(t){return arguments.length?(this._rDelay=t,Aa(this)):this._rDelay},t.yoyo=function yoyo(t){return arguments.length?(this._yoyo=t,this):this._yoyo},t.seek=function seek(t,e){return this.totalTime(Ca(this,t),s(e))},t.restart=function restart(t,e){return this.play().totalTime(t?-this._delay:0,s(e))},t.play=function play(t,e){return null!=t&&this.seek(t,e),this.reversed(!1).paused(!1)},t.reverse=function reverse(t,e){return null!=t&&this.seek(t||this.totalDuration(),e),this.reversed(!0).paused(!1)},t.pause=function pause(t,e){return null!=t&&this.seek(t,e),this.paused(!0)},t.resume=function resume(){return this.paused(!1)},t.reversed=function reversed(t){var e=this._ts||this._pauseTS;return arguments.length?(e=Math.abs(e)*(t?-1:1),this[this._ts?"_ts":"_pauseTS"]=e,this.totalTime(this._tTime,!0)):e<0},t.invalidate=function invalidate(){return this._initted=0,this},t.isActive=function isActive(){var t,e=this.parent||this._gc,r=this._start;return!e||this._ts&&e.isActive()&&(t=e.rawTime(!0))>=r&&t<this.endTime(!0)-S},t.eventCallback=function eventCallback(t,e,r){var n=this.vars;return 1<arguments.length?(e?(n[t]=e,r&&(n[t+"Params"]=r),"onUpdate"===t&&(this._onUpdate=e)):delete n[t],this):n[t]},t.then=function then(e){var r=this;return void 0===e&&(e=L),new Promise(function(t){r._prom=function(){e(r),t()}})},t.kill=function kill(){Pa(this)},Animation}();ja(At.prototype,{_time:0,_start:0,_end:0,_tTime:0,_tDur:0,_dirty:0,_repeat:0,_yoyo:!1,parent:0,_rDelay:0,_ts:1,_gc:0,ratio:0,_zTime:-S,_prom:0});var St=function(i){function Timeline(t,e){var r;return void 0===t&&(t={}),(r=i.call(this,t,e)||this).labels={},r.smoothChildTiming=s(t.smoothChildTiming),r.autoRemoveChildren=!!t.autoRemoveChildren,r._sort=s(t.sortChildren),r}_inheritsLoose(Timeline,i);var t=Timeline.prototype;return t.to=function to(t,e,r,n){return new Bt(t,da(arguments,0,this),Ca(this,p(e)?n:r)),this},t.from=function from(t,e,r,n){return new Bt(t,da(arguments,1,this),Ca(this,p(e)?n:r)),this},t.fromTo=function fromTo(t,e,r,n,i){return new Bt(t,da(arguments,2,this),Ca(this,p(e)?i:n)),this},t.set=function set(t,e,r){return e.duration=0,e.parent=this,e.repeatDelay||(e.repeat=0),new Bt(t,e,Ca(this,r)),this},t.call=function call(t,e,r){return xa(this,Bt.delayedCall(0,t,e),Ca(this,r))},t.staggerTo=function staggerTo(t,e,r,n,i,a,s){return r.duration=e,r.stagger=r.stagger||n,r.onComplete=a,r.onCompleteParams=s,r.parent=this,new Bt(t,r,Ca(this,i)),this},t.staggerFrom=function staggerFrom(t,e,r,n,i,a,o){return r.runBackwards=1,r.immediateRender=s(r.immediateRender),this.staggerTo(t,e,r,n,i,a,o)},t.staggerFromTo=function staggerFromTo(t,e,r,n,i,a,o,u){return n.startAt=r,n.immediateRender=s(n.immediateRender),this.staggerTo(t,e,n,i,a,o,u)},t.render=function render(t,e,r){var n,i,a,s,o,u,h,l,f,c,p,d,m=this._time,g=this._dirty?this.totalDuration():this._tDur,v=this._dur,y=g-S<t&&0<=t&&this!==F?g:t<S?0:t;if(v||(r=r||this._zTime<0!=t<0)&&(m=this._zTime),y!==this._tTime||r){if(n=y,f=this._start,u=0===(l=this._ts),m!==this._time&&v&&(n+=this._time-m),this._repeat&&(p=this._yoyo,o=v+this._rDelay,(v<(n=_(y%o))||g===y)&&(n=v),(s=~~(y/o))&&s===y/o&&(n=v,s--),(c=~~(this._tTime/o))&&c===this._tTime/o&&c--,p&&1&s&&(n=v-n,d=1),s!==c&&!this._lock)){var w=p&&1&c,b=w===(p&&1&s);if(s<c&&(w=!w),m=w?0:v,this._lock=1,this.render(m,e,!v)._lock=0,!e&&this.parent&>(this,"onRepeat"),m!==this._time||u!=!this._ts)return this;if(b&&(this._lock=2,m=w?v+1e-4:-1e-4,this.render(m,!0)),this._lock=0,!this._ts&&!u)return this;hb(this,d)}if(this._hasPause&&!this._forcing&&this._lock<2&&(h=function _findNextPauseTween(t,e,r){var n;if(e<r)for(n=t._first;n&&n._start<=r;){if(!n._dur&&"isPause"===n.data&&n._start>e)return n;n=n._next}else for(n=t._last;n&&n._start>=r;){if(!n._dur&&"isPause"===n.data&&n._start<e)return n;n=n._prev}}(this,m,n))&&(y-=n-(n=h._start)),this._tTime=y,this._time=n,this._act=!l,this._initted||(this._onUpdate=this.vars.onUpdate,this._initted=1),m||!n||e||gt(this,"onStart"),m<=n)for(i=this._first;i;){if(a=i._next,(i._act||n>=i._start)&&i._ts&&h!==i&&(i.render(0<i._ts?(n-i._start)*i._ts:(i._dirty?i.totalDuration():i._tDur)+(n-i._start)*i._ts,e,r),n!==this._time||!this._ts&&!u)){h=0;break}i=a}else for(i=this._last;i;){if(a=i._prev,(i._act||n<=i._end)&&i._ts&&h!==i&&(i.render(0<i._ts?(n-i._start)*i._ts:(i._dirty?i.totalDuration():i._tDur)+(n-i._start)*i._ts,e,r),n!==this._time||!this._ts&&!u)){h=0;break}i=a}if(h&&!e&&(this.pause(),h.render(0)._zTime=1,this._ts))return this._start=f,this.render(t,e,r);this._onUpdate&&!e&>(this,"onUpdate",!0),(y===g||!y&&this._ts<0)&&(f!==this._start&&l===this._ts||(!n||g>=this.totalDuration())&&(sa(this,1),e||(gt(this,y===g?"onComplete":"onReverseComplete",!0),this._prom&&y===g&&this._prom())))}return this},t.add=function add(t,e){var r=this;if(p(e)||(e=Ca(this,e)),!(t instanceof At)){if(Z(t))return t.forEach(function(t){return r.add(t,e)}),ta(this);if(n(t))return this.addLabel(t,e);if(!o(t))return this;t=Bt.delayedCall(0,t)}return xa(this,t,e)},t.getChildren=function getChildren(t,e,r,n){void 0===t&&(t=!0),void 0===e&&(e=!0),void 0===r&&(r=!0),void 0===n&&(n=-A);for(var i=[],a=this._first;a;)a._start>=n&&(a instanceof Bt?e&&i.push(a):(r&&i.push(a),t&&i.push.apply(i,a.getChildren(!0,e,r)))),a=a._next;return i},t.remove=function remove(t){return n(t)?this.removeLabel(t):o(t)?this.killTweensOf(t):(ra(this,t),t===this._recent&&(this._recent=this._last),ta(this))},t.totalTime=function totalTime(t,e){return arguments.length?(this._forcing=1,this===F&&this._ts&&(this._start=Tt.time-(0<this._ts?t/this._ts:(this.totalDuration()-t)/-this._ts)),i.prototype.totalTime.call(this,t,e),this._forcing=0,this):this._tTime},t.addLabel=function addLabel(t,e){return this.labels[t]=Ca(this,e),this},t.removeLabel=function removeLabel(t){return delete this.labels[t],this},t.addPause=function addPause(t,e,r){var n=Bt.delayedCall(0,e||L,r);return n.data="isPause",this._hasPause=1,xa(this,n,t)},t.removePause=function removePause(t){var e=this._first;for(t=Ca(this,t);e;)e._start===t&&"isPause"===e.data&&sa(e),e=e._next},t.killTweensOf=function killTweensOf(t,e,r){for(var n=this.getTweensOf(t,r),i=n.length;i--;)n[i].kill(t,e);return this},t.getTweensOf=function getTweensOf(t,e){for(var r,n=[],i=pt(t),a=this._first;a;)a instanceof Bt?!ca(a._targets,i)||e&&!a.isActive()||n.push(a):(r=a.getTweensOf(i,e)).length&&n.push.apply(n,r),a=a._next;return n},t.tweenTo=function tweenTo(t,e){var r=this,n=Ca(r,t),i=e&&e.startAt,a=Bt.to(r,ja({ease:"none",lazy:!1,time:n,duration:Math.abs(n-(i&&"time"in i?i.time:r._time))/r.timeScale()||S,onStart:function onStart(){r.pause();var t=Math.abs(n-r._time)/r.timeScale();a._dur!==t&&(a._dur=t,a.render(a._time,!0,!0)),e&&e.onStart&&e.onStart.apply(a,e.onStartParams||[])}},e));return a},t.tweenFromTo=function tweenFromTo(t,e,r){return this.tweenTo(e,ja({startAt:{time:Ca(this,t)}},r))},t.recent=function recent(){return this._recent},t.nextLabel=function nextLabel(t){return void 0===t&&(t=this._time),Na(this,Ca(this,t))},t.previousLabel=function previousLabel(t){return void 0===t&&(t=this._time),Na(this,Ca(this,t),1)},t.currentLabel=function currentLabel(t){return arguments.length?this.seek(t,!0):this.previousLabel(this._time+S)},t.shiftChildren=function shiftChildren(t,e,r){void 0===r&&(r=0);for(var n,i=this._first,a=this.labels;i;)i._start>=r&&(i._start+=t),i=i._next;if(e)for(n in a)a[n]>=r&&(a[n]+=t);return ta(this)},t.invalidate=function invalidate(){var t=this._first;for(this._lock=0;t;)t.invalidate(),t=t._next;return i.prototype.invalidate.call(this)},t.clear=function clear(t){void 0===t&&(t=!0);for(var e,r=this._first;r;)e=r._next,this.remove(r),r=e;return this._time=this._tTime=0,t&&(this.labels={}),ta(this)},t.totalDuration=function totalDuration(t){var e,r,n=0,i=this,a=i._last,s=A,o=i._repeat,u=o*i._rDelay||0,h=o<0;if(arguments.length)return h?i:i.timeScale(i.totalDuration()/t);if(i._dirty){for(;a;)e=a._prev,a._dirty&&a.totalDuration(),a._start>s&&i._sort&&a._ts&&!i._lock?(i._lock=1,xa(i,a,a._start-a._delay),i._lock=0):s=a._start,a._start<0&&a._ts&&(n-=a._start,(i===F||i.parent&&i.parent.smoothChildTiming)&&(i._start+=a._start/i._ts,i._time-=a._start,i._tTime-=a._start),i.shiftChildren(-a._start,!1,-A),s=0),n<(r=a._end=a._start+a._tDur/Math.abs(a._ts))&&(n=_(r)),a=e;i._dur=i===F&&i._time>n?i._time:Math.min(A,n),i._tDur=h&&(i._dur||u)?1e20:Math.min(A,n*(o+1)+u),i._end=i._start+(i._tDur/Math.abs(i._ts||i._pauseTS)||0),i._dirty=0}return i._tDur},Timeline.updateRoot=function updateRoot(t){if(F._ts&&ga(F,function _parentToChildTotalTime(t,e){return 0<e._ts?(t-e._start)*e._ts:(e._dirty?e.totalDuration():e._tDur)+(t-e._start)*e._ts}(t,F)),Tt.frame>=lt){lt+=N.autoSleep||120;var e=F._first;if((!e||!e._ts)&&N.autoSleep&&Tt._listeners.length<2){for(;e&&!e._ts;)e=e._next;e||Tt.sleep()}}},Timeline}(At);ja(St.prototype,{_lock:0,_hasPause:0,_forcing:0});function tb(t,e,n,i,a,s){var u,h,l,f;if(ut[t]&&!1!==(u=new ut[t]).init(a,u.rawVars?e[t]:function _processVars(t,e,n,i,a){if(o(t)&&(t=Rt(t,a,e,n,i)),!r(t)||t.style&&t.nodeType||Z(t))return t;var s,u={};for(s in t)u[s]=Rt(t[s],a,e,n,i);return u}(e[t],i,a,s,n),n,i,s)&&(n._pt=h=new Qt(n._pt,a,t,0,1,u.render,u,0,u.priority),n!==c))for(l=n._ptLookup[n._targets.indexOf(a)],f=u._props.length;f--;)l[u._props[f]]=h;return u}function xb(t){return o(t)||n(t)}var Dt,Et=function _addPropTween(t,e,r,i,a,s,u,h,l){o(i)&&(i=i(a||0,t,s));var f,c=t[e],_="get"!==r?r:o(c)?l?t[e.indexOf("set")||!o(t["get"+e.substr(3)])?e:"get"+e.substr(3)](l):t[e]():c,p=o(c)?l?Ut:It:jt;if(n(i)&&(~i.indexOf("random(")&&(i=Ka(i)),"="===i.charAt(1)&&(i=parseFloat(_)+parseFloat(i.substr(2))*("-"===i.charAt(0)?-1:1)+W(_))),_!==i)return isNaN(_+i)?function _addComplexStringPropTween(t,e,r,n,i,a,s){var o,u,h,l,f,c,_,p,d=new Qt(this._pt,t,e,0,1,Yt,null,i),m=0,g=0;for(d.b=r,d.e=n,r+="",(_=~(n+="").indexOf("random("))&&(n=Ka(n)),a&&(a(p=[r,n],t,e),r=p[0],n=p[1]),u=r.match(tt)||[];o=tt.exec(n);)l=o[0],f=n.substring(m,o.index),h?h=(h+1)%5:"rgba("===f.substr(-5)&&(h=1),l!==u[g++]&&(c=parseFloat(u[g-1]),d._pt={_next:d._pt,p:f||1===g?f:",",s:c,c:"="===l.charAt(1)?parseFloat(l.substr(2))*("-"===l.charAt(0)?-1:1):parseFloat(l)-c,m:h&&h<4?Math.round:0},m=tt.lastIndex);return d.c=m<n.length?n.substring(m,n.length):"",d.fp=s,(rt.test(n)||_)&&(d.e=0),this._pt=d}.call(this,t,e,_,i,p,h||N.stringFilter,l):(f=new Qt(this._pt,t,e,+_||0,i-(_||0),Xt,0,p),l&&(f.fp=l),u&&f.modifier(u,this,t),this._pt=f)},Ft=function _initTween(t,e){var r,n,i,a,o,u,h,l,f,c,_,p,d=t.vars,m=d.ease,g=d.startAt,v=d.immediateRender,y=d.lazy,w=d.onUpdate,b=d.onUpdateParams,T=d.callbackScope,x=d.runBackwards,k=d.yoyoEase,C=d.keyframes,O=t._dur,P=t._startAt,M=t._targets,A=t.parent,S=A&&"nested"===A.data?A.parent._targets:M,D="auto"===t._overwrite,E=t.timeline;if(!E||C&&m||(m="none"),t._ease=Pt(m,R.ease),t._yEase=k?function _invertEase(e){return function(t){return 1-e(1-t)}}(Pt(!0===k?m:k,R.ease)):0,k&&t._yoyo&&!t._repeat&&(k=t._yEase,t._yEase=t._ease,t._ease=k),!E){if(g){if(P&&P.render(-1,!0).kill(),sa(t._startAt=Bt.set(M,ja({data:"isStart",overwrite:!1,parent:A,immediateRender:!0,lazy:s(y),startAt:null,delay:0,onUpdate:w,onUpdateParams:b,callbackScope:T,stagger:0},g))),v)if(0<e)t._startAt=0;else if(O)return}else if(x&&O)if(P)P.render(-1,!0).kill(),t._startAt=0;else if(e&&(v=!1),sa(t._startAt=Bt.set(M,dt(na(d,at),{overwrite:!1,data:"isFromStart",lazy:v&&s(y),immediateRender:v,stagger:0,parent:A}))),v){if(!e)return}else _initTween(t._startAt,e),v&&(t._startAt=0);for(r=na(d,at),p=(l=M[t._pt=0]?V(M[0]).harness:0)&&d[l.prop],n=0;n<M.length;n++){if(h=(o=M[n])._gsap||U(M)[n]._gsap,t._ptLookup[n]=c={},ot[h.id]&&fa(),_=S===M?n:S.indexOf(o),D&&(Dt=t,F.killTweensOf(o,r,!0),Dt=0),l&&!1!==(f=new l).init(o,p||r,t,_,S)&&(t._pt=a=new Qt(t._pt,o,f.name,0,1,f.render,f,0,f.priority),f._props.forEach(function(t){c[t]=a}),f.priority&&(u=1)),!l||p)for(i in r)ut[i]&&(f=tb(i,r,t,_,o,S))?f.priority&&(u=1):c[i]=a=Et.call(t,o,i,"get",r[i],_,S,0,d.stringFilter);t._op&&t._op[n]&&t.kill(o,t._op[n]),t._pt&&(s(y)&&O||y&&!O)&&(ot[h.id]=1)}u&&qt(t),t._onInit&&t._onInit(t)}t._from=!E&&!!d.runBackwards,t._onUpdate=w,t._initted=1},Rt=function _parseFuncOrString(t,e,r,i,a){return o(t)?t.call(e,r,i,a):n(t)&&~t.indexOf("random(")?Ka(t):t},Lt=ct+",repeat,repeatDelay,yoyo,yoyoEase",zt=(Lt+",id,stagger,delay,duration").split(","),Bt=function(x){function Tween(t,e,n){var i;"number"==typeof e&&(n.duration=e,e=n,n=null);var a,o,u,h,l,f,c,_,p=(i=x.call(this,function _inheritDefaults(t){var e=t.parent||F,r=t.keyframes?ka:ja;if(s(t.inherit))for(;e;)r(t,e.vars.defaults),e=e.parent;return t}(e),n)||this).vars,d=p.duration,m=p.delay,g=p.immediateRender,v=p.stagger,y=p.overwrite,w=p.keyframes,b=p.defaults,T=pt(t);if(i._targets=T.length?U(T):J("Cannot tween a null target")||[{}],i._ptLookup=[],i._overwrite=y,w||v||xb(d)||xb(m)){if(e=i.vars,(a=i.timeline=new St({data:"nested",defaults:b||{}})).kill(),a.parent=_assertThisInitialized(i),w)ja(a.vars.defaults,{ease:"none"}),w.forEach(function(t){return a.to(T,t,">")});else{if(h=T.length,c=v?ea(v):L,r(v))for(l in v)~Lt.indexOf(l)&&((_=_||{})[l]=v[l]);for(o=0;o<h;o++){for(l in u={},e)zt.indexOf(l)<0&&(u[l]=e[l]);u.stagger=0,_&&dt(u,_),e.yoyoEase&&!e.repeat&&(u.yoyoEase=e.yoyoEase),f=T[o],u.duration=+Rt(e.duration,_assertThisInitialized(i),o,f,T),u.delay=+Rt(e.delay,_assertThisInitialized(i),o,f,T)||0,a.to(f,u,c(o,f,T)),d=0}}d||i.duration(d=a.duration())}else i.timeline=0;return!0===y&&(Dt=_assertThisInitialized(i),F.killTweensOf(T),Dt=0),(g||!d&&!w&&i._start===i.parent._time&&s(g))&&(i._tTime=-S,i.render(Math.max(0,-m))),i}_inheritsLoose(Tween,x);var t=Tween.prototype;return t.render=function render(t,e,r){var n,i,a,o,u,h,l,f,c,p=this._time,d=this._tDur,m=this._dur,g=d-S<t&&0<=t?d:t<S?0:t;if(m){if(g!==this._tTime||r){if(n=g,f=this.timeline,this._repeat){if(o=m+this._rDelay,m<(n=_(g%o))&&(n=m),(a=~~(g/o))&&a===g/o&&(n=m,a--),(h=this._yoyo&&1&a)&&(c=this._yEase,n=m-n),(u=~~(this._tTime/o))&&u===this._tTime/o&&u--,n===p&&!r)return this;a!==u&&(f&&this._yEase&&hb(f,h),this.vars.repeatRefresh&&!this._lock&&(this._lock=1,this.render(o*a,!0).invalidate()._lock=0))}if(!this._initted){if(Ft(this,n),!this._initted)return this;if(!r&&this._pt&&s(this.vars.lazy)&&!this.timeline)return st.push(this),this._lazy=[g,e],this}for(this._tTime=g,this._time=n,!this._act&&this._ts&&n&&(this._act=1,this._lazy&&(this._lazy=0)),this.ratio=l=(c||this._ease)(n/m),this._from&&(this.ratio=l=1-l),p||!n||e||gt(this,"onStart"),i=this._pt;i;)i.r(l,i.d),i=i._next;f&&f.render(t<0?t:f._dur*l,e,r),this._onUpdate&&!e&&(t<0&&this._startAt&&this._startAt.render(t,!0,r),gt(this,"onUpdate")),this._repeat&&a!==u&&this.vars.onRepeat&&!e&&this.parent&>(this,"onRepeat"),(g===d||!g&&this._ts<0)&&(t<0&&this._startAt&&!this._onUpdate&&this._startAt.render(t,!0,r),sa(this,1),e||(gt(this,g===d?"onComplete":"onReverseComplete",!0),this._prom&&g===d&&this._prom()))}}else!function _renderZeroDurationTween(t,e,r,n){var i,a,s,o=t._zTime<0?0:1,u=e<0?0:1,h=t._rDelay,l=0;if(h&&t._repeat&&((a=~~((l=Y(0,t._tDur,e))/h))&&a===l/h&&a--,(s=~~(t._tTime/h))&&s===t._tTime/h&&s--,a!==s&&(o=1-u,t.vars.repeatRefresh&&t.invalidate())),!t._initted){if(Ft(t,e),!t._initted)return;if(!n&&t._pt&&t.vars.lazy)return st.push(t),t._lazy=[e,r]}if(u!==o||n){for(r&&!e||(t._zTime=e),t.ratio=u,t._from&&(u=1-u),t._time=0,t._tTime=l,r||gt(t,"onStart"),i=t._pt;i;)i.r(u,i.d),i=i._next;!u&&t._startAt&&!t._onUpdate&&t._start&&t._startAt.render(e,!0,n),t._onUpdate&&!r&&(e<0&&t._startAt&&t._start&&t._startAt.render(e,!0,n),gt(t,"onUpdate")),l&&t.vars.onRepeat&&!r&&t.parent&>(t,"onRepeat"),(e>=t._tDur||e<0)&&(sa(t,1),r||(gt(t,t.ratio?"onComplete":"onReverseComplete",!0),t._prom&&t.ratio&&t._prom()))}}(this,t,e,r);return this},t.targets=function targets(){return this._targets},t.invalidate=function invalidate(){return this._pt=this._op=this._startAt=this._onUpdate=this._act=this._lazy=0,this._ptLookup=[],this.timeline&&this.timeline.invalidate(),x.prototype.invalidate.call(this)},t.kill=function kill(t,e){if(void 0===e&&(e="all"),Dt===this)return Dt;if(!(t||e&&"all"!==e)&&this.parent)return this._lazy=0,Pa(this);if(this.timeline)return this.timeline.killTweensOf(t,e),this;var r,i,a,s,o,u,h,l=this._targets,f=t?pt(t):l,c=this._ptLookup,_=this._pt;if((!e||"all"===e)&&function _arraysMatch(t,e){for(var r=t.length,n=r===e.length;n&&r--&&t[r]===e[r];);return r<0}(l,f))return Pa(this);for(r=this._op=this._op||[],"all"!==e&&(n(e)&&(o={},$(e,function(t){return o[t]=1}),e=o),e=function _addAliasesToVars(t,e){var r,n,i,a,s=t[0]?V(t[0]).harness:0,o=s&&s.aliases;if(!o)return e;for(n in r=dt({},e),o)if(n in r)for(i=(a=o[n].split(",")).length;i--;)r[a[i]]=r[n];return r}(l,e)),h=l.length;h--;)if(~f.indexOf(l[h]))for(o in i=c[h],"all"===e?(r[h]=e,s=i,a={}):(a=r[h]=r[h]||{},s=e),s)(u=i&&i[o])&&("kill"in u.d&&!0!==u.d.kill(o)||(ra(this,u,"_pt"),delete i[o])),"all"!==a&&(a[o]=1);return this._initted&&!this._pt&&_&&Pa(this),this},Tween.to=function to(t,e,r){return new Tween(t,e,r)},Tween.from=function from(t,e){return new Tween(t,da(arguments,1))},Tween.delayedCall=function delayedCall(t,e,r,n){return new Tween(e,0,{immediateRender:!1,lazy:!1,overwrite:!1,delay:t,onComplete:e,onReverseComplete:e,onCompleteParams:r,onReverseCompleteParams:r,callbackScope:n})},Tween.fromTo=function fromTo(t,e,r){return new Tween(t,da(arguments,2))},Tween.set=function set(t,e){return e.duration=0,e.repeatDelay||(e.repeat=0),new Tween(t,e)},Tween.killTweensOf=function killTweensOf(t,e,r){return F.killTweensOf(t,e,r)},Tween}(At);ja(Bt.prototype,{_targets:[],_initted:0,_lazy:0,_startAt:0,_op:0,_onInit:0}),$("staggerTo,staggerFrom,staggerFromTo",function(r){Bt[r]=function(){var t=new St,e=pt(arguments);return e.splice("staggerFromTo"===r?5:4,0,0),t[r].apply(t,e)}});function Fb(t,e,r){return t.setAttribute(e,r)}function Mb(t,e,r,n){n.mSet(t,e,n.m.call(n.tween,r,n.mt),n)}var jt=function _setterPlain(t,e,r){return t[e]=r},It=function _setterFunc(t,e,r){return t[e](r)},Ut=function _setterFuncWithParam(t,e,r,n){return t[e](n.fp,r)},Nt=function _getSetter(t,e){return o(t[e])?It:q(t[e])&&t.setAttribute?Fb:jt},Xt=function _renderPlain(t,e){return e.set(e.t,e.p,~~(1e4*(e.s+e.c*t))/1e4,e)},Yt=function _renderComplexString(t,e){var r=e._pt,n="";if(!t&&e.b)n=e.b;else if(1===t&&e.e)n=e.e;else{for(;r;)n=r.p+(r.m?r.m(r.s+r.c*t):~~(1e4*(r.s+r.c*t))/1e4)+n,r=r._next;n+=e.c}e.set(e.t,e.p,n,e)},Vt=function _renderPropTweens(t,e){for(var r=e._pt;r;)r.r(t,r.d),r=r._next},Wt=function _addPluginModifier(t,e,r,n){for(var i,a=this._pt;a;)i=a._next,a.p===n&&a.modifier(t,e,r),a=i},$t=function _killPropTweensOf(t){for(var e,r,n=this._pt;n;)r=n._next,n.p===t?ra(this,n,"_pt"):n.dep||(e=1),n=r;return!e},qt=function _sortPropTweensByPriority(t){for(var e,r,n,i,a=t._pt;a;){for(e=a._next,r=n;r&&r.pr>a.pr;)r=r._next;(a._prev=r?r._prev:i)?a._prev._next=a:n=a,(a._next=r)?r._prev=a:i=a,a=e}t._pt=n},Qt=function(){function PropTween(t,e,r,n,i,a,s,o,u){this.t=e,this.s=n,this.c=i,this.p=r,this.r=a||Xt,this.d=s||this,this.set=o||jt,this.pr=u||0,(this._next=t)&&(t._prev=this)}return PropTween.prototype.modifier=function modifier(t,e,r){this.mSet=this.mSet||this.set,this.set=Mb,this.m=t,this.mt=r,this.tween=e},PropTween}();$(ct+",parent,duration,ease,delay,overwrite,runBackwards,startAt,yoyo,immediateRender,repeat,repeatDelay,data,paused,reversed,lazy,callbackScope,stringFilter,id,yoyoEase,stagger,inherit,repeatRefresh,keyframes",function(t){at[t]=1,"on"===t.substr(0,2)&&(at[t+"Params"]=1)}),it.TweenMax=it.TweenLite=Bt,it.TimelineLite=it.TimelineMax=St,F=new St({sortChildren:!1,defaults:R,autoRemoveChildren:!0,id:"root"}),N.stringFilter=Za;var Zt={registerPlugin:function registerPlugin(){for(var t=arguments.length,e=new Array(t),r=0;r<t;r++)e[r]=arguments[r];e.forEach(function(t){return function _createPlugin(t){var e=(t=!t.name&&t.default||t).name,r=o(t),n=e&&!r?function(){this._props=[]}:t,i={init:L,render:Vt,add:Et,kill:$t,modifier:Wt,rawVars:0},a={targetTest:0,get:0,getSetter:Nt,aliases:{},register:0};if(xt(),!r){if(ut[e])return;ja(n,ja(na(t,i),a)),dt(n.prototype,dt(i,na(t,a))),ut[n.prop=e]=n,t.targetTest&&(ft.push(n),at[e]=1),e=("css"===e?"CSS":e.charAt(0).toUpperCase()+e.substr(1))+"Plugin"}K(e,n),t.register&&t.register(Zt,n,Qt)}(t)})},timeline:function timeline(t){return new St(t)},getTweensOf:function getTweensOf(t,e){return F.getTweensOf(t,e)},getProperty:function getProperty(i,t,e,r){n(i)&&(i=pt(i)[0]);var a=V(i||{}).get,s=e?ia:ha;return"native"===e&&(e=""),i?t?s((ut[t]&&ut[t].get||a)(i,t,e,r)):function(t,e,r){return s((ut[t]&&ut[t].get||a)(i,t,e,r))}:i},quickSetter:function quickSetter(r,e,i){n(r)&&(r=pt(r)[0]);var a=ut[e],s=V(r),o=a?function(t){var e=new a;c._pt=0,e.init(r,i?t+i:t,c,0,[r]),e.render(1,e),c._pt&&Vt(1,c)}:s.set(r,e);return a?o:function(t){return o(r,e,i?t+i:t,s,1)}},isTweening:function isTweening(t){return 0<F.getTweensOf(t,!0).length},defaults:function defaults(t){return ma(R,t||{})},config:function config(t){return ma(N,t||{})},registerEffect:function registerEffect(t){var i=t.name,n=t.effect,e=t.plugins,a=t.defaults,s=t.extendTimeline;(e||"").split(",").forEach(function(t){return t&&!ut[t]&&!it[t]&&J(i+" effect requires "+t+" plugin.")}),ht[i]=function(t,e){return n(pt(t),ja(e||{},a))},s&&(St.prototype[i]=function(t,e,n){return this.add(ht[i](t,r(e)?e:(n=e)&&{}),n)})},registerEase:function registerEase(t,e){kt[t]=Pt(e)},parseEase:function parseEase(t,e){return arguments.length?Pt(t,e):kt},getById:function getById(t){for(var e=F.getChildren(1,1,1),r=e.length;r--;)if(e[r].vars.id===t)return e[r]},exportRoot:function exportRoot(t,e){void 0===t&&(t={});var r,n,i=new St(t);for(i.smoothChildTiming=s(t.smoothChildTiming),F.remove(i),i._time=i._totalTime=F._time,r=F._first;r;)n=r._next,!e&&!r._dur&&r instanceof Bt&&r.vars.onComplete===r._targets[0]||xa(i,r,r._start-r._delay),r=n;return xa(F,i,0),i},utils:{wrap:function _wrap(e,t,r){var n=t-e;return Z(e)?Ha(e,_wrap(0,e.length),t):isNaN(r)?function(t){return(n+(t-e)%n)%n+e}:_wrap(e,t)(r)},wrapYoyo:function _wrapYoyo(e,t,r){var n=t-e,i=2*n;return Z(e)?Ha(e,_wrapYoyo(0,e.length-1),t):isNaN(r)?function(t){return e+(n<(t=(i+(t-e)%i)%i)?i-t:t)}:_wrapYoyo(e,t)(r)},distribute:ea,random:Fa,snap:Ea,normalize:function normalize(t,e,r){return La(t,e,0,1,r)},getUnit:W,clamp:function _clampModifier(e,r,t){return isNaN(t)?function(t){return Y(e,r,t)}:Y(e,r,t)},splitColor:Va,toArray:pt,mapRange:La,pipe:function _pipe(){for(var t=arguments.length,e=new Array(t),r=0;r<t;r++)e[r]=arguments[r];return function(t){return e.reduce(function(t,e){return e(t)},t)}},unitize:function unitize(e,r){return function(t){return e(parseFloat(t))+(r||W(t))}},interpolate:function _interpolate(e,r,t,i){var a=isNaN(e+r)?0:function(t){return(1-t)*e+t*r};if(!a){var s,o,u,h,l,f=n(e),c={};if(f)e={p:e},r={p:r};else if(Z(e)&&!Z(r)){for(u=[],h=e.length,l=h-2,o=1;o<h;o++)u.push(_interpolate(e[o-1],e[o]));h--,a=function func(t){t*=h;var e=Math.min(l,~~t);return u[e](t-e)},t=r}else i||(e=dt(Z(e)?[]:{},e));if(!u){for(s in r)Et.call(c,e,s,"get",r[s]);a=function func(t){return Vt(t,c)||(f?e.p:e)}}}return p(t)?a(t):a}},install:I,effects:ht,ticker:Tt,updateRoot:St.updateRoot,plugins:ut,globalTimeline:F,core:{PropTween:Qt,globals:K,Tween:Bt,Timeline:St,Animation:At,getCache:V}};$("to,from,fromTo,delayedCall,set,killTweensOf",function(t){return Zt[t]=Bt[t]}),Tt.add(St.updateRoot),c=Zt.to({},{duration:0});function Rb(t,a){return{name:t,rawVars:1,init:function init(t,i,e){e._onInit=function(t){var e,r;if(n(i)&&(e={},$(i,function(t){return e[t]=1}),i=e),a){for(r in e={},i)e[r]=a(i[r]);i=e}!function _addModifiers(t,e){var r,n,i,a=t._targets;for(r in e)for(n=a.length;n--;)(i=t._ptLookup[n][r])&&i.d.modifier&&i.d.modifier(e[r],t,a[n],r)}(t,i)}}}}Zt.registerPlugin({name:"attr",init:function init(t,e,r,n,i){for(var a in e)this.add(t,"setAttribute",(t.getAttribute(a)||0)+"",e[a],n,i,0,0,a),this._props.push(a)}},{name:"endArray",init:function init(t,e){for(var r=e.length;r--;)this.add(t,r,t[r],e[r])}},Rb("roundProps",Da),Rb("modifiers"),Rb("snap",Ea)),Bt.version=St.version=Zt.version="3.0.0-beta.8",l=1,t()&&xt();function Ac(t,e){return e.set(e.t,e.p,~~(1e4*(e.s+e.c*t))/1e4+e.u,e)}function Bc(t,e){return e.set(e.t,e.p,1===t?e.e:~~(1e4*(e.s+e.c*t))/1e4+e.u,e)}function Cc(t,e){return e.set(e.t,e.p,t?~~(1e4*(e.s+e.c*t))/1e4+e.u:e.b,e)}function Dc(t,e){var r=e.s+e.c*t;e.set(e.t,e.p,~~(r+(r<0?-.5:.5))+e.u,e)}function Ec(t,e){return e.set(e.t,e.p,t?e.e:e.b,e)}function Fc(t,e){return e.set(e.t,e.p,1!==t?e.b:e.e,e)}function Gc(t,e,r){return t.style[e]=r}function Hc(t,e,r){return t._gsap[e]=r}function Ic(t,e,r){return t._gsap.scaleX=t._gsap.scaleY=r}function Jc(t,e,r,n,i){var a=t._gsap;a.scaleX=a.scaleY=r,a.renderTransform(i,a)}function Kc(t,e,r,n,i){var a=t._gsap;a[e]=r,a.renderTransform(i,a)}function Oc(t,e){var r=Ht.createElementNS?Ht.createElementNS((e||"http://www.w3.org/1999/xhtml").replace(/^https/,"http"),t):Ht.createElement(t);return r.style?r:Ht.createElement(t)}function Pc(t,e){var r=getComputedStyle(t);return r[e]||r.getPropertyValue(e.replace(Ae,"-$1").toLowerCase())||r.getPropertyValue(e)}function Qc(t,e){var r=(e||te).style,n=5,i="O,Moz,ms,Ms,Webkit".split(",");if(t in r)return t;for(t=t.charAt(0).toUpperCase()+t.substr(1);n--&&!(i[n]+t in r););return n<0?null:(3===n?"ms":0<=n?i[n]:"")+t}function Rc(){!function _windowExists(){return"undefined"!=typeof window}()||(Gt=window,Ht=Gt.document,Kt=Ht.documentElement,te=Oc("div")||{style:{}},ee=Oc("div"),Re=Qc(Re),Le=Qc(Re),te.style.cssText="border-width:0;line-height:0;position:absolute;padding:0",ne=!!Qc("perspective"),Jt=1)}function Tc(t,e){for(var r=e.length;r--;)if(t.hasAttribute(e[r]))return t.getAttribute(e[r])}function Uc(e){var r;try{r=e.getBBox()}catch(t){r=function _getBBoxHack(t){var e,r=Oc("svg",this.ownerSVGElement&&this.ownerSVGElement.getAttribute("xmlns")||"http://www.w3.org/2000/svg"),n=this.parentNode,i=this.nextSibling,a=this.style.cssText;if(Kt.appendChild(r),r.appendChild(this),this.style.display="block",t)try{e=this.getBBox(),this._gsapBBox=this.getBBox,this.getBBox=_getBBoxHack}catch(t){}else this._gsapBBox&&(e=this._gsapBBox());return i?n.insertBefore(this,i):n.appendChild(this),Kt.removeChild(r),this.style.cssText=a,e}.call(e,!0)}return!r||r.width||r.x||r.y?r:{x:+Tc(e,["x","cx","x1"]),y:+Tc(e,["y","cy","y1"]),width:0,height:0}}function Vc(t){return!(!t.getCTM||t.parentNode&&!t.ownerSVGElement||!Uc(t))}function Wc(t,e){if(e){var r=t.style;e in Ce&&(e=Re),r.removeProperty?("ms"!==e.substr(0,2)&&"webkit"!==e.substr(0,6)||(e="-"+e),r.removeProperty(e.replace(Ae,"-$1").toLowerCase())):r.removeAttribute(e)}}function Xc(t,e,r,n,i,a){var s=new Qt(t._pt,e,r,0,1,a?Fc:Ec);return(t._pt=s).b=n,s.e=i,t._props.push(r),s}function Zc(t,e,r,n){var i,a,s,o,u=parseFloat(r),h=(r+"").substr((u+"").length),l=te.style,f=De.test(e),c="svg"===t.tagName.toLowerCase(),p=(c?"client":"offset")+(f?"Width":"Height"),d="px"===n;return n===h||ze[n]||ze[h]?u:(o=t.getCTM&&Vc(t),"%"===n&&Ce[e]?_(u/(o?t.getBBox()[f?"width":"height"]:t[p])*100):(l[f?"width":"height"]=100+(d?h:n),a="em"===n&&t.appendChild&&!c?t:t.parentNode,o&&(a=(t.ownerSVGElement||{}).parentNode),a&&a!==Ht&&a.appendChild||(a=Ht.body),(s=a._gsap)&&"%"===n&&s.width&&f&&s.time===Tt.time?i=s.width*u/100:(a.appendChild(te),i=te[p],a.removeChild(te),f&&"%"===n&&((s=a._gsap=a._gsap||{}).time=Tt.time,s.width=i/u*100)),_(d?i*u/100:100/i*u)))}function $c(t,e,r,n){var i,a;return Jt||Rc(),e in Fe&&~(e=Fe[e]).indexOf(",")&&(e=e.split(",")[0]),Ce[e]&&(a=Ne(t,n)[e],i="transformOrigin"!==e),i||(a=t.style[e])&&"auto"!==a&&!n||(a=Pc(t,e)||X(t,e)),r?Zc(t,e,a,r)+r:a}function _c(t,e,r,n){var i,a,s,o,u,h,l,f,c,_,p,d,m=new Qt(this._pt,t.style,e,0,1,Yt),g=0,v=0;if(m.b=r,m.e=n,r+="","auto"===(n+="")&&(t.style[e]=n,n=Pc(t,e)||n,t.style[e]=r),Za(i=[r,n]),n=i[1],s=(r=i[0]).match(Se)||[],(n.match(Se)||[]).length){for(;a=Se.exec(n);)l=a[0],c=n.substring(g,a.index),u?u=(u+1)%5:"rgba("===c.substr(-5)&&(u=1),l!==(h=s[v++]||"")&&(o=parseFloat(h)||0,p=h.substr((o+"").length),(d="="===l.charAt(1)?+(l.charAt(0)+"1"):0)&&(l=l.substr(2)),f=parseFloat(l),_=l.substr((f+"").length),g=Se.lastIndex-_.length,_||(_=_||N.units[e]||p,g===n.length&&(n+=_,m.e+=_)),p!==_&&(o=Zc(t,e,h,_)),m._pt={_next:m._pt,p:c||1===v?c:",",s:o,c:d?d*f:f-o,m:u&&u<4?Math.round:0});m.c=g<n.length?n.substring(g,n.length):""}else m.r="display"===e?Fc:Ec;return rt.test(n)&&(m.e=0),this._pt=m}function bd(t){var e=t.split(" "),r=e[0],n=e[1]||"50%";return"top"!==r&&"bottom"!==r&&"left"!==n&&"right"!==n||(e=r,r=n,n=e),(Be[r]||r)+" "+(Be[n]||n)}function cd(t,e){if(e.tween&&e.tween._time===e.tween._dur){var r,n,i,a=e.t,s=a.style,o=e.u;if("all"===o||!0===o)s.cssText="",n=1;else for(i=(o=o.split(",")).length;-1<--i;)r=o[i],Ce[r]&&(n=1,r="transformOrigin"===r?Le:Re),Wc(a,r);n&&(Wc(a,Re),(n=a._gsap)&&(n.svg&&a.removeAttribute("transform"),delete n.x))}}function gd(t){var e=Pc(t,Re);return"matrix(1, 0, 0, 1, 0, 0)"!==e&&"none"!==e&&e?e.substr(7).match(H).map(_):Ie}function hd(t,e){var r,n,i,a,s=t._gsap,o=t.style,u=gd(t);return s.svg&&t.getAttribute("transform")?"1,0,0,1,0,0"===(u=[(i=t.transform.baseVal.consolidate().matrix).a,i.b,i.c,i.d,i.e,i.f]).join(",")?Ie:u:(u!==Ie||t.offsetParent||t===Kt||s.svg||(i=o.display,o.display="block",(r=t.parentNode)&&t.offsetParent||(a=1,n=t.nextSibling,Kt.appendChild(t)),u=gd(t),i?o.display=i:Wc(t,"display"),a&&(n?r.insertBefore(t,n):r?r.appendChild(t):Kt.removeChild(t))),e&&6<u.length?[u[0],u[1],u[4],u[5],u[12],u[13]]:u)}function id(t,e,r,n,i,a){var s,o,u,h=t._gsap,l=i||hd(t,!0),f=h.xOrigin||0,c=h.yOrigin||0,_=h.xOffset||0,p=h.yOffset||0,d=l[0],m=l[1],g=l[2],v=l[3],y=l[4],w=l[5],b=e.split(" "),T=parseFloat(b[0])||0,x=parseFloat(b[1])||0;r?l!==Ie&&(o=d*v-m*g)&&(u=T*(-m/o)+x*(d/o)-(d*w-m*y)/o,T=T*(v/o)+x*(-g/o)+(g*w-v*y)/o,x=u):(T=(s=Uc(t)).x+(~b[0].indexOf("%")?T/100*s.width:T),x=s.y+(~(b[1]||b[0]).indexOf("%")?x/100*s.height:x)),n||!1!==n&&h.smooth?(y=T-f,w=x-c,h.xOffset+=y*d+w*g-y,h.yOffset+=y*m+w*v-w):h.xOffset=h.yOffset=0,h.xOrigin=T,h.yOrigin=x,h.smooth=!!n,h.origin=e,h.originIsAbsolute=!!r,a&&(Xc(a,h,"xOrigin",f,T),Xc(a,h,"yOrigin",c,x),Xc(a,h,"xOffset",_,h.xOffset),Xc(a,h,"yOffset",p,h.yOffset))}function nd(t,e,r,i,a,s){var o,u,h=360,l=n(a),f=parseFloat(a)*(l&&~a.indexOf("rad")?Oe:1),c=s?f*s:f-i,_=i+c+"deg";return l&&("short"===(o=a.split("_")[1])&&(c%=h)!==c%180&&(c+=c<0?h:-h),"cw"===o&&c<0?c=(c+36e9)%h-~~(c/h)*h:"ccw"===o&&0<c&&(c=(c-36e9)%h-~~(c/h)*h)),t._pt=u=new Qt(t._pt,e,r,i,c,Bc),u.e=_,u.u="deg",t._props.push(r),u}function od(t,e,r){var n,i,a,s,o,u,h,l=ee.style,f=r._gsap;for(i in l.cssText=getComputedStyle(r).cssText+";position:absolute;display:block;",l[Re]=e,Ht.body.appendChild(ee),n=Ne(ee,1),Ce)(a=f[i])!==(s=n[i])&&"perspective"!==i&&(o=W(a)!==(h=W(s))?Zc(r,i,a,h):parseFloat(a),u=parseFloat(s),t._pt=new Qt(t._pt,f,i,o,u-o,Ac),t._pt.u=h,t._props.push(i));Ht.body.removeChild(ee)}var Gt,Ht,Kt,Jt,te,ee,re,ne,ie,ae,se,oe=kt.Power0,ue=kt.Power1,he=kt.Power2,le=kt.Power3,fe=kt.Power4,ce=kt.Linear,_e=kt.Quad,pe=kt.Cubic,de=kt.Quart,me=kt.Quint,ge=kt.Strong,ve=kt.Elastic,ye=kt.Back,we=kt.SteppedEase,be=kt.Bounce,Te=kt.Sine,xe=kt.Expo,ke=kt.Circ,Ce={},Oe=180/Math.PI,Pe=Math.PI/180,Me=Math.atan2,Ae=/([A-Z])/g,Se=/[-+=\.]*\d+[\.e-]*\d*[a-z%]*/g,De=/(?:left|right|width|margin|padding|x)/i,Ee=/[\s,\(]\S/,Fe={autoAlpha:"opacity,visibility",scale:"scaleX,scaleY",alpha:"opacity"},Re="transform",Le=Re+"Origin",ze={deg:1,rad:1,turn:1},Be={top:"0%",bottom:"100%",left:"0%",right:"100%",center:"50%"},je={clearProps:function clearProps(t,e,r,n,i){var a=t._pt=new Qt(t._pt,e,r,0,0,cd);return a.u=n,a.pr=-10,a.tween=i,t._props.push(r),1}},Ie=[1,0,0,1,0,0],Ue={},Ne=function _parseTransform(t,e){var r=t._gsap||new Mt(t);if("x"in r&&!e)return r;var n,i,a,s,o,u,h,l,f,c,p,d,m,g,v,y,w,b,T,x,k,C,O,P,M,A,S,D,E,F,R=t.style,L=r.scaleX<0,z=r.xOrigin||0,B=r.yOrigin||0,j="deg";return n=i=a=u=h=l=f=c=p=0,s=o=1,r.svg=!(!t.getCTM||!Vc(t)),d=hd(t,r.svg),r.svg&&id(t,Pc(t,"transformOrigin")||"0",r.originIsAbsolute,!1!==r.smooth,d),d!==Ie&&(y=d[0],w=d[1],b=d[2],T=d[3],n=x=d[4],i=k=d[5],6===d.length?(s=Math.sqrt(y*y+w*w),o=Math.sqrt(T*T+b*b),u=y||w?Me(w,y)*Oe:r.rotation||0,f=b||T?Me(b,T)*Oe+u:r.skewX||0,r.svg&&(n-=z-(z*y+B*b),i-=B-(z*w+B*T))):(F=d[6],D=d[7],M=d[8],A=d[9],S=d[10],E=d[11],n=d[12],i=d[13],a=d[14],h=(m=Me(F,S))*Oe,m&&(C=x*(g=Math.cos(-m))+M*(v=Math.sin(-m)),O=k*g+A*v,P=F*g+S*v,M=x*-v+M*g,A=k*-v+A*g,S=F*-v+S*g,E=D*-v+E*g,x=C,k=O,F=P),l=(m=Me(-b,S))*Oe,m&&(g=Math.cos(-m),E=T*(v=Math.sin(-m))+E*g,y=C=y*g-M*v,w=O=w*g-A*v,b=P=b*g-S*v),u=(m=Me(w,y))*Oe,m&&(C=y*(g=Math.cos(m))+w*(v=Math.sin(m)),O=x*g+k*v,w=w*g-y*v,k=k*g-x*v,y=C,x=O),h&&359.9<Math.abs(h)+Math.abs(u)&&(h=u=0,l=180-l),s=_(Math.sqrt(y*y+w*w+b*b)),o=_(Math.sqrt(k*k+F*F)),m=Me(x,k),f=2e-4<Math.abs(m)?m*Oe:0,p=E?1/(E<0?-E:E):0)),90<Math.abs(f)&&Math.abs(f)<270&&(L?(s*=-1,f+=u<=0?180:-180,u+=u<=0?180:-180):(o*=-1,f+=f<=0?180:-180)),r.x=n+"px",r.y=i+"px",r.z=a+"px",r.scaleX=_(s),r.scaleY=_(o),r.rotation=_(u)+j,r.rotationX=_(h)+j,r.rotationY=_(l)+j,r.skewX=f+j,r.skewY=c+j,r.transformPerspective=p+"px",r.xPercent=r.yPercent=r.xOffset=r.yOffset=0,r.force3D=N.force3D,r.renderTransform=r.svg?Ve:ne?Ye:Xe,r.svg&&R[Re]&&Zt.delayedCall(.001,function(){return Wc(t,Re)}),r},Xe=function _renderNon3DTransforms(t,e){e.z="0px",e.rotationY=e.rotationX="0deg",e.force3D=0,Ye(t,e)},Ye=function _renderCSSTransforms(t,e){var r=e.xPercent,n=e.yPercent,i=e.x,a=e.y,s=e.z,o=e.rotation,u=e.rotationY,h=e.rotationX,l=e.skewX,f=e.skewY,c=e.scaleX,_=e.scaleY,p=e.transformPerspective,d="",m="0deg",g=") ",v="auto"===e.force3D&&t&&1!==t,y="0px";(r||n)&&(d="translate("+r+"%, "+n+"%) "),!v&&i===y&&a===y&&s===y||(d+=s!==y||v?"translate3d("+i+", "+a+", "+s+") ":"translate("+i+", "+a+g),p!==y&&(d+="perspective("+p+g),o!==m&&(d+="rotate("+o+g),u!==m&&(d+="rotateY("+u+g),h!==m&&(d+="rotateX("+h+g),l===m&&f===m||(d+="skew("+l+", "+f+g),1===c&&1===_||(d+="scale("+c+", "+_+g),e.target.style[Re]=d||"translate(0, 0)"},Ve=function _renderSVGTransforms(t,e){var r,n,i,a,s,o=e.xPercent,u=e.yPercent,h=e.x,l=e.y,f=e.rotation,c=e.skewX,p=e.skewY,d=e.scaleX,m=e.scaleY,g=e.target,v=e.xOrigin,y=e.yOrigin,w=e.xOffset,b=e.yOffset,T=parseFloat(h),x=parseFloat(l);f=parseFloat(f),c=parseFloat(c),(p=parseFloat(p))&&(c+=p=parseFloat(p),f+=p),f||c?(f*=Pe,c*=Pe,r=Math.cos(f)*d,n=Math.sin(f)*d,i=Math.sin(f-c)*-m,a=Math.cos(f-c)*m,c&&(p*=Pe,s=Math.tan(c-p),i*=s=Math.sqrt(1+s*s),a*=s,p&&(s=Math.tan(p),r*=s=Math.sqrt(1+s*s),n*=s)),r=_(r),n=_(n),i=_(i),a=_(a)):(r=d,a=m,n=i=0),(T&&!~h.indexOf("px")||x&&!~l.indexOf("px"))&&(T=Zc(g,"x",h,"px"),x=Zc(g,"y",l,"px")),(v||y||w||b)&&(T=_(T+v-(v*r+y*i)+w),x=_(x+y-(v*n+y*a)+b)),(o||u)&&(s=g.getBBox(),T=_(T+o/100*s.width),x=_(x+u/100*s.height)),g.setAttribute("transform","matrix("+r+","+n+","+i+","+a+","+T+","+x+")")},We={name:"css",register:Rc,targetTest:function targetTest(t){return t.style&&t.nodeType},init:function init(t,e,r,n,i){var a,s,o,u,h,l,f,c,_,p,d,m,g,v,y,w=this._props,b=t.style;for(f in Jt||Rc(),e)if("autoRound"!==f&&(s=e[f],!ut[f]||!tb(f,e,r,n,t,i)))if(l=je[f],"function"===(h=typeof s)&&(h=typeof(s=s.call(r,n,t,i))),"string"===h&&~s.indexOf("random(")&&(s=Ka(s)),l)l(this,t,f,s,r)&&(y=1);else if("--"===f.substr(0,2))this.add(b,"setProperty",getComputedStyle(t).getPropertyValue(f)+"",s+"",n,i,0,0,f);else{if(a=$c(t,f),u=parseFloat(a),(p="string"===h&&"="===s.charAt(1)?+(s.charAt(0)+"1"):0)&&(s=s.substr(2)),o=parseFloat(s),f in Fe&&("autoAlpha"===f&&(1===u&&"hidden"===$c(t,"visibility")&&o&&(u=0),Xc(this,b,"visibility",u?"inherit":"hidden",o?"inherit":"hidden",!o)),"scale"!==f&&~(f=Fe[f]).indexOf(",")&&(f=f.split(",")[0])),d=f in Ce){if(m||(g=t._gsap,v=!1!==e.smoothOrigin&&g.smooth,(m=this._pt=new Qt(this._pt,b,Re,0,1,g.renderTransform,g)).dep=1),"scale"===f){this._pt=new Qt(this._pt,t,"scale",u,p?p*o:o-u,0,0,Ic),w.push("scale");continue}if("transformOrigin"===f){s=bd(s),g.svg?id(t,s,0,v,0,this):Xc(this,b,f,a,s);continue}if("svgOrigin"===f){id(t,s,1,v,0,this);continue}if(f in Ue){nd(this,g,f,u,s,p);continue}if("smoothOrigin"===f){Xc(this,g,"smooth",g.smooth,s);continue}if("force3D"===f){g[f]=s;continue}if("transform"===f){od(this,s,t);continue}}if(d||(o||0===o)&&(u||0===u)&&!Ee.test(s)&&f in b)(c=(a+"").substr((u+"").length))!==(_=(s+"").substr((o+"").length)||(f in N.units?N.units[f]:c))&&(u=Zc(t,f,a,_)),this._pt=new Qt(this._pt,d?g:b,f,u,p?p*o:o-u,"px"!==_||!1===e.autoRound||d?Ac:Dc),this._pt.u=_||0,c!==_&&(this._pt.b=a,this._pt.r=Cc);else if(f in b)_c.call(this,t,f,a,s);else{if(!(f in t)){J("Invalid "+f+" tween "+s+". Missing a plugin? gsap.registerPlugin()");continue}this.add(t,f,t[f],s,n,i)}w.push(f)}y&&qt(this)},get:$c,aliases:Fe,getSetter:function getSetter(t,e,r){return e in Ce&&(t._gsap.x||$c(t,"x"))?r&&re===r?"scale"===e?Ic:Hc:(re=r||{})&&("scale"===e?Jc:Kc):t.style&&!q(t.style[e])?Gc:Nt(t,e)}};Zt.utils.checkPrefix=Qc,se=$((ie="x,y,z,scale,scaleX,scaleY,xPercent,yPercent")+","+(ae="rotation,rotationX,rotationY,skewX,skewY")+",transform,transformOrigin,svgOrigin,force3D,smoothOrigin,transformPerspective",function(t){Ce[t]=1}),$(ae,function(t){N.units[t]="deg",Ue[t]=1}),Fe[se[13]]=ie+","+ae,$("0:translateX,1:translateY,2:translateZ,8:rotate,8:rotationZ,9:rotateX,10:rotateY",function(t){var e=t.split(":");Fe[e[1]]=se[e[0]]}),$("x,y,z,top,right,bottom,left,width,height,fontSize,padding,margin,perspective",function(t){N.units[t]="px"}),Zt.registerPlugin(We),Zt.registerPlugin(We),e.Back=ye,e.Bounce=be,e.CSSPlugin=We,e.Circ=ke,e.Cubic=pe,e.Elastic=ve,e.Expo=xe,e.Linear=ce,e.Power0=oe,e.Power1=ue,e.Power2=he,e.Power3=le,e.Power4=fe,e.Quad=_e,e.Quart=de,e.Quint=me,e.Sine=Te,e.SteppedEase=we,e.Strong=ge,e.TimelineLite=St,e.TimelineMax=St,e.TweenLite=Bt,e.TweenMax=Bt,e.default=Zt,e.gsap=Zt,Object.defineProperty(e,"__esModule",{value:!0})}); | ||
*/function n(t){return"string"==typeof t}function o(t){return"function"==typeof t}function p(t){return"number"==typeof t}function q(t){return void 0===t}function r(t){return"object"==typeof t}function s(t){return!1!==t}function t(){return"undefined"!=typeof window}function u(t){return o(t)||n(t)}function J(t){return(l=dt(t,at))&&ee}function K(t,e){return!e&&"undefined"!=typeof console&&console.warn(t)}function L(t,e){return t&&(at[t]=e)&&l&&(l[t]=e)||at}function M(){return 0}function V(t){var e,n,i=t[0];if(!r(i)&&!o(i))return G(t)?t:[t];if(!(e=(i._gsap||{}).harness)){for(n=ct.length;n--&&!ct[n].targetTest(i););e=ct[n]}for(n=t.length;n--;)t[n]._gsap||(t[n]._gsap=new Ft(t[n],e));return t}function W(t){return t._gsap||V(vt(t))[0]._gsap}function X(t,e){var r=t[e];return o(r)?t[e]():q(r)&&t.getAttribute(e)||r}function Y(t,e){return(t=t.split(",")).forEach(e)||t}function Z(t){return Math.round(1e4*t)/1e4}function $(t,e){for(var r=e.length,n=0;t.indexOf(e[n])<0&&++n<r;);return n<r}function _(t,e,r){var n,i=p(t[1]),a=(i?2:1)+(e<2?0:1),o=t[a];return i&&(o.duration=t[1]),1===e?(o.runBackwards=1,o.immediateRender=s(o.immediateRender)):2===e&&(n=t[a-1],o.startAt=n,o.immediateRender=s(o.immediateRender)),o.parent=r,o}function aa(){var t,e,r=ot.length,n=ot.slice(0);for(ut={},t=ot.length=0;t<r;t++)(e=n[t])&&e._lazy&&(e.render(e._lazy[0],e._lazy[1],!0)._lazy=0)}function ba(t,e,r,n){ot.length&&aa(),t.render(e,r,n),ot.length&&aa()}function ca(t){var e=parseFloat(t);return e||0===e?e:t}function da(t){return t}function ea(t,e){for(var r in e)r in t||(t[r]=e[r]);return t}function fa(t,e){for(var r in e)r in t||"duration"===r||"ease"===r||(t[r]=e[r])}function ha(t,e){for(var n in e)t[n]=r(e[n])?ha(t[n]||(t[n]={}),e[n]):e[n];return t}function ia(t,e){var r,n={};for(r in t)r in e||(n[r]=t[r]);return n}function ma(t,e,r,n){void 0===r&&(r="_first"),void 0===n&&(n="_last");var i=e._prev,a=e._next;i?i._next=a:t[r]===e&&(t[r]=a),a?a._prev=i:t[n]===e&&(t[n]=i),e._dp=t,e._next=e._prev=e.parent=null}function na(t,e){!t.parent||e&&!t.parent.autoRemoveChildren||t.parent.remove(t),t._act=0}function oa(t){for(var e=t;e;)e._dirty=1,e=e.parent;return t}function ra(t){var e;return t._repeat?(e=t.duration()+t._rDelay)*~~(t._tTime/e):0}function sa(t,e){return 0<e._ts?(t-e._start)*e._ts:(e._dirty?e.totalDuration():e._tDur)+(t-e._start)*e._ts}function ta(t,e,r){if(e.parent&&na(e),e._start=r+e._delay,e._end=e._start+(e.totalDuration()/e._ts||0),function _addLinkedListItem(t,e,r,n,i){void 0===r&&(r="_first"),void 0===n&&(n="_last");var a,s=t[n];if(i)for(a=e[i];s&&s[i]>a;)s=s._prev;s?(e._next=s._next,s._next=e):(e._next=t[r],t[r]=e),e._next?e._next._prev=e:t[n]=e,e._prev=s,e.parent=t}(t,e,"_first","_last",t._sort?"_start":0),(t._recent=e)._time||!e._dur&&e._initted){var n=(t.rawTime()-e._start)*e._ts;(!e._dur||mt(0,e.totalDuration(),n)-e._tTime>z)&&e.render(n,!0)}if(oa(t),t._dp&&t._time>=t._dur&&t._ts&&t._dur<t.duration())for(var i=t;i._dp;)i.totalTime(i._tTime,!0),i=i._dp;return t}function ua(t,e,r,n){return It(t,e),t._initted?!r&&t._pt&&t.vars.lazy?(ot.push(t),t._lazy=[e,n],1):void 0:1}function xa(t){if(t instanceof Et)return oa(t);var e=t._repeat;return t._tDur=e?e<0?1e20:Z(t._dur*(e+1)+t._rDelay*e):t._dur,oa(t.parent),t}function za(t,e){var r,i,a=t.labels,s=t._recent||_t,o=t.duration()>=D?s.endTime(!1):t._dur;return n(e)&&(isNaN(e)||e in a)?"<"===(r=e.charAt(0))||">"===r?("<"===r?s._start:s.endTime(0<=s._repeat))+(parseFloat(e.substr(1))||0):(r=e.indexOf("="))<0?(e in a||(a[e]=o),a[e]):(i=+(e.charAt(r-1)+e.substr(r+1)),1<r?za(t,e.substr(0,r-1))+i:o+i):null==e?o:+e}function Aa(t,e){return t||0===t?e(t):e}function Ca(t){return(t+"").substr((parseFloat(t)+"").length)}function Fa(t){return r(t)&&"length"in t&&t.length-1 in t&&r(t[0])&&t!==i}function Ia(t){if(o(t))return t;var d=r(t)?t:{each:t},_=Dt(d.ease),m=d.from||0,g=parseFloat(d.base)||0,v={},e=0<m&&m<1,y=isNaN(m)||e,b=d.axis,w=m,T=m;return n(m)?w=T={center:.5,edges:.5,end:1}[m]||0:!e&&y&&(w=m[0],T=m[1]),function(t,e,r){var n,i,a,s,o,u,h,l,f,c=(r||d).length,p=v[c];if(!p){if(!(f="auto"===d.grid?0:(d.grid||[1,D])[1])){for(h=-D;h<(h=r[f++].getBoundingClientRect().left)&&f<c;);f--}for(p=v[c]=[],n=y?Math.min(f,c)*w-.5:m%f,i=y?c*T/f-.5:m/f|0,l=D,u=h=0;u<c;u++)a=u%f-n,s=i-(u/f|0),p[u]=o=b?Math.abs("y"===b?s:a):U(a*a+s*s),h<o&&(h=o),o<l&&(l=o);p.max=h-l,p.min=l,p.v=c=(parseFloat(d.amount)||parseFloat(d.each)*(c<f?c-1:b?"y"===b?c/f:f:Math.max(f,c/f))||0)*("edges"===m?-1:1),p.b=c<0?g-c:g,p.u=Ca(d.amount||d.each)||0,_=_&&c<0?St(_):_}return c=(p[t]-p.min)/p.max||0,Z(p.b+(_?_(c):c)*p.v)+p.u}}function Ja(e){var r=e<1?Math.pow(10,(e+"").length-2):1;return function(t){return~~(Math.round(parseFloat(t)/e)*e*r)/r+(p(t)?0:Ca(t))}}function Ka(u,t){var h,l,e=G(u);return!e&&r(u)&&(h=e=u.radius||D,u=vt(u.values),(l=!p(u[0]))&&(h*=h)),Aa(t,e?function(t){for(var e,r,n=parseFloat(l?t.x:t),i=parseFloat(l?t.y:0),a=D,s=0,o=u.length;o--;)(e=l?(e=u[o].x-n)*e+(r=u[o].y-i)*r:Math.abs(u[o]-n))<a&&(a=e,s=o);return s=!h||a<=h?u[s]:t,l||s===t||p(t)?s:s+Ca(t)}:Ja(u))}function La(t,e,r,n){return Aa(G(t)?!e:!n,function(){return G(t)?t[~~(Math.random()*t.length)]:(r=r||1e-5)&&(n=r<1?Math.pow(10,(r+"").length-2):1)&&~~(Math.round((t+Math.random()*(e-t))/r)*r*n)/n})}function Pa(e,r,t){return Aa(t,function(t){return e[~~r(t)]})}function Sa(t){for(var e,r,n,i,a=0,s="";~(e=t.indexOf("random(",a));)n=t.indexOf(")",e),i="["===t.charAt(e+7),r=t.substr(e+7,n-e-7).match(i?it:H),s+=t.substr(a,e-a)+La(i?r:+r[0],+r[1],+r[2]||1e-5),a=n+1;return s+t.substr(a,t.length-a)}function Va(t,e,r){var n,i,a,s=t.labels,o=D;for(n in s)(i=s[n]-e)<0==!!r&&i&&o>(i=Math.abs(i))&&(a=n,o=i);return a}function Xa(t){return na(t),t.progress()<1&&bt(t,"onInterrupt"),t}function ab(t,e,r){return(6*(t=t<0?t+1:1<t?t-1:t)<1?e+(r-e)*t*6:t<.5?r:3*t<2?e+(r-e)*(2/3-t)*6:e)*wt+.5|0}function bb(t,e){var r,n,i,a,s,o,u,h,l,f,c=t?p(t)?[t>>16,t>>8&wt,t&wt]:0:Tt.black;if(!c){if(","===t.substr(-1)&&(t=t.substr(0,t.length-1)),Tt[t])c=Tt[t];else if("#"===t.charAt(0))4===t.length&&(t="#"+(r=t.charAt(1))+r+(n=t.charAt(2))+n+(i=t.charAt(3))+i),c=[(t=parseInt(t.substr(1),16))>>16,t>>8&wt,t&wt];else if("hsl"===t.substr(0,3))if(c=f=t.match(H),e){if(~t.indexOf("="))return t.match(tt)}else a=+c[0]%360/360,s=+c[1]/100,r=2*(o=+c[2]/100)-(n=o<=.5?o*(s+1):o+s-o*s),3<c.length&&(c[3]*=1),c[0]=ab(a+1/3,r,n),c[1]=ab(a,r,n),c[2]=ab(a-1/3,r,n);else c=t.match(H)||Tt.transparent;c=c.map(Number)}return e&&!f&&(r=c[0]/wt,n=c[1]/wt,i=c[2]/wt,o=((u=Math.max(r,n,i))+(h=Math.min(r,n,i)))/2,u===h?a=s=0:(l=u-h,s=.5<o?l/(2-u-h):l/(u+h),a=u===r?(n-i)/l+(n<i?6:0):u===n?(i-r)/l+2:(r-n)/l+4,a*=60),c[0]=a+.5|0,c[1]=100*s+.5|0,c[2]=100*o+.5|0),c}function cb(t,e){var r,n,i,a=(t+"").match(xt),s=0,o="";if(!a)return t;for(r=0;r<a.length;r++)n=a[r],s+=(i=t.substr(s,t.indexOf(n,s)-s)).length+n.length,3===(n=bb(n,e)).length&&n.push(1),o+=i+(e?"hsla("+n[0]+","+n[1]+"%,"+n[2]+"%,"+n[3]:"rgba("+n.join(","))+")";return o+t.substr(s)}function fb(t){var e,r=t.join(" ");xt.lastIndex=0,xt.test(r)&&(e=kt.test(r),t[0]=cb(t[0],e),t[1]=cb(t[1],e))}function nb(t){var e=(t+"").split("("),r=Ct[e[0]];return r&&1<e.length&&r.config?r.config.apply(null,~t.indexOf("{")?[function _parseObjectInString(t){for(var e,r,n,i={},a=t.substr(1,t.length-3).split(":"),s=a[0],o=1,u=a.length;o<u;o++)r=a[o],e=o!==u-1?r.lastIndexOf(","):r.length,n=r.substr(0,e),i[s]=isNaN(n)?n.replace(At,"").trim():+n,s=r.substr(e+1).trim();return i}(e[1])]:rt.exec(t)[1].split(",").map(ca)):Ct._CE&&Pt.test(t)?Ct._CE("",t):r}function pb(t,e){for(var r,n=t._first;n;)n instanceof Et?pb(n,e):!n.vars.yoyoEase||n._yoyo&&n._repeat||n._yoyo===e||(n.timeline?pb(n.timeline,e):(r=n._ease,n._ease=n._yEase,n._yEase=r,n._yoyo=e)),n=n._next}function rb(t,e,r,n){void 0===r&&(r=function easeOut(t){return 1-e(1-t)}),void 0===n&&(n=function easeInOut(t){return t<.5?e(2*t)/2:1-e(2*(1-t))/2});var i,a={easeIn:e,easeOut:r,easeInOut:n};return Y(t,function(t){for(var e in Ct[t]=at[t]=a,Ct[i=t.toLowerCase()]=r,a)Ct[i+("easeIn"===e?".in":"easeOut"===e?".out":".inOut")]=Ct[t+"."+e]=a[e]}),a}function sb(e){return function(t){return t<.5?(1-e(1-2*t))/2:.5+e(2*(t-.5))/2}}function tb(r,t,e){function sk(t){return 1===t?1:n*Math.pow(2,-10*t)*Q((t-a)*i)+1}var n=1<=t?t:1,i=(e||(r?.3:.45))/(t<1?t:1),a=i/F*(Math.asin(1/n)||0),s="out"===r?sk:"in"===r?function(t){return 1-sk(1-t)}:sb(sk);return i=F/i,s.config=function(t,e){return tb(r,t,e)},s}function ub(e,r){function Ak(t){return--t*t*((r+1)*t+r)+1}void 0===r&&(r=1.70158);var t="out"===e?Ak:"in"===e?function(t){return 1-Ak(1-t)}:sb(Ak);return t.config=function(t){return ub(e,t)},t}var R,i,a,h,l,f,d,c,m,g,v,y,b,w,T,x,k,O,C,P,A,S,N={autoSleep:120,force3D:"auto",nullTargetWarn:1,units:{lineHeight:""}},E={duration:.5,overwrite:!1,delay:0},D=1e8,z=1/D,F=2*Math.PI,B=F/4,I=0,U=Math.sqrt,j=Math.cos,Q=Math.sin,G=Array.isArray,H=/(?:-?\.?\d|\.)+/gi,tt=/[-+=\.]*\d+[\.e\-\+]*\d*[e\-\+]*\d*/gi,et=/[-+=\.]*\d+(?:\.|e-|e)*\d*/gi,rt=/\(([^()]+)\)/i,nt=/[\+-]=-?[\.\d]+/,it=/[#\-+\.]*\b[a-z\d-=+%.]+/gi,at={},st={},ot=[],ut={},ht={},lt={},ft=30,ct=[],pt="onComplete,onUpdate,onStart,onRepeat,onReverseComplete,onInterrupt",dt=function _merge(t,e){for(var r in e)t[r]=e[r];return t},_t={_start:0,endTime:M},mt=function _clamp(t,e,r){return r<t?t:e<r?e:r},gt=[].slice,vt=function toArray(t,e){return!n(t)||e||!a&&Ot()?G(t)?function _flatten(t,r,i){return void 0===i&&(i=[]),t.forEach(function(t){var e;return n(t)&&!r||Fa(t)?(e=i).push.apply(e,vt(t)):i.push(t)})||i}(t,e):Fa(t)?gt.call(t,0):t?[t]:[]:gt.call(h.querySelectorAll(t),0)},yt=function mapRange(e,t,r,n,i){var a=t-e,s=n-r;return Aa(i,function(t){return r+(t-e)/a*s})},bt=function _callback(t,e,r){var n,i,a=t.vars,s=a[e];if(s)return n=a[e+"Params"],i=a.callbackScope||t,r&&ot.length&&aa(),n?s.apply(i,n):s.call(i,t)},wt=255,Tt={aqua:[0,wt,wt],lime:[0,wt,0],silver:[192,192,192],black:[0,0,0],maroon:[128,0,0],teal:[0,128,128],blue:[0,0,wt],navy:[0,0,128],white:[wt,wt,wt],olive:[128,128,0],yellow:[wt,wt,0],orange:[wt,165,0],gray:[128,128,128],purple:[128,0,128],green:[0,128,0],red:[wt,0,0],pink:[wt,192,203],cyan:[0,wt,wt],transparent:[wt,wt,wt,0]},xt=function(){var t,e="(?:\\b(?:(?:rgb|rgba|hsl|hsla)\\(.+?\\))|\\B#(?:[0-9a-f]{3}){1,2}\\b";for(t in Tt)e+="|"+t+"\\b";return new RegExp(e+")","gi")}(),kt=/hsl[a]?\(/,Mt=(b=Date.now,w=500,T=33,x=b(),k=x,C=O=1/60,y={time:0,frame:0,tick:function tick(){uj(!0)},wake:function wake(){f&&(!a&&t()&&(i=a=window,h=i.document||{},at.gsap=ee,(i.gsapVersions||(i.gsapVersions=[])).push(ee.version),J(l||i.GreenSockGlobals||i),v=i.requestAnimationFrame),m&&y.sleep(),g=v||function(t){return setTimeout(t,1e3*(C-y.time)+1|0)},c=1,uj(2))},sleep:function sleep(){(v?i.cancelAnimationFrame:clearTimeout)(m),c=0,g=M},lagSmoothing:function lagSmoothing(t,e){w=t||1e8,T=Math.min(e,w,0)},fps:function fps(t){O=1/(t||60),C=y.time+O},add:function add(t){P.indexOf(t)<0&&P.push(t),Ot()},remove:function remove(t){var e;~(e=P.indexOf(t))&&P.splice(e,1)},_listeners:P=[]}),Ot=function _wake(){return!c&&Mt.wake()},Ct={},Pt=/^[\d.\-M][\d.\-,\s]/,At=/["']/g,St=function _invertEase(e){return function(t){return 1-e(1-t)}},Dt=function _parseEase(t,e){return t&&(o(t)?t:Ct[t]||nb(t))||e};function uj(e){var t,r,n=b()-k,i=!0===e;w<n&&(x+=n-T),k+=n,y.time=(k-x)/1e3,(0<(t=y.time-C)||i)&&(y.frame++,C+=t+(O<=t?.004:O-t),r=1),i||(m=g(uj)),r&&P.forEach(function(t){return t(y.time,n,y.frame,e)})}function Rk(t){return t<S?A*t*t:t<.7272727272727273?A*Math.pow(t-1.5/2.75,2)+.75:t<.9090909090909092?A*(t-=2.25/2.75)*t+.9375:A*Math.pow(t-2.625/2.75,2)+.984375}Y("Linear,Quad,Cubic,Quart,Quint,Strong",function(t,e){var r=e<5?e+1:e;rb(t+",Power"+(r-1),e?function(t){return Math.pow(t,r)}:function(t){return t},function(t){return 1-Math.pow(1-t,r)},function(t){return t<.5?Math.pow(2*t,r)/2:1-Math.pow(2*(1-t),r)/2})}),Ct.Linear.easeNone=Ct.none=Ct.Linear.easeIn,rb("Elastic",tb("in"),tb("out"),tb()),A=7.5625,S=1/2.75,rb("Bounce",function(t){return 1-Rk(1-t)},Rk),rb("Expo",function(t){return t?Math.pow(2,10*(t-1)):0}),rb("Circ",function(t){return-(U(1-t*t)-1)}),rb("Sine",function(t){return 1-j(t*B)}),rb("Back",ub("in"),ub("out"),ub()),Ct.SteppedEase=Ct.steps=at.SteppedEase={config:function config(t,e){void 0===t&&(t=1);var r=1/t,n=t+(e?0:1),i=e?1:0;return function(t){return((n*mt(0,.99999999,t)|0)+i)*r}}},E.ease=Ct["quad.out"];var zt,Ft=function GSCache(t,e){this.id=I++,(t._gsap=this).target=t,this.harness=e,this.get=e?e.get:X,this.set=e?e.getSetter:jt},Rt=((zt=Animation.prototype).delay=function delay(t){return t||0===t?(this._delay=t,this):this._delay},zt.duration=function duration(t){var e=arguments.length,r=this._repeat,n=0<r?r*((e?t:this._dur)+this._rDelay):0;return e?this.totalDuration(r<0?t:t+n):this.totalDuration()&&this._dur},zt.totalDuration=function totalDuration(t){if(!arguments.length)return this._tDur;var e=this._repeat,r=(t||this._rDelay)&&e<0;return this._tDur=r?1e20:t,this._dur=r?t:(t-e*this._rDelay)/(e+1),this._dirty=0,oa(this.parent),this},zt.totalTime=function totalTime(t,e){if(Ot(),!arguments.length)return this._tTime;var r,n=this.parent||this._dp;if(n&&n.smoothChildTiming&&this._ts){for(r=this._start,this._start=n._time-(0<this._ts?t/this._ts:((this._dirty?this.totalDuration():this._tDur)-t)/-this._ts),this._end+=this._start-r,n._dirty||oa(n);n.parent;)n.parent._time!==n._start+(0<n._ts?n._tTime/n._ts:(n.totalDuration()-n._tTime)/-n._ts)&&n.totalTime(n._tTime,!0),n=n.parent;this.parent||ta(this._dp,this,this._start-this._delay)}return this._tTime===t&&this._dur||ba(this,t,e),this},zt.time=function time(t,e){return arguments.length?this.totalTime(t+ra(this),e):this._time},zt.totalProgress=function totalProgress(t,e){return arguments.length?this.totalTime(this.totalDuration()*t,e):this._tTime/this.totalDuration()},zt.progress=function progress(t,e){return arguments.length?this.totalTime(this.duration()*t+ra(this),e):this.duration()?this._time/this._dur:this.ratio},zt.iteration=function iteration(t,e){var r=this.duration()+this._rDelay;return arguments.length?this.totalTime(this._time+(t-1)*r,e):this._repeat?1+~~(this._tTime/r):1},zt.timeScale=function timeScale(t){var e=this._ts;return arguments.length?e?(this._end=this._start+this._tDur/(this._ts=t||z),function _recacheAncestors(t){for(var e=t.parent;e&&e.parent;)e._dirty=1,e.totalDuration(),e=e.parent;return t}(this).totalTime(this._tTime,!0)):(this._pauseTS=t,this):e||this._pauseTS},zt.paused=function paused(t){var e=!this._ts;return arguments.length?(e!==t&&(t?(this._pauseTS=this._ts,this._pTime=this._tTime||Math.max(-this._delay,this.rawTime()),this._ts=this._act=0):(this._ts=this._pauseTS,t=this._tTime||this._pTime,1===this.progress()&&(this._tTime-=z),this.totalTime(t,!0))),this):e},zt.startTime=function startTime(t){return arguments.length?(this.parent&&this.parent._sort&&ta(this.parent,this,t-this._delay),this):this._start},zt.endTime=function endTime(t){return this._start+(s(t)?this.totalDuration():this.duration())/this._ts},zt.rawTime=function rawTime(t){var e=this.parent||this._dp;return e?t&&(!this._ts||this._repeat&&this._time&&this.totalProgress()<1)?this._tTime%(this._dur+this._rDelay):this._ts?sa(e.rawTime(t),this):this._tTime:this._tTime},zt.repeat=function repeat(t){return arguments.length?(this._repeat=t,xa(this)):this._repeat},zt.repeatDelay=function repeatDelay(t){return arguments.length?(this._rDelay=t,xa(this)):this._rDelay},zt.yoyo=function yoyo(t){return arguments.length?(this._yoyo=t,this):this._yoyo},zt.seek=function seek(t,e){return this.totalTime(za(this,t),s(e))},zt.restart=function restart(t,e){return this.play().totalTime(t?-this._delay:0,s(e))},zt.play=function play(t,e){return null!=t&&this.seek(t,e),this.reversed(!1).paused(!1)},zt.reverse=function reverse(t,e){return null!=t&&this.seek(t||this.totalDuration(),e),this.reversed(!0).paused(!1)},zt.pause=function pause(t,e){return null!=t&&this.seek(t,e),this.paused(!0)},zt.resume=function resume(){return this.paused(!1)},zt.reversed=function reversed(t){var e=this._ts||this._pauseTS;return arguments.length?(t!==this.reversed()&&(this[this._ts?"_ts":"_pauseTS"]=Math.abs(e)*(t?-1:1),this.totalTime(this._tTime,!0)),this):e<0},zt.invalidate=function invalidate(){return this._initted=0,this},zt.isActive=function isActive(){var t,e=this.parent||this._dp,r=this._start;return!e||this._ts&&this._initted&&e.isActive()&&(t=e.rawTime(!0))>=r&&t<this.endTime(!0)-z},zt.eventCallback=function eventCallback(t,e,r){var n=this.vars;return 1<arguments.length?(e?(n[t]=e,r&&(n[t+"Params"]=r),"onUpdate"===t&&(this._onUpdate=e)):delete n[t],this):n[t]},zt.then=function then(e){var r=this;return void 0===e&&(e=M),new Promise(function(t){r._prom=function(){e(r),t()}})},zt.kill=function kill(){Xa(this)},Animation);function Animation(t,e){var r=t.parent||R;this.vars=t,this._dur=this._tDur=+t.duration||0,this._delay=+t.delay||0,(this._repeat=t.repeat||0)&&(this._rDelay=t.repeatDelay||0,this._yoyo=!!t.yoyo||!!t.yoyoEase,xa(this)),this._ts=1,this.data=t.data,c||Mt.wake(),r&&ta(r,this,e||0===e?e:r._time),t.reversed&&this.reversed(!0),t.paused&&this.paused(!0)}ea(Rt.prototype,{_time:0,_start:0,_end:0,_tTime:0,_tDur:0,_dirty:0,_repeat:0,_yoyo:!1,parent:0,_rDelay:0,_ts:1,_dp:0,ratio:0,_zTime:-z,_prom:0});var Et=function(i){function Timeline(t,e){var r;return void 0===t&&(t={}),(r=i.call(this,t,e)||this).labels={},r.smoothChildTiming=s(t.smoothChildTiming),r.autoRemoveChildren=!!t.autoRemoveChildren,r._sort=s(t.sortChildren),r}_inheritsLoose(Timeline,i);var t=Timeline.prototype;return t.to=function to(t,e,r,n){return new Nt(t,_(arguments,0,this),za(this,p(e)?n:r)),this},t.from=function from(t,e,r,n){return new Nt(t,_(arguments,1,this),za(this,p(e)?n:r)),this},t.fromTo=function fromTo(t,e,r,n,i){return new Nt(t,_(arguments,2,this),za(this,p(e)?i:n)),this},t.set=function set(t,e,r){return e.duration=0,e.parent=this,e.repeatDelay||(e.repeat=0),e.immediateRender=!!e.immediateRender,new Nt(t,e,za(this,r)),this},t.call=function call(t,e,r){return ta(this,Nt.delayedCall(0,t,e),za(this,r))},t.staggerTo=function staggerTo(t,e,r,n,i,a,s){return r.duration=e,r.stagger=r.stagger||n,r.onComplete=a,r.onCompleteParams=s,r.parent=this,new Nt(t,r,za(this,i)),this},t.staggerFrom=function staggerFrom(t,e,r,n,i,a,o){return r.runBackwards=1,r.immediateRender=s(r.immediateRender),this.staggerTo(t,e,r,n,i,a,o)},t.staggerFromTo=function staggerFromTo(t,e,r,n,i,a,o,u){return n.startAt=r,n.immediateRender=s(n.immediateRender),this.staggerTo(t,e,n,i,a,o,u)},t.render=function render(t,e,r){var n,i,a,s,o,u,h,l,f,c,p,d,_=this._time,m=this._dirty?this.totalDuration():this._tDur,g=this._dur,v=m-z<t&&0<=t&&this!==R?m:t<z?0:t,y=this._zTime<0!=t<0&&this._initted;if(v!==this._tTime||r||y){if(y&&(g||(_=this._zTime),!t&&e||(this._zTime=t)),n=v,f=this._start,u=0===(l=this._ts),_!==this._time&&g&&(n+=this._time-_),this._repeat&&(p=this._yoyo,o=g+this._rDelay,(g<(n=Z(v%o))||m===v)&&(n=g),(s=~~(v/o))&&s===v/o&&(n=g,s--),(c=~~(this._tTime/o))&&c===this._tTime/o&&c--,p&&1&s&&(n=g-n,d=1),s!==c&&!this._lock)){var b=p&&1&c,w=b===(p&&1&s);if(s<c&&(b=!b),_=b?0:g,this._lock=1,this.render(_,e,!g)._lock=0,!e&&this.parent&&bt(this,"onRepeat"),_!==this._time||u!=!this._ts)return this;if(w&&(this._lock=2,_=b?g+1e-4:-1e-4,this.render(_,!0)),this._lock=0,!this._ts&&!u)return this;pb(this,d)}if(this._hasPause&&!this._forcing&&this._lock<2&&(h=function _findNextPauseTween(t,e,r){var n;if(e<r)for(n=t._first;n&&n._start<=r;){if(!n._dur&&"isPause"===n.data&&n._start>e)return n;n=n._next}else for(n=t._last;n&&n._start>=r;){if(!n._dur&&"isPause"===n.data&&n._start<e)return n;n=n._prev}}(this,Z(_),Z(n)))&&(v-=n-(n=h._start)),this._tTime=v,this._time=n,this._act=!l,this._initted||(this._onUpdate=this.vars.onUpdate,this._initted=1),_||!n||e||bt(this,"onStart"),_<=n&&0<=t)for(i=this._first;i;){if(a=i._next,(i._act||n>=i._start)&&i._ts&&h!==i){if(i.parent!==this)return this.render(t,e,r);if(i.render(0<i._ts?(n-i._start)*i._ts:(i._dirty?i.totalDuration():i._tDur)+(n-i._start)*i._ts,e,r),n!==this._time||!this._ts&&!u){h=0;break}}i=a}else{i=this._last;for(var T=t<0?t:n;i;){if(a=i._prev,(i._act||T<=i._end)&&i._ts&&h!==i){if(i.parent!==this)return this.render(t,e,r);if(i.render(0<i._ts?(T-i._start)*i._ts:(i._dirty?i.totalDuration():i._tDur)+(T-i._start)*i._ts,e,r),n!==this._time||!this._ts&&!u){h=0;break}}i=a}}if(h&&!e&&(this.pause(),h.render(_<=n?0:-z)._zTime=_<=n?1:-1,this._ts))return this._start=f,this.render(t,e,r);this._onUpdate&&!e&&bt(this,"onUpdate",!0),(v===m||!v&&this._ts<0)&&(f!==this._start&&Math.abs(l)===Math.abs(this._ts)||(!n||m>=this.totalDuration())&&(!t&&g||na(this,1),e||t<0&&!_||(bt(this,v===m?"onComplete":"onReverseComplete",!0),this._prom&&v===m&&this._prom())))}return this},t.add=function add(t,e){var r=this;if(p(e)||(e=za(this,e)),!(t instanceof Rt)){if(G(t))return t.forEach(function(t){return r.add(t,e)}),oa(this);if(n(t))return this.addLabel(t,e);if(!o(t))return this;t=Nt.delayedCall(0,t)}return this!==t?ta(this,t,e):this},t.getChildren=function getChildren(t,e,r,n){void 0===t&&(t=!0),void 0===e&&(e=!0),void 0===r&&(r=!0),void 0===n&&(n=-D);for(var i=[],a=this._first;a;)a._start>=n&&(a instanceof Nt?e&&i.push(a):(r&&i.push(a),t&&i.push.apply(i,a.getChildren(!0,e,r)))),a=a._next;return i},t.getById=function getById(t){for(var e=this.getChildren(1,1,1),r=e.length;r--;)if(e[r].vars.id===t)return e[r]},t.remove=function remove(t){return n(t)?this.removeLabel(t):o(t)?this.killTweensOf(t):(ma(this,t),t===this._recent&&(this._recent=this._last),oa(this))},t.totalTime=function totalTime(t,e){return arguments.length?(this._forcing=1,this.parent||this._dp||!this._ts||(this._start=Mt.time-(0<this._ts?t/this._ts:(this.totalDuration()-t)/-this._ts)),i.prototype.totalTime.call(this,t,e),this._forcing=0,this):this._tTime},t.addLabel=function addLabel(t,e){return this.labels[t]=za(this,e),this},t.removeLabel=function removeLabel(t){return delete this.labels[t],this},t.addPause=function addPause(t,e,r){var n=Nt.delayedCall(0,e||M,r);return n.data="isPause",this._hasPause=1,ta(this,n,za(this,t))},t.removePause=function removePause(t){var e=this._first;for(t=za(this,t);e;)e._start===t&&"isPause"===e.data&&na(e),e=e._next},t.killTweensOf=function killTweensOf(t,e,r){for(var n=this.getTweensOf(t,r),i=n.length;i--;)n[i].kill(t,e);return this},t.getTweensOf=function getTweensOf(t,e){for(var r,n=[],i=vt(t),a=this._first;a;)a instanceof Nt?!$(a._targets,i)||e&&!a.isActive()||n.push(a):(r=a.getTweensOf(i,e)).length&&n.push.apply(n,r),a=a._next;return n},t.tweenTo=function tweenTo(t,e){var r=this,n=za(r,t),i=e&&e.startAt,a=Nt.to(r,ea({ease:"none",lazy:!1,time:n,duration:Math.abs(n-(i&&"time"in i?i.time:r._time))/r.timeScale()||z,onStart:function onStart(){r.pause();var t=Math.abs(n-r._time)/r.timeScale();a._dur!==t&&(a._dur=t,a.render(a._time,!0,!0)),e&&e.onStart&&e.onStart.apply(a,e.onStartParams||[])}},e));return a},t.tweenFromTo=function tweenFromTo(t,e,r){return this.tweenTo(e,ea({startAt:{time:za(this,t)}},r))},t.recent=function recent(){return this._recent},t.nextLabel=function nextLabel(t){return void 0===t&&(t=this._time),Va(this,za(this,t))},t.previousLabel=function previousLabel(t){return void 0===t&&(t=this._time),Va(this,za(this,t),1)},t.currentLabel=function currentLabel(t){return arguments.length?this.seek(t,!0):this.previousLabel(this._time+z)},t.shiftChildren=function shiftChildren(t,e,r){void 0===r&&(r=0);for(var n,i=this._first,a=this.labels;i;)i._start>=r&&(i._start+=t),i=i._next;if(e)for(n in a)a[n]>=r&&(a[n]+=t);return oa(this)},t.invalidate=function invalidate(){var t=this._first;for(this._lock=0;t;)t.invalidate(),t=t._next;return i.prototype.invalidate.call(this)},t.clear=function clear(t){void 0===t&&(t=!0);for(var e,r=this._first;r;)e=r._next,this.remove(r),r=e;return this._time=this._tTime=0,t&&(this.labels={}),oa(this)},t.totalDuration=function totalDuration(t){var e,r,n=0,i=this,a=i._last,s=D,o=i._repeat,u=o*i._rDelay||0,h=o<0;if(arguments.length)return h?i:i.timeScale(i.totalDuration()/t);if(i._dirty){for(;a;)e=a._prev,a._dirty&&a.totalDuration(),a._start>s&&i._sort&&a._ts&&!i._lock?(i._lock=1,ta(i,a,a._start-a._delay),i._lock=0):s=a._start,a._start<0&&a._ts&&(n-=a._start,(!i.parent&&!i._dp||i.parent&&i.parent.smoothChildTiming)&&(i._start+=a._start/i._ts,i._time-=a._start,i._tTime-=a._start),i.shiftChildren(-a._start,!1,-D),s=0),n<(r=a._end=a._start+a._tDur/Math.abs(a._ts||a._pauseTS))&&a._ts&&(n=Z(r)),a=e;i._dur=i===R&&i._time>n?i._time:Math.min(D,n),i._tDur=h&&(i._dur||u)?1e20:Math.min(D,n*(o+1)+u),i._end=i._start+(i._tDur/Math.abs(i._ts||i._pauseTS)||0),i._dirty=0}return i._tDur},Timeline.updateRoot=function updateRoot(t){if(R._ts&&ba(R,sa(t,R)),Mt.frame>=ft){ft+=N.autoSleep||120;var e=R._first;if((!e||!e._ts)&&N.autoSleep&&Mt._listeners.length<2){for(;e&&!e._ts;)e=e._next;e||Mt.sleep()}}},Timeline}(Rt);ea(Et.prototype,{_lock:0,_hasPause:0,_forcing:0});function Bb(t,e,i,a,s,u){var h,l,f,c;if(ht[t]&&!1!==(h=new ht[t]).init(s,h.rawVars?e[t]:function _processVars(t,e,i,a,s){if(o(t)&&(t=Zt(t,s,e,i,a)),!r(t)||t.style&&t.nodeType||G(t))return n(t)?Zt(t,s,e,i,a):t;var u,h={};for(u in t)h[u]=Zt(t[u],s,e,i,a);return h}(e[t],a,s,u,i),i,a,u)&&(i._pt=l=new te(i._pt,s,t,0,1,h.render,h,0,h.priority),i!==d))for(f=i._ptLookup[i._targets.indexOf(s)],c=h._props.length;c--;)f[h._props[c]]=l;return h}var Bt,Lt=function _addPropTween(t,e,r,i,a,s,u,h,l){o(i)&&(i=i(a||0,t,s));var f,c=t[e],p="get"!==r?r:o(c)?l?t[e.indexOf("set")||!o(t["get"+e.substr(3)])?e:"get"+e.substr(3)](l):t[e]():c,d=o(c)?l?qt:Vt:Ut;if(n(i)&&(~i.indexOf("random(")&&(i=Sa(i)),"="===i.charAt(1)&&(i=parseFloat(p)+parseFloat(i.substr(2))*("-"===i.charAt(0)?-1:1)+Ca(p))),p!==i)return isNaN(p+i)?function _addComplexStringPropTween(t,e,r,n,i,a,s){var o,u,h,l,f,c,p,d,_=new te(this._pt,t,e,0,1,Gt,null,i),m=0,g=0;for(_.b=r,_.e=n,r+="",(p=~(n+="").indexOf("random("))&&(n=Sa(n)),a&&(a(d=[r,n],t,e),r=d[0],n=d[1]),u=r.match(et)||[];o=et.exec(n);)l=o[0],f=n.substring(m,o.index),h?h=(h+1)%5:"rgba("===f.substr(-5)&&(h=1),l!==u[g++]&&(c=parseFloat(u[g-1]),_._pt={_next:_._pt,p:f||1===g?f:",",s:c,c:"="===l.charAt(1)?parseFloat(l.substr(2))*("-"===l.charAt(0)?-1:1):parseFloat(l)-c,m:h&&h<4?Math.round:0},m=et.lastIndex);return _.c=m<n.length?n.substring(m,n.length):"",_.fp=s,(nt.test(n)||p)&&(_.e=0),this._pt=_}.call(this,t,e,p,i,d,h||N.stringFilter,l):(f=new te(this._pt,t,e,+p||0,i-(p||0),"boolean"==typeof c?Qt:Wt,0,d),l&&(f.fp=l),u&&f.modifier(u,this,t),this._pt=f)},It=function _initTween(t,e){var r,n,i,a,o,u,h,l,f,c,p,d,_=t.vars,m=_.ease,g=_.startAt,v=_.immediateRender,y=_.lazy,b=_.onUpdate,w=_.onUpdateParams,T=_.callbackScope,x=_.runBackwards,k=_.yoyoEase,M=_.keyframes,O=_.autoRevert,C=t._dur,P=t._startAt,A=t._targets,S=t.parent,D=S&&"nested"===S.data?S.parent._targets:A,z="auto"===t._overwrite,F=t.timeline;if(!F||M&&m||(m="none"),t._ease=Dt(m,E.ease),t._yEase=k?St(Dt(!0===k?m:k,E.ease)):0,k&&t._yoyo&&!t._repeat&&(k=t._yEase,t._yEase=t._ease,t._ease=k),!F){if(P&&P.render(-1,!0).kill(),g){if(na(t._startAt=Nt.set(A,ea({data:"isStart",overwrite:!1,parent:S,immediateRender:!0,lazy:s(y),startAt:null,delay:0,onUpdate:b,onUpdateParams:w,callbackScope:T,stagger:0},g))),v)if(0<e)O||(t._startAt=0);else if(C)return}else if(x&&C)if(P)O||(t._startAt=0);else if(e&&(v=!1),na(t._startAt=Nt.set(A,dt(ia(_,st),{overwrite:!1,data:"isFromStart",lazy:v&&s(y),immediateRender:v,stagger:0,parent:S}))),v){if(!e)return}else _initTween(t._startAt,e),v&&(O||(t._startAt=0));for(r=ia(_,st),d=(l=A[t._pt=0]?W(A[0]).harness:0)&&_[l.prop],n=0;n<A.length;n++){if(h=(o=A[n])._gsap||V(A)[n]._gsap,t._ptLookup[n]=c={},ut[h.id]&&aa(),p=D===A?n:D.indexOf(o),l&&!1!==(f=new l).init(o,d||r,t,p,D)&&(t._pt=a=new te(t._pt,o,f.name,0,1,f.render,f,0,f.priority),f._props.forEach(function(t){c[t]=a}),f.priority&&(u=1)),!l||d)for(i in r)ht[i]&&(f=Bb(i,r,t,p,o,D))?f.priority&&(u=1):c[i]=a=Lt.call(t,o,i,"get",r[i],p,D,0,_.stringFilter);t._op&&t._op[n]&&t.kill(o,t._op[n]),z&&(Bt=t,R.killTweensOf(o,c,!0),Bt=0),t._pt&&(s(y)&&C||y&&!C)&&(ut[h.id]=1)}u&&Ht(t),t._onInit&&t._onInit(t)}t._from=!F&&!!_.runBackwards,t._onUpdate=b,t._initted=1},Zt=function _parseFuncOrString(t,e,r,i,a){return o(t)?t.call(e,r,i,a):n(t)&&~t.indexOf("random(")?Sa(t):t},Yt=pt+",repeat,repeatDelay,yoyo,yoyoEase",Xt=(Yt+",id,stagger,delay,duration").split(","),Nt=function(k){function Tween(t,e,n){var i;"number"==typeof e&&(n.duration=e,e=n,n=null);var a,o,h,l,f,c,p,d,_=(i=k.call(this,function _inheritDefaults(t){var e=t.parent||R,r=t.keyframes?fa:ea;if(s(t.inherit))for(;e;)r(t,e.vars.defaults),e=e.parent;return t}(e),n)||this).vars,m=_.duration,g=_.delay,v=_.immediateRender,y=_.stagger,b=_.overwrite,w=_.keyframes,T=_.defaults,x=vt(t);if(i._targets=x.length?V(x):K("GSAP target "+t+" not found. https://greensock.com",!N.nullTargetWarn)||[{}],i._ptLookup=[],i._overwrite=b,w||y||u(m)||u(g)){if(e=i.vars,(a=i.timeline=new Et({data:"nested",defaults:T||{}})).kill(),a.parent=_assertThisInitialized(i),w)ea(a.vars.defaults,{ease:"none"}),w.forEach(function(t){return a.to(x,t,">")});else{if(l=x.length,p=y?Ia(y):M,r(y))for(f in y)~Yt.indexOf(f)&&((d=d||{})[f]=y[f]);for(o=0;o<l;o++){for(f in h={},e)Xt.indexOf(f)<0&&(h[f]=e[f]);h.stagger=0,d&&dt(h,d),e.yoyoEase&&!e.repeat&&(h.yoyoEase=e.yoyoEase),c=x[o],h.duration=+Zt(m,_assertThisInitialized(i),o,c,x),h.delay=(+Zt(g,_assertThisInitialized(i),o,c,x)||0)-i._delay,!y&&1===l&&h.delay&&(i._delay=g=h.delay,i._start+=g,h.delay=0),a.to(c,h,p(o,c,x))}m=g=0}m||i.duration(m=a.duration())}else i.timeline=0;return!0===b&&(Bt=_assertThisInitialized(i),R.killTweensOf(x),Bt=0),(v||!m&&!w&&i._start===i.parent._time&&s(v)&&function _hasNoPausedAncestors(t){return!t||t._ts&&_hasNoPausedAncestors(t.parent)}(_assertThisInitialized(i))&&"nested"!==i.parent.data)&&(i._tTime=-z,i.render(Math.max(0,-g))),i}_inheritsLoose(Tween,k);var t=Tween.prototype;return t.render=function render(t,e,r){var n,i,a,o,u,h,l,f,c,p=this._time,d=this._tDur,_=this._dur,m=d-z<t&&0<=t?d:t<z?0:t;if(_){if(m!==this._tTime||r||this._initted&&this._zTime<0!=t<0&&(this._zTime=t,1)){if(n=m,f=this.timeline,this._repeat){if(o=_+this._rDelay,_<(n=Z(m%o))&&(n=_),(a=~~(m/o))&&a===m/o&&(n=_,a--),(h=this._yoyo&&1&a)&&(c=this._yEase,n=_-n),(u=~~(this._tTime/o))&&u===this._tTime/o&&u--,n===p&&!r)return this;a!==u&&(f&&this._yEase&&pb(f,h),this.vars.repeatRefresh&&!this._lock&&(this._lock=1,this.render(o*a,!0).invalidate()._lock=0))}if(!this._initted&&ua(this,n,r,e))return this;for(this._tTime=m,this._time=n,!this._act&&this._ts&&(this._act=1,this._lazy=0),this.ratio=l=(c||this._ease)(n/_),this._from&&(this.ratio=l=1-l),p||!n||e||bt(this,"onStart"),i=this._pt;i;)i.r(l,i.d),i=i._next;f&&f.render(t<0?t:!n&&h?-z:f._dur*l,e,r),this._onUpdate&&!e&&(t<0&&this._startAt&&s(this.vars.autoRevert)&&this._startAt.render(t,!0,r),bt(this,"onUpdate")),this._repeat&&a!==u&&this.vars.onRepeat&&!e&&this.parent&&bt(this,"onRepeat"),m!==d&&m||this._tTime!==m||(t<0&&this._startAt&&!this._onUpdate&&s(this.vars.autoRevert)&&this._startAt.render(t,!0,r),!t&&_||!(m||this._ts<0)||na(this,1),e||t<0&&!p||(bt(this,m===d?"onComplete":"onReverseComplete",!0),this._prom&&m===d&&this._prom()))}}else!function _renderZeroDurationTween(t,e,r,n){var i,a,s,o=t._zTime<0?0:1,u=e<0?0:1,h=t._rDelay,l=0;if(h&&t._repeat&&((a=~~((l=mt(0,t._tDur,e))/h))&&a===l/h&&a--,(s=~~(t._tTime/h))&&s===t._tTime/h&&s--,a!==s&&(o=1-u,t.vars.repeatRefresh&&t.invalidate())),(t._initted||!ua(t,e,n,r))&&(u!==o||n)){for(r&&!e||(t._zTime=e),t.ratio=u,t._from&&(u=1-u),t._time=0,t._tTime=l,r||bt(t,"onStart"),i=t._pt;i;)i.r(u,i.d),i=i._next;!u&&t._startAt&&!t._onUpdate&&t._start&&t._startAt.render(e,!0,n),t._onUpdate&&!r&&bt(t,"onUpdate"),l&&t._repeat&&!r&&t.parent&&bt(t,"onRepeat"),(e>=t._tDur||e<0)&&t.ratio===u&&(t.ratio&&na(t,1),r||(bt(t,t.ratio?"onComplete":"onReverseComplete",!0),t._prom&&t.ratio&&t._prom()))}}(this,t,e,r);return this},t.targets=function targets(){return this._targets},t.invalidate=function invalidate(){return this._pt=this._op=this._startAt=this._onUpdate=this._act=this._lazy=0,this._ptLookup=[],this.timeline&&this.timeline.invalidate(),k.prototype.invalidate.call(this)},t.kill=function kill(t,e){if(void 0===e&&(e="all"),Bt===this)return Bt;if(!(t||e&&"all"!==e)&&this.parent)return this._lazy=0,Xa(this);if(this.timeline)return this.timeline.killTweensOf(t,e),this;var r,i,a,s,o,u,h,l=this._targets,f=t?vt(t):l,c=this._ptLookup,p=this._pt;if((!e||"all"===e)&&function _arraysMatch(t,e){for(var r=t.length,n=r===e.length;n&&r--&&t[r]===e[r];);return r<0}(l,f))return Xa(this);for(r=this._op=this._op||[],"all"!==e&&(n(e)&&(o={},Y(e,function(t){return o[t]=1}),e=o),e=function _addAliasesToVars(t,e){var r,n,i,a,s=t[0]?W(t[0]).harness:0,o=s&&s.aliases;if(!o)return e;for(n in r=dt({},e),o)if(n in r)for(i=(a=o[n].split(",")).length;i--;)r[a[i]]=r[n];return r}(l,e)),h=l.length;h--;)if(~f.indexOf(l[h]))for(o in i=c[h],"all"===e?(r[h]=e,s=i,a={}):(a=r[h]=r[h]||{},s=e),s)(u=i&&i[o])&&("kill"in u.d&&!0!==u.d.kill(o)||(ma(this,u,"_pt"),delete i[o])),"all"!==a&&(a[o]=1);return this._initted&&!this._pt&&p&&Xa(this),this},Tween.to=function to(t,e,r){return new Tween(t,e,r)},Tween.from=function from(t,e){return new Tween(t,_(arguments,1))},Tween.delayedCall=function delayedCall(t,e,r,n){return new Tween(e,0,{immediateRender:!1,lazy:!1,overwrite:!1,delay:t,onComplete:e,onReverseComplete:e,onCompleteParams:r,onReverseCompleteParams:r,callbackScope:n})},Tween.fromTo=function fromTo(t,e,r){return new Tween(t,_(arguments,2))},Tween.set=function set(t,e){return e.duration=0,e.repeatDelay||(e.repeat=0),new Tween(t,e)},Tween.killTweensOf=function killTweensOf(t,e,r){return R.killTweensOf(t,e,r)},Tween}(Rt);ea(Nt.prototype,{_targets:[],_initted:0,_lazy:0,_startAt:0,_op:0,_onInit:0}),Y("staggerTo,staggerFrom,staggerFromTo",function(r){Nt[r]=function(){var t=new Et,e=vt(arguments);return e.splice("staggerFromTo"===r?5:4,0,0),t[r].apply(t,e)}});function Mb(t,e,r){return t.setAttribute(e,r)}function Ub(t,e,r,n){n.mSet(t,e,n.m.call(n.tween,r,n.mt),n)}var Ut=function _setterPlain(t,e,r){return t[e]=r},Vt=function _setterFunc(t,e,r){return t[e](r)},qt=function _setterFuncWithParam(t,e,r,n){return t[e](n.fp,r)},jt=function _getSetter(t,e){return o(t[e])?Vt:q(t[e])&&t.setAttribute?Mb:Ut},Wt=function _renderPlain(t,e){return e.set(e.t,e.p,~~(1e4*(e.s+e.c*t))/1e4,e)},Qt=function _renderBoolean(t,e){return e.set(e.t,e.p,!!(e.s+e.c*t),e)},Gt=function _renderComplexString(t,e){var r=e._pt,n="";if(!t&&e.b)n=e.b;else if(1===t&&e.e)n=e.e;else{for(;r;)n=r.p+(r.m?r.m(r.s+r.c*t):~~(1e4*(r.s+r.c*t))/1e4)+n,r=r._next;n+=e.c}e.set(e.t,e.p,n,e)},Kt=function _renderPropTweens(t,e){for(var r=e._pt;r;)r.r(t,r.d),r=r._next},Jt=function _addPluginModifier(t,e,r,n){for(var i,a=this._pt;a;)i=a._next,a.p===n&&a.modifier(t,e,r),a=i},$t=function _killPropTweensOf(t){for(var e,r,n=this._pt;n;)r=n._next,n.p===t&&!n.op||n.op===t?ma(this,n,"_pt"):n.dep||(e=1),n=r;return!e},Ht=function _sortPropTweensByPriority(t){for(var e,r,n,i,a=t._pt;a;){for(e=a._next,r=n;r&&r.pr>a.pr;)r=r._next;(a._prev=r?r._prev:i)?a._prev._next=a:n=a,(a._next=r)?r._prev=a:i=a,a=e}t._pt=n},te=(PropTween.prototype.modifier=function modifier(t,e,r){this.mSet=this.mSet||this.set,this.set=Ub,this.m=t,this.mt=r,this.tween=e},PropTween);function PropTween(t,e,r,n,i,a,s,o,u){this.t=e,this.s=n,this.c=i,this.p=r,this.r=a||Wt,this.d=s||this,this.set=o||Ut,this.pr=u||0,(this._next=t)&&(t._prev=this)}Y(pt+",parent,duration,ease,delay,overwrite,runBackwards,startAt,yoyo,immediateRender,repeat,repeatDelay,data,paused,reversed,lazy,callbackScope,stringFilter,id,yoyoEase,stagger,inherit,repeatRefresh,keyframes,autoRevert",function(t){st[t]=1,"on"===t.substr(0,2)&&(st[t+"Params"]=1)}),at.TweenMax=at.TweenLite=Nt,at.TimelineLite=at.TimelineMax=Et,R=new Et({sortChildren:!1,defaults:E,autoRemoveChildren:!0,id:"root"}),N.stringFilter=fb;var ee={registerPlugin:function registerPlugin(){for(var t=arguments.length,e=new Array(t),r=0;r<t;r++)e[r]=arguments[r];e.forEach(function(t){return function _createPlugin(t){var e=(t=!t.name&&t.default||t).name,r=o(t),n=e&&!r&&t.init?function(){this._props=[]}:t,i={init:M,render:Kt,add:Lt,kill:$t,modifier:Jt,rawVars:0},a={targetTest:0,get:0,getSetter:jt,aliases:{},register:0};if(Ot(),t!==n){if(ht[e])return;ea(n,ea(ia(t,i),a)),dt(n.prototype,dt(i,ia(t,a))),ht[n.prop=e]=n,t.targetTest&&(ct.push(n),st[e]=1),e=("css"===e?"CSS":e.charAt(0).toUpperCase()+e.substr(1))+"Plugin"}L(e,n),t.register&&t.register(ee,n,te)}(t)})},timeline:function timeline(t){return new Et(t)},getTweensOf:function getTweensOf(t,e){return R.getTweensOf(t,e)},getProperty:function getProperty(i,t,e,r){n(i)&&(i=vt(i)[0]);var a=W(i||{}).get,s=e?da:ca;return"native"===e&&(e=""),i?t?s((ht[t]&&ht[t].get||a)(i,t,e,r)):function(t,e,r){return s((ht[t]&&ht[t].get||a)(i,t,e,r))}:i},quickSetter:function quickSetter(r,e,i){n(r)&&(r=vt(r)[0]);var a=ht[e],s=W(r),o=a?function(t){var e=new a;d._pt=0,e.init(r,i?t+i:t,d,0,[r]),e.render(1,e),d._pt&&Kt(1,d)}:s.set(r,e);return a?o:function(t){return o(r,e,i?t+i:t,s,1)}},isTweening:function isTweening(t){return 0<R.getTweensOf(t,!0).length},defaults:function defaults(t){return t&&t.ease&&(t.ease=Dt(t.ease,E.ease)),ha(E,t||{})},config:function config(t){return ha(N,t||{})},registerEffect:function registerEffect(t){var i=t.name,n=t.effect,e=t.plugins,a=t.defaults,s=t.extendTimeline;(e||"").split(",").forEach(function(t){return t&&!ht[t]&&!at[t]&&K(i+" effect requires "+t+" plugin.")}),lt[i]=function(t,e){return n(vt(t),ea(e||{},a))},s&&(Et.prototype[i]=function(t,e,n){return this.add(lt[i](t,r(e)?e:(n=e)&&{}),n)})},registerEase:function registerEase(t,e){Ct[t]=Dt(e)},parseEase:function parseEase(t,e){return arguments.length?Dt(t,e):Ct},getById:function getById(t){return R.getById(t)},exportRoot:function exportRoot(t,e){void 0===t&&(t={});var r,n,i=new Et(t);for(i.smoothChildTiming=s(t.smoothChildTiming),R.remove(i),i._dp=0,i._time=i._tTime=R._time,r=R._first;r;)n=r._next,!e&&!r._dur&&r instanceof Nt&&r.vars.onComplete===r._targets[0]||ta(i,r,r._start-r._delay),r=n;return ta(R,i,0),i},utils:{wrap:function wrap(e,t,r){var n=t-e;return G(e)?Pa(e,wrap(0,e.length),t):Aa(r,function(t){return(n+(t-e)%n)%n+e})},wrapYoyo:function wrapYoyo(e,t,r){var n=t-e,i=2*n;return G(e)?Pa(e,wrapYoyo(0,e.length-1),t):Aa(r,function(t){return e+(n<(t=(i+(t-e)%i)%i)?i-t:t)})},distribute:Ia,random:La,snap:Ka,normalize:function normalize(t,e,r){return yt(t,e,0,1,r)},getUnit:Ca,clamp:function clamp(e,r,t){return Aa(t,function(t){return mt(e,r,t)})},splitColor:bb,toArray:vt,mapRange:yt,pipe:function pipe(){for(var t=arguments.length,e=new Array(t),r=0;r<t;r++)e[r]=arguments[r];return function(t){return e.reduce(function(t,e){return e(t)},t)}},unitize:function unitize(e,r){return function(t){return e(parseFloat(t))+(r||Ca(t))}},interpolate:function interpolate(e,r,t,i){var a=isNaN(e+r)?0:function(t){return(1-t)*e+t*r};if(!a){var s,o,u,h,l,f=n(e),c={};if(f)e={p:e},r={p:r};else if(G(e)&&!G(r)){for(u=[],h=e.length,l=h-2,o=1;o<h;o++)u.push(interpolate(e[o-1],e[o]));h--,a=function func(t){t*=h;var e=Math.min(l,~~t);return u[e](t-e)},t=r}else i||(e=dt(G(e)?[]:{},e));if(!u){for(s in r)Lt.call(c,e,s,"get",r[s]);a=function func(t){return Kt(t,c)||(f?e.p:e)}}}return Aa(t,a)}},install:J,effects:lt,ticker:Mt,updateRoot:Et.updateRoot,plugins:ht,globalTimeline:R,core:{PropTween:te,globals:L,Tween:Nt,Timeline:Et,Animation:Rt,getCache:W}};Y("to,from,fromTo,delayedCall,set,killTweensOf",function(t){return ee[t]=Nt[t]}),Mt.add(Et.updateRoot),d=ee.to({},{duration:0});function Zb(t,a){return{name:t,rawVars:1,init:function init(t,i,e){e._onInit=function(t){var e,r;if(n(i)&&(e={},Y(i,function(t){return e[t]=1}),i=e),a){for(r in e={},i)e[r]=a(i[r]);i=e}!function _addModifiers(t,e){var r,n,i,a=t._targets;for(r in e)for(n=a.length;n--;)(i=t._ptLookup[n][r])&&i.d.modifier&&i.d.modifier(e[r],t,a[n],r)}(t,i)}}}}ee.registerPlugin({name:"attr",init:function init(t,e,r,n,i){for(var a in e)this.add(t,"setAttribute",(t.getAttribute(a)||0)+"",e[a],n,i,0,0,a),this._props.push(a)}},{name:"endArray",init:function init(t,e){for(var r=e.length;r--;)this.add(t,r,t[r],e[r])}},Zb("roundProps",Ja),Zb("modifiers"),Zb("snap",Ka)),Nt.version=Et.version=ee.version="3.0.0-beta.10",f=1,t()&&Ot();function Ic(t,e){return e.set(e.t,e.p,~~(1e4*(e.s+e.c*t))/1e4+e.u,e)}function Jc(t,e){return e.set(e.t,e.p,1===t?e.e:~~(1e4*(e.s+e.c*t))/1e4+e.u,e)}function Kc(t,e){return e.set(e.t,e.p,t?~~(1e4*(e.s+e.c*t))/1e4+e.u:e.b,e)}function Lc(t,e){var r=e.s+e.c*t;e.set(e.t,e.p,~~(r+(r<0?-.5:.5))+e.u,e)}function Mc(t,e){return e.set(e.t,e.p,t?e.e:e.b,e)}function Nc(t,e){return e.set(e.t,e.p,1!==t?e.b:e.e,e)}function Oc(t,e,r){return t.style[e]=r}function Pc(t,e,r){return t.style.setProperty(e,r)}function Qc(t,e,r){return t._gsap[e]=r}function Rc(t,e,r){return t._gsap.scaleX=t._gsap.scaleY=r}function Sc(t,e,r,n,i){var a=t._gsap;a.scaleX=a.scaleY=r,a.renderTransform(i,a)}function Tc(t,e,r,n,i){var a=t._gsap;a[e]=r,a.renderTransform(i,a)}function Xc(t,e){var r=ne.createElementNS?ne.createElementNS((e||"http://www.w3.org/1999/xhtml").replace(/^https/,"http"),t):ne.createElement(t);return r.style?r:ne.createElement(t)}function Yc(t,e){var r=getComputedStyle(t);return r[e]||r.getPropertyValue(e.replace(Ee,"-$1").toLowerCase())||r.getPropertyValue(e)}function Zc(t,e){var r=(e||se).style,n=5,i="O,Moz,ms,Ms,Webkit".split(",");if(t in r)return t;for(t=t.charAt(0).toUpperCase()+t.substr(1);n--&&!(i[n]+t in r););return n<0?null:(3===n?"ms":0<=n?i[n]:"")+t}function $c(){!function _windowExists(){return"undefined"!=typeof window}()||(re=window,ne=re.document,ie=ne.documentElement,se=Xc("div")||{style:{}},oe=Xc("div"),Ye=Zc(Ye),Xe=Zc(Xe),se.style.cssText="border-width:0;line-height:0;position:absolute;padding:0",he=!!Zc("perspective"),ae=1)}function ad(t,e){for(var r=e.length;r--;)if(t.hasAttribute(e[r]))return t.getAttribute(e[r])}function bd(e){var r;try{r=e.getBBox()}catch(t){r=function _getBBoxHack(t){var e,r=Xc("svg",this.ownerSVGElement&&this.ownerSVGElement.getAttribute("xmlns")||"http://www.w3.org/2000/svg"),n=this.parentNode,i=this.nextSibling,a=this.style.cssText;if(ie.appendChild(r),r.appendChild(this),this.style.display="block",t)try{e=this.getBBox(),this._gsapBBox=this.getBBox,this.getBBox=_getBBoxHack}catch(t){}else this._gsapBBox&&(e=this._gsapBBox());return i?n.insertBefore(this,i):n.appendChild(this),ie.removeChild(r),this.style.cssText=a,e}.call(e,!0)}return!r||r.width||r.x||r.y?r:{x:+ad(e,["x","cx","x1"]),y:+ad(e,["y","cy","y1"]),width:0,height:0}}function cd(t){return!(!t.getCTM||t.parentNode&&!t.ownerSVGElement||!bd(t))}function dd(t,e){if(e){var r=t.style;e in De&&(e=Ye),r.removeProperty?("ms"!==e.substr(0,2)&&"webkit"!==e.substr(0,6)||(e="-"+e),r.removeProperty(e.replace(Ee,"-$1").toLowerCase())):r.removeAttribute(e)}}function ed(t,e,r,n,i,a){var s=new te(t._pt,e,r,0,1,a?Nc:Mc);return(t._pt=s).b=n,s.e=i,t._props.push(r),s}function gd(t,e,r,n){var i,a,s,o,u=parseFloat(r),h=(r+"").substr((u+"").length),l=se.style,f=Le.test(e),c="svg"===t.tagName.toLowerCase(),p=(c?"client":"offset")+(f?"Width":"Height"),d="px"===n;return n===h||Ne[n]||Ne[h]?u:(o=t.getCTM&&cd(t),"%"===n&&De[e]?Z(u/(o?t.getBBox()[f?"width":"height"]:t[p])*100):(l[f?"width":"height"]=100+(d?h:n),a="em"===n&&t.appendChild&&!c?t:t.parentNode,o&&(a=(t.ownerSVGElement||{}).parentNode),a&&a!==ne&&a.appendChild||(a=ne.body),(s=a._gsap)&&"%"===n&&s.width&&f&&s.time===Mt.time?i=s.width*u/100:(a.appendChild(se),i=se[p],a.removeChild(se),f&&"%"===n&&((s=a._gsap=a._gsap||{}).time=Mt.time,s.width=i/u*100)),Z(d?i*u/100:100/i*u)))}function hd(t,e,r,n){var i;return ae||$c(),e in Ze&&~(e=Ze[e]).indexOf(",")&&(e=e.split(",")[0]),De[e]?(i=We(t,n),i="transformOrigin"!==e?i[e]:Qe(Yc(t,Xe))+i.zOrigin+"px"):(i=t.style[e])&&"auto"!==i&&!n||(i=Yc(t,e)||X(t,e)),r?gd(t,e,i,r)+r:i}function id(t,e,r,n){var i,a,s,o,u,h,l,f,c,p,d,_,m=new te(this._pt,t.style,e,0,1,Gt),g=0,v=0;if(m.b=r,m.e=n,r+="","auto"===(n+="")&&(t.style[e]=n,n=Yc(t,e)||n,t.style[e]=r),fb(i=[r,n]),n=i[1],s=(r=i[0]).match(Be)||[],(n.match(Be)||[]).length){for(;a=Be.exec(n);)l=a[0],c=n.substring(g,a.index),u?u=(u+1)%5:"rgba("===c.substr(-5)&&(u=1),l!==(h=s[v++]||"")&&(o=parseFloat(h)||0,d=h.substr((o+"").length),(_="="===l.charAt(1)?+(l.charAt(0)+"1"):0)&&(l=l.substr(2)),f=parseFloat(l),p=l.substr((f+"").length),g=Be.lastIndex-p.length,p||(p=p||N.units[e]||d,g===n.length&&(n+=p,m.e+=p)),d!==p&&(o=gd(t,e,h,p)),m._pt={_next:m._pt,p:c||1===v?c:",",s:o,c:_?_*f:f-o,m:u&&u<4?Math.round:0});m.c=g<n.length?n.substring(g,n.length):""}else m.r="display"===e?Nc:Mc;return nt.test(n)&&(m.e=0),this._pt=m}function kd(t){var e=t.split(" "),r=e[0],n=e[1]||"50%";return"top"!==r&&"bottom"!==r&&"left"!==n&&"right"!==n||(e=r,r=n,n=e),e[0]=Ue[r]||r,e[1]=Ue[n]||n,e.join(" ")}function ld(t,e){if(e.tween&&e.tween._time===e.tween._dur){var r,n,i,a=e.t,s=a.style,o=e.u;if("all"===o||!0===o)s.cssText="",n=1;else for(i=(o=o.split(",")).length;-1<--i;)r=o[i],De[r]&&(n=1,r="transformOrigin"===r?Xe:Ye),dd(a,r);n&&(dd(a,Ye),(n=a._gsap)&&(n.svg&&a.removeAttribute("transform"),delete n.x))}}function pd(t){var e=Yc(t,Ye);return"matrix(1, 0, 0, 1, 0, 0)"!==e&&"none"!==e&&e?e.substr(7).match(tt).map(Z):qe}function qd(t,e){var r,n,i,a,s=t._gsap,o=t.style,u=pd(t);return s.svg&&t.getAttribute("transform")?"1,0,0,1,0,0"===(u=[(i=t.transform.baseVal.consolidate().matrix).a,i.b,i.c,i.d,i.e,i.f]).join(",")?qe:u:(u!==qe||t.offsetParent||t===ie||s.svg||(i=o.display,o.display="block",(r=t.parentNode)&&t.offsetParent||(a=1,n=t.nextSibling,ie.appendChild(t)),u=pd(t),i?o.display=i:dd(t,"display"),a&&(n?r.insertBefore(t,n):r?r.appendChild(t):ie.removeChild(t))),e&&6<u.length?[u[0],u[1],u[4],u[5],u[12],u[13]]:u)}function rd(t,e,r,n,i,a){var s,o,u,h=t._gsap,l=i||qd(t,!0),f=h.xOrigin||0,c=h.yOrigin||0,p=h.xOffset||0,d=h.yOffset||0,_=l[0],m=l[1],g=l[2],v=l[3],y=l[4],b=l[5],w=e.split(" "),T=parseFloat(w[0])||0,x=parseFloat(w[1])||0;r?l!==qe&&(o=_*v-m*g)&&(u=T*(-m/o)+x*(_/o)-(_*b-m*y)/o,T=T*(v/o)+x*(-g/o)+(g*b-v*y)/o,x=u):(T=(s=bd(t)).x+(~w[0].indexOf("%")?T/100*s.width:T),x=s.y+(~(w[1]||w[0]).indexOf("%")?x/100*s.height:x)),n||!1!==n&&h.smooth?(y=T-f,b=x-c,h.xOffset+=y*_+b*g-y,h.yOffset+=y*m+b*v-b):h.xOffset=h.yOffset=0,h.xOrigin=T,h.yOrigin=x,h.smooth=!!n,h.origin=e,h.originIsAbsolute=!!r,a&&(ed(a,h,"xOrigin",f,T),ed(a,h,"yOrigin",c,x),ed(a,h,"xOffset",p,h.xOffset),ed(a,h,"yOffset",d,h.yOffset))}function ud(t,e,r){var n=Ca(e);return Z(parseFloat(e)+parseFloat(gd(t,"x",r+"px",n)))+n}function Bd(t,e,r,i,a,s){var o,u,h=360,l=n(a),f=parseFloat(a)*(l&&~a.indexOf("rad")?ze:1),c=s?f*s:f-i,p=i+c+"deg";return l&&("short"===(o=a.split("_")[1])&&(c%=h)!==c%180&&(c+=c<0?h:-h),"cw"===o&&c<0?c=(c+36e9)%h-~~(c/h)*h:"ccw"===o&&0<c&&(c=(c-36e9)%h-~~(c/h)*h)),t._pt=u=new te(t._pt,e,r,i,c,Jc),u.e=p,u.u="deg",t._props.push(r),u}function Cd(t,e,r){var n,i,a,s,o,u,h,l=oe.style,f=r._gsap;for(i in l.cssText=getComputedStyle(r).cssText+";position:absolute;display:block;",l[Ye]=e,ne.body.appendChild(oe),n=We(oe,1),De)(a=f[i])!==(s=n[i])&&"perspective"!==i&&(o=Ca(a)!==(h=Ca(s))?gd(r,i,a,h):parseFloat(a),u=parseFloat(s),t._pt=new te(t._pt,f,i,o,u-o,Ic),t._pt.u=h,t._props.push(i));ne.body.removeChild(oe)}var re,ne,ie,ae,se,oe,ue,he,le,fe,ce,pe=Ct.Power0,de=Ct.Power1,_e=Ct.Power2,me=Ct.Power3,ge=Ct.Power4,ve=Ct.Linear,ye=Ct.Quad,be=Ct.Cubic,we=Ct.Quart,Te=Ct.Quint,xe=Ct.Strong,ke=Ct.Elastic,Me=Ct.Back,Oe=Ct.SteppedEase,Ce=Ct.Bounce,Pe=Ct.Sine,Ae=Ct.Expo,Se=Ct.Circ,De={},ze=180/Math.PI,Fe=Math.PI/180,Re=Math.atan2,Ee=/([A-Z])/g,Be=/[-+=\.]*\d+[\.e-]*\d*[a-z%]*/g,Le=/(?:left|right|width|margin|padding|x)/i,Ie=/[\s,\(]\S/,Ze={autoAlpha:"opacity,visibility",scale:"scaleX,scaleY",alpha:"opacity"},Ye="transform",Xe=Ye+"Origin",Ne={deg:1,rad:1,turn:1},Ue={top:"0%",bottom:"100%",left:"0%",right:"100%",center:"50%"},Ve={clearProps:function clearProps(t,e,r,n,i){var a=t._pt=new te(t._pt,e,r,0,0,ld);return a.u=n,a.pr=-10,a.tween=i,t._props.push(r),1}},qe=[1,0,0,1,0,0],je={},We=function _parseTransform(t,e){var r=t._gsap||new Ft(t);if("x"in r&&!e)return r;var n,i,a,s,o,u,h,l,f,c,p,d,_,m,g,v,y,b,w,T,x,k,M,O,C,P,A,S,D,z,F=t.style,R=r.scaleX<0,E=r.xOrigin||0,B=r.yOrigin||0,L="deg",I=Yc(t,Xe)||"0";return n=i=a=u=h=l=f=c=p=0,s=o=1,r.svg=!(!t.getCTM||!cd(t)),d=qd(t,r.svg),r.svg&&rd(t,I,r.originIsAbsolute,!1!==r.smooth,d),d!==qe&&(v=d[0],y=d[1],b=d[2],w=d[3],n=T=d[4],i=x=d[5],6===d.length?(s=Math.sqrt(v*v+y*y),o=Math.sqrt(w*w+b*b),u=v||y?Re(y,v)*ze:r.rotation||0,f=b||w?Re(b,w)*ze+u:r.skewX||0,r.svg&&(n-=E-(E*v+B*b),i-=B-(E*y+B*w))):(z=d[6],S=d[7],C=d[8],P=d[9],A=d[10],D=d[11],n=d[12],i=d[13],a=d[14],h=(_=Re(z,A))*ze,_&&(k=T*(m=Math.cos(-_))+C*(g=Math.sin(-_)),M=x*m+P*g,O=z*m+A*g,C=T*-g+C*m,P=x*-g+P*m,A=z*-g+A*m,D=S*-g+D*m,T=k,x=M,z=O),l=(_=Re(-b,A))*ze,_&&(m=Math.cos(-_),D=w*(g=Math.sin(-_))+D*m,v=k=v*m-C*g,y=M=y*m-P*g,b=O=b*m-A*g),u=(_=Re(y,v))*ze,_&&(k=v*(m=Math.cos(_))+y*(g=Math.sin(_)),M=T*m+x*g,y=y*m-v*g,x=x*m-T*g,v=k,T=M),h&&359.9<Math.abs(h)+Math.abs(u)&&(h=u=0,l=180-l),s=Z(Math.sqrt(v*v+y*y+b*b)),o=Z(Math.sqrt(x*x+z*z)),_=Re(T,x),f=2e-4<Math.abs(_)?_*ze:0,p=D?1/(D<0?-D:D):0)),90<Math.abs(f)&&Math.abs(f)<270&&(R?(s*=-1,f+=u<=0?180:-180,u+=u<=0?180:-180):(o*=-1,f+=f<=0?180:-180)),r.x=((r.xPercent=n&&Math.round(t.offsetWidth/2)===Math.round(-n)?-50:0)?0:n)+"px",r.y=((r.yPercent=i&&Math.round(t.offsetHeight/2)===Math.round(-i)?-50:0)?0:i)+"px",r.z=a+"px",r.scaleX=Z(s),r.scaleY=Z(o),r.rotation=Z(u)+L,r.rotationX=Z(h)+L,r.rotationY=Z(l)+L,r.skewX=f+L,r.skewY=c+L,r.transformPerspective=p+"px",(r.zOrigin=parseFloat(I.split(" ")[2])||0)&&(F[Xe]=Qe(I)),r.xOffset=r.yOffset=0,r.force3D=N.force3D,r.renderTransform=r.svg?tr:he?He:Ge,r.svg&&F[Ye]&&ee.delayedCall(.001,function(){return dd(t,Ye)}),r},Qe=function _firstTwoOnly(t){return(t=t.split(" "))[0]+" "+t[1]},Ge=function _renderNon3DTransforms(t,e){e.z="0px",e.rotationY=e.rotationX="0deg",e.force3D=0,He(t,e)},Ke="0deg",Je="0px",$e=") ",He=function _renderCSSTransforms(t,e){var r=e||this,n=r.xPercent,i=r.yPercent,a=r.x,s=r.y,o=r.z,u=r.rotation,h=r.rotationY,l=r.rotationX,f=r.skewX,c=r.skewY,p=r.scaleX,d=r.scaleY,_=r.transformPerspective,m=r.force3D,g=r.target,v=r.zOrigin,y="",b="auto"===m&&t&&1!==t||!0===m;if(v&&(l!==Ke||h!==Ke)){var w,T=parseFloat(h)*Fe,x=Math.sin(T),k=Math.cos(T);T=parseFloat(l)*Fe,w=Math.cos(T),a=ud(g,a,x*w*-v),s=ud(g,s,-Math.sin(T)*-v),o=ud(g,o,k*w*-v+v)}(n||i)&&(y="translate("+n+"%, "+i+"%) "),!b&&a===Je&&s===Je&&o===Je||(y+=o!==Je||b?"translate3d("+a+", "+s+", "+o+") ":"translate("+a+", "+s+$e),_!==Je&&(y+="perspective("+_+$e),u!==Ke&&(y+="rotate("+u+$e),h!==Ke&&(y+="rotateY("+h+$e),l!==Ke&&(y+="rotateX("+l+$e),f===Ke&&c===Ke||(y+="skew("+f+", "+c+$e),1===p&&1===d||(y+="scale("+p+", "+d+$e),g.style[Ye]=y||"translate(0, 0)"},tr=function _renderSVGTransforms(t,e){var r,n,i,a,s,o=e||this,u=o.xPercent,h=o.yPercent,l=o.x,f=o.y,c=o.rotation,p=o.skewX,d=o.skewY,_=o.scaleX,m=o.scaleY,g=o.target,v=o.xOrigin,y=o.yOrigin,b=o.xOffset,w=o.yOffset,T=parseFloat(l),x=parseFloat(f);c=parseFloat(c),p=parseFloat(p),(d=parseFloat(d))&&(p+=d=parseFloat(d),c+=d),c||p?(c*=Fe,p*=Fe,r=Math.cos(c)*_,n=Math.sin(c)*_,i=Math.sin(c-p)*-m,a=Math.cos(c-p)*m,p&&(d*=Fe,s=Math.tan(p-d),i*=s=Math.sqrt(1+s*s),a*=s,d&&(s=Math.tan(d),r*=s=Math.sqrt(1+s*s),n*=s)),r=Z(r),n=Z(n),i=Z(i),a=Z(a)):(r=_,a=m,n=i=0),(T&&!~l.indexOf("px")||x&&!~f.indexOf("px"))&&(T=gd(g,"x",l,"px"),x=gd(g,"y",f,"px")),(v||y||b||w)&&(T=Z(T+v-(v*r+y*i)+b),x=Z(x+y-(v*n+y*a)+w)),(u||h)&&(s=g.getBBox(),T=Z(T+u/100*s.width),x=Z(x+h/100*s.height)),g.setAttribute("transform","matrix("+r+","+n+","+i+","+a+","+T+","+x+")")},er={name:"css",register:$c,targetTest:function targetTest(t){return t.style&&t.nodeType},init:function init(t,e,r,n,i){var a,s,o,u,h,l,f,c,p,d,_,m,g,v,y,b=this._props,w=t.style;for(f in ae||$c(),e)if("autoRound"!==f&&(s=e[f],!ht[f]||!Bb(f,e,r,n,t,i)))if(l=Ve[f],"function"===(h=typeof s)&&(h=typeof(s=s.call(r,n,t,i))),"string"===h&&~s.indexOf("random(")&&(s=Sa(s)),l)l(this,t,f,s,r)&&(y=1);else if("--"===f.substr(0,2))this.add(w,"setProperty",getComputedStyle(t).getPropertyValue(f)+"",s+"",n,i,0,0,f);else{if(a=hd(t,f),u=parseFloat(a),(d="string"===h&&"="===s.charAt(1)?+(s.charAt(0)+"1"):0)&&(s=s.substr(2)),o=parseFloat(s),f in Ze&&("autoAlpha"===f&&(1===u&&"hidden"===hd(t,"visibility")&&o&&(u=0),ed(this,w,"visibility",u?"inherit":"hidden",o?"inherit":"hidden",!o)),"scale"!==f&&~(f=Ze[f]).indexOf(",")&&(f=f.split(",")[0])),_=f in De){if(m||(g=t._gsap,v=!1!==e.smoothOrigin&&g.smooth,(m=this._pt=new te(this._pt,w,Ye,0,1,g.renderTransform,g)).dep=1),"scale"===f){this._pt=new te(this._pt,t,"scale",u,d?d*o:o-u,0,0,Rc),b.push("scale");continue}if("transformOrigin"===f){s=kd(s),g.svg?rd(t,s,0,v,0,this):((p=parseFloat(s.split(" ")[2]))!==g.zOrigin&&ed(this,g,"zOrigin",g.zOrigin,p),ed(this,w,f,Qe(a),Qe(s)));continue}if("svgOrigin"===f){rd(t,s,1,v,0,this);continue}if(f in je){Bd(this,g,f,u,s,d);continue}if("smoothOrigin"===f){ed(this,g,"smooth",g.smooth,s);continue}if("force3D"===f){g[f]=s;continue}if("transform"===f){Cd(this,s,t);continue}}if(_||(o||0===o)&&(u||0===u)&&!Ie.test(s)&&f in w)(c=(a+"").substr((u+"").length))!==(p=(s+"").substr((o+"").length)||(f in N.units?N.units[f]:c))&&(u=gd(t,f,a,p)),this._pt=new te(this._pt,_?g:w,f,u,d?d*o:o-u,"px"!==p||!1===e.autoRound||_?Ic:Lc),this._pt.u=p||0,c!==p&&(this._pt.b=a,this._pt.r=Kc);else if(f in w)id.call(this,t,f,a,s);else{if(!(f in t)){K("Invalid "+f+" tween "+s+". Missing a plugin? gsap.registerPlugin()");continue}this.add(t,f,t[f],s,n,i)}b.push(f)}y&&Ht(this)},get:hd,aliases:Ze,getSetter:function getSetter(t,e,r){return e in De&&e!==Xe&&(t._gsap.x||hd(t,"x"))?r&&ue===r?"scale"===e?Rc:Qc:(ue=r||{})&&("scale"===e?Sc:Tc):t.style&&!q(t.style[e])?Oc:~e.indexOf("-")?Pc:jt(t,e)}};ee.utils.checkPrefix=Zc,ce=Y((le="x,y,z,scale,scaleX,scaleY,xPercent,yPercent")+","+(fe="rotation,rotationX,rotationY,skewX,skewY")+",transform,transformOrigin,svgOrigin,force3D,smoothOrigin,transformPerspective",function(t){De[t]=1}),Y(fe,function(t){N.units[t]="deg",je[t]=1}),Ze[ce[13]]=le+","+fe,Y("0:translateX,1:translateY,2:translateZ,8:rotate,8:rotationZ,9:rotateX,10:rotateY",function(t){var e=t.split(":");Ze[e[1]]=ce[e[0]]}),Y("x,y,z,top,right,bottom,left,width,height,fontSize,padding,margin,perspective",function(t){N.units[t]="px"}),ee.registerPlugin(er),ee.registerPlugin(er),e.Back=Me,e.Bounce=Ce,e.CSSPlugin=er,e.Circ=Se,e.Cubic=be,e.Elastic=ke,e.Expo=Ae,e.Linear=ve,e.Power0=pe,e.Power1=de,e.Power2=_e,e.Power3=me,e.Power4=ge,e.Quad=ye,e.Quart=we,e.Quint=Te,e.Sine=Pe,e.SteppedEase=Oe,e.Strong=xe,e.TimelineLite=Et,e.TimelineMax=Et,e.TweenLite=Nt,e.TweenMax=Nt,e.default=ee,e.gsap=ee,Object.defineProperty(e,"__esModule",{value:!0})}); | ||
//# sourceMappingURL=gsap.min.js.map |
@@ -7,14 +7,2 @@ (function (global, factory) { | ||
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-09-18 | ||
* http://greensock.com | ||
* | ||
* Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/ | ||
/* eslint-disable */ | ||
var _svgPathExp = /[achlmqstvz]|(-?\d*\.?\d*(?:e[\-+]?\d+)?)[0-9]/ig, | ||
@@ -47,4 +35,3 @@ _numbersExp = /(?:(-)?\d*\.?\d*(?:e[\-+]?\d+)?)[0-9]/ig, | ||
}, | ||
//if progress lands on 1, the % will make it 0 which is why we || 1, but not if it's negative because it makes more sense for motion to end at 0 in that case. | ||
_round = function _round(value) { | ||
_round = function _round(value) { | ||
return ~~(value * _roundingNum + (value < 0 ? -.5 : .5)) / _roundingNum; | ||
@@ -79,3 +66,2 @@ }, | ||
if (source.samples) { | ||
//segment | ||
copy.samples = source.samples.slice(0); | ||
@@ -86,3 +72,2 @@ copy.lookup = source.lookup.slice(0); | ||
} else { | ||
//rawPath | ||
copy.totalPoints = source.totalPoints; | ||
@@ -93,4 +78,3 @@ } | ||
}, | ||
//pushes a new segment into a rawPath, but if its starting values match the ending values of the last segment, it'll merge it into that same segment (to reduce the number of segments) | ||
_appendOrMerge = function _appendOrMerge(rawPath, segment) { | ||
_appendOrMerge = function _appendOrMerge(rawPath, segment) { | ||
var index = rawPath.length, | ||
@@ -107,11 +91,3 @@ prevSeg = rawPath[index - 1] || [], | ||
}; | ||
/* TERMINOLOGY | ||
- RawPath - an array of arrays, one for each Segment. A single RawPath could have multiple "M" commands, defining Segments (paths aren't always connected). | ||
- Segment - an array containing a sequence of Cubic Bezier coordinates in alternating x, y, x, y format. Starting anchor, then control point 1, control point 2, and ending anchor, then the next control point 1, control point 2, anchor, etc. Uses less memory than an array with a bunch of {x, y} points. | ||
- Bezier - a single cubic Bezier with a starting anchor, two control points, and an ending anchor. | ||
- the variable "t" is typically the position along an individual Bezier path (time) and it's NOT linear, meaning it could accelerate/decelerate based on the control points whereas the "p" or "progress" value is linearly mapped to the whole path, so it shouldn't really accelerate/decelerate based on control points. So a progress of 0.2 would be almost exactly 20% along the path. "t" is ONLY in an individual Bezier piece. | ||
*/ | ||
//accepts basic selector text, a path instance, a RawPath instance, or a Segment and returns a RawPath (makes it easy to homogenize things). If an element or selector text is passed in, it'll also cache the value so that if it's queried again, it'll just take the path data from there instead of parsing it all over again (as long as the path data itself hasn't changed - it'll check). | ||
function getRawPath(value) { | ||
@@ -123,3 +99,2 @@ value = _isString(value) && _selectorExp.test(value) ? document.querySelector(value) || value : value; | ||
if (e && (value = value.getAttribute("d"))) { | ||
//implements caching | ||
if (!e._gsPath) { | ||
@@ -134,4 +109,3 @@ e._gsPath = {}; | ||
return !value ? console.warn("Expecting a <path> element or an SVG path data string") : _isString(value) ? stringToRawPath(value) : _isNumber(value[0]) ? [value] : value; | ||
} //copies a RawPath WITHOUT the length meta data (for speed) | ||
} | ||
function copyRawPath(rawPath) { | ||
@@ -150,3 +124,3 @@ var a = [], | ||
y; | ||
segment.reverse(); //this will invert the order y, x, y, x so we must flip it back. | ||
segment.reverse(); | ||
@@ -170,3 +144,3 @@ for (; i < segment.length; i += 2) { | ||
while (--i > -1) { | ||
name = attr[i].nodeName.toLowerCase(); //in Microsoft Edge, if you don't set the attribute with a lowercase name, it doesn't render correctly! Super weird. | ||
name = attr[i].nodeName.toLowerCase(); | ||
@@ -196,5 +170,4 @@ if (ignore.indexOf("," + name + ",") < 0) { | ||
return obj; | ||
}; //converts an SVG shape like <circle>, <rect>, <polygon>, <polyline>, <ellipse>, etc. to a <path>, swapping it in and copying the attributes to match. | ||
}; | ||
function convertToPath(element, swap) { | ||
@@ -242,3 +215,2 @@ var type = element.tagName.toLowerCase(), | ||
if (r || ry) { | ||
//if there are rounded corners, render cubic beziers | ||
x2 = x + r * (1 - circ); | ||
@@ -273,3 +245,3 @@ x3 = x + r; | ||
} else if (type === "line") { | ||
data = "M" + attr.x1 + "," + attr.y1 + " L" + attr.x2 + "," + attr.y2; //previously, we just converted to "Mx,y Lx,y" but Safari has bugs that cause that not to render properly when using a stroke-dasharray that's not fully visible! Using a cubic bezier fixes that issue. | ||
data = "M" + attr.x1 + "," + attr.y1 + " L" + attr.x2 + "," + attr.y2; | ||
} else if (type === "polyline" || type === "polygon") { | ||
@@ -294,3 +266,3 @@ points = (element.getAttribute("points") + "").match(_numbersExp) || []; | ||
return path; | ||
} //returns the rotation (in degrees) at a particular progress on a rawPath (the slope of the tangent) | ||
} | ||
@@ -439,3 +411,2 @@ function getRotationAtBezierT(segment, i, t) { | ||
while (i--) { | ||
//chop off any extra segments | ||
if (i < sSegIndex || i > eSegIndex) { | ||
@@ -446,4 +417,3 @@ path.splice(i, 1); | ||
} else { | ||
eSeg.angle = getRotationAtBezierT(eSeg, ei + eShift, 0); //record the value before we chop because it'll be impossible to determine the angle after its length is 0! | ||
eSeg.angle = getRotationAtBezierT(eSeg, ei + eShift, 0); | ||
ei += eShift; | ||
@@ -464,3 +434,3 @@ s = eSeg[ei]; | ||
return path; | ||
} //measures a Segment according to its resolution (so if segment.resolution is 6, for example, it'll take 6 samples equally across each Bezier) and create/populate a "samples" array that has the length up to each of those sample points (always increasing from the start) as well as a "lookup" array that's broken up according to the smallest distance between 2 samples. This gives us a very fast way of looking up a progress position rather than looping through all the points/Beziers. You can optionally have it only measure a subset, starting at startIndex and going for a specific number of beziers (remember, there are 3 x/y pairs each, for a total of 6 elements for each Bezier). It will also populate a "totalLength" property, but that's not generally super accurate because by default it'll only take 6 samples per Bezier. But for performance reasons, it's perfectly adequate for measuring progress values along the path. If you need a more accurate totalLength, either increase the resolution or use the more advanced bezierToPoints() method which keeps adding points until they don't deviate by more than a certain precision value. | ||
} | ||
@@ -560,4 +530,3 @@ function measureSegment(segment, startIndex, bezierQty) { | ||
for (i = pathLength = points = 0; i < rawPath.length; i++) { | ||
rawPath[i].resolution = ~~resolution || 12; //steps per Bezier curve (anchor, 2 control points, to anchor) | ||
rawPath[i].resolution = ~~resolution || 12; | ||
points += rawPath[i].length; | ||
@@ -570,4 +539,3 @@ pathLength += measureSegment(rawPath[i]); | ||
return rawPath; | ||
} //divide segment[i] at position t (value between 0 and 1, progress along that particular cubic bezier segment that starts at segment[i]). Returns how many elements were spliced into the segment array (either 0 or 6) | ||
} | ||
function subdivideSegment(segment, i, t) { | ||
@@ -596,8 +564,3 @@ if (t <= 0 || t >= 1) { | ||
y2 += (y2a - y2) * t; | ||
segment.splice(i + 2, 4, _round(x1a), //first control point | ||
_round(y1a), _round(x1), //second control point | ||
_round(y1), _round(x1 + (x2 - x1) * t), //new fabricated anchor on line | ||
_round(y1 + (y2 - y1) * t), _round(x2), //third control point | ||
_round(y2), _round(x2a), //fourth control point | ||
_round(y2a)); | ||
segment.splice(i + 2, 4, _round(x1a), _round(y1a), _round(x1), _round(y1), _round(x1 + (x2 - x1) * t), _round(y1 + (y2 - y1) * t), _round(x2), _round(y2), _round(x2a), _round(y2a)); | ||
@@ -609,3 +572,3 @@ if (segment.samples) { | ||
return 6; | ||
} // returns an object {path, segment, segIndex, i, t} | ||
} | ||
@@ -633,3 +596,2 @@ function getProgressData(rawPath, progress, decoratee) { | ||
if (rawPath.length > 1) { | ||
//speed optimization: most of the time, there's only one segment so skip the recursion. | ||
length = rawPath.totalLength * progress; | ||
@@ -648,4 +610,3 @@ max = i = 0; | ||
samples = segment.samples; | ||
resolution = segment.resolution; //how many samples per cubic bezier chunk | ||
resolution = segment.resolution; | ||
length = segment.totalLength * progress; | ||
@@ -687,3 +648,2 @@ i = segment.lookup[~~(length / segment.minLength)] || 0; | ||
if (rawPath.length > 1) { | ||
//speed optimization: most of the time, there's only one segment so skip the recursion. | ||
length = rawPath.totalLength * progress; | ||
@@ -724,4 +684,3 @@ max = i = 0; | ||
return result; | ||
} //applies a matrix transform to RawPath (or a segment in a RawPath) and returns whatever was passed in (it transforms the values in the array(s), not a copy). | ||
} | ||
function transformRawPath(rawPath, a, b, c, d, tx, ty) { | ||
@@ -749,3 +708,3 @@ var j = rawPath.length, | ||
return rawPath; | ||
} // translates SVG arc data into a segment (cubic beziers). Angle is in degrees. | ||
} | ||
@@ -802,3 +761,2 @@ function arcToSegment(lastX, lastY, rx, ry, angle, largeArcFlag, sweepFlag, x, y) { | ||
if (isNaN(angleExtent)) { | ||
//rare edge case. Math.cos(-1) is NaN. | ||
angleExtent = PI; | ||
@@ -833,5 +791,4 @@ } | ||
rawPath.push(x1 - controlLength * y1, y1 + controlLength * x1, ux + controlLength * uy, uy - controlLength * ux, ux, uy); | ||
} //now transform according to the actual size of the ellipse/arc (the beziers were noramlized, between 0 and 1 on a circle). | ||
} | ||
for (i = 0; i < rawPath.length; i += 2) { | ||
@@ -844,9 +801,7 @@ x1 = rawPath[i]; | ||
rawPath[i - 2] = x; //always set the end to exactly where it's supposed to be | ||
rawPath[i - 2] = x; | ||
rawPath[i - 1] = y; | ||
return rawPath; | ||
} //Spits back a RawPath with absolute coordinates. Each segment starts with a "moveTo" command (x coordinate, then y) and then 2 control points (x, y, x, y), then anchor. The goal is to minimize memory and maximize speed. | ||
} | ||
function stringToRawPath(d) { | ||
@@ -857,4 +812,3 @@ var a = (d + "").replace(_scientific, function (m) { | ||
}).match(_svgPathExp) || [], | ||
//some authoring programs spit out very small numbers in scientific notation like "1e-5", so make sure we round that down to 0 first. | ||
path = [], | ||
path = [], | ||
relativeX = 0, | ||
@@ -895,5 +849,4 @@ relativeY = 0, | ||
command = a[i].toUpperCase(); | ||
isRelative = command !== a[i]; //lower case means relative | ||
isRelative = command !== a[i]; | ||
} else { | ||
//commands like "C" can be strung together without any new command characters between. | ||
i--; | ||
@@ -913,9 +866,7 @@ } | ||
startY = y; | ||
} // "M" (move) | ||
} | ||
if (command === "M") { | ||
if (segment) { | ||
if (segment.length < 8) { | ||
//if the path data was funky and just had a M with no actual drawing anywhere, skip it. | ||
path.length -= 1; | ||
@@ -932,4 +883,3 @@ } else { | ||
i += 2; | ||
command = "L"; //an "M" with more than 2 values gets interpreted as "lineTo" commands ("L"). | ||
// "C" (cubic bezier) | ||
command = "L"; | ||
} else if (command === "C") { | ||
@@ -942,7 +892,6 @@ if (!segment) { | ||
relativeX = relativeY = 0; | ||
} //note: "*1" is just a fast/short way to cast the value as a Number. WAAAY faster in Chrome, slightly slower in Firefox. | ||
} | ||
segment.push(x, y, relativeX + a[i + 3] * 1, relativeY + a[i + 4] * 1, relativeX += a[i + 5] * 1, relativeY += a[i + 6] * 1); | ||
i += 6; // "S" (continuation of cubic bezier) | ||
i += 6; | ||
} else if (command === "S") { | ||
@@ -962,3 +911,3 @@ difX = relativeX; | ||
segment.push(difX, difY, x, y, relativeX += a[i + 3] * 1, relativeY += a[i + 4] * 1); | ||
i += 4; // "Q" (quadratic bezier) | ||
i += 4; | ||
} else if (command === "Q") { | ||
@@ -975,3 +924,3 @@ difX = relativeX + (x - relativeX) * twoThirds; | ||
segment.push(difX, difY, relativeX + (x - relativeX) * twoThirds, relativeY + (y - relativeY) * twoThirds, relativeX, relativeY); | ||
i += 4; // "T" (continuation of quadratic bezier) | ||
i += 4; | ||
} else if (command === "T") { | ||
@@ -981,10 +930,9 @@ difX = relativeX - segment[segment.length - 4]; | ||
segment.push(relativeX + difX, relativeY + difY, x + (relativeX + difX * 1.5 - x) * twoThirds, y + (relativeY + difY * 1.5 - y) * twoThirds, relativeX = x, relativeY = y); | ||
i += 2; // "H" (horizontal line) | ||
i += 2; | ||
} else if (command === "H") { | ||
line(relativeX, relativeY, relativeX = x, relativeY); | ||
i += 1; // "V" (vertical line) | ||
i += 1; | ||
} else if (command === "V") { | ||
//adjust values because the first (and only one) isn't x in this case, it's y. | ||
line(relativeX, relativeY, relativeX, relativeY = x + (isRelative ? relativeY - relativeX : 0)); | ||
i += 1; // "L" (line) or "Z" (close) | ||
i += 1; | ||
} else if (command === "L" || command === "Z") { | ||
@@ -1006,3 +954,3 @@ if (command === "Z") { | ||
relativeX = x; | ||
relativeY = y; // "A" (arc) | ||
relativeY = y; | ||
} else if (command === "A") { | ||
@@ -1028,3 +976,2 @@ beziers = arcToSegment(relativeX, relativeY, +a[i + 1], +a[i + 2], +a[i + 3], +a[i + 4], +a[i + 5], (isRelative ? relativeX : 0) + a[i + 6] * 1, (isRelative ? relativeY : 0) + a[i + 7] * 1); | ||
if (i < 6) { | ||
//in case there's odd SVG like a M0,0 command at the very end. | ||
path.pop(); | ||
@@ -1038,19 +985,3 @@ i = 0; | ||
return path; | ||
} //populates the points array in alternating x/y values (like [x, y, x, y...] instead of individual point objects [{x, y}, {x, y}...] to conserve memory and stay in line with how we're handling segment arrays | ||
/* | ||
function getAngleBetweenPoints(x0, y0, x1, y1, x2, y2) { //angle between 3 points in radians | ||
var dx1 = x1 - x0, | ||
dy1 = y1 - y0, | ||
dx2 = x2 - x1, | ||
dy2 = y2 - y1, | ||
dx3 = x2 - x0, | ||
dy3 = y2 - y0, | ||
a = dx1 * dx1 + dy1 * dy1, | ||
b = dx2 * dx2 + dy2 * dy2, | ||
c = dx3 * dx3 + dy3 * dy3; | ||
return Math.acos( (a + b - c) / _sqrt(4 * a * b) ); | ||
}, | ||
*/ | ||
//pointsToSegment() doesn't handle flat coordinates (where y is always 0) the way we need (the resulting control points are always right on top of the anchors), so this function basically makes the control points go directly up and down, varying in length based on the curviness (more curvy, further control points) | ||
} | ||
function flatPointsToSegment(points, curviness) { | ||
@@ -1071,6 +1002,4 @@ if (curviness === void 0) { | ||
return segment; | ||
} //points is an array of x/y points, like [x, y, x, y, x, y] | ||
} | ||
function pointsToSegment(points, curviness, cornerThreshold) { | ||
//points = simplifyPoints(points, tolerance); | ||
var l = points.length - 2, | ||
@@ -1121,8 +1050,5 @@ x = +points[0], | ||
c = dx3 * dx3 + dy3 * dy3; | ||
angle = Math.acos((a + b - c) / _sqrt(4 * a * b)); //angle between the 3 points | ||
d2 = angle / Math.PI * curviness; //temporary precalculation for speed (reusing d2 variable) | ||
d1 = _sqrt(a) * d2; //the tighter the angle, the shorter we make the handles in proportion. | ||
angle = Math.acos((a + b - c) / _sqrt(4 * a * b)); | ||
d2 = angle / Math.PI * curviness; | ||
d1 = _sqrt(a) * d2; | ||
d2 *= _sqrt(b); | ||
@@ -1133,14 +1059,8 @@ | ||
slope = _atan2(dy3, dx3); | ||
segment.push(_round(x - _cos(slope) * d1), //first control point | ||
_round(y - _sin(slope) * d1), _round(x), //anchor | ||
_round(y), _round(x + _cos(slope) * d2), //second control point | ||
_round(y + _sin(slope) * d2)); | ||
segment.push(_round(x - _cos(slope) * d1), _round(y - _sin(slope) * d1), _round(x), _round(y), _round(x + _cos(slope) * d2), _round(y + _sin(slope) * d2)); | ||
} else { | ||
slope = _atan2(dy1, dx1); | ||
segment.push(_round(x - _cos(slope) * d1), //first control point | ||
_round(y - _sin(slope) * d1)); | ||
segment.push(_round(x - _cos(slope) * d1), _round(y - _sin(slope) * d1)); | ||
slope = _atan2(dy2, dx2); | ||
segment.push(_round(x), //anchor | ||
_round(y), _round(x + _cos(slope) * d2), //second control point | ||
_round(y + _sin(slope) * d2)); | ||
segment.push(_round(x), _round(y), _round(x + _cos(slope) * d2), _round(y + _sin(slope) * d2)); | ||
} | ||
@@ -1152,15 +1072,5 @@ } | ||
return segment; | ||
} //returns the squared distance between an x/y coordinate and a segment between x1/y1 and x2/y2 | ||
/* | ||
Takes any of the following and converts it to an all Cubic Bezier SVG data string: | ||
- A <path> data string like "M0,0 L2,4 v20,15 H100" | ||
- A RawPath, like [[x, y, x, y, x, y, x, y][[x, y, x, y, x, y, x, y]] | ||
- A Segment, like [x, y, x, y, x, y, x, y] | ||
Note: all numbers are rounded down to the closest 0.001 to minimize memory, maximize speed, and avoid odd numbers like 1e-13 | ||
*/ | ||
} | ||
function rawPathToString(rawPath) { | ||
if (_isNumber(rawPath[0])) { | ||
//in case a segment is passed in instead | ||
rawPath = [rawPath]; | ||
@@ -1192,108 +1102,3 @@ } | ||
} | ||
/* | ||
// takes a segment with coordinates [x, y, x, y, ...] and converts the control points into angles and lengths [x, y, angle, length, angle, length, x, y, angle, length, ...] so that it animates more cleanly and avoids odd breaks/kinks. For example, if you animate from 1 o'clock to 6 o'clock, it'd just go directly/linearly rather than around. So the length would be very short in the middle of the tween. | ||
export function cpCoordsToAngles(segment, copy) { | ||
var result = copy ? segment.slice(0) : segment, | ||
x, y, i; | ||
for (i = 0; i < segment.length; i+=6) { | ||
x = segment[i+2] - segment[i]; | ||
y = segment[i+3] - segment[i+1]; | ||
result[i+2] = Math.atan2(y, x); | ||
result[i+3] = Math.sqrt(x * x + y * y); | ||
x = segment[i+6] - segment[i+4]; | ||
y = segment[i+7] - segment[i+5]; | ||
result[i+4] = Math.atan2(y, x); | ||
result[i+5] = Math.sqrt(x * x + y * y); | ||
} | ||
return result; | ||
} | ||
// takes a segment that was converted with cpCoordsToAngles() to have angles and lengths instead of coordinates for the control points, and converts it BACK into coordinates. | ||
export function cpAnglesToCoords(segment, copy) { | ||
var result = copy ? segment.slice(0) : segment, | ||
length = segment.length, | ||
rnd = 1000, | ||
angle, l, i, j; | ||
for (i = 0; i < length; i+=6) { | ||
angle = segment[i+2]; | ||
l = segment[i+3]; //length | ||
result[i+2] = (((segment[i] + Math.cos(angle) * l) * rnd) | 0) / rnd; | ||
result[i+3] = (((segment[i+1] + Math.sin(angle) * l) * rnd) | 0) / rnd; | ||
angle = segment[i+4]; | ||
l = segment[i+5]; //length | ||
result[i+4] = (((segment[i+6] - Math.cos(angle) * l) * rnd) | 0) / rnd; | ||
result[i+5] = (((segment[i+7] - Math.sin(angle) * l) * rnd) | 0) / rnd; | ||
} | ||
return result; | ||
} | ||
//adds an "isSmooth" array to each segment and populates it with a boolean value indicating whether or not it's smooth (the control points have basically the same slope). For any smooth control points, it converts the coordinates into angle (x, in radians) and length (y) and puts them into the same index value in a smoothData array. | ||
export function populateSmoothData(rawPath) { | ||
let j = rawPath.length, | ||
smooth, segment, x, y, x2, y2, i, l, a, a2, isSmooth, smoothData; | ||
while (--j > -1) { | ||
segment = rawPath[j]; | ||
isSmooth = segment.isSmooth = segment.isSmooth || [0, 0, 0, 0]; | ||
smoothData = segment.smoothData = segment.smoothData || [0, 0, 0, 0]; | ||
isSmooth.length = 4; | ||
l = segment.length - 2; | ||
for (i = 6; i < l; i += 6) { | ||
x = segment[i] - segment[i - 2]; | ||
y = segment[i + 1] - segment[i - 1]; | ||
x2 = segment[i + 2] - segment[i]; | ||
y2 = segment[i + 3] - segment[i + 1]; | ||
a = _atan2(y, x); | ||
a2 = _atan2(y2, x2); | ||
smooth = (Math.abs(a - a2) < 0.09); | ||
if (smooth) { | ||
smoothData[i - 2] = a; | ||
smoothData[i + 2] = a2; | ||
smoothData[i - 1] = _sqrt(x * x + y * y); | ||
smoothData[i + 3] = _sqrt(x2 * x2 + y2 * y2); | ||
} | ||
isSmooth.push(smooth, smooth, 0, 0, smooth, smooth); | ||
} | ||
//if the first and last points are identical, check to see if there's a smooth transition. We must handle this a bit differently due to their positions in the array. | ||
if (segment[l] === segment[0] && segment[l+1] === segment[1]) { | ||
x = segment[0] - segment[l-2]; | ||
y = segment[1] - segment[l-1]; | ||
x2 = segment[2] - segment[0]; | ||
y2 = segment[3] - segment[1]; | ||
a = _atan2(y, x); | ||
a2 = _atan2(y2, x2); | ||
if (Math.abs(a - a2) < 0.09) { | ||
smoothData[l-2] = a; | ||
smoothData[2] = a2; | ||
smoothData[l-1] = _sqrt(x * x + y * y); | ||
smoothData[3] = _sqrt(x2 * x2 + y2 * y2); | ||
isSmooth[l-2] = isSmooth[l-1] = true; //don't change indexes 2 and 3 because we'll trigger everything from the END, and this will optimize file size a bit. | ||
} | ||
} | ||
} | ||
return rawPath; | ||
} | ||
export function pointToScreen(svgElement, point) { | ||
if (arguments.length < 2) { //by default, take the first set of coordinates in the path as the point | ||
let rawPath = getRawPath(svgElement); | ||
point = svgElement.ownerSVGElement.createSVGPoint(); | ||
point.x = rawPath[0][0]; | ||
point.y = rawPath[0][1]; | ||
} | ||
return point.matrixTransform(svgElement.getScreenCTM()); | ||
} | ||
*/ | ||
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-10-03 | ||
* http://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/ | ||
/* eslint-disable */ | ||
var _doc, | ||
@@ -1307,3 +1112,2 @@ _win, | ||
if (!(_transformProp in element.style) && "msTransform" in element.style) { | ||
//to improve compatibility with old Microsoft browsers | ||
_transformProp = "msTransform"; | ||
@@ -1319,4 +1123,3 @@ _transformOriginProp = _transformProp + "Origin"; | ||
_svgTemps = [], | ||
//we create 3 elements for SVG, and 3 for other DOM elements and cache them for performance reasons. They get nested in _divContainer and _svgContainer so that just one element is added to the DOM on each successive attempt. Again, performance is key. | ||
_divTemps = [], | ||
_divTemps = [], | ||
_divContainer, | ||
@@ -1386,7 +1189,6 @@ _svgContainer, | ||
if (svg) { | ||
b = isRootSVG ? { | ||
b = isRootSVG || element.tagName.toLowerCase() === "g" ? { | ||
x: 0, | ||
y: 0 | ||
} : element.getBBox(); //may need to make x/y 0,0 if the element is a <g>. | ||
} : element.getBBox(); | ||
m = element.transform.baseVal; | ||
@@ -1400,4 +1202,3 @@ | ||
m = new Matrix2D(); | ||
x = b.x; //MAY NEED TO BE 0, 0 | ||
x = b.x; | ||
y = b.y; | ||
@@ -1429,5 +1230,3 @@ } | ||
var Matrix2D = | ||
/*#__PURE__*/ | ||
function () { | ||
var Matrix2D = function () { | ||
function Matrix2D(a, b, c, d, e, f) { | ||
@@ -1519,10 +1318,3 @@ if (a === void 0) { | ||
return Matrix2D; | ||
}(); //feed in an element and it'll return a 2D matrix (optionally inverted) so that you can translate between coordinate spaces. | ||
// Inverting lets you translate a global point into a local coordinate space. No inverting lets you go the other way. | ||
// We needed this to work around various browser bugs, like Firefox doesn't accurately report getScreenCTM() when there | ||
// are transforms applied to ancestor elements. | ||
// The matrix math to convert any x/y coordinate is: | ||
// tx = m.a * x + m.c * y + m.e | ||
// ty = m.b * x + m.d * y + m.f | ||
}(); | ||
function getGlobalMatrix(element, inverse) { | ||
@@ -1547,9 +1339,8 @@ if (!element.parentNode) { | ||
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-09-27 | ||
* http://greensock.com | ||
* MotionPathPlugin 3.0.0 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @license Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
@@ -1566,6 +1357,5 @@ */ | ||
_getGSAP = function _getGSAP() { | ||
return gsap || typeof window !== "undefined" && (gsap = window.gsap); | ||
return gsap || typeof window !== "undefined" && (gsap = window.gsap) && gsap.registerPlugin && gsap; | ||
}, | ||
_populateSegmentFromArray = function _populateSegmentFromArray(segment, values, property, mode) { | ||
//mode: 0 = x but don't fill y yet, 1 = y. | ||
var l = values.length, | ||
@@ -1617,3 +1407,3 @@ si = mode, | ||
return cacheRawPathMeasurements(segment, vars.resolution || (vars.curviness === 0 ? 20 : 12)); //when curviness is 0, it creates control points right on top of the anchors which makes it more sensitive to resolution, thus we change the default accordingly. | ||
return cacheRawPathMeasurements(segment, vars.resolution || (vars.curviness === 0 ? 20 : 12)); | ||
}, | ||
@@ -1625,3 +1415,3 @@ _emptyFunc = function _emptyFunc(v) { | ||
var align = _ref.align, | ||
transform = _ref.transform, | ||
matrix = _ref.matrix, | ||
offsetX = _ref.offsetX, | ||
@@ -1646,10 +1436,7 @@ offsetY = _ref.offsetY; | ||
y: 0 | ||
}).progress(1); //get rid of transforms, otherwise they'll throw off the measurements. | ||
targetMatrix = getGlobalMatrix(target); //we cannot use something like getScreenCTM() because of a major bug in Firefox that has existed for years and prevents values from being reported correctly when an ancestor element has transforms applied. Our proprietary getGlobalMatrix() works across all browsers. | ||
}).progress(1); | ||
targetMatrix = getGlobalMatrix(target); | ||
tween.render(-1).kill(); | ||
if (alignTarget.getTotalLength && alignTarget.tagName.toLowerCase() === "path") { | ||
//path | ||
alignPath = getRawPath(alignTarget); | ||
@@ -1679,4 +1466,4 @@ alignMatrix = getGlobalMatrix(alignTarget.parentNode); | ||
if (transform) { | ||
transformRawPath(rawPath, transform[0], transform[1], transform[2], transform[3], transform[4], transform[5]); | ||
if (matrix) { | ||
transformRawPath(rawPath, matrix.a, matrix.b, matrix.c, matrix.d, matrix.e, matrix.f); | ||
} else if (offsetX || offsetY) { | ||
@@ -1738,10 +1525,7 @@ transformRawPath(rawPath, 1, 0, 0, 1, offsetX || 0, offsetY || 0); | ||
if (this.rotate = autoRotate || autoRotate === 0) { | ||
//get the rotational data FIRST so that the setTransform() method is called in the correct order in the render() loop - rotation gets set last. | ||
this.rOffset = parseFloat(autoRotate) || 0; | ||
this.radians = !!vars.useRadians; | ||
this.rProp = vars.rotation || "rotation"; // rotation property | ||
this.rSet = target._gsap.set(target, this.rProp, this); // rotation setter | ||
this.ru = _getUnit(target._gsap.get(target, this.rProp)) || 0; // rotation units | ||
this.rProp = vars.rotation || "rotation"; | ||
this.rSet = target._gsap.set(target, this.rProp, this); | ||
this.ru = _getUnit(target._gsap.get(target, this.rProp)) || 0; | ||
} | ||
@@ -1759,3 +1543,2 @@ | ||
if (x && y) { | ||
//correlated values | ||
rawPaths.push(_segmentToRawPath(this, _populateSegmentFromArray(_populateSegmentFromArray([], path, x, 0), path, y, 1), target, vars.x || x, vars.y || y, slicer, vars)); | ||
@@ -1762,0 +1545,0 @@ } else { |
@@ -1,22 +0,11 @@ | ||
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t=t||self).window=t.window||{})}(this,function(t){"use strict";function p(t){return"string"==typeof t}function x(t,e,n,r){var a=t[e],o=1===r?6:subdivideSegment(a,n,r);if(o&&o+n+2<a.length)return t.splice(e,0,a.slice(0,n+o+2)),a.splice(0,n+o),1}function A(t,e){var n=t.length,r=t[n-1]||[],a=r.length;e[0]===r[a-2]&&e[1]===r[a-1]&&(e=r.concat(e.slice(2)),n--),t[n]=e}var y=/[achlmqstvz]|(-?\d*\.?\d*(?:e[\-+]?\d+)?)[0-9]/gi,T=/(?:(-)?\d*\.?\d*(?:e[\-+]?\d+)?)[0-9]/gi,b=/[\+\-]?\d*\.?\d+e[\+\-]?\d+/gi,r=/(^[#\.][a-z]|[a-y][a-z])/i,X=Math.PI/180,s=180/Math.PI,Y=Math.sin,F=Math.cos,U=Math.abs,Z=Math.sqrt,L=Math.atan2,C=1e8,h=function _isNumber(t){return"number"==typeof t},S={},z={},e=1e5,d=function _wrapProgress(t){return Math.round((t+C)%1*e)/e||(t<0?0:1)},B=function _round(t){return~~(t*e+(t<0?-.5:.5))/e},D=function _copyMetaData(t,e){return e.totalLength=t.totalLength,t.samples?(e.samples=t.samples.slice(0),e.lookup=t.lookup.slice(0),e.minLength=t.minLength,e.resolution=t.resolution):e.totalPoints=t.totalPoints,e};function getRawPath(t){var e,n=(t=p(t)&&r.test(t)&&document.querySelector(t)||t).getAttribute?t:0;return n&&(t=t.getAttribute("d"))?(n._gsPath||(n._gsPath={}),(e=n._gsPath[t])&&!e._dirty?e:n._gsPath[t]=stringToRawPath(t)):t?p(t)?stringToRawPath(t):h(t[0])?[t]:t:console.warn("Expecting a <path> element or an SVG path data string")}function reverseSegment(t){var e,n=0;for(t.reverse();n<t.length;n+=2)e=t[n],t[n]=t[n+1],t[n+1]=e;t.reversed=!t.reversed}var G={rect:"rx,ry,x,y,width,height",circle:"r,cx,cy",ellipse:"rx,ry,cx,cy",line:"x1,x2,y1,y2"};function convertToPath(t,e){var n,r,a,o,i,s,h,l,u,g,f,c,p,d,m,v,P,w,x,y,b,M,R=t.tagName.toLowerCase(),L=.552284749831;return"path"!==R&&t.getBBox?(s=function _createPath(t,e){var n,r=document.createElementNS("http://www.w3.org/2000/svg","path"),a=[].slice.call(t.attributes),o=a.length;for(e=","+e+",";-1<--o;)n=a[o].nodeName.toLowerCase(),e.indexOf(","+n+",")<0&&r.setAttributeNS(null,n,a[o].nodeValue);return r}(t,"x,y,width,height,cx,cy,rx,ry,r,x1,x2,y1,y2,points"),M=function _attrToObj(t,e){for(var n=e?e.split(","):[],r={},a=n.length;-1<--a;)r[n[a]]=+t.getAttribute(n[a])||0;return r}(t,G[R]),"rect"===R?(o=M.rx,i=M.ry,r=M.x,a=M.y,g=M.width-2*o,f=M.height-2*i,n=o||i?"M"+(v=(d=(p=r+o)+g)+o)+","+(w=a+i)+" V"+(x=w+f)+" C"+[v,y=x+i*L,m=d+o*L,b=x+i,d,b,d-(d-p)/3,b,p+(d-p)/3,b,p,b,c=r+o*(1-L),b,r,y,r,x,r,x-(x-w)/3,r,w+(x-w)/3,r,w,r,P=a+i*(1-L),c,a,p,a,p+(d-p)/3,a,d-(d-p)/3,a,d,a,m,a,v,P,v,w].join(",")+"z":"M"+(r+g)+","+a+" v"+f+" h"+-g+" v"+-f+" h"+g+"z"):"circle"===R||"ellipse"===R?(l="circle"===R?(o=i=M.r)*L:(o=M.rx,(i=M.ry)*L),n="M"+((r=M.cx)+o)+","+(a=M.cy)+" C"+[r+o,a+l,r+(h=o*L),a+i,r,a+i,r-h,a+i,r-o,a+l,r-o,a,r-o,a-l,r-h,a-i,r,a-i,r+h,a-i,r+o,a-l,r+o,a].join(",")+"z"):"line"===R?n="M"+M.x1+","+M.y1+" L"+M.x2+","+M.y2:"polyline"!==R&&"polygon"!==R||(n="M"+(r=(u=(t.getAttribute("points")+"").match(T)||[]).shift())+","+(a=u.shift())+" L"+u.join(","),"polygon"===R&&(n+=","+r+","+a+"z")),s.setAttribute("d",rawPathToString(s._gsRawPath=stringToRawPath(n))),e&&t.parentNode&&(t.parentNode.insertBefore(s,t),t.parentNode.removeChild(t)),s):t}function getRotationAtBezierT(t,e,n){var r,a=t[e],o=t[e+2],i=t[e+4];return a+=(o-a)*n,a+=((o+=(i-o)*n)-a)*n,r=o+(i+(t[e+6]-i)*n-o)*n-a,a=t[e+1],a+=((o=t[e+3])-a)*n,a+=((o+=((i=t[e+5])-o)*n)-a)*n,B(L(o+(i+(t[e+7]-i)*n-o)*n-a,r)*s)}function sliceRawPath(t,e,n){!function _isUndefined(t){return void 0===t}(n)||(n=1);var r=n<(e=e||0),a=Math.max(0,~~(U(n-e)-1e-8));if(r&&(r=n,n=e,e=r,r=1,a-=a?1:0),e<0||n<0){var o=1+~~Math.min(e,n);e+=o,n+=o}var i,s,h,l,u,g,f,c=function copyRawPath(t){for(var e=[],n=0;n<t.length;n++)e[n]=D(t[n],t[n].slice(0));return D(t,e)}(t.totalLength?t:cacheRawPathMeasurements(t)),p=1<n,d=getProgressData(c,e,S),m=getProgressData(c,n,z),v=m.segment,P=d.segment,w=m.segIndex,y=d.segIndex,b=m.i,M=d.i,R=y===w,L=b===M&&R,T=R&&b<M||L&&d.t>m.t;if(p||a){if(x(c,y,M,d.t)&&(i=1,y++,L?T?m.t/=d.t:(m.t=(m.t-d.t)/(1-d.t),w++,b=0):y<=w+1&&!T&&(w++,R&&(b-=M))),m.t?x(c,w,b,m.t)&&(T&&i&&y++,r&&w++):(w--,r&&y--),l=[],g=1+(u=c.length)*a,f=y,r)for(g+=(u-(w=(w||u)-1)+y)%u,h=0;h<g;h++)A(l,c[f]),f=(f||u)-1;else for(g+=(u-y+w)%u,h=0;h<g;h++)A(l,c[f++%u]);c=l}else if(s=1===m.t?6:subdivideSegment(v,b,m.t),e!==n)for(i=subdivideSegment(P,M,L?d.t/m.t:d.t),R&&(s+=i),v.splice(b+s+2),i&&P.splice(0,M+i),h=c.length;h--;)(h<y||w<h)&&c.splice(h,1);else v.angle=getRotationAtBezierT(v,b+s,0),d=v[b+=s],m=v[b+1],v.length=v.totalLength=0,v.totalPoints=c.totalPoints=8,v.push(d,m,d,m,d,m,d,m);return r&&function _reverseRawPath(t,e){var n=t.length;for(e||t.reverse();n--;)t[n].reversed||reverseSegment(t[n])}(c,p||a),c.totalLength=0,c}function measureSegment(t,e,n){e=e||0,t.samples||(t.samples=[],t.lookup=[]);var r,a,o,i,s,h,l,u,g,f,c,p,d,m,v,P,w,x=~~t.resolution||12,y=1/x,b=n?e+6*n+1:t.length,M=t[e],R=t[e+1],L=e?e/6*x:0,T=t.samples,_=t.lookup,N=(e?t.minLength:C)||C,S=T[L+n*x-1],A=e?T[L-1]:0;for(T.length=_.length=0,a=e+2;a<b;a+=6){for(o=t[a+4]-M,i=t[a+2]-M,s=t[a]-M,u=t[a+5]-R,g=t[a+3]-R,f=t[a+1]-R,h=l=c=p=0,r=1;r<=x;r++)h=l-(l=((m=y*r)*m*o+3*(d=1-m)*(m*i+d*s))*m),c=p-(p=(m*m*u+3*d*(m*g+d*f))*m),(P=Z(c*c+h*h))<N&&(N=P),A+=P,T[L++]=A;M+=o,R+=u}if(S)for(S-=A;L<T.length;L++)T[L]+=S;if(T.length&&N)for(t.totalLength=w=T[T.length-1]||0,t.minLength=N,P=v=0,r=0;r<w;r+=N)_[P++]=T[v]<r?++v:v;else t.totalLength=T[0]=0;return e?A-T[e/2-1]:A}function cacheRawPathMeasurements(t,e){var n,r,a;for(a=n=r=0;a<t.length;a++)t[a].resolution=~~e||12,r+=t[a].length,n+=measureSegment(t[a]);return t.totalPoints=r,t.totalLength=n,t}function subdivideSegment(t,e,n){if(n<=0||1<=n)return 0;var r=t[e],a=t[e+1],o=t[e+2],i=t[e+3],s=t[e+4],h=t[e+5],l=r+(o-r)*n,u=o+(s-o)*n,g=a+(i-a)*n,f=i+(h-i)*n,c=l+(u-l)*n,p=g+(f-g)*n,d=s+(t[e+6]-s)*n,m=h+(t[e+7]-h)*n;return u+=(d-u)*n,f+=(m-f)*n,t.splice(e+2,4,B(l),B(g),B(c),B(p),B(c+(u-c)*n),B(p+(f-p)*n),B(u),B(f),B(d),B(m)),t.samples&&t.samples.splice(e/6*t.resolution|0,0,0,0,0,0,0,0),6}function getProgressData(t,e,n){n=n||{},t.totalLength||cacheRawPathMeasurements(t),(e<0||1<e)&&(e=d(e));var r,a,o,i,s,h,l=0,u=t[0];if(1<t.length){for(o=t.totalLength*e,s=h=0;(s+=t[h++].totalLength)<o;)l=h;e=(o-(i=s-(u=t[l]).totalLength))/(s-i)||0}return r=u.samples,a=u.resolution,o=u.totalLength*e,i=(h=u.lookup[~~(o/u.minLength)]||0)?r[h-1]:0,(s=r[h])<o&&(i=s,s=r[++h]),n.path=t,n.segment=u,n.segIndex=l,n.i=6*~~(h/a),n.t=1/a*((o-i)/(s-i)+h%a),n}function getPositionOnPath(t,e,n,r){var a,o,i,s,h,l,u,g,f,c=t[0],p=r||{};if((e<0||1<e)&&(e=d(e)),1<t.length){for(i=t.totalLength*e,h=l=0;(h+=t[l++].totalLength)<i;)c=t[l];e=(i-(s=h-c.totalLength))/(h-s)||0}return a=c.samples,o=c.resolution,i=c.totalLength*e,s=(l=c.lookup[~~(i/c.minLength)]||0)?a[l-1]:0,(h=a[l])<i&&(s=h,h=a[++l]),f=1-(u=1/o*((i-s)/(h-s)+l%o)||0),g=c[l=6*~~(l/o)],p.x=B((u*u*(c[l+6]-g)+3*f*(u*(c[l+4]-g)+f*(c[l+2]-g)))*u+g),p.y=B((u*u*(c[l+7]-(g=c[l+1]))+3*f*(u*(c[l+5]-g)+f*(c[l+3]-g)))*u+g),n&&(p.angle=c.totalLength?getRotationAtBezierT(c,l,1<=u?1-1e-9:u||1e-9):c.angle||0),p}function transformRawPath(t,e,n,r,a,o,i){for(var s,h,l,u,g,f=t.length;-1<--f;)for(h=(s=t[f]).length,l=0;l<h;l+=2)u=s[l],g=s[l+1],s[l]=u*e+g*r+o,s[l+1]=u*n+g*a+i;return t._dirty=1,t}function arcToSegment(t,e,n,r,a,o,i,s,h){if(t!==s||e!==h){n=U(n),r=U(r);var l=a%360*X,u=F(l),g=Y(l),f=Math.PI,c=2*f,p=(t-s)/2,d=(e-h)/2,m=u*p+g*d,v=-g*p+u*d,P=m*m,w=v*v,x=P/(n*n)+w/(r*r);1<x&&(n=Z(x)*n,r=Z(x)*r);var y=n*n,b=r*r,M=(y*b-y*w-b*P)/(y*w+b*P);M<0&&(M=0);var R=(o===i?-1:1)*Z(M),L=n*v/r*R,T=-r*m/n*R,_=u*L-g*T+(t+s)/2,N=g*L+u*T+(e+h)/2,S=(m-L)/n,A=(v-T)/r,C=(-m-L)/n,O=(-v-T)/r,z=S*S+A*A,B=(A<0?-1:1)*Math.acos(S/Z(z)),D=(S*O-A*C<0?-1:1)*Math.acos((S*C+A*O)/Z(z*(C*C+O*O)));isNaN(D)&&(D=f),!i&&0<D?D-=c:i&&D<0&&(D+=c),B%=c,D%=c;var G,I=Math.ceil(U(D)/(c/4)),k=[],j=D/I,E=4/3*Y(j/2)/(1+F(j/2)),$=u*n,V=g*n,q=g*-r,Q=u*r;for(G=0;G<I;G++)m=F(a=B+G*j),v=Y(a),S=F(a+=j),A=Y(a),k.push(m-E*v,v+E*m,S+E*A,A-E*S,S,A);for(G=0;G<k.length;G+=2)m=k[G],v=k[G+1],k[G]=m*$+v*q+_,k[G+1]=m*V+v*Q+N;return k[G-2]=s,k[G-1]=h,k}}function stringToRawPath(t){function af(t,e,n,r){u=(n-t)/3,g=(r-e)/3,s.push(t+u,e+g,n-u,r-g,n,r)}var e,n,r,a,o,i,s,h,l,u,g,f,c,p=(t+"").replace(b,function(t){var e=+t;return e<1e-4&&-1e-4<e?0:e}).match(y)||[],d=[],m=0,v=0,P=p.length,w=0,x="ERROR: malformed path: "+t;if(!t||!isNaN(p[0])||isNaN(p[1]))return console.log(x),d;for(e=0;e<P;e++)if(c=o,isNaN(p[e])?i=(o=p[e].toUpperCase())!==p[e]:e--,r=+p[e+1],a=+p[e+2],i&&(r+=m,a+=v),e||(h=r,l=a),"M"===o)s&&(s.length<8?d.length-=1:w+=s.length),m=h=r,v=l=a,s=[r,a],d.push(s),e+=2,o="L";else if("C"===o)i||(m=v=0),(s=s||[0,0]).push(r,a,m+1*p[e+3],v+1*p[e+4],m+=1*p[e+5],v+=1*p[e+6]),e+=6;else if("S"===o)u=m,g=v,"C"!==c&&"S"!==c||(u+=m-s[s.length-4],g+=v-s[s.length-3]),i||(m=v=0),s.push(u,g,r,a,m+=1*p[e+3],v+=1*p[e+4]),e+=4;else if("Q"===o)u=m+2/3*(r-m),g=v+2/3*(a-v),i||(m=v=0),m+=1*p[e+3],v+=1*p[e+4],s.push(u,g,m+2/3*(r-m),v+2/3*(a-v),m,v),e+=4;else if("T"===o)u=m-s[s.length-4],g=v-s[s.length-3],s.push(m+u,v+g,r+2/3*(m+1.5*u-r),a+2/3*(v+1.5*g-a),m=r,v=a),e+=2;else if("H"===o)af(m,v,m=r,v),e+=1;else if("V"===o)af(m,v,m,v=r+(i?v-m:0)),e+=1;else if("L"===o||"Z"===o)"Z"===o&&(r=h,a=l,s.closed=!0),("L"===o||.5<U(m-r)||.5<U(v-a))&&(af(m,v,r,a),"L"===o&&(e+=2)),m=r,v=a;else if("A"===o){if(f=arcToSegment(m,v,+p[e+1],+p[e+2],+p[e+3],+p[e+4],+p[e+5],(i?m:0)+1*p[e+6],(i?v:0)+1*p[e+7]))for(n=0;n<f.length;n++)s.push(f[n]);m=s[s.length-2],v=s[s.length-1],e+=7}else console.log(x);return(e=s.length)<6?(d.pop(),e=0):s[0]===s[e-2]&&s[1]===s[e-1]&&(s.closed=!0),d.totalPoints=w+e,d}function flatPointsToSegment(t,e){void 0===e&&(e=1);for(var n=t[0],r=0,a=[n,r],o=2;o<t.length;o+=2)a.push(n,r,t[o],r=(t[o]-n)*e/2,n=t[o],-r);return a}function pointsToSegment(t,e,n){var r,a,o,i,s,h,l,u,g,f,c,p,d,m,v=t.length-2,P=+t[0],w=+t[1],x=+t[2],y=+t[3],b=[P,w,P,w],M=x-P,R=y-w;for(isNaN(n)&&(n=Math.PI/10),e=e||0===e?+e:1,s=2;s<v;s+=2)r=P,a=w,P=x,w=y,p=(h=M)*h+(u=R)*u,d=(M=(x=+t[s+2])-P)*M+(R=(y=+t[s+3])-w)*R,m=(l=x-r)*l+(g=y-a)*g,c=(o=Math.acos((p+d-m)/Z(4*p*d)))/Math.PI*e,f=Z(p)*c,c*=Z(d),P===r&&w===a||(n<o?(i=L(g,l),b.push(B(P-F(i)*f),B(w-Y(i)*f),B(P),B(w),B(P+F(i)*c),B(w+Y(i)*c))):(i=L(u,h),b.push(B(P-F(i)*f),B(w-Y(i)*f)),i=L(R,M),b.push(B(P),B(w),B(P+F(i)*c),B(w+Y(i)*c))));return b.push(B(x),B(y),B(x),B(y)),b}function rawPathToString(t){h(t[0])&&(t=[t]);var e,n,r,a,o="",i=t.length;for(n=0;n<i;n++){for(a=t[n],o+="M"+B(a[0])+","+B(a[1])+" C",e=a.length,r=2;r<e;r++)o+=B(a[r++])+","+B(a[r++])+" "+B(a[r++])+","+B(a[r++])+" "+B(a[r++])+","+B(a[r])+" ";a.closed&&(o+="z")}return o} | ||
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t=t||self).window=t.window||{})}(this,function(t){"use strict";function p(t){return"string"==typeof t}function x(t,e,n,r){var a=t[e],o=1===r?6:subdivideSegment(a,n,r);if(o&&o+n+2<a.length)return t.splice(e,0,a.slice(0,n+o+2)),a.splice(0,n+o),1}function A(t,e){var n=t.length,r=t[n-1]||[],a=r.length;e[0]===r[a-2]&&e[1]===r[a-1]&&(e=r.concat(e.slice(2)),n--),t[n]=e}var y=/[achlmqstvz]|(-?\d*\.?\d*(?:e[\-+]?\d+)?)[0-9]/gi,T=/(?:(-)?\d*\.?\d*(?:e[\-+]?\d+)?)[0-9]/gi,b=/[\+\-]?\d*\.?\d+e[\+\-]?\d+/gi,r=/(^[#\.][a-z]|[a-y][a-z])/i,X=Math.PI/180,s=180/Math.PI,Y=Math.sin,F=Math.cos,U=Math.abs,Z=Math.sqrt,L=Math.atan2,C=1e8,l=function _isNumber(t){return"number"==typeof t},S={},z={},e=1e5,d=function _wrapProgress(t){return Math.round((t+C)%1*e)/e||(t<0?0:1)},B=function _round(t){return~~(t*e+(t<0?-.5:.5))/e},D=function _copyMetaData(t,e){return e.totalLength=t.totalLength,t.samples?(e.samples=t.samples.slice(0),e.lookup=t.lookup.slice(0),e.minLength=t.minLength,e.resolution=t.resolution):e.totalPoints=t.totalPoints,e};function getRawPath(t){var e,n=(t=p(t)&&r.test(t)&&document.querySelector(t)||t).getAttribute?t:0;return n&&(t=t.getAttribute("d"))?(n._gsPath||(n._gsPath={}),(e=n._gsPath[t])&&!e._dirty?e:n._gsPath[t]=stringToRawPath(t)):t?p(t)?stringToRawPath(t):l(t[0])?[t]:t:console.warn("Expecting a <path> element or an SVG path data string")}function reverseSegment(t){var e,n=0;for(t.reverse();n<t.length;n+=2)e=t[n],t[n]=t[n+1],t[n+1]=e;t.reversed=!t.reversed}var G={rect:"rx,ry,x,y,width,height",circle:"r,cx,cy",ellipse:"rx,ry,cx,cy",line:"x1,x2,y1,y2"};function convertToPath(t,e){var n,r,a,o,i,s,l,h,u,g,f,c,p,d,m,v,P,w,x,y,b,M,R=t.tagName.toLowerCase(),L=.552284749831;return"path"!==R&&t.getBBox?(s=function _createPath(t,e){var n,r=document.createElementNS("http://www.w3.org/2000/svg","path"),a=[].slice.call(t.attributes),o=a.length;for(e=","+e+",";-1<--o;)n=a[o].nodeName.toLowerCase(),e.indexOf(","+n+",")<0&&r.setAttributeNS(null,n,a[o].nodeValue);return r}(t,"x,y,width,height,cx,cy,rx,ry,r,x1,x2,y1,y2,points"),M=function _attrToObj(t,e){for(var n=e?e.split(","):[],r={},a=n.length;-1<--a;)r[n[a]]=+t.getAttribute(n[a])||0;return r}(t,G[R]),"rect"===R?(o=M.rx,i=M.ry,r=M.x,a=M.y,g=M.width-2*o,f=M.height-2*i,n=o||i?"M"+(v=(d=(p=r+o)+g)+o)+","+(w=a+i)+" V"+(x=w+f)+" C"+[v,y=x+i*L,m=d+o*L,b=x+i,d,b,d-(d-p)/3,b,p+(d-p)/3,b,p,b,c=r+o*(1-L),b,r,y,r,x,r,x-(x-w)/3,r,w+(x-w)/3,r,w,r,P=a+i*(1-L),c,a,p,a,p+(d-p)/3,a,d-(d-p)/3,a,d,a,m,a,v,P,v,w].join(",")+"z":"M"+(r+g)+","+a+" v"+f+" h"+-g+" v"+-f+" h"+g+"z"):"circle"===R||"ellipse"===R?(h="circle"===R?(o=i=M.r)*L:(o=M.rx,(i=M.ry)*L),n="M"+((r=M.cx)+o)+","+(a=M.cy)+" C"+[r+o,a+h,r+(l=o*L),a+i,r,a+i,r-l,a+i,r-o,a+h,r-o,a,r-o,a-h,r-l,a-i,r,a-i,r+l,a-i,r+o,a-h,r+o,a].join(",")+"z"):"line"===R?n="M"+M.x1+","+M.y1+" L"+M.x2+","+M.y2:"polyline"!==R&&"polygon"!==R||(n="M"+(r=(u=(t.getAttribute("points")+"").match(T)||[]).shift())+","+(a=u.shift())+" L"+u.join(","),"polygon"===R&&(n+=","+r+","+a+"z")),s.setAttribute("d",rawPathToString(s._gsRawPath=stringToRawPath(n))),e&&t.parentNode&&(t.parentNode.insertBefore(s,t),t.parentNode.removeChild(t)),s):t}function getRotationAtBezierT(t,e,n){var r,a=t[e],o=t[e+2],i=t[e+4];return a+=(o-a)*n,a+=((o+=(i-o)*n)-a)*n,r=o+(i+(t[e+6]-i)*n-o)*n-a,a=t[e+1],a+=((o=t[e+3])-a)*n,a+=((o+=((i=t[e+5])-o)*n)-a)*n,B(L(o+(i+(t[e+7]-i)*n-o)*n-a,r)*s)}function sliceRawPath(t,e,n){!function _isUndefined(t){return void 0===t}(n)||(n=1);var r=n<(e=e||0),a=Math.max(0,~~(U(n-e)-1e-8));if(r&&(r=n,n=e,e=r,r=1,a-=a?1:0),e<0||n<0){var o=1+~~Math.min(e,n);e+=o,n+=o}var i,s,l,h,u,g,f,c=function copyRawPath(t){for(var e=[],n=0;n<t.length;n++)e[n]=D(t[n],t[n].slice(0));return D(t,e)}(t.totalLength?t:cacheRawPathMeasurements(t)),p=1<n,d=getProgressData(c,e,S),m=getProgressData(c,n,z),v=m.segment,P=d.segment,w=m.segIndex,y=d.segIndex,b=m.i,M=d.i,R=y===w,L=b===M&&R,T=R&&b<M||L&&d.t>m.t;if(p||a){if(x(c,y,M,d.t)&&(i=1,y++,L?T?m.t/=d.t:(m.t=(m.t-d.t)/(1-d.t),w++,b=0):y<=w+1&&!T&&(w++,R&&(b-=M))),m.t?x(c,w,b,m.t)&&(T&&i&&y++,r&&w++):(w--,r&&y--),h=[],g=1+(u=c.length)*a,f=y,r)for(g+=(u-(w=(w||u)-1)+y)%u,l=0;l<g;l++)A(h,c[f]),f=(f||u)-1;else for(g+=(u-y+w)%u,l=0;l<g;l++)A(h,c[f++%u]);c=h}else if(s=1===m.t?6:subdivideSegment(v,b,m.t),e!==n)for(i=subdivideSegment(P,M,L?d.t/m.t:d.t),R&&(s+=i),v.splice(b+s+2),i&&P.splice(0,M+i),l=c.length;l--;)(l<y||w<l)&&c.splice(l,1);else v.angle=getRotationAtBezierT(v,b+s,0),d=v[b+=s],m=v[b+1],v.length=v.totalLength=0,v.totalPoints=c.totalPoints=8,v.push(d,m,d,m,d,m,d,m);return r&&function _reverseRawPath(t,e){var n=t.length;for(e||t.reverse();n--;)t[n].reversed||reverseSegment(t[n])}(c,p||a),c.totalLength=0,c}function measureSegment(t,e,n){e=e||0,t.samples||(t.samples=[],t.lookup=[]);var r,a,o,i,s,l,h,u,g,f,c,p,d,m,v,P,w,x=~~t.resolution||12,y=1/x,b=n?e+6*n+1:t.length,M=t[e],R=t[e+1],L=e?e/6*x:0,T=t.samples,N=t.lookup,_=(e?t.minLength:C)||C,S=T[L+n*x-1],A=e?T[L-1]:0;for(T.length=N.length=0,a=e+2;a<b;a+=6){for(o=t[a+4]-M,i=t[a+2]-M,s=t[a]-M,u=t[a+5]-R,g=t[a+3]-R,f=t[a+1]-R,l=h=c=p=0,r=1;r<=x;r++)l=h-(h=((m=y*r)*m*o+3*(d=1-m)*(m*i+d*s))*m),c=p-(p=(m*m*u+3*d*(m*g+d*f))*m),(P=Z(c*c+l*l))<_&&(_=P),A+=P,T[L++]=A;M+=o,R+=u}if(S)for(S-=A;L<T.length;L++)T[L]+=S;if(T.length&&_)for(t.totalLength=w=T[T.length-1]||0,t.minLength=_,P=v=0,r=0;r<w;r+=_)N[P++]=T[v]<r?++v:v;else t.totalLength=T[0]=0;return e?A-T[e/2-1]:A}function cacheRawPathMeasurements(t,e){var n,r,a;for(a=n=r=0;a<t.length;a++)t[a].resolution=~~e||12,r+=t[a].length,n+=measureSegment(t[a]);return t.totalPoints=r,t.totalLength=n,t}function subdivideSegment(t,e,n){if(n<=0||1<=n)return 0;var r=t[e],a=t[e+1],o=t[e+2],i=t[e+3],s=t[e+4],l=t[e+5],h=r+(o-r)*n,u=o+(s-o)*n,g=a+(i-a)*n,f=i+(l-i)*n,c=h+(u-h)*n,p=g+(f-g)*n,d=s+(t[e+6]-s)*n,m=l+(t[e+7]-l)*n;return u+=(d-u)*n,f+=(m-f)*n,t.splice(e+2,4,B(h),B(g),B(c),B(p),B(c+(u-c)*n),B(p+(f-p)*n),B(u),B(f),B(d),B(m)),t.samples&&t.samples.splice(e/6*t.resolution|0,0,0,0,0,0,0,0),6}function getProgressData(t,e,n){n=n||{},t.totalLength||cacheRawPathMeasurements(t),(e<0||1<e)&&(e=d(e));var r,a,o,i,s,l,h=0,u=t[0];if(1<t.length){for(o=t.totalLength*e,s=l=0;(s+=t[l++].totalLength)<o;)h=l;e=(o-(i=s-(u=t[h]).totalLength))/(s-i)||0}return r=u.samples,a=u.resolution,o=u.totalLength*e,i=(l=u.lookup[~~(o/u.minLength)]||0)?r[l-1]:0,(s=r[l])<o&&(i=s,s=r[++l]),n.path=t,n.segment=u,n.segIndex=h,n.i=6*~~(l/a),n.t=1/a*((o-i)/(s-i)+l%a),n}function getPositionOnPath(t,e,n,r){var a,o,i,s,l,h,u,g,f,c=t[0],p=r||{};if((e<0||1<e)&&(e=d(e)),1<t.length){for(i=t.totalLength*e,l=h=0;(l+=t[h++].totalLength)<i;)c=t[h];e=(i-(s=l-c.totalLength))/(l-s)||0}return a=c.samples,o=c.resolution,i=c.totalLength*e,s=(h=c.lookup[~~(i/c.minLength)]||0)?a[h-1]:0,(l=a[h])<i&&(s=l,l=a[++h]),f=1-(u=1/o*((i-s)/(l-s)+h%o)||0),g=c[h=6*~~(h/o)],p.x=B((u*u*(c[h+6]-g)+3*f*(u*(c[h+4]-g)+f*(c[h+2]-g)))*u+g),p.y=B((u*u*(c[h+7]-(g=c[h+1]))+3*f*(u*(c[h+5]-g)+f*(c[h+3]-g)))*u+g),n&&(p.angle=c.totalLength?getRotationAtBezierT(c,h,1<=u?1-1e-9:u||1e-9):c.angle||0),p}function transformRawPath(t,e,n,r,a,o,i){for(var s,l,h,u,g,f=t.length;-1<--f;)for(l=(s=t[f]).length,h=0;h<l;h+=2)u=s[h],g=s[h+1],s[h]=u*e+g*r+o,s[h+1]=u*n+g*a+i;return t._dirty=1,t}function arcToSegment(t,e,n,r,a,o,i,s,l){if(t!==s||e!==l){n=U(n),r=U(r);var h=a%360*X,u=F(h),g=Y(h),f=Math.PI,c=2*f,p=(t-s)/2,d=(e-l)/2,m=u*p+g*d,v=-g*p+u*d,P=m*m,w=v*v,x=P/(n*n)+w/(r*r);1<x&&(n=Z(x)*n,r=Z(x)*r);var y=n*n,b=r*r,M=(y*b-y*w-b*P)/(y*w+b*P);M<0&&(M=0);var R=(o===i?-1:1)*Z(M),L=n*v/r*R,T=-r*m/n*R,N=u*L-g*T+(t+s)/2,_=g*L+u*T+(e+l)/2,S=(m-L)/n,A=(v-T)/r,C=(-m-L)/n,O=(-v-T)/r,z=S*S+A*A,B=(A<0?-1:1)*Math.acos(S/Z(z)),D=(S*O-A*C<0?-1:1)*Math.acos((S*C+A*O)/Z(z*(C*C+O*O)));isNaN(D)&&(D=f),!i&&0<D?D-=c:i&&D<0&&(D+=c),B%=c,D%=c;var G,I=Math.ceil(U(D)/(c/4)),k=[],j=D/I,E=4/3*Y(j/2)/(1+F(j/2)),$=u*n,V=g*n,q=g*-r,Q=u*r;for(G=0;G<I;G++)m=F(a=B+G*j),v=Y(a),S=F(a+=j),A=Y(a),k.push(m-E*v,v+E*m,S+E*A,A-E*S,S,A);for(G=0;G<k.length;G+=2)m=k[G],v=k[G+1],k[G]=m*$+v*q+N,k[G+1]=m*V+v*Q+_;return k[G-2]=s,k[G-1]=l,k}}function stringToRawPath(t){function af(t,e,n,r){u=(n-t)/3,g=(r-e)/3,s.push(t+u,e+g,n-u,r-g,n,r)}var e,n,r,a,o,i,s,l,h,u,g,f,c,p=(t+"").replace(b,function(t){var e=+t;return e<1e-4&&-1e-4<e?0:e}).match(y)||[],d=[],m=0,v=0,P=p.length,w=0,x="ERROR: malformed path: "+t;if(!t||!isNaN(p[0])||isNaN(p[1]))return console.log(x),d;for(e=0;e<P;e++)if(c=o,isNaN(p[e])?i=(o=p[e].toUpperCase())!==p[e]:e--,r=+p[e+1],a=+p[e+2],i&&(r+=m,a+=v),e||(l=r,h=a),"M"===o)s&&(s.length<8?d.length-=1:w+=s.length),m=l=r,v=h=a,s=[r,a],d.push(s),e+=2,o="L";else if("C"===o)i||(m=v=0),(s=s||[0,0]).push(r,a,m+1*p[e+3],v+1*p[e+4],m+=1*p[e+5],v+=1*p[e+6]),e+=6;else if("S"===o)u=m,g=v,"C"!==c&&"S"!==c||(u+=m-s[s.length-4],g+=v-s[s.length-3]),i||(m=v=0),s.push(u,g,r,a,m+=1*p[e+3],v+=1*p[e+4]),e+=4;else if("Q"===o)u=m+2/3*(r-m),g=v+2/3*(a-v),i||(m=v=0),m+=1*p[e+3],v+=1*p[e+4],s.push(u,g,m+2/3*(r-m),v+2/3*(a-v),m,v),e+=4;else if("T"===o)u=m-s[s.length-4],g=v-s[s.length-3],s.push(m+u,v+g,r+2/3*(m+1.5*u-r),a+2/3*(v+1.5*g-a),m=r,v=a),e+=2;else if("H"===o)af(m,v,m=r,v),e+=1;else if("V"===o)af(m,v,m,v=r+(i?v-m:0)),e+=1;else if("L"===o||"Z"===o)"Z"===o&&(r=l,a=h,s.closed=!0),("L"===o||.5<U(m-r)||.5<U(v-a))&&(af(m,v,r,a),"L"===o&&(e+=2)),m=r,v=a;else if("A"===o){if(f=arcToSegment(m,v,+p[e+1],+p[e+2],+p[e+3],+p[e+4],+p[e+5],(i?m:0)+1*p[e+6],(i?v:0)+1*p[e+7]))for(n=0;n<f.length;n++)s.push(f[n]);m=s[s.length-2],v=s[s.length-1],e+=7}else console.log(x);return(e=s.length)<6?(d.pop(),e=0):s[0]===s[e-2]&&s[1]===s[e-1]&&(s.closed=!0),d.totalPoints=w+e,d}function flatPointsToSegment(t,e){void 0===e&&(e=1);for(var n=t[0],r=0,a=[n,r],o=2;o<t.length;o+=2)a.push(n,r,t[o],r=(t[o]-n)*e/2,n=t[o],-r);return a}function pointsToSegment(t,e,n){var r,a,o,i,s,l,h,u,g,f,c,p,d,m,v=t.length-2,P=+t[0],w=+t[1],x=+t[2],y=+t[3],b=[P,w,P,w],M=x-P,R=y-w;for(isNaN(n)&&(n=Math.PI/10),e=e||0===e?+e:1,s=2;s<v;s+=2)r=P,a=w,P=x,w=y,p=(l=M)*l+(u=R)*u,d=(M=(x=+t[s+2])-P)*M+(R=(y=+t[s+3])-w)*R,m=(h=x-r)*h+(g=y-a)*g,c=(o=Math.acos((p+d-m)/Z(4*p*d)))/Math.PI*e,f=Z(p)*c,c*=Z(d),P===r&&w===a||(n<o?(i=L(g,h),b.push(B(P-F(i)*f),B(w-Y(i)*f),B(P),B(w),B(P+F(i)*c),B(w+Y(i)*c))):(i=L(u,l),b.push(B(P-F(i)*f),B(w-Y(i)*f)),i=L(R,M),b.push(B(P),B(w),B(P+F(i)*c),B(w+Y(i)*c))));return b.push(B(x),B(y),B(x),B(y)),b}function rawPathToString(t){l(t[0])&&(t=[t]);var e,n,r,a,o="",i=t.length;for(n=0;n<i;n++){for(a=t[n],o+="M"+B(a[0])+","+B(a[1])+" C",e=a.length,r=2;r<e;r++)o+=B(a[r++])+","+B(a[r++])+" "+B(a[r++])+","+B(a[r++])+" "+B(a[r++])+","+B(a[r])+" ";a.closed&&(o+="z")}return o}function N(t){return t.ownerSVGElement||("svg"===(t.tagName+"").toLowerCase()?t:null)}function O(t,e){if(t.parentNode&&(h||function _setDoc(t){var e=t.ownerDocument||t;!(c in t.style)&&"msTransform"in t.style&&(m=(c="msTransform")+"Origin");for(;e.parentNode&&(e=e.parentNode););return u=window,h=e}(t))){var n=N(t),r=n?n.getAttribute("xmlns")||"http://www.w3.org/2000/svg":"http://www.w3.org/1999/xhtml",a=n?e?"rect":"g":"div",o=2!==e?0:100,i=3===e?100:0,s="position:absolute;display:block;",l=h.createElementNS?h.createElementNS(r.replace(/^https/,"http"),a):h.createElement(a);return e&&(n?(f=f||O(t),l.setAttribute("width",1),l.setAttribute("height",1),l.setAttribute("transform","translate("+o+","+i+")"),f.appendChild(l)):(g||((g=O(t)).style.cssText=s),l.style.cssText=s+"width:1px;height:1px;top:"+i+"px;left:"+o+"px",g.appendChild(l))),l}throw"Need document and parent."}function Q(t,e,n,r,a,o,i){return t.a=e,t.b=n,t.c=r,t.d=a,t.e=o,t.f=i,t}var h,u,g,f,n,c="transform",m=c+"Origin",v=[],P=[],w=((n=Matrix2D.prototype).inverse=function inverse(){var t=this.a,e=this.b,n=this.c,r=this.d,a=this.e,o=this.f,i=t*r-e*n;return Q(this,r/i,-e/i,-n/i,t/i,(n*o-r*a)/i,-(t*o-e*a)/i)},n.multiply=function multiply(t){var e=this.a,n=this.b,r=this.c,a=this.d,o=this.e,i=this.f,s=t.a,l=t.c,h=t.b,u=t.d,g=t.e,f=t.f;return Q(this,s*e+h*r,s*n+h*a,l*e+u*r,l*n+u*a,o+g*e+f*r,i+g*n+f*a)},n.equals=function equals(t){var e=this.a,n=this.b,r=this.c,a=this.d,o=this.e,i=this.f;return e===t.a&&n===t.b&&r===t.c&&a===t.d&&o===t.e&&i===t.f},n.apply=function apply(t,e){void 0===e&&(e={});var n=t.x,r=t.y,a=this.a,o=this.b,i=this.c,s=this.d,l=this.e,h=this.f;return e.x=n*a+r*i+l,e.y=n*o+r*s+h,e},Matrix2D);function Matrix2D(t,e,n,r,a,o){void 0===t&&(t=1),void 0===e&&(e=0),void 0===n&&(n=0),void 0===r&&(r=1),void 0===a&&(a=0),void 0===o&&(o=0),Q(this,t,e,n,r,a,o)}function getGlobalMatrix(t,e){if(!t.parentNode)return new w;var n=N(t)?v:P,r=function _placeSiblings(t){var e,n,r,a,o,i=N(t),s=t===i,l=i?v:P;return t===u?t:(l.length||l.push(O(t,1),O(t,2),O(t,3)),e=i?f:g,i?(r=s||"g"===t.tagName.toLowerCase()?{x:0,y:0}:t.getBBox(),o=(n=t.transform.baseVal).length?(a=(n=n.consolidate().matrix).a*r.x+n.c*r.y,n.b*r.x+n.d*r.y):(n=new w,a=r.x,r.y),e.setAttribute("transform","matrix("+n.a+","+n.b+","+n.c+","+n.d+","+(n.e+a)+","+(n.f+o)+")"),(s?i:t.parentNode).appendChild(e)):(e.style.top=t.offsetTop+"px",e.style.left=t.offsetLeft+"px",n=u.getComputedStyle(t),e.style[c]=n[c],e.style[m]=n[m],t.parentNode.appendChild(e)),e)}(t),a=n[0].getBoundingClientRect(),o=n[1].getBoundingClientRect(),i=n[2].getBoundingClientRect(),s=r.parentNode,l=new w((o.left-a.left)/100,(o.top-a.top)/100,(i.left-a.left)/100,(i.top-a.top)/100,a.left,a.top);return s.removeChild(r),e?l.inverse():l} | ||
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-10-03 | ||
* http://greensock.com | ||
* MotionPathPlugin 3.0.0 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @license Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/function N(t){return t.ownerSVGElement||("svg"===(t.tagName+"").toLowerCase()?t:null)}function O(t,e){if(t.parentNode&&(l||function _setDoc(t){var e=t.ownerDocument||t;!(c in t.style)&&"msTransform"in t.style&&(m=(c="msTransform")+"Origin");for(;e.parentNode&&(e=e.parentNode););return u=window,l=e}(t))){var n=N(t),r=n?n.getAttribute("xmlns")||"http://www.w3.org/2000/svg":"http://www.w3.org/1999/xhtml",a=n?e?"rect":"g":"div",o=2!==e?0:100,i=3===e?100:0,s="position:absolute;display:block;",h=l.createElementNS?l.createElementNS(r.replace(/^https/,"http"),a):l.createElement(a);return e&&(n?(f=f||O(t),h.setAttribute("width",1),h.setAttribute("height",1),h.setAttribute("transform","translate("+o+","+i+")"),f.appendChild(h)):(g||((g=O(t)).style.cssText=s),h.style.cssText=s+"width:1px;height:1px;top:"+i+"px;left:"+o+"px",g.appendChild(h))),h}throw"Need document and parent."}function Q(t,e,n,r,a,o,i){return t.a=e,t.b=n,t.c=r,t.d=a,t.e=o,t.f=i,t}var l,u,g,f,c="transform",m=c+"Origin",v=[],P=[],w=function(){function Matrix2D(t,e,n,r,a,o){void 0===t&&(t=1),void 0===e&&(e=0),void 0===n&&(n=0),void 0===r&&(r=1),void 0===a&&(a=0),void 0===o&&(o=0),Q(this,t,e,n,r,a,o)}var t=Matrix2D.prototype;return t.inverse=function inverse(){var t=this.a,e=this.b,n=this.c,r=this.d,a=this.e,o=this.f,i=t*r-e*n;return Q(this,r/i,-e/i,-n/i,t/i,(n*o-r*a)/i,-(t*o-e*a)/i)},t.multiply=function multiply(t){var e=this.a,n=this.b,r=this.c,a=this.d,o=this.e,i=this.f,s=t.a,h=t.c,l=t.b,u=t.d,g=t.e,f=t.f;return Q(this,s*e+l*r,s*n+l*a,h*e+u*r,h*n+u*a,o+g*e+f*r,i+g*n+f*a)},t.equals=function equals(t){var e=this.a,n=this.b,r=this.c,a=this.d,o=this.e,i=this.f;return e===t.a&&n===t.b&&r===t.c&&a===t.d&&o===t.e&&i===t.f},t.apply=function apply(t,e){void 0===e&&(e={});var n=t.x,r=t.y,a=this.a,o=this.b,i=this.c,s=this.d,h=this.e,l=this.f;return e.x=n*a+r*i+h,e.y=n*o+r*s+l,e},Matrix2D}();function getGlobalMatrix(t,e){if(!t.parentNode)return new w;var n=N(t)?v:P,r=function _placeSiblings(t){var e,n,r,a,o,i=N(t),s=t===i,h=i?v:P;return t===u?t:(h.length||h.push(O(t,1),O(t,2),O(t,3)),e=i?f:g,i?(r=s?{x:0,y:0}:t.getBBox(),o=(n=t.transform.baseVal).length?(a=(n=n.consolidate().matrix).a*r.x+n.c*r.y,n.b*r.x+n.d*r.y):(n=new w,a=r.x,r.y),e.setAttribute("transform","matrix("+n.a+","+n.b+","+n.c+","+n.d+","+(n.e+a)+","+(n.f+o)+")"),(s?i:t.parentNode).appendChild(e)):(e.style.top=t.offsetTop+"px",e.style.left=t.offsetLeft+"px",n=u.getComputedStyle(t),e.style[c]=n[c],e.style[m]=n[m],t.parentNode.appendChild(e)),e)}(t),a=n[0].getBoundingClientRect(),o=n[1].getBoundingClientRect(),i=n[2].getBoundingClientRect(),s=r.parentNode,h=new w((o.left-a.left)/100,(o.top-a.top)/100,(i.left-a.left)/100,(i.top-a.top)/100,a.left,a.top);return s.removeChild(r),e?h.inverse():h} | ||
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-09-27 | ||
* http://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/function $(t,e,n,r){for(var a=e.length,o=r,i=0;i<a;i++)t[o]=parseFloat(e[i][n]),o+=2;return t}function _(t,e,n){return parseFloat(t._gsap.get(t,e,n||"px"))||0}function aa(t){var e,n=t[0],r=t[1];for(e=2;e<t.length;e+=2)n=t[e]+=n,r=t[e+1]+=r}function ba(t,e,n,r,a,o,i){return e="cubic"===i.type?[e]:(e.unshift(_(n,r,i.unitX),a?_(n,a,i.unitY):0),i.relative&&aa(e),[(a?pointsToSegment:flatPointsToSegment)(e,i.curviness)]),e=o(V(e,n,i)),q(t,n,r,e,"x",i.unitX),a&&q(t,n,a,e,"y",i.unitY),cacheRawPathMeasurements(e,i.resolution||(0===i.curviness?20:12))}function ca(t){return t}var M,R,I,k,j=["x","translateX","left","marginLeft"],E=["y","translateY","top","marginTop"],o=Math.PI/180,V=function _align(t,e,n){var r,a,o,i,s,h,l,u,g,f,c=n.align,p=n.transform,d=n.offsetX,m=n.offsetY;return t&&t.length?(c&&("self"===c||(s=k(c)[0]||e)===e?transformRawPath(t,1,0,0,1,r=_(e,"x")-t[0][0],a=_(e,"y")-t[0][1]):(o=M.to(e,{xPercent:0,yPercent:0,x:0,y:0}).progress(1),i=getGlobalMatrix(e),o.render(-1).kill(),a=s.getTotalLength&&"path"===s.tagName.toLowerCase()?(h=getRawPath(s),l=getGlobalMatrix(s.parentNode),r=h[0][0],h[0][1]):(l=getGlobalMatrix(s),r=0),g=l.a*r+l.c*a+l.e-i.e,f=l.b*r+l.d*a+l.f-i.f,r=(u=getGlobalMatrix(e.parentNode,!0)).a*g+u.c*f,a=u.b*g+u.d*f,g=t[0][0],f=t[0][1],l.multiply(u),r-=l.a*g+l.c*f,a-=l.b*g+l.d*f,transformRawPath(t,l.a,l.b,l.c,l.d,r,a))),p?transformRawPath(t,p[0],p[1],p[2],p[3],p[4],p[5]):(d||m)&&transformRawPath(t,1,0,0,1,d||0,m||0),t):getRawPath("M0,0L0,0")},q=function _addDimensionalPropTween(t,e,n,r,a,o){var i=e._gsap,s=t._pt=new R(t._pt,e,n,0,0,ca,0,i.set(e,n,t));s.u=I(i.get(e,n,o))||0,s.path=r,s.pp=a,t._props.push(n)},n={version:"3.0.0",name:"motionPath",register:function register(t,e,n){I=(M=t).utils.getUnit,k=M.utils.toArray,R=n},init:function init(t,e){if(!M)return console.warn("Please gsap.registerPlugin(MotionPathPlugin)"),!1;"object"==typeof e&&!e.style&&e.path||(e={path:e});var n,r,a,o,i=[],s=e.path,h=s[0],l=e.autoRotate,u=function _sliceModifier(e,n){return function(t){return e||1!==n?sliceRawPath(t,e,n):t}}(e.start,"end"in e?e.end:1);if(this.rawPaths=i,this.target=t,(this.rotate=l||0===l)&&(this.rOffset=parseFloat(l)||0,this.radians=!!e.useRadians,this.rProp=e.rotation||"rotation",this.rSet=t._gsap.set(t,this.rProp,this),this.ru=I(t._gsap.get(t,this.rProp))||0),!Array.isArray(s)||"closed"in s||"number"==typeof h)cacheRawPathMeasurements(n=u(V(getRawPath(e.path),t,e)),e.resolution),i.push(n),q(this,t,e.x||"x",n,"x",e.unitX||"px"),q(this,t,e.y||"y",n,"y",e.unitY||"px");else{for(r in h)~j.indexOf(r)?a=r:~E.indexOf(r)&&(o=r);for(r in a&&o?i.push(ba(this,$($([],s,a,0),s,o,1),t,e.x||a,e.y||o,u,e)):a=o=0,h)r!==a&&r!==o&&i.push(ba(this,$([],s,r,0),t,r,0,u,e))}},render:function render(t,e){var n=e.rawPaths,r=n.length,a=e._pt;for(1<t?t=1:t<0&&(t=0);r--;)getPositionOnPath(n[r],t,!r&&e.rotate,n[r]);for(;a;)a.set(a.t,a.p,a.path[a.pp]+a.u,a.d,t),a=a._next;e.rotate&&e.rSet(e.target,e.rProp,n[0].angle*(e.radians?o:1)+e.rOffset+e.ru,e,t)},getLength:function getLength(t){return cacheRawPathMeasurements(getRawPath(t)).totalLength},sliceRawPath:sliceRawPath,getRawPath:getRawPath,pointsToSegment:pointsToSegment,stringToRawPath:stringToRawPath,rawPathToString:rawPathToString,transformRawPath:transformRawPath,convertToPath:function convertToPath$1(t,e){return k(t).map(function(t){return convertToPath(t,!1!==e)})},getGlobalMatrix:getGlobalMatrix,arrayToRawPath:function arrayToRawPath(t,e){var n=$($([],t,(e=e||{}).x||"x",0),t,e.y||"y",1);return e.relative&&aa(n),["cubic"===e.type?n:pointsToSegment(n,e.curviness)]}};!function _getGSAP(){return M||"undefined"!=typeof window&&(M=window.gsap)}()||M.registerPlugin(n),t.MotionPathPlugin=n,t.default=n,Object.defineProperty(t,"__esModule",{value:!0})}); | ||
*/function $(t,e,n,r){for(var a=e.length,o=r,i=0;i<a;i++)t[o]=parseFloat(e[i][n]),o+=2;return t}function _(t,e,n){return parseFloat(t._gsap.get(t,e,n||"px"))||0}function aa(t){var e,n=t[0],r=t[1];for(e=2;e<t.length;e+=2)n=t[e]+=n,r=t[e+1]+=r}function ba(t,e,n,r,a,o,i){return e="cubic"===i.type?[e]:(e.unshift(_(n,r,i.unitX),a?_(n,a,i.unitY):0),i.relative&&aa(e),[(a?pointsToSegment:flatPointsToSegment)(e,i.curviness)]),e=o(V(e,n,i)),q(t,n,r,e,"x",i.unitX),a&&q(t,n,a,e,"y",i.unitY),cacheRawPathMeasurements(e,i.resolution||(0===i.curviness?20:12))}function ca(t){return t}var M,R,I,k,j=["x","translateX","left","marginLeft"],E=["y","translateY","top","marginTop"],o=Math.PI/180,V=function _align(t,e,n){var r,a,o,i,s,l,h,u,g,f,c=n.align,p=n.matrix,d=n.offsetX,m=n.offsetY;return t&&t.length?(c&&("self"===c||(s=k(c)[0]||e)===e?transformRawPath(t,1,0,0,1,r=_(e,"x")-t[0][0],a=_(e,"y")-t[0][1]):(o=M.to(e,{xPercent:0,yPercent:0,x:0,y:0}).progress(1),i=getGlobalMatrix(e),o.render(-1).kill(),a=s.getTotalLength&&"path"===s.tagName.toLowerCase()?(l=getRawPath(s),h=getGlobalMatrix(s.parentNode),r=l[0][0],l[0][1]):(h=getGlobalMatrix(s),r=0),g=h.a*r+h.c*a+h.e-i.e,f=h.b*r+h.d*a+h.f-i.f,r=(u=getGlobalMatrix(e.parentNode,!0)).a*g+u.c*f,a=u.b*g+u.d*f,g=t[0][0],f=t[0][1],h.multiply(u),r-=h.a*g+h.c*f,a-=h.b*g+h.d*f,transformRawPath(t,h.a,h.b,h.c,h.d,r,a))),p?transformRawPath(t,p.a,p.b,p.c,p.d,p.e,p.f):(d||m)&&transformRawPath(t,1,0,0,1,d||0,m||0),t):getRawPath("M0,0L0,0")},q=function _addDimensionalPropTween(t,e,n,r,a,o){var i=e._gsap,s=t._pt=new R(t._pt,e,n,0,0,ca,0,i.set(e,n,t));s.u=I(i.get(e,n,o))||0,s.path=r,s.pp=a,t._props.push(n)},a={version:"3.0.0",name:"motionPath",register:function register(t,e,n){I=(M=t).utils.getUnit,k=M.utils.toArray,R=n},init:function init(t,e){if(!M)return console.warn("Please gsap.registerPlugin(MotionPathPlugin)"),!1;"object"==typeof e&&!e.style&&e.path||(e={path:e});var n,r,a,o,i=[],s=e.path,l=s[0],h=e.autoRotate,u=function _sliceModifier(e,n){return function(t){return e||1!==n?sliceRawPath(t,e,n):t}}(e.start,"end"in e?e.end:1);if(this.rawPaths=i,this.target=t,(this.rotate=h||0===h)&&(this.rOffset=parseFloat(h)||0,this.radians=!!e.useRadians,this.rProp=e.rotation||"rotation",this.rSet=t._gsap.set(t,this.rProp,this),this.ru=I(t._gsap.get(t,this.rProp))||0),!Array.isArray(s)||"closed"in s||"number"==typeof l)cacheRawPathMeasurements(n=u(V(getRawPath(e.path),t,e)),e.resolution),i.push(n),q(this,t,e.x||"x",n,"x",e.unitX||"px"),q(this,t,e.y||"y",n,"y",e.unitY||"px");else{for(r in l)~j.indexOf(r)?a=r:~E.indexOf(r)&&(o=r);for(r in a&&o?i.push(ba(this,$($([],s,a,0),s,o,1),t,e.x||a,e.y||o,u,e)):a=o=0,l)r!==a&&r!==o&&i.push(ba(this,$([],s,r,0),t,r,0,u,e))}},render:function render(t,e){var n=e.rawPaths,r=n.length,a=e._pt;for(1<t?t=1:t<0&&(t=0);r--;)getPositionOnPath(n[r],t,!r&&e.rotate,n[r]);for(;a;)a.set(a.t,a.p,a.path[a.pp]+a.u,a.d,t),a=a._next;e.rotate&&e.rSet(e.target,e.rProp,n[0].angle*(e.radians?o:1)+e.rOffset+e.ru,e,t)},getLength:function getLength(t){return cacheRawPathMeasurements(getRawPath(t)).totalLength},sliceRawPath:sliceRawPath,getRawPath:getRawPath,pointsToSegment:pointsToSegment,stringToRawPath:stringToRawPath,rawPathToString:rawPathToString,transformRawPath:transformRawPath,convertToPath:function convertToPath$1(t,e){return k(t).map(function(t){return convertToPath(t,!1!==e)})},getGlobalMatrix:getGlobalMatrix,arrayToRawPath:function arrayToRawPath(t,e){var n=$($([],t,(e=e||{}).x||"x",0),t,e.y||"y",1);return e.relative&&aa(n),["cubic"===e.type?n:pointsToSegment(n,e.curviness)]}};!function _getGSAP(){return M||"undefined"!=typeof window&&(M=window.gsap)&&M.registerPlugin&&M}()||M.registerPlugin(a),t.MotionPathPlugin=a,t.default=a,Object.defineProperty(t,"__esModule",{value:!0})}); | ||
//# sourceMappingURL=MotionPathPlugin.min.js.map |
@@ -8,13 +8,10 @@ (function (global, factory) { | ||
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-10-01 | ||
* http://greensock.com | ||
* PixiPlugin 3.0.0 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @license Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/ | ||
/* eslint-disable */ | ||
var gsap, | ||
@@ -31,3 +28,3 @@ _win, | ||
_getGSAP = function _getGSAP() { | ||
return gsap || _windowExists() && (gsap = window.gsap); | ||
return gsap || _windowExists() && (gsap = window.gsap) && gsap.registerPlugin && gsap; | ||
}, | ||
@@ -114,3 +111,2 @@ _isFunction = function _isFunction(value) { | ||
_addColorMatrixFilterCacheTween = function _addColorMatrixFilterCacheTween(p, plugin, cache, vars) { | ||
//we cache the ColorMatrixFilter components in a _gsColorMatrixFilter object attached to the target object so that it's easy to grab the current value at any time. | ||
plugin.add(cache, p, cache[p], vars[p]); | ||
@@ -272,3 +268,2 @@ | ||
if (g) { | ||
//in order for PixiJS to actually redraw GraphicsData, we've gotta increment the "dirty" and "clearDirty" values. If we don't do this, the values will be tween properly, but not rendered. | ||
g.dirty++; | ||
@@ -331,5 +326,4 @@ g.clearDirty++; | ||
i, | ||
p; //context setup... | ||
p; | ||
for (i = 0; i < _xyContexts.length; i++) { | ||
@@ -385,3 +379,2 @@ p = _xyContexts[i]; | ||
} else if (p === "rotation") { | ||
//PIXI expects rotation in radians, but as a convenience we let folks define it in degrees and we do the conversion. | ||
this.add(target, p, target.rotation, _degreesToRadians(value)); | ||
@@ -403,3 +396,3 @@ } else if (_colorMatrixFilterProps[p]) { | ||
while (--i > -1) { | ||
target.filters[i].padding = Math.max(target.filters[i].padding, padding); //if we don't expand the padding on all the filters, it can look clipped. | ||
target.filters[i].padding = Math.max(target.filters[i].padding, padding); | ||
} | ||
@@ -409,4 +402,3 @@ } | ||
if ((p === "lineColor" || p === "fillColor") && target instanceof _PIXI.Graphics) { | ||
data = (target.geometry || target).graphicsData; //"geometry" was introduced in PIXI version 5 | ||
data = (target.geometry || target).graphicsData; | ||
this._pt = new PropTween(this._pt, target, p, 0, 0, _renderDirtyCache, { | ||
@@ -413,0 +405,0 @@ g: target.geometry || target |
!function(t,i){"object"==typeof exports&&"undefined"!=typeof module?i(exports):"function"==typeof define&&define.amd?define(["exports"],i):i((t=t||self).window=t.window||{})}(this,function(i){"use strict"; | ||
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-10-01 | ||
* http://greensock.com | ||
* PixiPlugin 3.0.0 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @license Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/function k(){return"undefined"!=typeof window}function l(){return o||k()&&(o=window.gsap)}function m(t){return"function"==typeof t}function s(t,i){var r,o,e=[],n=0,s=0;for(r=0;r<4;r++){for(o=0;o<5;o++)s=4===o?t[n+4]:0,e[n+o]=t[n]*i[o]+t[n+1]*i[o+5]+t[n+2]*i[o+10]+t[n+3]*i[o+15]+s;n+=5}return e}function t(t,i){var r=1-i,o=r*p,e=r*g,n=r*b;return s([o+i,e,n,0,0,o,e+i,n,0,0,o,e,n+i,0,0,0,0,0,1,0],t)}function u(t,i,r){var o=c(i),e=o[0]/255,n=o[1]/255,l=o[2]/255,a=1-r;return s([a+r*e*p,r*e*g,r*e*b,0,0,r*n*p,a+r*n*g,r*n*b,0,0,r*l*p,r*l*g,a+r*l*b,0,0,0,0,0,1,0],t)}function v(t,i){i*=Math.PI/180;var r=Math.cos(i),o=Math.sin(i);return s([p+r*(1-p)+o*-p,g+r*-g+o*-g,b+r*-b+o*(1-b),0,0,p+r*-p+.143*o,g+r*(1-g)+.14*o,b+r*-b+-.283*o,0,0,p+r*-p+o*-(1-p),g+r*-g+o*g,b+r*(1-b)+o*b,0,0,0,0,0,1,0,0,0,0,0,1],t)}function w(t,i){return s([i,0,0,0,.5*(1-i),0,i,0,0,.5*(1-i),0,0,i,0,.5*(1-i),0,0,0,1,0],t)}function x(t,i){var r,o=h.filters[i],e=t.filters||[],n=e.length;for(o||function _warn(t){console.warn(t)}(i+" not found. PixiPlugin.registerPIXI(PIXI)");-1<--n;)if(e[n]instanceof o)return e[n];return r=new o,"BlurFilter"===i&&(r.blur=0),e.push(r),t.filters=e,r}function y(t,i,r,o){i.add(r,t,r[t],o[t]),i._props.push(t)}function z(t,i){var r=new h.filters.ColorMatrixFilter;return r.matrix=i,r.brightness(t,!0),r.matrix}function C(i,r,o){var e,n,s,l=x(i,"ColorMatrixFilter"),a=i._gsColorMatrixFilter=i._gsColorMatrixFilter||function _copy(t){var i,r={};for(i in t)r[i]=t[i];return r}(P),c=r.combineCMF&&!("colorMatrixFilter"in r&&!r.colorMatrixFilter);s=l.matrix,r.resolution&&(l.resolution=r.resolution),r.matrix&&r.matrix.length===s.length?(n=r.matrix,1!==a.contrast&&y("contrast",o,a,P),a.hue&&y("hue",o,a,P),1!==a.brightness&&y("brightness",o,a,P),a.colorizeAmount&&(y("colorize",o,a,P),y("colorizeAmount",o,a,P)),1!==a.saturation&&y("saturation",o,a,P)):(n=f.slice(),null!=r.contrast?(n=w(n,+r.contrast),y("contrast",o,a,r)):1!==a.contrast&&(c?n=w(n,a.contrast):y("contrast",o,a,P)),null!=r.hue?(n=v(n,+r.hue),y("hue",o,a,r)):a.hue&&(c?n=v(n,a.hue):y("hue",o,a,P)),null!=r.brightness?(n=z(+r.brightness,n),y("brightness",o,a,r)):1!==a.brightness&&(c?n=z(a.brightness,n):y("brightness",o,a,P)),null!=r.colorize?(r.colorizeAmount="colorizeAmount"in r?+r.colorizeAmount:1,n=u(n,r.colorize,r.colorizeAmount),y("colorize",o,a,r),y("colorizeAmount",o,a,r)):a.colorizeAmount&&(c?n=u(n,a.colorize,a.colorizeAmount):(y("colorize",o,a,P),y("colorizeAmount",o,a,P))),null!=r.saturation?(n=t(n,+r.saturation),y("saturation",o,a,r)):1!==a.saturation&&(c?n=t(n,a.saturation):y("saturation",o,a,P))),e=n.length;for(;-1<--e;)n[e]!==s[e]&&o.add(s,e,s[e],n[e],"colorMatrixFilter");o._props.push("colorMatrixFilter")}function D(t,i){var r=i.t,o=i.p,e=i.color;(0,i.set)(r,o,e[0]<<16|e[1]<<8|e[2])}function E(t,i){var r=i.g;r&&(r.dirty++,r.clearDirty++)}function F(t,i){i.t.visible=!!i.t.alpha}function G(t,i,r,o){var e=t[i],n=c(m(e)?t[i.indexOf("set")||!m(t["get"+i.substr(3)])?i:"get"+i.substr(3)]():e),s=c(r);o._pt=new d(o._pt,t,i,0,0,D,{t:t,p:i,color:n,set:a(t,i)}),o.add(n,0,n[0],s[0]),o.add(n,1,n[1],s[1]),o.add(n,2,n[2],s[2])}function M(t){return"string"==typeof t&&"="===t.charAt(1)?t.substr(0,2)+parseFloat(t.substr(2))*O:t*O}function N(){k()&&(r=window,o=l(),h=h||r.PIXI,c=o.utils.splitColor)}var o,r,c,h,d,a,e,n,f=[1,0,0,0,0,0,1,0,0,0,0,0,1,0,0,0,0,0,1,0],p=.212671,g=.71516,b=.072169,P={contrast:1,saturation:1,colorizeAmount:0,colorize:"rgb(255,255,255)",hue:0,brightness:1},A={tint:1,lineColor:1,fillColor:1},_="position,scale,skew,pivot,anchor,tilePosition,tileScale".split(","),I={x:"position",y:"position",tileX:"tilePosition",tileY:"tilePosition"},X={colorMatrixFilter:1,saturation:1,contrast:1,hue:1,colorize:1,colorizeAmount:1,brightness:1,combineCMF:1},O=Math.PI/180;for(e=0;e<_.length;e++)n=_[e],I[n+"X"]=n,I[n+"Y"]=n;var S={version:"3.0.0",name:"pixi",register:function register(t,i,r){o=t,d=r,a=i.getSetter,N()},registerPIXI:function registerPIXI(t){h=t},init:function init(t,i){if(h||N(),!t instanceof h.DisplayObject)return!1;var r,o,e,n,s,l,a,u,c,f="4"===h.VERSION.charAt(0);for(l in i){if(r=I[l],e=i[l],r)o=~l.charAt(l.length-1).toLowerCase().indexOf("x")?"x":"y",this.add(t[r],o,t[r][o],"skew"===r?M(e):e);else if("scale"===l||"anchor"===l||"pivot"===l||"tileScale"===l)this.add(t[l],"x",t[l].x,e),this.add(t[l],"y",t[l].y,e);else if("rotation"===l)this.add(t,l,t.rotation,M(e));else if(X[l])n||(C(t,i.colorMatrixFilter||i,this),n=!0);else if("blur"===l||"blurX"===l||"blurY"===l||"blurPadding"===l){if(s=x(t,"BlurFilter"),this.add(s,l,s[l],e),0!==i.blurPadding)for(a=i.blurPadding||2*Math.max(s[l],e),u=t.filters.length;-1<--u;)t.filters[u].padding=Math.max(t.filters[u].padding,a)}else if(A[l])if(("lineColor"===l||"fillColor"===l)&&t instanceof h.Graphics)for(c=(t.geometry||t).graphicsData,this._pt=new d(this._pt,t,l,0,0,E,{g:t.geometry||t}),u=c.length;-1<--u;)G(f?c[u]:c[u][l.substr(0,4)+"Style"],f?l:"color",e,this);else G(t,l,e,this);else"autoAlpha"===l?(this._pt=new d(this._pt,t,"visible",0,0,F),this.add(t,"alpha",t.alpha,e),this._props.push("alpha","visible")):this.add(t,l,"get",e);this._props.push(l)}}};l()&&o.registerPlugin(S),i.PixiPlugin=S,i.default=S,Object.defineProperty(i,"__esModule",{value:!0})}); | ||
*/function k(){return"undefined"!=typeof window}function l(){return o||k()&&(o=window.gsap)&&o.registerPlugin&&o}function m(t){return"function"==typeof t}function s(t,i){var r,o,e=[],n=0,s=0;for(r=0;r<4;r++){for(o=0;o<5;o++)s=4===o?t[n+4]:0,e[n+o]=t[n]*i[o]+t[n+1]*i[o+5]+t[n+2]*i[o+10]+t[n+3]*i[o+15]+s;n+=5}return e}function t(t,i){var r=1-i,o=r*p,e=r*g,n=r*b;return s([o+i,e,n,0,0,o,e+i,n,0,0,o,e,n+i,0,0,0,0,0,1,0],t)}function u(t,i,r){var o=c(i),e=o[0]/255,n=o[1]/255,l=o[2]/255,a=1-r;return s([a+r*e*p,r*e*g,r*e*b,0,0,r*n*p,a+r*n*g,r*n*b,0,0,r*l*p,r*l*g,a+r*l*b,0,0,0,0,0,1,0],t)}function v(t,i){i*=Math.PI/180;var r=Math.cos(i),o=Math.sin(i);return s([p+r*(1-p)+o*-p,g+r*-g+o*-g,b+r*-b+o*(1-b),0,0,p+r*-p+.143*o,g+r*(1-g)+.14*o,b+r*-b+-.283*o,0,0,p+r*-p+o*-(1-p),g+r*-g+o*g,b+r*(1-b)+o*b,0,0,0,0,0,1,0,0,0,0,0,1],t)}function w(t,i){return s([i,0,0,0,.5*(1-i),0,i,0,0,.5*(1-i),0,0,i,0,.5*(1-i),0,0,0,1,0],t)}function x(t,i){var r,o=h.filters[i],e=t.filters||[],n=e.length;for(o||function _warn(t){console.warn(t)}(i+" not found. PixiPlugin.registerPIXI(PIXI)");-1<--n;)if(e[n]instanceof o)return e[n];return r=new o,"BlurFilter"===i&&(r.blur=0),e.push(r),t.filters=e,r}function y(t,i,r,o){i.add(r,t,r[t],o[t]),i._props.push(t)}function z(t,i){var r=new h.filters.ColorMatrixFilter;return r.matrix=i,r.brightness(t,!0),r.matrix}function C(i,r,o){var e,n,s,l=x(i,"ColorMatrixFilter"),a=i._gsColorMatrixFilter=i._gsColorMatrixFilter||function _copy(t){var i,r={};for(i in t)r[i]=t[i];return r}(P),c=r.combineCMF&&!("colorMatrixFilter"in r&&!r.colorMatrixFilter);s=l.matrix,r.resolution&&(l.resolution=r.resolution),r.matrix&&r.matrix.length===s.length?(n=r.matrix,1!==a.contrast&&y("contrast",o,a,P),a.hue&&y("hue",o,a,P),1!==a.brightness&&y("brightness",o,a,P),a.colorizeAmount&&(y("colorize",o,a,P),y("colorizeAmount",o,a,P)),1!==a.saturation&&y("saturation",o,a,P)):(n=f.slice(),null!=r.contrast?(n=w(n,+r.contrast),y("contrast",o,a,r)):1!==a.contrast&&(c?n=w(n,a.contrast):y("contrast",o,a,P)),null!=r.hue?(n=v(n,+r.hue),y("hue",o,a,r)):a.hue&&(c?n=v(n,a.hue):y("hue",o,a,P)),null!=r.brightness?(n=z(+r.brightness,n),y("brightness",o,a,r)):1!==a.brightness&&(c?n=z(a.brightness,n):y("brightness",o,a,P)),null!=r.colorize?(r.colorizeAmount="colorizeAmount"in r?+r.colorizeAmount:1,n=u(n,r.colorize,r.colorizeAmount),y("colorize",o,a,r),y("colorizeAmount",o,a,r)):a.colorizeAmount&&(c?n=u(n,a.colorize,a.colorizeAmount):(y("colorize",o,a,P),y("colorizeAmount",o,a,P))),null!=r.saturation?(n=t(n,+r.saturation),y("saturation",o,a,r)):1!==a.saturation&&(c?n=t(n,a.saturation):y("saturation",o,a,P))),e=n.length;for(;-1<--e;)n[e]!==s[e]&&o.add(s,e,s[e],n[e],"colorMatrixFilter");o._props.push("colorMatrixFilter")}function D(t,i){var r=i.t,o=i.p,e=i.color;(0,i.set)(r,o,e[0]<<16|e[1]<<8|e[2])}function E(t,i){var r=i.g;r&&(r.dirty++,r.clearDirty++)}function F(t,i){i.t.visible=!!i.t.alpha}function G(t,i,r,o){var e=t[i],n=c(m(e)?t[i.indexOf("set")||!m(t["get"+i.substr(3)])?i:"get"+i.substr(3)]():e),s=c(r);o._pt=new d(o._pt,t,i,0,0,D,{t:t,p:i,color:n,set:a(t,i)}),o.add(n,0,n[0],s[0]),o.add(n,1,n[1],s[1]),o.add(n,2,n[2],s[2])}function M(t){return"string"==typeof t&&"="===t.charAt(1)?t.substr(0,2)+parseFloat(t.substr(2))*O:t*O}function N(){k()&&(r=window,o=l(),h=h||r.PIXI,c=o.utils.splitColor)}var o,r,c,h,d,a,e,n,f=[1,0,0,0,0,0,1,0,0,0,0,0,1,0,0,0,0,0,1,0],p=.212671,g=.71516,b=.072169,P={contrast:1,saturation:1,colorizeAmount:0,colorize:"rgb(255,255,255)",hue:0,brightness:1},A={tint:1,lineColor:1,fillColor:1},_="position,scale,skew,pivot,anchor,tilePosition,tileScale".split(","),I={x:"position",y:"position",tileX:"tilePosition",tileY:"tilePosition"},X={colorMatrixFilter:1,saturation:1,contrast:1,hue:1,colorize:1,colorizeAmount:1,brightness:1,combineCMF:1},O=Math.PI/180;for(e=0;e<_.length;e++)n=_[e],I[n+"X"]=n,I[n+"Y"]=n;var S={version:"3.0.0",name:"pixi",register:function register(t,i,r){o=t,d=r,a=i.getSetter,N()},registerPIXI:function registerPIXI(t){h=t},init:function init(t,i){if(h||N(),!t instanceof h.DisplayObject)return!1;var r,o,e,n,s,l,a,u,c,f="4"===h.VERSION.charAt(0);for(l in i){if(r=I[l],e=i[l],r)o=~l.charAt(l.length-1).toLowerCase().indexOf("x")?"x":"y",this.add(t[r],o,t[r][o],"skew"===r?M(e):e);else if("scale"===l||"anchor"===l||"pivot"===l||"tileScale"===l)this.add(t[l],"x",t[l].x,e),this.add(t[l],"y",t[l].y,e);else if("rotation"===l)this.add(t,l,t.rotation,M(e));else if(X[l])n||(C(t,i.colorMatrixFilter||i,this),n=!0);else if("blur"===l||"blurX"===l||"blurY"===l||"blurPadding"===l){if(s=x(t,"BlurFilter"),this.add(s,l,s[l],e),0!==i.blurPadding)for(a=i.blurPadding||2*Math.max(s[l],e),u=t.filters.length;-1<--u;)t.filters[u].padding=Math.max(t.filters[u].padding,a)}else if(A[l])if(("lineColor"===l||"fillColor"===l)&&t instanceof h.Graphics)for(c=(t.geometry||t).graphicsData,this._pt=new d(this._pt,t,l,0,0,E,{g:t.geometry||t}),u=c.length;-1<--u;)G(f?c[u]:c[u][l.substr(0,4)+"Style"],f?l:"color",e,this);else G(t,l,e,this);else"autoAlpha"===l?(this._pt=new d(this._pt,t,"visible",0,0,F),this.add(t,"alpha",t.alpha,e),this._props.push("alpha","visible")):this.add(t,l,"get",e);this._props.push(l)}}};l()&&o.registerPlugin(S),i.PixiPlugin=S,i.default=S,Object.defineProperty(i,"__esModule",{value:!0})}); | ||
//# sourceMappingURL=PixiPlugin.min.js.map |
@@ -8,13 +8,10 @@ (function (global, factory) { | ||
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-09-27 | ||
* http://greensock.com | ||
* ScrollToPlugin 3.0.0 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @license Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/ | ||
/* eslint-disable */ | ||
var gsap, | ||
@@ -31,3 +28,3 @@ _coreInitted, | ||
_getGSAP = function _getGSAP() { | ||
return gsap || _windowExists() && (gsap = window.gsap); | ||
return gsap || _windowExists() && (gsap = window.gsap) && gsap.registerPlugin && gsap; | ||
}, | ||
@@ -44,3 +41,2 @@ _isString = function _isString(value) { | ||
_buildGetter = function _buildGetter(e, axis) { | ||
//pass in an element and an axis ("x" or "y") and it'll return a getter function for the scroll position of that element (like scrollTop or scrollLeft, although if the element is the window, it'll use the pageXOffset/pageYOffset or the documentElement's scrollTop/scrollLeft or document.body's. Basically this streamlines things and makes a very fast getter across browsers. | ||
var p = "scroll" + (axis === "x" ? "Left" : "Top"); | ||
@@ -73,3 +69,2 @@ | ||
if (!isRoot && container) { | ||
//only add the current scroll position if it's not the window/body. | ||
offsets.x += _buildGetter(container, "x")(); | ||
@@ -121,3 +116,3 @@ offsets.y += _buildGetter(container, "y")(); | ||
y: value | ||
}; //if we don't receive an object as the parameter, assume the user intends "y". | ||
}; | ||
@@ -135,3 +130,3 @@ if (_isString(value.y) && value.y !== "max" && value.y.charAt(1) !== "=") { | ||
data.vars = value; | ||
data.autoKill = value.autoKill !== false; | ||
data.autoKill = !!value.autoKill; | ||
data.getX = _buildGetter(target, "x"); | ||
@@ -184,3 +179,2 @@ data.getY = _buildGetter(target, "y"); | ||
if (data.x < 0) { | ||
//can't scroll to a position less than 0! Might happen if someone uses a Back.easeOut or Elastic.easeOut when scrolling back to the top of the page (for example) | ||
data.x = 0; | ||
@@ -194,9 +188,8 @@ } | ||
if (autoKill) { | ||
//note: iOS has a bug that throws off the scroll by several pixels, so we need to check if it's within 7 pixels of the previous one that we set instead of just looking for an exact match. | ||
if (!data.skipX && (xDif > threshold || xDif < -threshold) && x < _max(target, "x")) { | ||
data.skipX = 1; //if the user scrolls separately, we should stop tweening! | ||
data.skipX = 1; | ||
} | ||
if (!data.skipY && (yDif > threshold || yDif < -threshold) && y < _max(target, "y")) { | ||
data.skipY = 1; //if the user scrolls separately, we should stop tweening! | ||
data.skipY = 1; | ||
} | ||
@@ -203,0 +196,0 @@ |
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t=t||self).window=t.window||{})}(this,function(t){"use strict"; | ||
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-09-27 | ||
* http://greensock.com | ||
* ScrollToPlugin 3.0.0 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @license Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/function k(){return"undefined"!=typeof window}function l(){return e||k()&&(e=window.gsap)}function m(t){return"string"==typeof t}function n(t,e){var o="x"===e?"Width":"Height",n="scroll"+o,r="client"+o;return t===x||t===s||t===u?Math.max(s[n],u[n])-(x["inner"+o]||s[r]||u[r]):t[n]-t["offset"+o]}function o(t,e){var o="scroll"+("x"===e?"Left":"Top");return t===x&&(null!=t.pageXOffset?o="page"+e.toUpperCase()+"Offset":t=null!=s[o]?s:u),function(){return t[o]}}function p(t,e){var n=a(t)[0].getBoundingClientRect(),r=!e||e===x||e===u,i=r?{top:s.clientTop-(x.pageYOffset||s.scrollTop||u.scrollTop||0),left:s.clientLeft-(x.pageXOffset||s.scrollLeft||u.scrollLeft||0)}:e.getBoundingClientRect(),l={x:n.left-i.left,y:n.top-i.top};return!r&&e&&(l.x+=o(e,"x")(),l.y+=o(e,"y")()),l}function q(t,e,o,r){return isNaN(t)?m(t)&&"="===t.charAt(1)?parseFloat(t.substr(2))*("-"===t.charAt(0)?-1:1)+r:"max"===t?n(e,o):Math.min(n(e,o),p(t,e)[o]):parseFloat(t)}function r(){e=l(),k()&&e&&(x=window,u=document.body,s=document.documentElement,a=e.utils.toArray,e.config({autoKillThreshold:7}),g=e.config(),f=1)}var e,f,x,s,u,a,g,i={version:"3.0.0",name:"scrollTo",register:function register(t){e=t,r()},init:function init(t,e,n,i,l){f||r();var s=this;s.isWin=t===x,s.target=t,s.tween=n,"object"!=typeof e?m((e={y:e}).y)&&"max"!==e.y&&"="!==e.y.charAt(1)&&(e.x=e.y):e.nodeType&&(e={y:e,x:e}),s.vars=e,s.autoKill=!1!==e.autoKill,s.getX=o(t,"x"),s.getY=o(t,"y"),s.x=s.xPrev=s.getX(),s.y=s.yPrev=s.getY(),null!=e.x?(s.add(s,"x",s.x,q(e.x,t,"x",s.x)-(e.offsetX||0),i,l,Math.round),s._props.push("scrollTo_x")):s.skipX=1,null!=e.y?(s.add(s,"y",s.y,q(e.y,t,"y",s.y)-(e.offsetY||0),i,l,Math.round),s._props.push("scrollTo_y")):s.skipY=1},render:function render(t,e){for(var o,r,i,l,s,f=e._pt,u=e.target,p=e.tween,a=e.autoKill,c=e.xPrev,y=e.yPrev,d=e.isWin;f;)f.r(t,f.d),f=f._next;o=d||!e.skipX?e.getX():c,i=(r=d||!e.skipY?e.getY():y)-y,l=o-c,s=g.autoKillThreshold,e.x<0&&(e.x=0),e.y<0&&(e.y=0),a&&(!e.skipX&&(s<l||l<-s)&&o<n(u,"x")&&(e.skipX=1),!e.skipY&&(s<i||i<-s)&&r<n(u,"y")&&(e.skipY=1),e.skipX&&e.skipY&&(p.kill(),e.vars.onAutoKill&&e.vars.onAutoKill.apply(p,e.vars.onAutoKillParams||[]))),d?x.scrollTo(e.skipX?o:e.x,e.skipY?r:e.y):(e.skipY||(u.scrollTop=e.y),e.skipX||(u.scrollLeft=e.x)),e.xPrev=e.x,e.yPrev=e.y},kill:function kill(t){var e="scrollTo"===t;!e&&"scrollTo_x"!==t||(this.skipX=1),!e&&"scrollTo_y"!==t||(this.skipY=1)}};i.max=n,i.getOffset=p,i.buildGetter=o,l()&&e.registerPlugin(i),t.ScrollToPlugin=i,t.default=i,Object.defineProperty(t,"__esModule",{value:!0})}); | ||
*/function k(){return"undefined"!=typeof window}function l(){return e||k()&&(e=window.gsap)&&e.registerPlugin&&e}function m(t){return"string"==typeof t}function n(t,e){var o="x"===e?"Width":"Height",n="scroll"+o,r="client"+o;return t===x||t===s||t===f?Math.max(s[n],f[n])-(x["inner"+o]||s[r]||f[r]):t[n]-t["offset"+o]}function o(t,e){var o="scroll"+("x"===e?"Left":"Top");return t===x&&(null!=t.pageXOffset?o="page"+e.toUpperCase()+"Offset":t=null!=s[o]?s:f),function(){return t[o]}}function p(t,e){var n=a(t)[0].getBoundingClientRect(),r=!e||e===x||e===f,i=r?{top:s.clientTop-(x.pageYOffset||s.scrollTop||f.scrollTop||0),left:s.clientLeft-(x.pageXOffset||s.scrollLeft||f.scrollLeft||0)}:e.getBoundingClientRect(),l={x:n.left-i.left,y:n.top-i.top};return!r&&e&&(l.x+=o(e,"x")(),l.y+=o(e,"y")()),l}function q(t,e,o,r){return isNaN(t)?m(t)&&"="===t.charAt(1)?parseFloat(t.substr(2))*("-"===t.charAt(0)?-1:1)+r:"max"===t?n(e,o):Math.min(n(e,o),p(t,e)[o]):parseFloat(t)}function r(){e=l(),k()&&e&&(x=window,f=document.body,s=document.documentElement,a=e.utils.toArray,e.config({autoKillThreshold:7}),g=e.config(),u=1)}var e,u,x,s,f,a,g,i={version:"3.0.0",name:"scrollTo",register:function register(t){e=t,r()},init:function init(t,e,n,i,l){u||r();var s=this;s.isWin=t===x,s.target=t,s.tween=n,"object"!=typeof e?m((e={y:e}).y)&&"max"!==e.y&&"="!==e.y.charAt(1)&&(e.x=e.y):e.nodeType&&(e={y:e,x:e}),s.vars=e,s.autoKill=!!e.autoKill,s.getX=o(t,"x"),s.getY=o(t,"y"),s.x=s.xPrev=s.getX(),s.y=s.yPrev=s.getY(),null!=e.x?(s.add(s,"x",s.x,q(e.x,t,"x",s.x)-(e.offsetX||0),i,l,Math.round),s._props.push("scrollTo_x")):s.skipX=1,null!=e.y?(s.add(s,"y",s.y,q(e.y,t,"y",s.y)-(e.offsetY||0),i,l,Math.round),s._props.push("scrollTo_y")):s.skipY=1},render:function render(t,e){for(var o,r,i,l,s,u=e._pt,f=e.target,p=e.tween,a=e.autoKill,c=e.xPrev,y=e.yPrev,d=e.isWin;u;)u.r(t,u.d),u=u._next;o=d||!e.skipX?e.getX():c,i=(r=d||!e.skipY?e.getY():y)-y,l=o-c,s=g.autoKillThreshold,e.x<0&&(e.x=0),e.y<0&&(e.y=0),a&&(!e.skipX&&(s<l||l<-s)&&o<n(f,"x")&&(e.skipX=1),!e.skipY&&(s<i||i<-s)&&r<n(f,"y")&&(e.skipY=1),e.skipX&&e.skipY&&(p.kill(),e.vars.onAutoKill&&e.vars.onAutoKill.apply(p,e.vars.onAutoKillParams||[]))),d?x.scrollTo(e.skipX?o:e.x,e.skipY?r:e.y):(e.skipY||(f.scrollTop=e.y),e.skipX||(f.scrollLeft=e.x)),e.xPrev=e.x,e.yPrev=e.y},kill:function kill(t){var e="scrollTo"===t;!e&&"scrollTo_x"!==t||(this.skipX=1),!e&&"scrollTo_y"!==t||(this.skipY=1)}};i.max=n,i.getOffset=p,i.buildGetter=o,l()&&e.registerPlugin(i),t.ScrollToPlugin=i,t.default=i,Object.defineProperty(t,"__esModule",{value:!0})}); | ||
//# sourceMappingURL=ScrollToPlugin.min.js.map |
327
EasePack.js
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-10-06 | ||
* http://greensock.com | ||
* EasePack 3.0.0 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @license Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/ | ||
/* eslint-disable */ | ||
var gsap, | ||
_coreInitted, | ||
_registerEase, | ||
_getGSAP = function _getGSAP() { | ||
return gsap || typeof window !== "undefined" && (gsap = window.gsap) && gsap.registerPlugin && gsap; | ||
}, | ||
_boolean = function _boolean(value, defaultValue) { | ||
return !!(typeof value === "undefined" ? defaultValue : value && !~(value + "").indexOf("false")); | ||
}, | ||
_initCore = function _initCore(core) { | ||
gsap = core || _getGSAP(); | ||
let gsap, _coreInitted, _registerEase, | ||
_getGSAP = () => gsap || typeof(window) !== "undefined" && (gsap = window.gsap), | ||
_initCore = core => { | ||
gsap = core || _getGSAP(); | ||
if (gsap) { | ||
_registerEase = gsap.registerEase; | ||
_registerEase("slow", SlowMo); | ||
_registerEase("expoScale", ExpoScaleEase); | ||
_registerEase("rough", RoughEase); | ||
for (let p in EasePack) { | ||
p !== "version" && gsap.core.globals(p, EasePack[p]); | ||
} | ||
_coreInitted = 1; | ||
} | ||
}, | ||
_createSlowMo = (linearRatio, power, yoyoMode) => { | ||
linearRatio = Math.min(1, linearRatio || 0.7); | ||
let pow = linearRatio < 1 ? ((power || power === 0) ? power : 0.7) : 0, | ||
p1 = (1 - linearRatio) / 2, | ||
p3 = p1 + linearRatio, | ||
calcEnd = !!yoyoMode; | ||
return p => { | ||
let r = p + (0.5 - p) * pow; | ||
return (p < p1) ? (calcEnd ? 1 - ((p = 1 - (p / p1)) * p) : r - ((p = 1 - (p / p1)) * p * p * p * r)) : (p > p3) ? (calcEnd ? (p === 1 ? 0 : 1 - (p = (p - p3) / p1) * p) : r + ((p - r) * (p = (p - p3) / p1) * p * p * p)) : (calcEnd ? 1 : r); | ||
} | ||
}, | ||
_createExpoScale = (start, end, ease) => { | ||
let p1 = Math.log(end / start), | ||
p2 = end - start; | ||
ease && (ease = gsap.parseEase(ease)); | ||
return p => (start * Math.exp(p1 * (ease ? ease(p) : p)) - start) / p2; | ||
}, | ||
EasePoint = function(time, value, next) { | ||
this.t = time; | ||
this.v = value; | ||
if (next) { | ||
this.next = next; | ||
next.prev = this; | ||
this.c = next.v - value; | ||
this.gap = next.t - time; | ||
} | ||
}, | ||
_createRoughEase = vars => { | ||
if (typeof(vars) !== "object") { //users may pass in via a string, like "rough(30)" | ||
vars = {points: +vars || 20}; | ||
} | ||
let taper = vars.taper || "none", | ||
a = [], | ||
cnt = 0, | ||
points = (+vars.points || 20) | 0, | ||
i = points, | ||
randomize = (vars.randomize + "" !== "false"), | ||
clamp = (vars.clamp + "" === "true"), | ||
template = gsap ? gsap.parseEase(vars.template) : 0, | ||
strength = (+vars.strength || 1) * 0.4, | ||
x, y, bump, invX, obj, pnt, recent; | ||
while (--i > -1) { | ||
x = randomize ? Math.random() : (1 / points) * i; | ||
y = template ? template(x) : x; | ||
if (taper === "none") { | ||
bump = strength; | ||
} else if (taper === "out") { | ||
invX = 1 - x; | ||
bump = invX * invX * strength; | ||
} else if (taper === "in") { | ||
bump = x * x * strength; | ||
} else if (x < 0.5) { //"both" (start) | ||
invX = x * 2; | ||
bump = invX * invX * 0.5 * strength; | ||
} else { //"both" (end) | ||
invX = (1 - x) * 2; | ||
bump = invX * invX * 0.5 * strength; | ||
} | ||
if (randomize) { | ||
y += (Math.random() * bump) - (bump * 0.5); | ||
} else if (i % 2) { | ||
y += bump * 0.5; | ||
} else { | ||
y -= bump * 0.5; | ||
} | ||
if (clamp) { | ||
if (y > 1) { | ||
y = 1; | ||
} else if (y < 0) { | ||
y = 0; | ||
} | ||
} | ||
a[cnt++] = {x:x, y:y}; | ||
} | ||
a.sort((a, b) => a.x - b.x); | ||
pnt = new EasePoint(1, 1, null); | ||
i = points; | ||
while (i--) { | ||
obj = a[i]; | ||
pnt = new EasePoint(obj.x, obj.y, pnt); | ||
} | ||
recent = new EasePoint(0, 0, pnt.t ? pnt : pnt.next); | ||
return p => { | ||
let pnt = recent; | ||
if (p > pnt.t) { | ||
while (pnt.next && p >= pnt.t) { | ||
pnt = pnt.next; | ||
} | ||
pnt = pnt.prev; | ||
} else { | ||
while (pnt.prev && p <= pnt.t) { | ||
pnt = pnt.prev; | ||
} | ||
} | ||
recent = pnt; | ||
return pnt.v + ((p - pnt.t) / pnt.gap) * pnt.c; | ||
}; | ||
}; | ||
if (gsap) { | ||
_registerEase = gsap.registerEase; //add weighted ease capabilities to standard eases so users can do "power2.inOut(0.8)" for example to push everything toward the "out", or (-0.8) to push it toward the "in" (0 is neutral) | ||
export const SlowMo = _createSlowMo(0.7); | ||
var eases = gsap.parseEase(), | ||
createConfig = function createConfig(ease) { | ||
return function (ratio) { | ||
var y = 0.5 + ratio / 2; | ||
ease.config = function (p) { | ||
return ease(2 * (1 - p) * p * y + p * p); | ||
}; | ||
}; | ||
}, | ||
p; | ||
for (p in eases) { | ||
if (!eases[p].config) { | ||
createConfig(eases[p]); | ||
} | ||
} | ||
_registerEase("slow", SlowMo); | ||
_registerEase("expoScale", ExpoScaleEase); | ||
_registerEase("rough", RoughEase); | ||
for (p in EasePack) { | ||
p !== "version" && gsap.core.globals(p, EasePack[p]); | ||
} | ||
_coreInitted = 1; | ||
} | ||
}, | ||
_createSlowMo = function _createSlowMo(linearRatio, power, yoyoMode) { | ||
linearRatio = Math.min(1, linearRatio || 0.7); | ||
var pow = linearRatio < 1 ? power || power === 0 ? power : 0.7 : 0, | ||
p1 = (1 - linearRatio) / 2, | ||
p3 = p1 + linearRatio, | ||
calcEnd = _boolean(yoyoMode); | ||
return function (p) { | ||
var r = p + (0.5 - p) * pow; | ||
return p < p1 ? calcEnd ? 1 - (p = 1 - p / p1) * p : r - (p = 1 - p / p1) * p * p * p * r : p > p3 ? calcEnd ? p === 1 ? 0 : 1 - (p = (p - p3) / p1) * p : r + (p - r) * (p = (p - p3) / p1) * p * p * p : calcEnd ? 1 : r; | ||
}; | ||
}, | ||
_createExpoScale = function _createExpoScale(start, end, ease) { | ||
var p1 = Math.log(end / start), | ||
p2 = end - start; | ||
ease && (ease = gsap.parseEase(ease)); | ||
return function (p) { | ||
return (start * Math.exp(p1 * (ease ? ease(p) : p)) - start) / p2; | ||
}; | ||
}, | ||
EasePoint = function EasePoint(time, value, next) { | ||
this.t = time; | ||
this.v = value; | ||
if (next) { | ||
this.next = next; | ||
next.prev = this; | ||
this.c = next.v - value; | ||
this.gap = next.t - time; | ||
} | ||
}, | ||
_createRoughEase = function _createRoughEase(vars) { | ||
if (typeof vars !== "object") { | ||
//users may pass in via a string, like "rough(30)" | ||
vars = { | ||
points: +vars || 20 | ||
}; | ||
} | ||
var taper = vars.taper || "none", | ||
a = [], | ||
cnt = 0, | ||
points = (+vars.points || 20) | 0, | ||
i = points, | ||
randomize = _boolean(vars.randomize, true), | ||
clamp = _boolean(vars.clamp), | ||
template = gsap ? gsap.parseEase(vars.template) : 0, | ||
strength = (+vars.strength || 1) * 0.4, | ||
x, | ||
y, | ||
bump, | ||
invX, | ||
obj, | ||
pnt, | ||
recent; | ||
while (--i > -1) { | ||
x = randomize ? Math.random() : 1 / points * i; | ||
y = template ? template(x) : x; | ||
if (taper === "none") { | ||
bump = strength; | ||
} else if (taper === "out") { | ||
invX = 1 - x; | ||
bump = invX * invX * strength; | ||
} else if (taper === "in") { | ||
bump = x * x * strength; | ||
} else if (x < 0.5) { | ||
//"both" (start) | ||
invX = x * 2; | ||
bump = invX * invX * 0.5 * strength; | ||
} else { | ||
//"both" (end) | ||
invX = (1 - x) * 2; | ||
bump = invX * invX * 0.5 * strength; | ||
} | ||
if (randomize) { | ||
y += Math.random() * bump - bump * 0.5; | ||
} else if (i % 2) { | ||
y += bump * 0.5; | ||
} else { | ||
y -= bump * 0.5; | ||
} | ||
if (clamp) { | ||
if (y > 1) { | ||
y = 1; | ||
} else if (y < 0) { | ||
y = 0; | ||
} | ||
} | ||
a[cnt++] = { | ||
x: x, | ||
y: y | ||
}; | ||
} | ||
a.sort(function (a, b) { | ||
return a.x - b.x; | ||
}); | ||
pnt = new EasePoint(1, 1, null); | ||
i = points; | ||
while (i--) { | ||
obj = a[i]; | ||
pnt = new EasePoint(obj.x, obj.y, pnt); | ||
} | ||
recent = new EasePoint(0, 0, pnt.t ? pnt : pnt.next); | ||
return function (p) { | ||
var pnt = recent; | ||
if (p > pnt.t) { | ||
while (pnt.next && p >= pnt.t) { | ||
pnt = pnt.next; | ||
} | ||
pnt = pnt.prev; | ||
} else { | ||
while (pnt.prev && p <= pnt.t) { | ||
pnt = pnt.prev; | ||
} | ||
} | ||
recent = pnt; | ||
return pnt.v + (p - pnt.t) / pnt.gap * pnt.c; | ||
}; | ||
}; | ||
export var SlowMo = _createSlowMo(0.7); | ||
SlowMo.ease = SlowMo; //for backward compatibility | ||
SlowMo.config = _createSlowMo; | ||
export const ExpoScaleEase = _createExpoScale(1, 2); | ||
export var ExpoScaleEase = _createExpoScale(1, 2); | ||
ExpoScaleEase.config = _createExpoScale; | ||
export var RoughEase = _createRoughEase(); | ||
RoughEase.ease = RoughEase; //for backward compatibility | ||
export const RoughEase = _createRoughEase(); | ||
RoughEase.config = _createRoughEase; | ||
export const EasePack = { | ||
SlowMo: SlowMo, | ||
RoughEase: RoughEase, | ||
ExpoScaleEase: ExpoScaleEase | ||
export var EasePack = { | ||
SlowMo: SlowMo, | ||
RoughEase: RoughEase, | ||
ExpoScaleEase: ExpoScaleEase | ||
}; | ||
for (let p in EasePack) { | ||
EasePack[p].register = _initCore; | ||
EasePack[p].version = "3.0.0"; | ||
for (var p in EasePack) { | ||
EasePack[p].register = _initCore; | ||
EasePack[p].version = "3.0.0"; | ||
} | ||
_getGSAP() && gsap.registerPlugin(SlowMo); | ||
export { EasePack as default }; |
637
gsap.d.ts
@@ -1,5 +0,52 @@ | ||
// WIP!!! We will be filling this in... | ||
// Type definitions for GSAP v3.0 | ||
// Project: https://github.com/greensock/GreenSock-JS | ||
// Definitions by: | ||
// Blake Bowen <https://github.com/OSUblake> | ||
// Pedro Tavares <https://github.com/dipscom> | ||
// Zach Saucier <https://github.com/ZachSaucier> | ||
declare namespace GSAPStatic { | ||
type validTargets = string | object | string[] | object[]; | ||
type callbackFn = (...args: any) => any; | ||
type positionType = number | string; | ||
type callbackType = 'onComplete' | 'onUpdate' | 'onStart' | 'onReverseComplete' | 'onRepeat'; | ||
type tweenVars = { | ||
data?: object; | ||
delay?: number; | ||
duration?: number; | ||
ease?: string; // TODO list all the eases available | ||
id?: string; | ||
immediateRender?: boolean; | ||
inherit?: boolean; | ||
lazy?: boolean; | ||
onComplete?: callbackFn; | ||
onCompleteParams?: any[]; | ||
onInterrupt?: callbackFn; | ||
onInterruptParams?: any[]; | ||
onRepeat?: callbackFn; | ||
onRepeatParams?: any[]; | ||
onReverseComplete?: callbackFn; | ||
onReverseCompleteParams?: any[]; | ||
onStart?: callbackFn; | ||
onStartParams?: any[]; | ||
onUpdate?: callbackFn; | ||
onUpdateParams?: any[]; | ||
overwrite?: 'autp' | boolean; | ||
paused?: boolean; | ||
repeat?: number; | ||
repeatDelay?: number; | ||
repeatRefresh?: boolean; | ||
reversed?: boolean; | ||
runBackwards?: boolean; | ||
stagger?: number | object | callbackFn; // TODO list the object option properties and the function option | ||
startAt?: object; | ||
yoyo?: boolean; | ||
yoyoEase?: string // TODO the same as the ease property | ||
keyframes?: object; // TODO review this object as it might need extra properties, like 'duration', definitions | ||
[key: string]: any; // so TypeScript does not prevent the user from adding their own properties | ||
} | ||
/** | ||
@@ -12,3 +59,3 @@ * Base class for Tween and Timeline classes. | ||
/** | ||
/** | ||
* A place to store any data you want (initially populated with vars.data if it exists) | ||
@@ -19,4 +66,7 @@ * | ||
*/ | ||
data: object; | ||
data: object; | ||
/** | ||
@@ -29,6 +79,18 @@ * Creates an instance of Animation. | ||
*/ | ||
constructor(vars: object, time?: number); | ||
constructor(vars?: object, time?: number); | ||
/** | ||
/** | ||
* Sets the animation's initial delay which is the length of time in seconds before the animation should begin. | ||
* | ||
* @param {number} value - Delay value | ||
* @returns {this} Returns self, useful for chaining. | ||
* @memberof Animation | ||
*/ | ||
delay(value: number): this; | ||
/** | ||
* Gets the animation's initial delay which is the length of time in seconds before the animation should begin. | ||
@@ -41,20 +103,77 @@ * | ||
/** | ||
* Sets the animation's initial delay which is the length of time in seconds before the animation should begin. | ||
* Adjusts the animation's timeScale to fit it within the specified duration. | ||
* | ||
* @param {number} value - Delay value | ||
* @param {number} value - Duration value | ||
* @returns {this} Returns self, useful for chaining. | ||
* @memberof Animation | ||
*/ | ||
delay(value: number): this; | ||
duration(value: number): this; | ||
/** | ||
* Gets the animation's progress which is a value between 0 and 1 indicating the position of the virtual | ||
* playhead (excluding repeats) where 0 is at the beginning, 0.5 is halfway complete, and 1 is complete. | ||
* Gets the animation's duration. | ||
* | ||
* @returns {number} The progress value | ||
* @returns {number} | ||
* @memberof Animation | ||
*/ | ||
progress(): number; | ||
duration(): number; | ||
endTime(includeRepeats?: boolean): number; | ||
eventCallback(type: callbackType, callback: callbackFn, params?: any[], scope?: object): this; | ||
eventCallback(type: callbackType): callbackFn; | ||
invalidate(): this; | ||
isActive(): boolean; | ||
iteration(value: number, supressEvents?: boolean): this; | ||
iteration(): number; | ||
kill(vars?: object, targets?: object | object[] ): this; | ||
pause(atTime?: number, supressEvents?: boolean): this; | ||
paused(value: boolean): this; | ||
paused(): boolean; | ||
play(from?: number, supressEvents?: boolean): this; | ||
/** | ||
@@ -70,4 +189,119 @@ * Sets the animation's progress which is a value between 0 and 1 indicating the position of the virtual | ||
progress(value: number, supressEvents?: boolean): this; | ||
/** | ||
* Gets the animation's progress which is a value between 0 and 1 indicating the position of the virtual | ||
* playhead (excluding repeats) where 0 is at the beginning, 0.5 is halfway complete, and 1 is complete. | ||
* | ||
* @returns {number} The progress value | ||
* @memberof Animation | ||
*/ | ||
progress(): number; | ||
rawTime(wrapRepeats: boolean): number; | ||
repeat(value: number): this; | ||
repeat(): number; | ||
repeatDelay(value: number): this | ||
repeatDelay(): number; | ||
restart(includeDelay?: boolean, supressEvents?: boolean): this; | ||
resume(from?: number, supressEvents?: boolean): this; | ||
reverse(from?: number, supressEvents?: boolean): this; | ||
reversed(value: boolean): this; | ||
reversed(): boolean | ||
startTime(value: number): this; | ||
startTime(): number; | ||
seek(time: number, supressEvents?: boolean): this; | ||
then(callback: callbackFn): Promise<any>; | ||
time(value: number, supressEvents?: boolean): this; | ||
time(): number; | ||
timeScale(value: number): this; | ||
timeScale(): number; | ||
totalDuration(value: number): this; | ||
totalDuration(): number; | ||
totalProgress(value: number, supressEvents?: boolean): this; | ||
totalProgress(): number; | ||
totalTime(value: number, supressEvents?: boolean): this; | ||
totalTime(): number; | ||
yoyo(value: boolean): this | ||
yoyo(): boolean; | ||
} | ||
/** | ||
@@ -81,2 +315,5 @@ * Tween description | ||
data: object; | ||
/** | ||
@@ -88,4 +325,9 @@ * The vars object passed into the constructor | ||
*/ | ||
vars: number; | ||
vars: object; | ||
static to(targets: validTargets, duration: number, vars: tweenVars): Tween; | ||
/** | ||
@@ -98,6 +340,29 @@ * Creates a Tween animating to destination values that are set. | ||
*/ | ||
static to(targets: any, duration: number, vars: object, position?: number|string): Tween; | ||
static to(targets: any, vars: object, position?: number|string): Tween; | ||
static to(targets: validTargets, vars: tweenVars): Tween; | ||
static from(targets: validTargets, duration: number, vars: tweenVars): Tween; | ||
static from(targets: validTargets, vars: tweenVars): Tween; | ||
static fromTo(targets: validTargets, duration: number, fromVars: tweenVars, toVars: tweenVars): Tween; | ||
static fromTo(targets: validTargets, fromVars: tweenVars, toVars: tweenVars): Tween; | ||
} | ||
/** | ||
@@ -119,4 +384,12 @@ * Timelines are essentially chains of tweens (.to, from, fromTo, etc.) calls. They are the ultimate | ||
*/ | ||
autoRemoveChildren: boolean; | ||
autoRemoveChildren: boolean; | ||
data: object; | ||
/** | ||
@@ -130,2 +403,5 @@ * Stores any labels that have been added to the timeline. | ||
/** | ||
@@ -142,5 +418,5 @@ * Controls whether or not child tweens and timelines are repositioned automatically (changing their startTime) in order to maintain smooth playback when properties are changed on-the-fly. | ||
/** | ||
* Adds a tween, timeline, callback, or label (or an array of them) to the timeline. | ||
* TODO: missing function() value param | ||
* | ||
@@ -150,4 +426,7 @@ * @returns {Timeline} | ||
*/ | ||
add(value: Tween|Timeline|string|function|array, position?: number|string, align?: string, stagger?: number|string): this; | ||
add(value: Tween | Timeline | string | string[], position?: positionType, align?: string, stagger?: number | string): this; | ||
/** | ||
@@ -159,4 +438,7 @@ * Adds a label to the timeline, making it easy to mark important positions/times. | ||
*/ | ||
addLabel(label: string, position?: number|string): this; | ||
addLabel(label: string, position?: positionType): this; | ||
/** | ||
@@ -168,4 +450,87 @@ * Inserts a special callback that pauses playback of the timeline at a particular time or label. | ||
*/ | ||
addPause(position?: number|string, callback?: function, params?: array): this; | ||
addPause(position?: positionType, callback?: callbackFn, params?: any[]): this; | ||
call(callback: callbackFn, params?: any[], position?: positionType): this; | ||
clear(labels: boolean): this; | ||
currentLabel(value: string): this; | ||
currentLabel(): string; | ||
from(targets: validTargets, duration: number, vars: tweenVars, position: positionType): this; | ||
from(targets: validTargets, vars: tweenVars, position?: positionType): this; | ||
fromTo(targets: validTargets, duration: number, fromVars: tweenVars, toVars: tweenVars, position: positionType): this; | ||
fromTo(targets: validTargets, fromVars: tweenVars, toVars: tweenVars, position?: positionType): this; | ||
getChildren(nested?: boolean, tweens?: boolean, timelines?: boolean, ignoreBeforeTime?: number): object[]; // This should be an array of Tweens AND Timelines | ||
getTweensOf(target: object, nested?: boolean): Tween[]; | ||
nextLabel(time?: number): string; | ||
previousLabel(time?: number): string; | ||
recent(): Tween | Timeline | callbackFn; | ||
remove(value: Tween | Timeline | callbackFn | string): this; | ||
removeLabel(label: string): number; | ||
removePause(position: positionType): this | ||
set(target: validTargets, vars: tweenVars, position?: positionType): this; | ||
shiftChildren(amount: number, adjustLabels?:boolean, ignoreBeforeTime?: number): this; | ||
/** | ||
@@ -177,9 +542,212 @@ * Creates a Tween animating to destination values that are set. | ||
*/ | ||
to(targets: any, duration: number, vars: object, position?: number|string): this; | ||
to(targets: any, vars: object, position?: number|string): this; | ||
to(targets: validTargets, duration: number, vars: tweenVars, position?: positionType): this; | ||
to(targets: validTargets, vars: tweenVars, position?: positionType): this; | ||
tweenFromTo(fromPosition: positionType, toPosition: positionType, vars: tweenVars): this; | ||
tweenTo(position: positionType, vars: tweenVars): this; | ||
} | ||
interface gsap { | ||
effects: object; | ||
globalTimeline: Timeline; | ||
ticker: { | ||
time: number; | ||
frame: number; | ||
tick(): void; | ||
wake(): void; | ||
sleep(): void; | ||
lagSmoothing(threshold: number, adjustedLag: number): void; | ||
fps(fps: number): void; | ||
add(callback: callbackFn): void; | ||
remove(callback: callbackFn): void; | ||
}; | ||
utils: { | ||
checkPrefix(value: string): string; | ||
clamp(min: number, max: number): (value: number) => number; | ||
clamp(min: number, max: number, value: number): number; | ||
distribute(config: { | ||
base: number, | ||
amount: number, | ||
from: number | string | any[], | ||
grid: 'auto' | [number, number], | ||
axis: 'x' | 'y', | ||
ease: string // TODO: ease declaration | ||
}): callbackFn; | ||
getUnit(value: string): string; | ||
interpolate<T>(array: T[]): (progress: number) => T; | ||
interpolate<T>(min: T, max: T): (progress: number) => T; | ||
interpolate<T>(min: T, max: T, progress: number): T; | ||
mapRange(inMin: number, inMax: number, outMin: number, outMax: number): (value: number) => number; | ||
mapRange(inMin: number, inMax: number, outMin: number, outMax: number, value: number): number; | ||
normalize(inMin: number, inMax: number): (value: number) => number; | ||
normalize(inMin: number, inMax: number, value: number): number; | ||
random<T>(values1: T[], values2?: null, progress?: number): T; // this is not working, when array, values2 is not provided or is null | ||
random<T>(values1: T, values2: T, progress?: number): T; | ||
random<T>(values1: T, values2: T, progress?: number, returnFunction?: boolean): () => T; | ||
// Continue from here | ||
} | ||
version: string; | ||
/** | ||
* gsap.config() lets you configure GSAP’s settings that aren't Tween-specific, like autoSleep, force3D, and units. | ||
* | ||
* @param {} value | ||
* @returns {gsap} | ||
* @memberof gsap | ||
*/ | ||
config(value: { | ||
autoSleep?: number; | ||
force3D?: boolean | 'auto'; | ||
units?: { }; // TODO: need to be able to specify key/value pair type here | ||
}): object; | ||
defaults(value: object): object; | ||
delayedCall(delay: number, callback: callbackFn, params?: string[], scope?: any): Tween; // TODO: investigate scope, try to eliminate 'any' | ||
exportRoot(vars?: tweenVars, includeDelayedCalls?: boolean): Timeline; | ||
from(targets: validTargets, vars: tweenVars): Tween; | ||
from(targets: validTargets, duration: number, vars:tweenVars): Tween; | ||
fromTo(targets: validTargets, fromVars: tweenVars, toVars: tweenVars): Tween; | ||
fromTo(targets: validTargets, duration: number, fromVars: tweenVars, toVars: tweenVars): Tween; | ||
getById(id: string): Tween | Timeline | undefined; | ||
getProperty(target: validTargets, property: string, unit?: string): string | number | null; | ||
getTweensOf(targets: object | object[], onlyActive?: boolean): Tween[]; | ||
isTweening(): Boolean; | ||
killTweensOf(targets: validTargets, properties?: object): void; | ||
killTweensOf(delayedCallback: callbackFn): void; | ||
parseEase(ease: string): void; | ||
registerEase(config: { name: string, ease: callbackFn }): void | ||
// registerEffect() | ||
// registerPlugin() | ||
set(targets: validTargets, vars: tweenVars): Tween; | ||
/** | ||
* | ||
* | ||
* @param {object} [vars] | ||
* @returns {Timeline} Timeline instance | ||
* @memberof gsap | ||
*/ | ||
timeline(vars?: tweenVars): Timeline; | ||
/** | ||
* **Deprecated method signature.** Use the `duration` property instead. | ||
* ```js | ||
* tl.to(".class", { duration: 1, x: 100 }); | ||
* ``` | ||
* @deprecated since version 2 | ||
* @param {*} targets | ||
* @param {number} duration - The duration parameter is deprecated. Use the `duration` | ||
* property instead. | ||
* @param {tweenVars} vars | ||
* @param {TimelinePosition} [position] | ||
* @returns {this} self, useful for chaining. | ||
* @memberof Timeline | ||
*/ | ||
to(targets: validTargets, duration: number, vars: tweenVars, position?: number|string): Tween; | ||
/** | ||
* Creates an animation | ||
@@ -196,12 +764,8 @@ * | ||
*/ | ||
to(targets: any, vars: object): Tween; | ||
to(targets: validTargets, vars: tweenVars): Tween; | ||
/** | ||
* | ||
* | ||
* @param {object} [vars] | ||
* @returns {Timeline} Timeline instance | ||
* @memberof gsap | ||
*/ | ||
timeline(vars?: object): Timeline; | ||
updateRoot(time: number): void; | ||
} | ||
@@ -212,2 +776,11 @@ | ||
declare const gsap: GSAPStatic.gsap; | ||
@@ -214,0 +787,0 @@ declare const TweenLite: typeof GSAPStatic.Tween; |
30
index.js
import { gsap, Power0, Power1, Power2, Power3, Power4, Linear, Quad, Cubic, Quart, Quint, Strong, Elastic, Back, SteppedEase, Bounce, Sine, Expo, Circ, TweenMax, TweenLite, TimelineLite, TimelineMax } from "./gsap-core.js"; | ||
import { CSSPlugin } from "./CSSPlugin.js"; | ||
gsap.registerPlugin(CSSPlugin); | ||
export { | ||
gsap, | ||
gsap as default, | ||
CSSPlugin, | ||
TweenMax, | ||
TweenLite, | ||
TimelineMax, | ||
TimelineLite, | ||
Power0, | ||
Power1, | ||
Power2, | ||
Power3, | ||
Power4, | ||
Linear, | ||
Quad, | ||
Cubic, | ||
Quart, | ||
Quint, | ||
Strong, | ||
Elastic, | ||
Back, | ||
SteppedEase, | ||
Bounce, | ||
Sine, | ||
Expo, | ||
Circ | ||
}; | ||
export { gsap, gsap as default, CSSPlugin, TweenMax, TweenLite, TimelineMax, TimelineLite, Power0, Power1, Power2, Power3, Power4, Linear, Quad, Cubic, Quart, Quint, Strong, Elastic, Back, SteppedEase, Bounce, Sine, Expo, Circ }; |
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-09-27 | ||
* http://greensock.com | ||
* MotionPathPlugin 3.0.0 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @license Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/ | ||
/* eslint-disable */ | ||
import { getRawPath, cacheRawPathMeasurements, getPositionOnPath, pointsToSegment, flatPointsToSegment, sliceRawPath, stringToRawPath, rawPathToString, transformRawPath, convertToPath } from "./utils/paths.js"; | ||
import { getRawPath, cacheRawPathMeasurements, getPositionOnPath, pointsToSegment, flatPointsToSegment, sliceRawPath, stringToRawPath, rawPathToString, transformRawPath, convertToPath as _convertToPath } from "./utils/paths.js"; | ||
import { getGlobalMatrix } from "./utils/matrix.js"; | ||
let _xProps = ["x","translateX","left","marginLeft"], | ||
_yProps = ["y","translateY","top","marginTop"], | ||
_DEG2RAD = Math.PI / 180, | ||
gsap, PropTween, _getUnit, _toArray, | ||
_getGSAP = () => gsap || typeof(window) !== "undefined" && (gsap = window.gsap), | ||
_populateSegmentFromArray = (segment, values, property, mode) => { //mode: 0 = x but don't fill y yet, 1 = y. | ||
let l = values.length, | ||
si = mode, | ||
i = 0; | ||
for (; i < l; i++) { | ||
segment[si] = parseFloat(values[i][property]); | ||
si += 2; | ||
} | ||
return segment; | ||
}, | ||
_getPropNum = (target, prop, unit) => parseFloat(target._gsap.get(target, prop, unit || "px")) || 0, | ||
_relativize = segment => { | ||
let x = segment[0], | ||
y = segment[1], | ||
i; | ||
for (i = 2; i < segment.length; i+=2) { | ||
x = (segment[i] += x); | ||
y = (segment[i+1] += y); | ||
} | ||
}, | ||
_segmentToRawPath = (plugin, segment, target, x, y, slicer, vars) => { | ||
if (vars.type === "cubic") { | ||
segment = [segment]; | ||
} else { | ||
segment.unshift(_getPropNum(target, x, vars.unitX), y ? _getPropNum(target, y, vars.unitY) : 0); | ||
if (vars.relative) { | ||
_relativize(segment); | ||
} | ||
let pointFunc = y ? pointsToSegment : flatPointsToSegment; | ||
segment = [pointFunc(segment, vars.curviness)]; | ||
} | ||
segment = slicer(_align(segment, target, vars)); | ||
_addDimensionalPropTween(plugin, target, x, segment, "x", vars.unitX); | ||
if (y) { | ||
_addDimensionalPropTween(plugin, target, y, segment, "y", vars.unitY); | ||
} | ||
return cacheRawPathMeasurements(segment, vars.resolution || (vars.curviness === 0 ? 20 : 12)); //when curviness is 0, it creates control points right on top of the anchors which makes it more sensitive to resolution, thus we change the default accordingly. | ||
}, | ||
_emptyFunc = v => v, | ||
_align = (rawPath, target, {align, transform, offsetX, offsetY}) => { | ||
let x, y, tween, targetMatrix, alignTarget, alignPath, alignMatrix, invertedMatrix, tx, ty; | ||
if (!rawPath || !rawPath.length) { | ||
return getRawPath("M0,0L0,0"); | ||
} | ||
if (align) { | ||
if (align === "self" || ((alignTarget = _toArray(align)[0] || target) === target)) { | ||
x = _getPropNum(target, "x") - rawPath[0][0]; | ||
y = _getPropNum(target, "y") - rawPath[0][1]; | ||
transformRawPath(rawPath, 1, 0, 0, 1, x, y); | ||
} else { | ||
tween = gsap.to(target, {xPercent:0, yPercent:0, x:0, y:0}).progress(1); //get rid of transforms, otherwise they'll throw off the measurements. | ||
targetMatrix = getGlobalMatrix(target); //we cannot use something like getScreenCTM() because of a major bug in Firefox that has existed for years and prevents values from being reported correctly when an ancestor element has transforms applied. Our proprietary getGlobalMatrix() works across all browsers. | ||
tween.render(-1).kill(); | ||
if (alignTarget.getTotalLength && alignTarget.tagName.toLowerCase() === "path") { //path | ||
alignPath = getRawPath(alignTarget); | ||
alignMatrix = getGlobalMatrix(alignTarget.parentNode); | ||
x = alignPath[0][0]; | ||
y = alignPath[0][1]; | ||
} else { | ||
alignMatrix = getGlobalMatrix(alignTarget); | ||
x = 0; | ||
y = 0; | ||
} | ||
tx = alignMatrix.a * x + alignMatrix.c * y + alignMatrix.e - targetMatrix.e; | ||
ty = alignMatrix.b * x + alignMatrix.d * y + alignMatrix.f - targetMatrix.f; | ||
invertedMatrix = getGlobalMatrix(target.parentNode, true); | ||
x = invertedMatrix.a * tx + invertedMatrix.c * ty; | ||
y = invertedMatrix.b * tx + invertedMatrix.d * ty; | ||
tx = rawPath[0][0]; | ||
ty = rawPath[0][1]; | ||
alignMatrix.multiply(invertedMatrix); | ||
x -= alignMatrix.a * tx + alignMatrix.c * ty; | ||
y -= alignMatrix.b * tx + alignMatrix.d * ty; | ||
transformRawPath(rawPath, alignMatrix.a, alignMatrix.b, alignMatrix.c, alignMatrix.d, x, y); | ||
} | ||
} | ||
if (transform) { | ||
transformRawPath(rawPath, transform[0], transform[1], transform[2], transform[3], transform[4], transform[5]); | ||
} else if (offsetX || offsetY) { | ||
transformRawPath(rawPath, 1, 0, 0, 1, offsetX || 0, offsetY || 0); | ||
} | ||
return rawPath; | ||
}, | ||
_addDimensionalPropTween = (plugin, target, property, rawPath, pathProperty, forceUnit) => { | ||
let cache = target._gsap, | ||
pt = plugin._pt = new PropTween(plugin._pt, target, property, 0, 0, _emptyFunc, 0, cache.set(target, property, plugin)); | ||
pt.u = _getUnit(cache.get(target, property, forceUnit)) || 0; | ||
pt.path = rawPath; | ||
pt.pp = pathProperty; | ||
plugin._props.push(property); | ||
}, | ||
_sliceModifier = (start, end) => rawPath => (start || end !== 1) ? sliceRawPath(rawPath, start, end) : rawPath; | ||
var _xProps = ["x", "translateX", "left", "marginLeft"], | ||
_yProps = ["y", "translateY", "top", "marginTop"], | ||
_DEG2RAD = Math.PI / 180, | ||
gsap, | ||
PropTween, | ||
_getUnit, | ||
_toArray, | ||
_getGSAP = function _getGSAP() { | ||
return gsap || typeof window !== "undefined" && (gsap = window.gsap) && gsap.registerPlugin && gsap; | ||
}, | ||
_populateSegmentFromArray = function _populateSegmentFromArray(segment, values, property, mode) { | ||
//mode: 0 = x but don't fill y yet, 1 = y. | ||
var l = values.length, | ||
si = mode, | ||
i = 0; | ||
for (; i < l; i++) { | ||
segment[si] = parseFloat(values[i][property]); | ||
si += 2; | ||
} | ||
export const MotionPathPlugin = { | ||
version:"3.0.0", | ||
name:"motionPath", | ||
register(core, Plugin, propTween) { | ||
gsap = core; | ||
_getUnit = gsap.utils.getUnit; | ||
_toArray = gsap.utils.toArray; | ||
PropTween = propTween; | ||
}, | ||
init(target, vars, tween, index, targets) { | ||
if (!gsap) { | ||
console.warn("Please gsap.registerPlugin(MotionPathPlugin)"); | ||
return false; | ||
} | ||
if (!(typeof(vars) === "object" && !vars.style) || !vars.path) { | ||
vars = {path:vars}; | ||
} | ||
let rawPaths = [], | ||
path = vars.path, | ||
firstObj = path[0], | ||
autoRotate = vars.autoRotate, | ||
slicer = _sliceModifier(vars.start, ("end" in vars) ? vars.end : 1), | ||
rawPath, p, x, y; | ||
this.rawPaths = rawPaths; | ||
this.target = target; | ||
if ((this.rotate = (autoRotate || autoRotate === 0))) { //get the rotational data FIRST so that the setTransform() method is called in the correct order in the render() loop - rotation gets set last. | ||
this.rOffset = parseFloat(autoRotate) || 0; | ||
this.radians = !!vars.useRadians; | ||
this.rProp = vars.rotation || "rotation"; // rotation property | ||
this.rSet = target._gsap.set(target, this.rProp, this); // rotation setter | ||
this.ru = _getUnit(target._gsap.get(target, this.rProp)) || 0; // rotation units | ||
} | ||
if (Array.isArray(path) && !("closed" in path) && typeof(firstObj) !== "number") { | ||
for (p in firstObj) { | ||
if (~_xProps.indexOf(p)) { | ||
x = p; | ||
} else if (~_yProps.indexOf(p)) { | ||
y = p; | ||
} | ||
} | ||
if (x && y) { //correlated values | ||
rawPaths.push(_segmentToRawPath(this, _populateSegmentFromArray(_populateSegmentFromArray([], path, x, 0), path, y, 1), target, vars.x || x, vars.y || y, slicer, vars)); | ||
} else { | ||
x = y = 0; | ||
} | ||
for (p in firstObj) { | ||
if (p !== x && p !== y) { | ||
rawPaths.push(_segmentToRawPath(this, _populateSegmentFromArray([], path, p, 0), target, p, 0, slicer, vars)); | ||
} | ||
} | ||
} else { | ||
rawPath = slicer(_align(getRawPath(vars.path), target, vars)); | ||
cacheRawPathMeasurements(rawPath, vars.resolution); | ||
rawPaths.push(rawPath); | ||
_addDimensionalPropTween(this, target, vars.x || "x", rawPath, "x", vars.unitX || "px"); | ||
_addDimensionalPropTween(this, target, vars.y || "y", rawPath, "y", vars.unitY || "px"); | ||
} | ||
}, | ||
render(ratio, data) { | ||
let rawPaths = data.rawPaths, | ||
i = rawPaths.length, | ||
pt = data._pt; | ||
if (ratio > 1) { | ||
ratio = 1; | ||
} else if (ratio < 0) { | ||
ratio = 0; | ||
} | ||
while (i--) { | ||
getPositionOnPath(rawPaths[i], ratio, !i && data.rotate, rawPaths[i]); | ||
} | ||
while (pt) { | ||
pt.set(pt.t, pt.p, pt.path[pt.pp] + pt.u, pt.d, ratio); | ||
pt = pt._next; | ||
} | ||
if (data.rotate) { | ||
data.rSet(data.target, data.rProp, rawPaths[0].angle * (data.radians ? _DEG2RAD : 1) + data.rOffset + data.ru, data, ratio); | ||
} | ||
}, | ||
getLength(path) { | ||
return cacheRawPathMeasurements(getRawPath(path)).totalLength; | ||
}, | ||
sliceRawPath: sliceRawPath, | ||
getRawPath: getRawPath, | ||
pointsToSegment: pointsToSegment, | ||
stringToRawPath: stringToRawPath, | ||
rawPathToString: rawPathToString, | ||
transformRawPath: transformRawPath, | ||
convertToPath: (targets, swap) => _toArray(targets).map(target => convertToPath(target, swap !== false)), | ||
getGlobalMatrix: getGlobalMatrix, | ||
arrayToRawPath(value, vars) { | ||
vars = vars || {}; | ||
let segment = _populateSegmentFromArray(_populateSegmentFromArray([], value, vars.x || "x", 0), value, vars.y || "y", 1); | ||
if (vars.relative) { | ||
_relativize(segment); | ||
} | ||
return [(vars.type === "cubic") ? segment : pointsToSegment(segment, vars.curviness)]; | ||
} | ||
return segment; | ||
}, | ||
_getPropNum = function _getPropNum(target, prop, unit) { | ||
return parseFloat(target._gsap.get(target, prop, unit || "px")) || 0; | ||
}, | ||
_relativize = function _relativize(segment) { | ||
var x = segment[0], | ||
y = segment[1], | ||
i; | ||
for (i = 2; i < segment.length; i += 2) { | ||
x = segment[i] += x; | ||
y = segment[i + 1] += y; | ||
} | ||
}, | ||
_segmentToRawPath = function _segmentToRawPath(plugin, segment, target, x, y, slicer, vars) { | ||
if (vars.type === "cubic") { | ||
segment = [segment]; | ||
} else { | ||
segment.unshift(_getPropNum(target, x, vars.unitX), y ? _getPropNum(target, y, vars.unitY) : 0); | ||
if (vars.relative) { | ||
_relativize(segment); | ||
} | ||
var pointFunc = y ? pointsToSegment : flatPointsToSegment; | ||
segment = [pointFunc(segment, vars.curviness)]; | ||
} | ||
segment = slicer(_align(segment, target, vars)); | ||
_addDimensionalPropTween(plugin, target, x, segment, "x", vars.unitX); | ||
if (y) { | ||
_addDimensionalPropTween(plugin, target, y, segment, "y", vars.unitY); | ||
} | ||
return cacheRawPathMeasurements(segment, vars.resolution || (vars.curviness === 0 ? 20 : 12)); //when curviness is 0, it creates control points right on top of the anchors which makes it more sensitive to resolution, thus we change the default accordingly. | ||
}, | ||
_emptyFunc = function _emptyFunc(v) { | ||
return v; | ||
}, | ||
_align = function _align(rawPath, target, _ref) { | ||
var align = _ref.align, | ||
matrix = _ref.matrix, | ||
offsetX = _ref.offsetX, | ||
offsetY = _ref.offsetY; | ||
var x, y, tween, targetMatrix, alignTarget, alignPath, alignMatrix, invertedMatrix, tx, ty; | ||
if (!rawPath || !rawPath.length) { | ||
return getRawPath("M0,0L0,0"); | ||
} | ||
if (align) { | ||
if (align === "self" || (alignTarget = _toArray(align)[0] || target) === target) { | ||
x = _getPropNum(target, "x") - rawPath[0][0]; | ||
y = _getPropNum(target, "y") - rawPath[0][1]; | ||
transformRawPath(rawPath, 1, 0, 0, 1, x, y); | ||
} else { | ||
tween = gsap.to(target, { | ||
xPercent: 0, | ||
yPercent: 0, | ||
x: 0, | ||
y: 0 | ||
}).progress(1); //get rid of transforms, otherwise they'll throw off the measurements. | ||
targetMatrix = getGlobalMatrix(target); //we cannot use something like getScreenCTM() because of a major bug in Firefox that has existed for years and prevents values from being reported correctly when an ancestor element has transforms applied. Our proprietary getGlobalMatrix() works across all browsers. | ||
tween.render(-1).kill(); | ||
if (alignTarget.getTotalLength && alignTarget.tagName.toLowerCase() === "path") { | ||
//path | ||
alignPath = getRawPath(alignTarget); | ||
alignMatrix = getGlobalMatrix(alignTarget.parentNode); | ||
x = alignPath[0][0]; | ||
y = alignPath[0][1]; | ||
} else { | ||
alignMatrix = getGlobalMatrix(alignTarget); | ||
x = 0; | ||
y = 0; | ||
} | ||
tx = alignMatrix.a * x + alignMatrix.c * y + alignMatrix.e - targetMatrix.e; | ||
ty = alignMatrix.b * x + alignMatrix.d * y + alignMatrix.f - targetMatrix.f; | ||
invertedMatrix = getGlobalMatrix(target.parentNode, true); | ||
x = invertedMatrix.a * tx + invertedMatrix.c * ty; | ||
y = invertedMatrix.b * tx + invertedMatrix.d * ty; | ||
tx = rawPath[0][0]; | ||
ty = rawPath[0][1]; | ||
alignMatrix.multiply(invertedMatrix); | ||
x -= alignMatrix.a * tx + alignMatrix.c * ty; | ||
y -= alignMatrix.b * tx + alignMatrix.d * ty; | ||
transformRawPath(rawPath, alignMatrix.a, alignMatrix.b, alignMatrix.c, alignMatrix.d, x, y); | ||
} | ||
} | ||
if (matrix) { | ||
transformRawPath(rawPath, matrix.a, matrix.b, matrix.c, matrix.d, matrix.e, matrix.f); | ||
} else if (offsetX || offsetY) { | ||
transformRawPath(rawPath, 1, 0, 0, 1, offsetX || 0, offsetY || 0); | ||
} | ||
return rawPath; | ||
}, | ||
_addDimensionalPropTween = function _addDimensionalPropTween(plugin, target, property, rawPath, pathProperty, forceUnit) { | ||
var cache = target._gsap, | ||
pt = plugin._pt = new PropTween(plugin._pt, target, property, 0, 0, _emptyFunc, 0, cache.set(target, property, plugin)); | ||
pt.u = _getUnit(cache.get(target, property, forceUnit)) || 0; | ||
pt.path = rawPath; | ||
pt.pp = pathProperty; | ||
plugin._props.push(property); | ||
}, | ||
_sliceModifier = function _sliceModifier(start, end) { | ||
return function (rawPath) { | ||
return start || end !== 1 ? sliceRawPath(rawPath, start, end) : rawPath; | ||
}; | ||
}; | ||
export var MotionPathPlugin = { | ||
version: "3.0.0", | ||
name: "motionPath", | ||
register: function register(core, Plugin, propTween) { | ||
gsap = core; | ||
_getUnit = gsap.utils.getUnit; | ||
_toArray = gsap.utils.toArray; | ||
PropTween = propTween; | ||
}, | ||
init: function init(target, vars, tween, index, targets) { | ||
if (!gsap) { | ||
console.warn("Please gsap.registerPlugin(MotionPathPlugin)"); | ||
return false; | ||
} | ||
if (!(typeof vars === "object" && !vars.style) || !vars.path) { | ||
vars = { | ||
path: vars | ||
}; | ||
} | ||
var rawPaths = [], | ||
path = vars.path, | ||
firstObj = path[0], | ||
autoRotate = vars.autoRotate, | ||
slicer = _sliceModifier(vars.start, "end" in vars ? vars.end : 1), | ||
rawPath, | ||
p, | ||
x, | ||
y; | ||
this.rawPaths = rawPaths; | ||
this.target = target; | ||
if (this.rotate = autoRotate || autoRotate === 0) { | ||
//get the rotational data FIRST so that the setTransform() method is called in the correct order in the render() loop - rotation gets set last. | ||
this.rOffset = parseFloat(autoRotate) || 0; | ||
this.radians = !!vars.useRadians; | ||
this.rProp = vars.rotation || "rotation"; // rotation property | ||
this.rSet = target._gsap.set(target, this.rProp, this); // rotation setter | ||
this.ru = _getUnit(target._gsap.get(target, this.rProp)) || 0; // rotation units | ||
} | ||
if (Array.isArray(path) && !("closed" in path) && typeof firstObj !== "number") { | ||
for (p in firstObj) { | ||
if (~_xProps.indexOf(p)) { | ||
x = p; | ||
} else if (~_yProps.indexOf(p)) { | ||
y = p; | ||
} | ||
} | ||
if (x && y) { | ||
//correlated values | ||
rawPaths.push(_segmentToRawPath(this, _populateSegmentFromArray(_populateSegmentFromArray([], path, x, 0), path, y, 1), target, vars.x || x, vars.y || y, slicer, vars)); | ||
} else { | ||
x = y = 0; | ||
} | ||
for (p in firstObj) { | ||
if (p !== x && p !== y) { | ||
rawPaths.push(_segmentToRawPath(this, _populateSegmentFromArray([], path, p, 0), target, p, 0, slicer, vars)); | ||
} | ||
} | ||
} else { | ||
rawPath = slicer(_align(getRawPath(vars.path), target, vars)); | ||
cacheRawPathMeasurements(rawPath, vars.resolution); | ||
rawPaths.push(rawPath); | ||
_addDimensionalPropTween(this, target, vars.x || "x", rawPath, "x", vars.unitX || "px"); | ||
_addDimensionalPropTween(this, target, vars.y || "y", rawPath, "y", vars.unitY || "px"); | ||
} | ||
}, | ||
render: function render(ratio, data) { | ||
var rawPaths = data.rawPaths, | ||
i = rawPaths.length, | ||
pt = data._pt; | ||
if (ratio > 1) { | ||
ratio = 1; | ||
} else if (ratio < 0) { | ||
ratio = 0; | ||
} | ||
while (i--) { | ||
getPositionOnPath(rawPaths[i], ratio, !i && data.rotate, rawPaths[i]); | ||
} | ||
while (pt) { | ||
pt.set(pt.t, pt.p, pt.path[pt.pp] + pt.u, pt.d, ratio); | ||
pt = pt._next; | ||
} | ||
if (data.rotate) { | ||
data.rSet(data.target, data.rProp, rawPaths[0].angle * (data.radians ? _DEG2RAD : 1) + data.rOffset + data.ru, data, ratio); | ||
} | ||
}, | ||
getLength: function getLength(path) { | ||
return cacheRawPathMeasurements(getRawPath(path)).totalLength; | ||
}, | ||
sliceRawPath: sliceRawPath, | ||
getRawPath: getRawPath, | ||
pointsToSegment: pointsToSegment, | ||
stringToRawPath: stringToRawPath, | ||
rawPathToString: rawPathToString, | ||
transformRawPath: transformRawPath, | ||
convertToPath: function convertToPath(targets, swap) { | ||
return _toArray(targets).map(function (target) { | ||
return _convertToPath(target, swap !== false); | ||
}); | ||
}, | ||
getGlobalMatrix: getGlobalMatrix, | ||
arrayToRawPath: function arrayToRawPath(value, vars) { | ||
vars = vars || {}; | ||
var segment = _populateSegmentFromArray(_populateSegmentFromArray([], value, vars.x || "x", 0), value, vars.y || "y", 1); | ||
if (vars.relative) { | ||
_relativize(segment); | ||
} | ||
return [vars.type === "cubic" ? segment : pointsToSegment(segment, vars.curviness)]; | ||
} | ||
}; | ||
_getGSAP() && gsap.registerPlugin(MotionPathPlugin); | ||
export { MotionPathPlugin as default }; |
{ | ||
"name": "gsap", | ||
"version": "3.0.0-beta.8", | ||
"version": "3.0.0-beta.10", | ||
"description": "GSAP is a JavaScript library for creating high-performance animations that work in **every** major browser (or anywhere JavaScript runs). No other library delivers such advanced sequencing, reliability, API efficiency, and tight control while solving real-world problems on over 8 million sites. GSAP works around countless browser inconsistencies. Your animations **just work**. Animate CSS, SVG, canvas, WebGL, React, Vue, custom properties of generic objects, colors, strings...pretty much anything! At its core, GSAP is a property manipulator, updating values over time very quickly with extreme accuracy. And it's up to 20x faster than jQuery! See http://greensock.com/why-gsap/ for details about what makes GSAP so special.", | ||
@@ -9,10 +9,3 @@ "homepage": "https://greensock.com", | ||
"types": "gsap.d.ts", | ||
"browser": { | ||
"./dist/gsap.min.js": "./gsap.js", | ||
"./dist/Draggable.min.js": "./Draggable.js", | ||
"./dist/EasePack.min.js": "./EasePack.js", | ||
"./dist/MotionPathPlugin.min.js": "./MotionPathPlugin.js", | ||
"./dist/ScrollToPlugin.min.js": "./ScrollToPlugin.js", | ||
"./dist/PixiPlugin.min.js": "./PixiPlugin.js" | ||
}, | ||
"sideEffects": false, | ||
"keywords": [ | ||
@@ -19,0 +12,0 @@ "GSAP", |
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-10-01 | ||
* http://greensock.com | ||
* PixiPlugin 3.0.0 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @license Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/ | ||
/* eslint-disable */ | ||
var gsap, | ||
_win, | ||
_splitColor, | ||
_coreInitted, | ||
_PIXI, | ||
PropTween, | ||
_getSetter, | ||
_windowExists = function _windowExists() { | ||
return typeof window !== "undefined"; | ||
}, | ||
_getGSAP = function _getGSAP() { | ||
return gsap || _windowExists() && (gsap = window.gsap) && gsap.registerPlugin && gsap; | ||
}, | ||
_isFunction = function _isFunction(value) { | ||
return typeof value === "function"; | ||
}, | ||
_warn = function _warn(message) { | ||
return console.warn(message); | ||
}, | ||
_idMatrix = [1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0], | ||
_lumR = 0.212671, | ||
_lumG = 0.715160, | ||
_lumB = 0.072169, | ||
_applyMatrix = function _applyMatrix(m, m2) { | ||
var temp = [], | ||
i = 0, | ||
z = 0, | ||
y, | ||
x; | ||
let gsap, _win, _splitColor, _coreInitted, _PIXI, PropTween, _getSetter, | ||
_windowExists = () => typeof(window) !== "undefined", | ||
_getGSAP = () => gsap || _windowExists() && (gsap = window.gsap), | ||
_isFunction = value => typeof(value) === "function", | ||
_warn = message => console.warn(message), | ||
_idMatrix = [1,0,0,0,0,0,1,0,0,0,0,0,1,0,0,0,0,0,1,0], | ||
_lumR = 0.212671, | ||
_lumG = 0.715160, | ||
_lumB = 0.072169, | ||
_applyMatrix = (m, m2) => { | ||
let temp = [], | ||
i = 0, | ||
z = 0, | ||
y, x; | ||
for (y = 0; y < 4; y++) { | ||
for (x = 0; x < 5; x++) { | ||
z = (x === 4) ? m[i + 4] : 0; | ||
temp[i + x] = m[i] * m2[x] + m[i+1] * m2[x + 5] + m[i+2] * m2[x + 10] + m[i+3] * m2[x + 15] + z; | ||
} | ||
i += 5; | ||
} | ||
return temp; | ||
}, | ||
_setSaturation = (m, n) => { | ||
let inv = 1 - n, | ||
r = inv * _lumR, | ||
g = inv * _lumG, | ||
b = inv * _lumB; | ||
return _applyMatrix([r + n, g, b, 0, 0, r, g + n, b, 0, 0, r, g, b + n, 0, 0, 0, 0, 0, 1, 0], m); | ||
}, | ||
_colorize = (m, color, amount) => { | ||
let c = _splitColor(color), | ||
r = c[0] / 255, | ||
g = c[1] / 255, | ||
b = c[2] / 255, | ||
inv = 1 - amount; | ||
return _applyMatrix([inv + amount * r * _lumR, amount * r * _lumG, amount * r * _lumB, 0, 0, amount * g * _lumR, inv + amount * g * _lumG, amount * g * _lumB, 0, 0, amount * b * _lumR, amount * b * _lumG, inv + amount * b * _lumB, 0, 0, 0, 0, 0, 1, 0], m); | ||
}, | ||
_setHue = (m, n) => { | ||
n *= Math.PI / 180; | ||
let c = Math.cos(n), | ||
s = Math.sin(n); | ||
return _applyMatrix([(_lumR + (c * (1 - _lumR))) + (s * (-_lumR)), (_lumG + (c * (-_lumG))) + (s * (-_lumG)), (_lumB + (c * (-_lumB))) + (s * (1 - _lumB)), 0, 0, (_lumR + (c * (-_lumR))) + (s * 0.143), (_lumG + (c * (1 - _lumG))) + (s * 0.14), (_lumB + (c * (-_lumB))) + (s * -0.283), 0, 0, (_lumR + (c * (-_lumR))) + (s * (-(1 - _lumR))), (_lumG + (c * (-_lumG))) + (s * _lumG), (_lumB + (c * (1 - _lumB))) + (s * _lumB), 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1], m); | ||
}, | ||
_setContrast = (m, n) => _applyMatrix([n,0,0,0,0.5 * (1 - n), 0,n,0,0,0.5 * (1 - n), 0,0,n,0,0.5 * (1 - n), 0,0,0,1,0], m), | ||
_getFilter = (target, type) => { | ||
let filterClass = _PIXI.filters[type], | ||
filters = target.filters || [], | ||
i = filters.length, | ||
filter; | ||
if (!filterClass) { | ||
_warn(type + " not found. PixiPlugin.registerPIXI(PIXI)"); | ||
} | ||
while (--i > -1) { | ||
if (filters[i] instanceof filterClass) { | ||
return filters[i]; | ||
} | ||
} | ||
filter = new filterClass(); | ||
if (type === "BlurFilter") { | ||
filter.blur = 0; | ||
} | ||
filters.push(filter); | ||
target.filters = filters; | ||
return filter; | ||
}, | ||
_addColorMatrixFilterCacheTween = (p, plugin, cache, vars) => { //we cache the ColorMatrixFilter components in a _gsColorMatrixFilter object attached to the target object so that it's easy to grab the current value at any time. | ||
plugin.add(cache, p, cache[p], vars[p]); | ||
plugin._props.push(p); | ||
}, | ||
_applyBrightnessToMatrix = (brightness, matrix) => { | ||
let temp = new _PIXI.filters.ColorMatrixFilter(); | ||
temp.matrix = matrix; | ||
temp.brightness(brightness, true); | ||
return temp.matrix; | ||
}, | ||
_copy = obj => { | ||
let copy = {}, | ||
p; | ||
for (p in obj) { | ||
copy[p] = obj[p]; | ||
} | ||
return copy; | ||
}, | ||
_CMFdefaults = {contrast:1, saturation:1, colorizeAmount:0, colorize:"rgb(255,255,255)", hue:0, brightness:1}, | ||
_parseColorMatrixFilter = (target, v, pg) => { | ||
let filter = _getFilter(target, "ColorMatrixFilter"), | ||
cache = target._gsColorMatrixFilter = target._gsColorMatrixFilter || _copy(_CMFdefaults), | ||
combine = v.combineCMF && !("colorMatrixFilter" in v && !v.colorMatrixFilter), | ||
i, matrix, startMatrix; | ||
startMatrix = filter.matrix; | ||
if (v.resolution) { | ||
filter.resolution = v.resolution; | ||
} | ||
if (v.matrix && v.matrix.length === startMatrix.length) { | ||
matrix = v.matrix; | ||
if (cache.contrast !== 1) { | ||
_addColorMatrixFilterCacheTween("contrast", pg, cache, _CMFdefaults); | ||
} | ||
if (cache.hue) { | ||
_addColorMatrixFilterCacheTween("hue", pg, cache, _CMFdefaults); | ||
} | ||
if (cache.brightness !== 1) { | ||
_addColorMatrixFilterCacheTween("brightness", pg, cache, _CMFdefaults); | ||
} | ||
if (cache.colorizeAmount) { | ||
_addColorMatrixFilterCacheTween("colorize", pg, cache, _CMFdefaults); | ||
_addColorMatrixFilterCacheTween("colorizeAmount", pg, cache, _CMFdefaults); | ||
} | ||
if (cache.saturation !== 1) { | ||
_addColorMatrixFilterCacheTween("saturation", pg, cache, _CMFdefaults); | ||
} | ||
for (y = 0; y < 4; y++) { | ||
for (x = 0; x < 5; x++) { | ||
z = x === 4 ? m[i + 4] : 0; | ||
temp[i + x] = m[i] * m2[x] + m[i + 1] * m2[x + 5] + m[i + 2] * m2[x + 10] + m[i + 3] * m2[x + 15] + z; | ||
} | ||
} else { | ||
matrix = _idMatrix.slice(); | ||
if (v.contrast != null) { | ||
matrix = _setContrast(matrix, +v.contrast); | ||
_addColorMatrixFilterCacheTween("contrast", pg, cache, v); | ||
} else if (cache.contrast !== 1) { | ||
if (combine) { | ||
matrix = _setContrast(matrix, cache.contrast); | ||
} else { | ||
_addColorMatrixFilterCacheTween("contrast", pg, cache, _CMFdefaults); | ||
} | ||
} | ||
if (v.hue != null) { | ||
matrix = _setHue(matrix, +v.hue); | ||
_addColorMatrixFilterCacheTween("hue", pg, cache, v); | ||
} else if (cache.hue) { | ||
if (combine) { | ||
matrix = _setHue(matrix, cache.hue); | ||
} else { | ||
_addColorMatrixFilterCacheTween("hue", pg, cache, _CMFdefaults); | ||
} | ||
} | ||
if (v.brightness != null) { | ||
matrix = _applyBrightnessToMatrix(+v.brightness, matrix); | ||
_addColorMatrixFilterCacheTween("brightness", pg, cache, v); | ||
} else if (cache.brightness !== 1) { | ||
if (combine) { | ||
matrix = _applyBrightnessToMatrix(cache.brightness, matrix); | ||
} else { | ||
_addColorMatrixFilterCacheTween("brightness", pg, cache, _CMFdefaults); | ||
} | ||
} | ||
if (v.colorize != null) { | ||
v.colorizeAmount = ("colorizeAmount" in v) ? +v.colorizeAmount : 1; | ||
matrix = _colorize(matrix, v.colorize, v.colorizeAmount); | ||
_addColorMatrixFilterCacheTween("colorize", pg, cache, v); | ||
_addColorMatrixFilterCacheTween("colorizeAmount", pg, cache, v); | ||
} else if (cache.colorizeAmount) { | ||
if (combine) { | ||
matrix = _colorize(matrix, cache.colorize, cache.colorizeAmount); | ||
} else { | ||
_addColorMatrixFilterCacheTween("colorize", pg, cache, _CMFdefaults); | ||
_addColorMatrixFilterCacheTween("colorizeAmount", pg, cache, _CMFdefaults); | ||
} | ||
} | ||
if (v.saturation != null) { | ||
matrix = _setSaturation(matrix, +v.saturation); | ||
_addColorMatrixFilterCacheTween("saturation", pg, cache, v); | ||
} else if (cache.saturation !== 1) { | ||
if (combine) { | ||
matrix = _setSaturation(matrix, cache.saturation); | ||
} else { | ||
_addColorMatrixFilterCacheTween("saturation", pg, cache, _CMFdefaults); | ||
} | ||
} | ||
} | ||
i = matrix.length; | ||
while (--i > -1) { | ||
if (matrix[i] !== startMatrix[i]) { | ||
pg.add(startMatrix, i, startMatrix[i], matrix[i], "colorMatrixFilter"); | ||
} | ||
} | ||
pg._props.push("colorMatrixFilter"); | ||
}, | ||
_renderColor = (ratio, {t, p, color, set}) => { | ||
set(t, p, color[0] << 16 | color[1] << 8 | color[2]); | ||
}, | ||
_renderDirtyCache = (ratio, {g}) => { | ||
if (g) { //in order for PixiJS to actually redraw GraphicsData, we've gotta increment the "dirty" and "clearDirty" values. If we don't do this, the values will be tween properly, but not rendered. | ||
g.dirty++; | ||
g.clearDirty++; | ||
} | ||
}, | ||
_renderAutoAlpha = (ratio, data) => { | ||
data.t.visible = !!data.t.alpha; | ||
}, | ||
_addColorTween = (target, p, value, plugin) => { | ||
let currentValue = target[p], | ||
startColor = _splitColor(_isFunction(currentValue) ? target[ ((p.indexOf("set") || !_isFunction(target["get" + p.substr(3)])) ? p : "get" + p.substr(3)) ]() : currentValue), | ||
endColor = _splitColor(value); | ||
plugin._pt = new PropTween(plugin._pt, target, p, 0, 0, _renderColor, {t:target, p:p, color:startColor, set:_getSetter(target, p)}); | ||
plugin.add(startColor, 0, startColor[0], endColor[0]); | ||
plugin.add(startColor, 1, startColor[1], endColor[1]); | ||
plugin.add(startColor, 2, startColor[2], endColor[2]); | ||
}, | ||
i += 5; | ||
} | ||
_colorProps = {tint:1, lineColor:1, fillColor:1}, | ||
_xyContexts = "position,scale,skew,pivot,anchor,tilePosition,tileScale".split(","), | ||
_contexts = {x:"position", y:"position", tileX:"tilePosition", tileY:"tilePosition"}, | ||
_colorMatrixFilterProps = {colorMatrixFilter:1, saturation:1, contrast:1, hue:1, colorize:1, colorizeAmount:1, brightness:1, combineCMF:1}, | ||
_DEG2RAD = Math.PI / 180, | ||
_degreesToRadians = value => (typeof(value) === "string" && value.charAt(1) === "=") ? value.substr(0, 2) + (parseFloat(value.substr(2)) * _DEG2RAD) : value * _DEG2RAD, | ||
_initCore = () => { | ||
if (_windowExists()) { | ||
_win = window; | ||
gsap = _coreInitted = _getGSAP(); | ||
_PIXI = _PIXI || _win.PIXI; | ||
_splitColor = gsap.utils.splitColor; | ||
} | ||
}, i, p; | ||
return temp; | ||
}, | ||
_setSaturation = function _setSaturation(m, n) { | ||
var inv = 1 - n, | ||
r = inv * _lumR, | ||
g = inv * _lumG, | ||
b = inv * _lumB; | ||
return _applyMatrix([r + n, g, b, 0, 0, r, g + n, b, 0, 0, r, g, b + n, 0, 0, 0, 0, 0, 1, 0], m); | ||
}, | ||
_colorize = function _colorize(m, color, amount) { | ||
var c = _splitColor(color), | ||
r = c[0] / 255, | ||
g = c[1] / 255, | ||
b = c[2] / 255, | ||
inv = 1 - amount; | ||
//context setup... | ||
return _applyMatrix([inv + amount * r * _lumR, amount * r * _lumG, amount * r * _lumB, 0, 0, amount * g * _lumR, inv + amount * g * _lumG, amount * g * _lumB, 0, 0, amount * b * _lumR, amount * b * _lumG, inv + amount * b * _lumB, 0, 0, 0, 0, 0, 1, 0], m); | ||
}, | ||
_setHue = function _setHue(m, n) { | ||
n *= Math.PI / 180; | ||
var c = Math.cos(n), | ||
s = Math.sin(n); | ||
return _applyMatrix([_lumR + c * (1 - _lumR) + s * -_lumR, _lumG + c * -_lumG + s * -_lumG, _lumB + c * -_lumB + s * (1 - _lumB), 0, 0, _lumR + c * -_lumR + s * 0.143, _lumG + c * (1 - _lumG) + s * 0.14, _lumB + c * -_lumB + s * -0.283, 0, 0, _lumR + c * -_lumR + s * -(1 - _lumR), _lumG + c * -_lumG + s * _lumG, _lumB + c * (1 - _lumB) + s * _lumB, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1], m); | ||
}, | ||
_setContrast = function _setContrast(m, n) { | ||
return _applyMatrix([n, 0, 0, 0, 0.5 * (1 - n), 0, n, 0, 0, 0.5 * (1 - n), 0, 0, n, 0, 0.5 * (1 - n), 0, 0, 0, 1, 0], m); | ||
}, | ||
_getFilter = function _getFilter(target, type) { | ||
var filterClass = _PIXI.filters[type], | ||
filters = target.filters || [], | ||
i = filters.length, | ||
filter; | ||
if (!filterClass) { | ||
_warn(type + " not found. PixiPlugin.registerPIXI(PIXI)"); | ||
} | ||
while (--i > -1) { | ||
if (filters[i] instanceof filterClass) { | ||
return filters[i]; | ||
} | ||
} | ||
filter = new filterClass(); | ||
if (type === "BlurFilter") { | ||
filter.blur = 0; | ||
} | ||
filters.push(filter); | ||
target.filters = filters; | ||
return filter; | ||
}, | ||
_addColorMatrixFilterCacheTween = function _addColorMatrixFilterCacheTween(p, plugin, cache, vars) { | ||
//we cache the ColorMatrixFilter components in a _gsColorMatrixFilter object attached to the target object so that it's easy to grab the current value at any time. | ||
plugin.add(cache, p, cache[p], vars[p]); | ||
plugin._props.push(p); | ||
}, | ||
_applyBrightnessToMatrix = function _applyBrightnessToMatrix(brightness, matrix) { | ||
var temp = new _PIXI.filters.ColorMatrixFilter(); | ||
temp.matrix = matrix; | ||
temp.brightness(brightness, true); | ||
return temp.matrix; | ||
}, | ||
_copy = function _copy(obj) { | ||
var copy = {}, | ||
p; | ||
for (p in obj) { | ||
copy[p] = obj[p]; | ||
} | ||
return copy; | ||
}, | ||
_CMFdefaults = { | ||
contrast: 1, | ||
saturation: 1, | ||
colorizeAmount: 0, | ||
colorize: "rgb(255,255,255)", | ||
hue: 0, | ||
brightness: 1 | ||
}, | ||
_parseColorMatrixFilter = function _parseColorMatrixFilter(target, v, pg) { | ||
var filter = _getFilter(target, "ColorMatrixFilter"), | ||
cache = target._gsColorMatrixFilter = target._gsColorMatrixFilter || _copy(_CMFdefaults), | ||
combine = v.combineCMF && !("colorMatrixFilter" in v && !v.colorMatrixFilter), | ||
i, | ||
matrix, | ||
startMatrix; | ||
startMatrix = filter.matrix; | ||
if (v.resolution) { | ||
filter.resolution = v.resolution; | ||
} | ||
if (v.matrix && v.matrix.length === startMatrix.length) { | ||
matrix = v.matrix; | ||
if (cache.contrast !== 1) { | ||
_addColorMatrixFilterCacheTween("contrast", pg, cache, _CMFdefaults); | ||
} | ||
if (cache.hue) { | ||
_addColorMatrixFilterCacheTween("hue", pg, cache, _CMFdefaults); | ||
} | ||
if (cache.brightness !== 1) { | ||
_addColorMatrixFilterCacheTween("brightness", pg, cache, _CMFdefaults); | ||
} | ||
if (cache.colorizeAmount) { | ||
_addColorMatrixFilterCacheTween("colorize", pg, cache, _CMFdefaults); | ||
_addColorMatrixFilterCacheTween("colorizeAmount", pg, cache, _CMFdefaults); | ||
} | ||
if (cache.saturation !== 1) { | ||
_addColorMatrixFilterCacheTween("saturation", pg, cache, _CMFdefaults); | ||
} | ||
} else { | ||
matrix = _idMatrix.slice(); | ||
if (v.contrast != null) { | ||
matrix = _setContrast(matrix, +v.contrast); | ||
_addColorMatrixFilterCacheTween("contrast", pg, cache, v); | ||
} else if (cache.contrast !== 1) { | ||
if (combine) { | ||
matrix = _setContrast(matrix, cache.contrast); | ||
} else { | ||
_addColorMatrixFilterCacheTween("contrast", pg, cache, _CMFdefaults); | ||
} | ||
} | ||
if (v.hue != null) { | ||
matrix = _setHue(matrix, +v.hue); | ||
_addColorMatrixFilterCacheTween("hue", pg, cache, v); | ||
} else if (cache.hue) { | ||
if (combine) { | ||
matrix = _setHue(matrix, cache.hue); | ||
} else { | ||
_addColorMatrixFilterCacheTween("hue", pg, cache, _CMFdefaults); | ||
} | ||
} | ||
if (v.brightness != null) { | ||
matrix = _applyBrightnessToMatrix(+v.brightness, matrix); | ||
_addColorMatrixFilterCacheTween("brightness", pg, cache, v); | ||
} else if (cache.brightness !== 1) { | ||
if (combine) { | ||
matrix = _applyBrightnessToMatrix(cache.brightness, matrix); | ||
} else { | ||
_addColorMatrixFilterCacheTween("brightness", pg, cache, _CMFdefaults); | ||
} | ||
} | ||
if (v.colorize != null) { | ||
v.colorizeAmount = "colorizeAmount" in v ? +v.colorizeAmount : 1; | ||
matrix = _colorize(matrix, v.colorize, v.colorizeAmount); | ||
_addColorMatrixFilterCacheTween("colorize", pg, cache, v); | ||
_addColorMatrixFilterCacheTween("colorizeAmount", pg, cache, v); | ||
} else if (cache.colorizeAmount) { | ||
if (combine) { | ||
matrix = _colorize(matrix, cache.colorize, cache.colorizeAmount); | ||
} else { | ||
_addColorMatrixFilterCacheTween("colorize", pg, cache, _CMFdefaults); | ||
_addColorMatrixFilterCacheTween("colorizeAmount", pg, cache, _CMFdefaults); | ||
} | ||
} | ||
if (v.saturation != null) { | ||
matrix = _setSaturation(matrix, +v.saturation); | ||
_addColorMatrixFilterCacheTween("saturation", pg, cache, v); | ||
} else if (cache.saturation !== 1) { | ||
if (combine) { | ||
matrix = _setSaturation(matrix, cache.saturation); | ||
} else { | ||
_addColorMatrixFilterCacheTween("saturation", pg, cache, _CMFdefaults); | ||
} | ||
} | ||
} | ||
i = matrix.length; | ||
while (--i > -1) { | ||
if (matrix[i] !== startMatrix[i]) { | ||
pg.add(startMatrix, i, startMatrix[i], matrix[i], "colorMatrixFilter"); | ||
} | ||
} | ||
pg._props.push("colorMatrixFilter"); | ||
}, | ||
_renderColor = function _renderColor(ratio, _ref) { | ||
var t = _ref.t, | ||
p = _ref.p, | ||
color = _ref.color, | ||
set = _ref.set; | ||
set(t, p, color[0] << 16 | color[1] << 8 | color[2]); | ||
}, | ||
_renderDirtyCache = function _renderDirtyCache(ratio, _ref2) { | ||
var g = _ref2.g; | ||
if (g) { | ||
//in order for PixiJS to actually redraw GraphicsData, we've gotta increment the "dirty" and "clearDirty" values. If we don't do this, the values will be tween properly, but not rendered. | ||
g.dirty++; | ||
g.clearDirty++; | ||
} | ||
}, | ||
_renderAutoAlpha = function _renderAutoAlpha(ratio, data) { | ||
data.t.visible = !!data.t.alpha; | ||
}, | ||
_addColorTween = function _addColorTween(target, p, value, plugin) { | ||
var currentValue = target[p], | ||
startColor = _splitColor(_isFunction(currentValue) ? target[p.indexOf("set") || !_isFunction(target["get" + p.substr(3)]) ? p : "get" + p.substr(3)]() : currentValue), | ||
endColor = _splitColor(value); | ||
plugin._pt = new PropTween(plugin._pt, target, p, 0, 0, _renderColor, { | ||
t: target, | ||
p: p, | ||
color: startColor, | ||
set: _getSetter(target, p) | ||
}); | ||
plugin.add(startColor, 0, startColor[0], endColor[0]); | ||
plugin.add(startColor, 1, startColor[1], endColor[1]); | ||
plugin.add(startColor, 2, startColor[2], endColor[2]); | ||
}, | ||
_colorProps = { | ||
tint: 1, | ||
lineColor: 1, | ||
fillColor: 1 | ||
}, | ||
_xyContexts = "position,scale,skew,pivot,anchor,tilePosition,tileScale".split(","), | ||
_contexts = { | ||
x: "position", | ||
y: "position", | ||
tileX: "tilePosition", | ||
tileY: "tilePosition" | ||
}, | ||
_colorMatrixFilterProps = { | ||
colorMatrixFilter: 1, | ||
saturation: 1, | ||
contrast: 1, | ||
hue: 1, | ||
colorize: 1, | ||
colorizeAmount: 1, | ||
brightness: 1, | ||
combineCMF: 1 | ||
}, | ||
_DEG2RAD = Math.PI / 180, | ||
_degreesToRadians = function _degreesToRadians(value) { | ||
return typeof value === "string" && value.charAt(1) === "=" ? value.substr(0, 2) + parseFloat(value.substr(2)) * _DEG2RAD : value * _DEG2RAD; | ||
}, | ||
_initCore = function _initCore() { | ||
if (_windowExists()) { | ||
_win = window; | ||
gsap = _coreInitted = _getGSAP(); | ||
_PIXI = _PIXI || _win.PIXI; | ||
_splitColor = gsap.utils.splitColor; | ||
} | ||
}, | ||
i, | ||
p; //context setup... | ||
for (i = 0; i < _xyContexts.length; i++) { | ||
p = _xyContexts[i]; | ||
_contexts[p + "X"] = p; | ||
_contexts[p + "Y"] = p; | ||
p = _xyContexts[i]; | ||
_contexts[p + "X"] = p; | ||
_contexts[p + "Y"] = p; | ||
} | ||
export var PixiPlugin = { | ||
version: "3.0.0", | ||
name: "pixi", | ||
register: function register(core, Plugin, propTween) { | ||
gsap = core; | ||
PropTween = propTween; | ||
_getSetter = Plugin.getSetter; | ||
export const PixiPlugin = { | ||
version:"3.0.0", | ||
name:"pixi", | ||
register(core, Plugin, propTween) { | ||
gsap = core; | ||
PropTween = propTween; | ||
_getSetter = Plugin.getSetter; | ||
_initCore(); | ||
}, | ||
registerPIXI(pixi) { | ||
_PIXI = pixi; | ||
}, | ||
init(target, values, tween, index, targets) { | ||
if (!_PIXI) { | ||
_initCore(); | ||
} | ||
if (!target instanceof _PIXI.DisplayObject) { | ||
return false; | ||
} | ||
let isV4 = _PIXI.VERSION.charAt(0) === "4", | ||
context, axis, value, colorMatrix, filter, p, padding, i, data; | ||
for (p in values) { | ||
context = _contexts[p]; | ||
value = values[p]; | ||
if (context) { | ||
axis = ~p.charAt(p.length-1).toLowerCase().indexOf("x") ? "x" : "y"; | ||
this.add(target[context], axis, target[context][axis], (context === "skew") ? _degreesToRadians(value) : value); | ||
} else if (p === "scale" || p === "anchor" || p === "pivot" || p === "tileScale") { | ||
this.add(target[p], "x", target[p].x, value); | ||
this.add(target[p], "y", target[p].y, value); | ||
} else if (p === "rotation") { //PIXI expects rotation in radians, but as a convenience we let folks define it in degrees and we do the conversion. | ||
this.add(target, p, target.rotation, _degreesToRadians(value)); | ||
} else if (_colorMatrixFilterProps[p]) { | ||
if (!colorMatrix) { | ||
_parseColorMatrixFilter(target, values.colorMatrixFilter || values, this); | ||
colorMatrix = true; | ||
} | ||
} else if (p === "blur" || p === "blurX" || p === "blurY" || p === "blurPadding") { | ||
filter = _getFilter(target, "BlurFilter"); | ||
this.add(filter, p, filter[p], value); | ||
if (values.blurPadding !== 0) { | ||
padding = values.blurPadding || Math.max(filter[p], value) * 2; | ||
i = target.filters.length; | ||
while (--i > -1) { | ||
target.filters[i].padding = Math.max(target.filters[i].padding, padding); //if we don't expand the padding on all the filters, it can look clipped. | ||
} | ||
} | ||
} else if (_colorProps[p]) { | ||
if ((p === "lineColor" || p === "fillColor") && target instanceof _PIXI.Graphics) { | ||
data = (target.geometry || target).graphicsData; //"geometry" was introduced in PIXI version 5 | ||
this._pt = new PropTween(this._pt, target, p, 0, 0, _renderDirtyCache, {g:target.geometry || target}); | ||
i = data.length; | ||
while (--i > -1) { | ||
_addColorTween(isV4 ? data[i] : data[i][p.substr(0, 4) + "Style"], isV4 ? p : "color", value, this); | ||
} | ||
} else { | ||
_addColorTween(target, p, value, this); | ||
} | ||
} else if (p === "autoAlpha") { | ||
this._pt = new PropTween(this._pt, target, "visible", 0, 0, _renderAutoAlpha); | ||
this.add(target, "alpha", target.alpha, value); | ||
this._props.push("alpha", "visible"); | ||
} else { | ||
this.add(target, p, "get", value); | ||
} | ||
this._props.push(p); | ||
} | ||
} | ||
_initCore(); | ||
}, | ||
registerPIXI: function registerPIXI(pixi) { | ||
_PIXI = pixi; | ||
}, | ||
init: function init(target, values, tween, index, targets) { | ||
if (!_PIXI) { | ||
_initCore(); | ||
} | ||
if (!target instanceof _PIXI.DisplayObject) { | ||
return false; | ||
} | ||
var isV4 = _PIXI.VERSION.charAt(0) === "4", | ||
context, | ||
axis, | ||
value, | ||
colorMatrix, | ||
filter, | ||
p, | ||
padding, | ||
i, | ||
data; | ||
for (p in values) { | ||
context = _contexts[p]; | ||
value = values[p]; | ||
if (context) { | ||
axis = ~p.charAt(p.length - 1).toLowerCase().indexOf("x") ? "x" : "y"; | ||
this.add(target[context], axis, target[context][axis], context === "skew" ? _degreesToRadians(value) : value); | ||
} else if (p === "scale" || p === "anchor" || p === "pivot" || p === "tileScale") { | ||
this.add(target[p], "x", target[p].x, value); | ||
this.add(target[p], "y", target[p].y, value); | ||
} else if (p === "rotation") { | ||
//PIXI expects rotation in radians, but as a convenience we let folks define it in degrees and we do the conversion. | ||
this.add(target, p, target.rotation, _degreesToRadians(value)); | ||
} else if (_colorMatrixFilterProps[p]) { | ||
if (!colorMatrix) { | ||
_parseColorMatrixFilter(target, values.colorMatrixFilter || values, this); | ||
colorMatrix = true; | ||
} | ||
} else if (p === "blur" || p === "blurX" || p === "blurY" || p === "blurPadding") { | ||
filter = _getFilter(target, "BlurFilter"); | ||
this.add(filter, p, filter[p], value); | ||
if (values.blurPadding !== 0) { | ||
padding = values.blurPadding || Math.max(filter[p], value) * 2; | ||
i = target.filters.length; | ||
while (--i > -1) { | ||
target.filters[i].padding = Math.max(target.filters[i].padding, padding); //if we don't expand the padding on all the filters, it can look clipped. | ||
} | ||
} | ||
} else if (_colorProps[p]) { | ||
if ((p === "lineColor" || p === "fillColor") && target instanceof _PIXI.Graphics) { | ||
data = (target.geometry || target).graphicsData; //"geometry" was introduced in PIXI version 5 | ||
this._pt = new PropTween(this._pt, target, p, 0, 0, _renderDirtyCache, { | ||
g: target.geometry || target | ||
}); | ||
i = data.length; | ||
while (--i > -1) { | ||
_addColorTween(isV4 ? data[i] : data[i][p.substr(0, 4) + "Style"], isV4 ? p : "color", value, this); | ||
} | ||
} else { | ||
_addColorTween(target, p, value, this); | ||
} | ||
} else if (p === "autoAlpha") { | ||
this._pt = new PropTween(this._pt, target, "visible", 0, 0, _renderAutoAlpha); | ||
this.add(target, "alpha", target.alpha, value); | ||
this._props.push("alpha", "visible"); | ||
} else { | ||
this.add(target, p, "get", value); | ||
} | ||
this._props.push(p); | ||
} | ||
} | ||
}; | ||
_getGSAP() && gsap.registerPlugin(PixiPlugin); | ||
export { PixiPlugin as default }; |
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-09-27 | ||
* http://greensock.com | ||
* ScrollToPlugin 3.0.0 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* @license Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/ | ||
/* eslint-disable */ | ||
var gsap, | ||
_coreInitted, | ||
_window, | ||
_docEl, | ||
_body, | ||
_toArray, | ||
_config, | ||
_windowExists = function _windowExists() { | ||
return typeof window !== "undefined"; | ||
}, | ||
_getGSAP = function _getGSAP() { | ||
return gsap || _windowExists() && (gsap = window.gsap) && gsap.registerPlugin && gsap; | ||
}, | ||
_isString = function _isString(value) { | ||
return typeof value === "string"; | ||
}, | ||
_max = function _max(element, axis) { | ||
var dim = axis === "x" ? "Width" : "Height", | ||
scroll = "scroll" + dim, | ||
client = "client" + dim; | ||
return element === _window || element === _docEl || element === _body ? Math.max(_docEl[scroll], _body[scroll]) - (_window["inner" + dim] || _docEl[client] || _body[client]) : element[scroll] - element["offset" + dim]; | ||
}, | ||
_buildGetter = function _buildGetter(e, axis) { | ||
//pass in an element and an axis ("x" or "y") and it'll return a getter function for the scroll position of that element (like scrollTop or scrollLeft, although if the element is the window, it'll use the pageXOffset/pageYOffset or the documentElement's scrollTop/scrollLeft or document.body's. Basically this streamlines things and makes a very fast getter across browsers. | ||
var p = "scroll" + (axis === "x" ? "Left" : "Top"); | ||
let gsap, _coreInitted, _window, _docEl, _body, _toArray, _config, | ||
_windowExists = () => typeof(window) !== "undefined", | ||
_getGSAP = () => gsap || _windowExists() && (gsap = window.gsap), | ||
_isString = value => typeof(value) === "string", | ||
_max = (element, axis) => { | ||
let dim = (axis === "x") ? "Width" : "Height", | ||
scroll = "scroll" + dim, | ||
client = "client" + dim; | ||
return (element === _window || element === _docEl || element === _body) ? Math.max(_docEl[scroll], _body[scroll]) - (_window["inner" + dim] || _docEl[client] || _body[client]) : element[scroll] - element["offset" + dim]; | ||
}, | ||
_buildGetter = (e, axis) => { //pass in an element and an axis ("x" or "y") and it'll return a getter function for the scroll position of that element (like scrollTop or scrollLeft, although if the element is the window, it'll use the pageXOffset/pageYOffset or the documentElement's scrollTop/scrollLeft or document.body's. Basically this streamlines things and makes a very fast getter across browsers. | ||
let p = "scroll" + ((axis === "x") ? "Left" : "Top"); | ||
if (e === _window) { | ||
if (e.pageXOffset != null) { | ||
p = "page" + axis.toUpperCase() + "Offset"; | ||
} else { | ||
e = _docEl[p] != null ? _docEl : _body; | ||
} | ||
} | ||
return () => e[p]; | ||
}, | ||
_getOffset = (element, container) => { | ||
let rect = _toArray(element)[0].getBoundingClientRect(), | ||
isRoot = (!container || container === _window || container === _body), | ||
cRect = isRoot ? {top:_docEl.clientTop - (_window.pageYOffset || _docEl.scrollTop || _body.scrollTop || 0), left:_docEl.clientLeft - (_window.pageXOffset || _docEl.scrollLeft || _body.scrollLeft || 0)} : container.getBoundingClientRect(), | ||
offsets = {x: rect.left - cRect.left, y: rect.top - cRect.top}; | ||
if (!isRoot && container) { //only add the current scroll position if it's not the window/body. | ||
offsets.x += _buildGetter(container, "x")(); | ||
offsets.y += _buildGetter(container, "y")(); | ||
} | ||
return offsets; | ||
}, | ||
_parseVal = (value, target, axis, currentVal) => !isNaN(value) ? parseFloat(value) : (_isString(value) && value.charAt(1) === "=") ? parseFloat(value.substr(2)) * (value.charAt(0) === "-" ? -1 : 1) + currentVal : (value === "max") ? _max(target, axis) : Math.min(_max(target, axis), _getOffset(value, target)[axis]), | ||
_initCore = () => { | ||
gsap = _getGSAP(); | ||
if (_windowExists() && gsap) { | ||
_window = window; | ||
_body = document.body; | ||
_docEl = document.documentElement; | ||
_toArray = gsap.utils.toArray; | ||
gsap.config({autoKillThreshold:7}); | ||
_config = gsap.config(); | ||
_coreInitted = 1; | ||
} | ||
}; | ||
if (e === _window) { | ||
if (e.pageXOffset != null) { | ||
p = "page" + axis.toUpperCase() + "Offset"; | ||
} else { | ||
e = _docEl[p] != null ? _docEl : _body; | ||
} | ||
} | ||
return function () { | ||
return e[p]; | ||
}; | ||
}, | ||
_getOffset = function _getOffset(element, container) { | ||
var rect = _toArray(element)[0].getBoundingClientRect(), | ||
isRoot = !container || container === _window || container === _body, | ||
cRect = isRoot ? { | ||
top: _docEl.clientTop - (_window.pageYOffset || _docEl.scrollTop || _body.scrollTop || 0), | ||
left: _docEl.clientLeft - (_window.pageXOffset || _docEl.scrollLeft || _body.scrollLeft || 0) | ||
} : container.getBoundingClientRect(), | ||
offsets = { | ||
x: rect.left - cRect.left, | ||
y: rect.top - cRect.top | ||
}; | ||
export const ScrollToPlugin = { | ||
version:"3.0.0", | ||
name:"scrollTo", | ||
register(core, Plugin, propTween) { | ||
gsap = core; | ||
_initCore(); | ||
}, | ||
init(target, value, tween, index, targets) { | ||
if (!_coreInitted) { | ||
_initCore(); | ||
} | ||
let data = this; | ||
data.isWin = (target === _window); | ||
data.target = target; | ||
data.tween = tween; | ||
if (typeof(value) !== "object") { | ||
value = {y:value}; //if we don't receive an object as the parameter, assume the user intends "y". | ||
if (_isString(value.y) && value.y !== "max" && value.y.charAt(1) !== "=") { | ||
value.x = value.y; | ||
} | ||
} else if (value.nodeType) { | ||
value = {y:value, x:value}; | ||
} | ||
data.vars = value; | ||
data.autoKill = (value.autoKill !== false); | ||
data.getX = _buildGetter(target, "x"); | ||
data.getY = _buildGetter(target, "y"); | ||
data.x = data.xPrev = data.getX(); | ||
data.y = data.yPrev = data.getY(); | ||
if (value.x != null) { | ||
data.add(data, "x", data.x, _parseVal(value.x, target, "x", data.x) - (value.offsetX || 0), index, targets, Math.round); | ||
data._props.push("scrollTo_x"); | ||
} else { | ||
data.skipX = 1; | ||
} | ||
if (value.y != null) { | ||
data.add(data, "y", data.y, _parseVal(value.y, target, "y", data.y) - (value.offsetY || 0), index, targets, Math.round); | ||
data._props.push("scrollTo_y"); | ||
} else { | ||
data.skipY = 1; | ||
} | ||
}, | ||
render(ratio, data) { | ||
let pt = data._pt, | ||
{ target, tween, autoKill, xPrev, yPrev, isWin } = data, | ||
x, y, yDif, xDif, threshold; | ||
while (pt) { | ||
pt.r(ratio, pt.d); | ||
pt = pt._next; | ||
} | ||
x = (isWin || !data.skipX) ? data.getX() : xPrev; | ||
y = (isWin || !data.skipY) ? data.getY() : yPrev; | ||
yDif = y - yPrev; | ||
xDif = x - xPrev; | ||
threshold = _config.autoKillThreshold; | ||
if (data.x < 0) { //can't scroll to a position less than 0! Might happen if someone uses a Back.easeOut or Elastic.easeOut when scrolling back to the top of the page (for example) | ||
data.x = 0; | ||
} | ||
if (data.y < 0) { | ||
data.y = 0; | ||
} | ||
if (autoKill) { | ||
//note: iOS has a bug that throws off the scroll by several pixels, so we need to check if it's within 7 pixels of the previous one that we set instead of just looking for an exact match. | ||
if (!data.skipX && (xDif > threshold || xDif < -threshold) && x < _max(target, "x")) { | ||
data.skipX = 1; //if the user scrolls separately, we should stop tweening! | ||
} | ||
if (!data.skipY && (yDif > threshold || yDif < -threshold) && y < _max(target, "y")) { | ||
data.skipY = 1; //if the user scrolls separately, we should stop tweening! | ||
} | ||
if (data.skipX && data.skipY) { | ||
tween.kill(); | ||
if (data.vars.onAutoKill) { | ||
data.vars.onAutoKill.apply(tween, data.vars.onAutoKillParams || []); | ||
} | ||
} | ||
} | ||
if (isWin) { | ||
_window.scrollTo((!data.skipX) ? data.x : x, (!data.skipY) ? data.y : y); | ||
} else { | ||
if (!data.skipY) { | ||
target.scrollTop = data.y; | ||
} | ||
if (!data.skipX) { | ||
target.scrollLeft = data.x; | ||
} | ||
} | ||
data.xPrev = data.x; | ||
data.yPrev = data.y; | ||
}, | ||
kill(property) { | ||
let both = (property === "scrollTo"); | ||
if (both || property === "scrollTo_x") { | ||
this.skipX = 1; | ||
} | ||
if (both || property === "scrollTo_y") { | ||
this.skipY = 1; | ||
} | ||
} | ||
if (!isRoot && container) { | ||
//only add the current scroll position if it's not the window/body. | ||
offsets.x += _buildGetter(container, "x")(); | ||
offsets.y += _buildGetter(container, "y")(); | ||
} | ||
return offsets; | ||
}, | ||
_parseVal = function _parseVal(value, target, axis, currentVal) { | ||
return !isNaN(value) ? parseFloat(value) : _isString(value) && value.charAt(1) === "=" ? parseFloat(value.substr(2)) * (value.charAt(0) === "-" ? -1 : 1) + currentVal : value === "max" ? _max(target, axis) : Math.min(_max(target, axis), _getOffset(value, target)[axis]); | ||
}, | ||
_initCore = function _initCore() { | ||
gsap = _getGSAP(); | ||
if (_windowExists() && gsap) { | ||
_window = window; | ||
_body = document.body; | ||
_docEl = document.documentElement; | ||
_toArray = gsap.utils.toArray; | ||
gsap.config({ | ||
autoKillThreshold: 7 | ||
}); | ||
_config = gsap.config(); | ||
_coreInitted = 1; | ||
} | ||
}; | ||
export var ScrollToPlugin = { | ||
version: "3.0.0", | ||
name: "scrollTo", | ||
register: function register(core, Plugin, propTween) { | ||
gsap = core; | ||
_initCore(); | ||
}, | ||
init: function init(target, value, tween, index, targets) { | ||
if (!_coreInitted) { | ||
_initCore(); | ||
} | ||
var data = this; | ||
data.isWin = target === _window; | ||
data.target = target; | ||
data.tween = tween; | ||
if (typeof value !== "object") { | ||
value = { | ||
y: value | ||
}; //if we don't receive an object as the parameter, assume the user intends "y". | ||
if (_isString(value.y) && value.y !== "max" && value.y.charAt(1) !== "=") { | ||
value.x = value.y; | ||
} | ||
} else if (value.nodeType) { | ||
value = { | ||
y: value, | ||
x: value | ||
}; | ||
} | ||
data.vars = value; | ||
data.autoKill = !!value.autoKill; | ||
data.getX = _buildGetter(target, "x"); | ||
data.getY = _buildGetter(target, "y"); | ||
data.x = data.xPrev = data.getX(); | ||
data.y = data.yPrev = data.getY(); | ||
if (value.x != null) { | ||
data.add(data, "x", data.x, _parseVal(value.x, target, "x", data.x) - (value.offsetX || 0), index, targets, Math.round); | ||
data._props.push("scrollTo_x"); | ||
} else { | ||
data.skipX = 1; | ||
} | ||
if (value.y != null) { | ||
data.add(data, "y", data.y, _parseVal(value.y, target, "y", data.y) - (value.offsetY || 0), index, targets, Math.round); | ||
data._props.push("scrollTo_y"); | ||
} else { | ||
data.skipY = 1; | ||
} | ||
}, | ||
render: function render(ratio, data) { | ||
var pt = data._pt, | ||
target = data.target, | ||
tween = data.tween, | ||
autoKill = data.autoKill, | ||
xPrev = data.xPrev, | ||
yPrev = data.yPrev, | ||
isWin = data.isWin, | ||
x, | ||
y, | ||
yDif, | ||
xDif, | ||
threshold; | ||
while (pt) { | ||
pt.r(ratio, pt.d); | ||
pt = pt._next; | ||
} | ||
x = isWin || !data.skipX ? data.getX() : xPrev; | ||
y = isWin || !data.skipY ? data.getY() : yPrev; | ||
yDif = y - yPrev; | ||
xDif = x - xPrev; | ||
threshold = _config.autoKillThreshold; | ||
if (data.x < 0) { | ||
//can't scroll to a position less than 0! Might happen if someone uses a Back.easeOut or Elastic.easeOut when scrolling back to the top of the page (for example) | ||
data.x = 0; | ||
} | ||
if (data.y < 0) { | ||
data.y = 0; | ||
} | ||
if (autoKill) { | ||
//note: iOS has a bug that throws off the scroll by several pixels, so we need to check if it's within 7 pixels of the previous one that we set instead of just looking for an exact match. | ||
if (!data.skipX && (xDif > threshold || xDif < -threshold) && x < _max(target, "x")) { | ||
data.skipX = 1; //if the user scrolls separately, we should stop tweening! | ||
} | ||
if (!data.skipY && (yDif > threshold || yDif < -threshold) && y < _max(target, "y")) { | ||
data.skipY = 1; //if the user scrolls separately, we should stop tweening! | ||
} | ||
if (data.skipX && data.skipY) { | ||
tween.kill(); | ||
if (data.vars.onAutoKill) { | ||
data.vars.onAutoKill.apply(tween, data.vars.onAutoKillParams || []); | ||
} | ||
} | ||
} | ||
if (isWin) { | ||
_window.scrollTo(!data.skipX ? data.x : x, !data.skipY ? data.y : y); | ||
} else { | ||
if (!data.skipY) { | ||
target.scrollTop = data.y; | ||
} | ||
if (!data.skipX) { | ||
target.scrollLeft = data.x; | ||
} | ||
} | ||
data.xPrev = data.x; | ||
data.yPrev = data.y; | ||
}, | ||
kill: function kill(property) { | ||
var both = property === "scrollTo"; | ||
if (both || property === "scrollTo_x") { | ||
this.skipX = 1; | ||
} | ||
if (both || property === "scrollTo_y") { | ||
this.skipY = 1; | ||
} | ||
} | ||
}; | ||
ScrollToPlugin.max = _max; | ||
ScrollToPlugin.getOffset = _getOffset; | ||
ScrollToPlugin.buildGetter = _buildGetter; | ||
_getGSAP() && gsap.registerPlugin(ScrollToPlugin); | ||
export { ScrollToPlugin as default }; |
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-10-03 | ||
* http://greensock.com | ||
* matrix 3.0.0 | ||
* https://greensock.com | ||
* | ||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/ | ||
/* eslint-disable */ | ||
var _doc, | ||
_win, | ||
_transformProp = "transform", | ||
_transformOriginProp = _transformProp + "Origin", | ||
_setDoc = function _setDoc(element) { | ||
var doc = element.ownerDocument || element; | ||
let _doc, _win, | ||
_transformProp = "transform", | ||
_transformOriginProp = _transformProp + "Origin", | ||
_setDoc = element => { | ||
let doc = element.ownerDocument || element; | ||
if (!(_transformProp in element.style) && "msTransform" in element.style) { //to improve compatibility with old Microsoft browsers | ||
_transformProp = "msTransform"; | ||
_transformOriginProp = _transformProp + "Origin"; | ||
} | ||
while (doc.parentNode && (doc = doc.parentNode)) { } | ||
_win = window; | ||
return (_doc = doc); | ||
}, | ||
_svgTemps = [], //we create 3 elements for SVG, and 3 for other DOM elements and cache them for performance reasons. They get nested in _divContainer and _svgContainer so that just one element is added to the DOM on each successive attempt. Again, performance is key. | ||
_divTemps = [], | ||
_divContainer, | ||
_svgContainer, | ||
_svgOwner = element => element.ownerSVGElement || ((element.tagName + "").toLowerCase() === "svg" ? element : null), | ||
_createSibling = (element, i) => { | ||
if (element.parentNode && (_doc || _setDoc(element))) { | ||
let svg = _svgOwner(element), | ||
ns = svg ? (svg.getAttribute("xmlns") || "http://www.w3.org/2000/svg") : "http://www.w3.org/1999/xhtml", | ||
type = svg ? (i ? "rect" : "g") : "div", | ||
x = i !== 2 ? 0 : 100, | ||
y = i === 3 ? 100 : 0, | ||
css = "position:absolute;display:block;", | ||
e = _doc.createElementNS ? _doc.createElementNS(ns.replace(/^https/, "http"), type) : _doc.createElement(type); | ||
if (i) { | ||
if (!svg) { | ||
if (!_divContainer) { | ||
_divContainer = _createSibling(element); | ||
_divContainer.style.cssText = css; | ||
} | ||
e.style.cssText = css + "width:1px;height:1px;top:" + y + "px;left:" + x + "px"; | ||
_divContainer.appendChild(e); | ||
if (!(_transformProp in element.style) && "msTransform" in element.style) { | ||
//to improve compatibility with old Microsoft browsers | ||
_transformProp = "msTransform"; | ||
_transformOriginProp = _transformProp + "Origin"; | ||
} | ||
} else { | ||
if (!_svgContainer) { | ||
_svgContainer = _createSibling(element); | ||
} | ||
e.setAttribute("width", 1); | ||
e.setAttribute("height", 1); | ||
e.setAttribute("transform", "translate(" + x + "," + y + ")"); | ||
_svgContainer.appendChild(e); | ||
} | ||
} | ||
return e; | ||
} | ||
throw "Need document and parent."; | ||
}, | ||
_placeSiblings = element => { | ||
let svg = _svgOwner(element), | ||
isRootSVG = element === svg, | ||
siblings = svg ? _svgTemps : _divTemps, | ||
container, m, b, x, y; | ||
if (element === _win) { | ||
return element; | ||
} | ||
if (!siblings.length) { | ||
siblings.push(_createSibling(element, 1), _createSibling(element, 2), _createSibling(element, 3)); | ||
} | ||
container = svg ? _svgContainer : _divContainer; | ||
if (svg) { | ||
b = isRootSVG ? {x:0, y:0} : element.getBBox(); //may need to make x/y 0,0 if the element is a <g>. | ||
m = element.transform.baseVal; | ||
if (m.length) { | ||
m = m.consolidate().matrix; | ||
x = m.a * b.x + m.c * b.y; | ||
y = m.b * b.x + m.d * b.y; | ||
} else { | ||
m = new Matrix2D(); | ||
x = b.x; //MAY NEED TO BE 0, 0 | ||
y = b.y; | ||
} | ||
container.setAttribute("transform", "matrix(" + m.a + "," + m.b + "," + m.c + "," + m.d + "," + (m.e + x) + "," + (m.f + y) + ")"); | ||
(isRootSVG ? svg : element.parentNode).appendChild(container); | ||
} else { | ||
container.style.top = element.offsetTop + "px"; | ||
container.style.left = element.offsetLeft + "px"; | ||
m = _win.getComputedStyle(element); | ||
container.style[_transformProp] = m[_transformProp]; | ||
container.style[_transformOriginProp] = m[_transformOriginProp]; | ||
element.parentNode.appendChild(container); | ||
} | ||
return container; | ||
}, | ||
_setMatrix = (m, a, b, c, d, e, f) => { | ||
m.a = a; | ||
m.b = b; | ||
m.c = c; | ||
m.d = d; | ||
m.e = e; | ||
m.f = f; | ||
return m; | ||
}; | ||
while (doc.parentNode && (doc = doc.parentNode)) {} | ||
export class Matrix2D { | ||
constructor(a=1, b=0, c=0, d=1, e=0, f=0) { | ||
_setMatrix(this, a, b, c, d, e, f); | ||
} | ||
_win = window; | ||
return _doc = doc; | ||
}, | ||
_svgTemps = [], | ||
//we create 3 elements for SVG, and 3 for other DOM elements and cache them for performance reasons. They get nested in _divContainer and _svgContainer so that just one element is added to the DOM on each successive attempt. Again, performance is key. | ||
_divTemps = [], | ||
_divContainer, | ||
_svgContainer, | ||
_svgOwner = function _svgOwner(element) { | ||
return element.ownerSVGElement || ((element.tagName + "").toLowerCase() === "svg" ? element : null); | ||
}, | ||
_createSibling = function _createSibling(element, i) { | ||
if (element.parentNode && (_doc || _setDoc(element))) { | ||
var svg = _svgOwner(element), | ||
ns = svg ? svg.getAttribute("xmlns") || "http://www.w3.org/2000/svg" : "http://www.w3.org/1999/xhtml", | ||
type = svg ? i ? "rect" : "g" : "div", | ||
x = i !== 2 ? 0 : 100, | ||
y = i === 3 ? 100 : 0, | ||
css = "position:absolute;display:block;", | ||
e = _doc.createElementNS ? _doc.createElementNS(ns.replace(/^https/, "http"), type) : _doc.createElement(type); | ||
inverse() { | ||
let {a, b, c, d, e, f} = this, | ||
determinant = (a * d - b * c); | ||
return _setMatrix( | ||
this, | ||
d / determinant, | ||
-b / determinant, | ||
-c / determinant, | ||
a / determinant, | ||
(c * f - d * e) / determinant, | ||
-(a * f - b * e) / determinant | ||
); | ||
} | ||
if (i) { | ||
if (!svg) { | ||
if (!_divContainer) { | ||
_divContainer = _createSibling(element); | ||
_divContainer.style.cssText = css; | ||
} | ||
multiply(matrix) { | ||
let {a, b, c, d, e, f} = this, | ||
a2 = matrix.a, | ||
b2 = matrix.c, | ||
c2 = matrix.b, | ||
d2 = matrix.d, | ||
e2 = matrix.e, | ||
f2 = matrix.f; | ||
return _setMatrix(this, | ||
a2 * a + c2 * c, | ||
a2 * b + c2 * d, | ||
b2 * a + d2 * c, | ||
b2 * b + d2 * d, | ||
e + e2 * a + f2 * c, | ||
f + e2 * b + f2 * d); | ||
} | ||
e.style.cssText = css + "width:1px;height:1px;top:" + y + "px;left:" + x + "px"; | ||
equals(matrix) { | ||
let {a, b, c, d, e, f} = this; | ||
return (a === matrix.a && b === matrix.b && c === matrix.c && d === matrix.d && e === matrix.e && f === matrix.f); | ||
} | ||
_divContainer.appendChild(e); | ||
} else { | ||
if (!_svgContainer) { | ||
_svgContainer = _createSibling(element); | ||
} | ||
apply(point, decoratee={}) { | ||
let {x, y} = point, | ||
{a, b, c, d, e, f} = this; | ||
decoratee.x = x * a + y * c + e; | ||
decoratee.y = x * b + y * d + f; | ||
return decoratee; | ||
} | ||
e.setAttribute("width", 1); | ||
e.setAttribute("height", 1); | ||
e.setAttribute("transform", "translate(" + x + "," + y + ")"); | ||
} | ||
_svgContainer.appendChild(e); | ||
} | ||
} | ||
//feed in an element and it'll return a 2D matrix (optionally inverted) so that you can translate between coordinate spaces. | ||
return e; | ||
} | ||
throw "Need document and parent."; | ||
}, | ||
_placeSiblings = function _placeSiblings(element) { | ||
var svg = _svgOwner(element), | ||
isRootSVG = element === svg, | ||
siblings = svg ? _svgTemps : _divTemps, | ||
container, | ||
m, | ||
b, | ||
x, | ||
y; | ||
if (element === _win) { | ||
return element; | ||
} | ||
if (!siblings.length) { | ||
siblings.push(_createSibling(element, 1), _createSibling(element, 2), _createSibling(element, 3)); | ||
} | ||
container = svg ? _svgContainer : _divContainer; | ||
if (svg) { | ||
b = isRootSVG || element.tagName.toLowerCase() === "g" ? { | ||
x: 0, | ||
y: 0 | ||
} : element.getBBox(); | ||
m = element.transform.baseVal; | ||
if (m.length) { | ||
m = m.consolidate().matrix; | ||
x = m.a * b.x + m.c * b.y; | ||
y = m.b * b.x + m.d * b.y; | ||
} else { | ||
m = new Matrix2D(); | ||
x = b.x; //MAY NEED TO BE 0, 0 in some scenarios(?) | ||
y = b.y; | ||
} | ||
container.setAttribute("transform", "matrix(" + m.a + "," + m.b + "," + m.c + "," + m.d + "," + (m.e + x) + "," + (m.f + y) + ")"); | ||
(isRootSVG ? svg : element.parentNode).appendChild(container); | ||
} else { | ||
container.style.top = element.offsetTop + "px"; | ||
container.style.left = element.offsetLeft + "px"; | ||
m = _win.getComputedStyle(element); | ||
container.style[_transformProp] = m[_transformProp]; | ||
container.style[_transformOriginProp] = m[_transformOriginProp]; | ||
element.parentNode.appendChild(container); | ||
} | ||
return container; | ||
}, | ||
_setMatrix = function _setMatrix(m, a, b, c, d, e, f) { | ||
m.a = a; | ||
m.b = b; | ||
m.c = c; | ||
m.d = d; | ||
m.e = e; | ||
m.f = f; | ||
return m; | ||
}; | ||
export var Matrix2D = | ||
/*#__PURE__*/ | ||
function () { | ||
function Matrix2D(a, b, c, d, e, f) { | ||
if (a === void 0) { | ||
a = 1; | ||
} | ||
if (b === void 0) { | ||
b = 0; | ||
} | ||
if (c === void 0) { | ||
c = 0; | ||
} | ||
if (d === void 0) { | ||
d = 1; | ||
} | ||
if (e === void 0) { | ||
e = 0; | ||
} | ||
if (f === void 0) { | ||
f = 0; | ||
} | ||
_setMatrix(this, a, b, c, d, e, f); | ||
} | ||
var _proto = Matrix2D.prototype; | ||
_proto.inverse = function inverse() { | ||
var a = this.a, | ||
b = this.b, | ||
c = this.c, | ||
d = this.d, | ||
e = this.e, | ||
f = this.f, | ||
determinant = a * d - b * c; | ||
return _setMatrix(this, d / determinant, -b / determinant, -c / determinant, a / determinant, (c * f - d * e) / determinant, -(a * f - b * e) / determinant); | ||
}; | ||
_proto.multiply = function multiply(matrix) { | ||
var a = this.a, | ||
b = this.b, | ||
c = this.c, | ||
d = this.d, | ||
e = this.e, | ||
f = this.f, | ||
a2 = matrix.a, | ||
b2 = matrix.c, | ||
c2 = matrix.b, | ||
d2 = matrix.d, | ||
e2 = matrix.e, | ||
f2 = matrix.f; | ||
return _setMatrix(this, a2 * a + c2 * c, a2 * b + c2 * d, b2 * a + d2 * c, b2 * b + d2 * d, e + e2 * a + f2 * c, f + e2 * b + f2 * d); | ||
}; | ||
_proto.equals = function equals(matrix) { | ||
var a = this.a, | ||
b = this.b, | ||
c = this.c, | ||
d = this.d, | ||
e = this.e, | ||
f = this.f; | ||
return a === matrix.a && b === matrix.b && c === matrix.c && d === matrix.d && e === matrix.e && f === matrix.f; | ||
}; | ||
_proto.apply = function apply(point, decoratee) { | ||
if (decoratee === void 0) { | ||
decoratee = {}; | ||
} | ||
var x = point.x, | ||
y = point.y, | ||
a = this.a, | ||
b = this.b, | ||
c = this.c, | ||
d = this.d, | ||
e = this.e, | ||
f = this.f; | ||
decoratee.x = x * a + y * c + e; | ||
decoratee.y = x * b + y * d + f; | ||
return decoratee; | ||
}; | ||
return Matrix2D; | ||
}(); //feed in an element and it'll return a 2D matrix (optionally inverted) so that you can translate between coordinate spaces. | ||
// Inverting lets you translate a global point into a local coordinate space. No inverting lets you go the other way. | ||
@@ -167,23 +233,19 @@ // We needed this to work around various browser bugs, like Firefox doesn't accurately report getScreenCTM() when there | ||
// ty = m.b * x + m.d * y + m.f | ||
export function getGlobalMatrix(element, inverse) { | ||
if (!element.parentNode) { | ||
return new Matrix2D(); | ||
} | ||
let svg = _svgOwner(element), | ||
temps = svg ? _svgTemps : _divTemps, | ||
container = _placeSiblings(element), | ||
b1 = temps[0].getBoundingClientRect(), | ||
b2 = temps[1].getBoundingClientRect(), | ||
b3 = temps[2].getBoundingClientRect(), | ||
parent = container.parentNode, | ||
m = new Matrix2D( | ||
(b2.left - b1.left) / 100, | ||
(b2.top - b1.top) / 100, | ||
(b3.left - b1.left) / 100, | ||
(b3.top - b1.top) / 100, | ||
b1.left, | ||
b1.top | ||
); | ||
parent.removeChild(container); | ||
return inverse ? m.inverse() : m; | ||
} | ||
if (!element.parentNode) { | ||
return new Matrix2D(); | ||
} | ||
var svg = _svgOwner(element), | ||
temps = svg ? _svgTemps : _divTemps, | ||
container = _placeSiblings(element), | ||
b1 = temps[0].getBoundingClientRect(), | ||
b2 = temps[1].getBoundingClientRect(), | ||
b3 = temps[2].getBoundingClientRect(), | ||
parent = container.parentNode, | ||
m = new Matrix2D((b2.left - b1.left) / 100, (b2.top - b1.top) / 100, (b3.left - b1.left) / 100, (b3.top - b1.top) / 100, b1.left, b1.top); | ||
parent.removeChild(container); | ||
return inverse ? m.inverse() : m; | ||
} |
2238
utils/paths.js
/*! | ||
* VERSION: 3.0.0 | ||
* DATE: 2019-09-18 | ||
* http://greensock.com | ||
* paths 3.0.0 | ||
* https://greensock.com | ||
* | ||
* Copyright (c) 2008-2019, GreenSock. All rights reserved. | ||
* This work is subject to the terms at http://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement that was issued with that membership. | ||
* Copyright 2008-2019, GreenSock. All rights reserved. | ||
* Subject to the terms at https://greensock.com/standard-license or for | ||
* Club GreenSock members, the agreement issued with that membership. | ||
* @author: Jack Doyle, jack@greensock.com | ||
*/ | ||
/* eslint-disable */ | ||
var _svgPathExp = /[achlmqstvz]|(-?\d*\.?\d*(?:e[\-+]?\d+)?)[0-9]/ig, | ||
_numbersExp = /(?:(-)?\d*\.?\d*(?:e[\-+]?\d+)?)[0-9]/ig, | ||
_scientific = /[\+\-]?\d*\.?\d+e[\+\-]?\d+/ig, | ||
_selectorExp = /(^[#\.][a-z]|[a-y][a-z])/i, | ||
_DEG2RAD = Math.PI / 180, | ||
_RAD2DEG = 180 / Math.PI, | ||
_sin = Math.sin, | ||
_cos = Math.cos, | ||
_abs = Math.abs, | ||
_sqrt = Math.sqrt, | ||
_atan2 = Math.atan2, | ||
_largeNum = 1e8, | ||
_isString = function _isString(value) { | ||
return typeof value === "string"; | ||
}, | ||
_isNumber = function _isNumber(value) { | ||
return typeof value === "number"; | ||
}, | ||
_isUndefined = function _isUndefined(value) { | ||
return typeof value === "undefined"; | ||
}, | ||
_temp = {}, | ||
_temp2 = {}, | ||
_roundingNum = 1e5, | ||
_wrapProgress = function _wrapProgress(progress) { | ||
return Math.round((progress + _largeNum) % 1 * _roundingNum) / _roundingNum || (progress < 0 ? 0 : 1); | ||
}, | ||
//if progress lands on 1, the % will make it 0 which is why we || 1, but not if it's negative because it makes more sense for motion to end at 0 in that case. | ||
_round = function _round(value) { | ||
return ~~(value * _roundingNum + (value < 0 ? -.5 : .5)) / _roundingNum; | ||
}, | ||
_splitSegment = function _splitSegment(rawPath, segIndex, i, t) { | ||
var segment = rawPath[segIndex], | ||
shift = t === 1 ? 6 : subdivideSegment(segment, i, t); | ||
let _svgPathExp = /[achlmqstvz]|(-?\d*\.?\d*(?:e[\-+]?\d+)?)[0-9]/ig, | ||
_numbersExp = /(?:(-)?\d*\.?\d*(?:e[\-+]?\d+)?)[0-9]/ig, | ||
_scientific = /[\+\-]?\d*\.?\d+e[\+\-]?\d+/ig, | ||
_selectorExp = /(^[#\.][a-z]|[a-y][a-z])/i, | ||
_DEG2RAD = Math.PI / 180, | ||
_RAD2DEG = 180 / Math.PI, | ||
_sin = Math.sin, | ||
_cos = Math.cos, | ||
_abs = Math.abs, | ||
_sqrt = Math.sqrt, | ||
_atan2 = Math.atan2, | ||
_largeNum = 1e8, | ||
_isString = value => typeof(value) === "string", | ||
_isNumber = value => typeof(value) === "number", | ||
_isUndefined = value => typeof(value) === "undefined", | ||
_temp = {}, | ||
_temp2 = {}, | ||
_roundingNum = 1e5, | ||
_wrapProgress = progress => (Math.round((progress + _largeNum) % 1 * _roundingNum) / _roundingNum) || ((progress < 0) ? 0 : 1), //if progress lands on 1, the % will make it 0 which is why we || 1, but not if it's negative because it makes more sense for motion to end at 0 in that case. | ||
_round = value => ~~(value * _roundingNum + (value < 0 ? -.5 : .5)) / _roundingNum, | ||
_splitSegment = (rawPath, segIndex, i, t) => { | ||
let segment = rawPath[segIndex], | ||
shift = t === 1 ? 6 : subdivideSegment(segment, i, t); | ||
if (shift && shift + i + 2 < segment.length) { | ||
rawPath.splice(segIndex, 0, segment.slice(0, i + shift + 2)); | ||
segment.splice(0, i + shift); | ||
return 1; | ||
} | ||
}, | ||
_reverseRawPath = (rawPath, skipOuter) => { | ||
let i = rawPath.length; | ||
if (!skipOuter) { | ||
rawPath.reverse(); | ||
} | ||
while (i--) { | ||
if (!rawPath[i].reversed) { | ||
reverseSegment(rawPath[i]); | ||
} | ||
} | ||
}, | ||
_copyMetaData = (source, copy) => { | ||
copy.totalLength = source.totalLength; | ||
if (source.samples) { //segment | ||
copy.samples = source.samples.slice(0); | ||
copy.lookup = source.lookup.slice(0); | ||
copy.minLength = source.minLength; | ||
copy.resolution = source.resolution; | ||
} else { //rawPath | ||
copy.totalPoints = source.totalPoints; | ||
} | ||
return copy; | ||
}, | ||
//pushes a new segment into a rawPath, but if its starting values match the ending values of the last segment, it'll merge it into that same segment (to reduce the number of segments) | ||
_appendOrMerge = (rawPath, segment) => { | ||
let index = rawPath.length, | ||
prevSeg = rawPath[index - 1] || [], | ||
l = prevSeg.length; | ||
if (segment[0] === prevSeg[l-2] && segment[1] === prevSeg[l-1]) { | ||
segment = prevSeg.concat(segment.slice(2)); | ||
index--; | ||
} | ||
rawPath[index] = segment; | ||
}, | ||
_bestDistance; | ||
if (shift && shift + i + 2 < segment.length) { | ||
rawPath.splice(segIndex, 0, segment.slice(0, i + shift + 2)); | ||
segment.splice(0, i + shift); | ||
return 1; | ||
} | ||
}, | ||
_reverseRawPath = function _reverseRawPath(rawPath, skipOuter) { | ||
var i = rawPath.length; | ||
if (!skipOuter) { | ||
rawPath.reverse(); | ||
} | ||
while (i--) { | ||
if (!rawPath[i].reversed) { | ||
reverseSegment(rawPath[i]); | ||
} | ||
} | ||
}, | ||
_copyMetaData = function _copyMetaData(source, copy) { | ||
copy.totalLength = source.totalLength; | ||
if (source.samples) { | ||
//segment | ||
copy.samples = source.samples.slice(0); | ||
copy.lookup = source.lookup.slice(0); | ||
copy.minLength = source.minLength; | ||
copy.resolution = source.resolution; | ||
} else { | ||
//rawPath | ||
copy.totalPoints = source.totalPoints; | ||
} | ||
return copy; | ||
}, | ||
//pushes a new segment into a rawPath, but if its starting values match the ending values of the last segment, it'll merge it into that same segment (to reduce the number of segments) | ||
_appendOrMerge = function _appendOrMerge(rawPath, segment) { | ||
var index = rawPath.length, | ||
prevSeg = rawPath[index - 1] || [], | ||
l = prevSeg.length; | ||
if (segment[0] === prevSeg[l - 2] && segment[1] === prevSeg[l - 1]) { | ||
segment = prevSeg.concat(segment.slice(2)); | ||
index--; | ||
} | ||
rawPath[index] = segment; | ||
}, | ||
_bestDistance; | ||
/* TERMINOLOGY | ||
@@ -84,765 +102,934 @@ - RawPath - an array of arrays, one for each Segment. A single RawPath could have multiple "M" commands, defining Segments (paths aren't always connected). | ||
*/ | ||
//accepts basic selector text, a path instance, a RawPath instance, or a Segment and returns a RawPath (makes it easy to homogenize things). If an element or selector text is passed in, it'll also cache the value so that if it's queried again, it'll just take the path data from there instead of parsing it all over again (as long as the path data itself hasn't changed - it'll check). | ||
//accepts basic selector text, a path instance, a RawPath instance, or a Segment and returns a RawPath (makes it easy to homogenize things). If an element or selector text is passed in, it'll also cache the value so that if it's queried again, it'll just take the path data from there instead of parsing it all over again (as long as the path data itself hasn't changed - it'll check). | ||
export function getRawPath(value) { | ||
value = (_isString(value) && _selectorExp.test(value)) ? document.querySelector(value) || value : value; | ||
let e = value.getAttribute ? value : 0, | ||
rawPath; | ||
if (e && (value = value.getAttribute("d"))) { | ||
//implements caching | ||
if (!e._gsPath) { | ||
e._gsPath = {}; | ||
} | ||
rawPath = e._gsPath[value]; | ||
return (rawPath && !rawPath._dirty) ? rawPath : (e._gsPath[value] = stringToRawPath(value)); | ||
} | ||
return !value ? console.warn("Expecting a <path> element or an SVG path data string") : _isString(value) ? stringToRawPath(value) : (_isNumber(value[0])) ? [value] : value; | ||
} | ||
value = _isString(value) && _selectorExp.test(value) ? document.querySelector(value) || value : value; | ||
var e = value.getAttribute ? value : 0, | ||
rawPath; | ||
//copies a RawPath WITHOUT the length meta data (for speed) | ||
if (e && (value = value.getAttribute("d"))) { | ||
//implements caching | ||
if (!e._gsPath) { | ||
e._gsPath = {}; | ||
} | ||
rawPath = e._gsPath[value]; | ||
return rawPath && !rawPath._dirty ? rawPath : e._gsPath[value] = stringToRawPath(value); | ||
} | ||
return !value ? console.warn("Expecting a <path> element or an SVG path data string") : _isString(value) ? stringToRawPath(value) : _isNumber(value[0]) ? [value] : value; | ||
} //copies a RawPath WITHOUT the length meta data (for speed) | ||
export function copyRawPath(rawPath) { | ||
let a = [], | ||
i = 0; | ||
for (; i < rawPath.length; i++) { | ||
a[i] = _copyMetaData(rawPath[i], rawPath[i].slice(0)); | ||
} | ||
return _copyMetaData(rawPath, a); | ||
var a = [], | ||
i = 0; | ||
for (; i < rawPath.length; i++) { | ||
a[i] = _copyMetaData(rawPath[i], rawPath[i].slice(0)); | ||
} | ||
return _copyMetaData(rawPath, a); | ||
} | ||
export function reverseSegment(segment) { | ||
var i = 0, | ||
y; | ||
segment.reverse(); //this will invert the order y, x, y, x so we must flip it back. | ||
export function reverseSegment(segment) { | ||
let i = 0, | ||
y; | ||
segment.reverse(); //this will invert the order y, x, y, x so we must flip it back. | ||
for (; i < segment.length; i += 2) { | ||
y = segment[i]; | ||
segment[i] = segment[i+1]; | ||
segment[i+1] = y; | ||
} | ||
segment.reversed = !segment.reversed; | ||
for (; i < segment.length; i += 2) { | ||
y = segment[i]; | ||
segment[i] = segment[i + 1]; | ||
segment[i + 1] = y; | ||
} | ||
segment.reversed = !segment.reversed; | ||
} | ||
var _createPath = function _createPath(e, ignore) { | ||
var path = document.createElementNS("http://www.w3.org/2000/svg", "path"), | ||
attr = [].slice.call(e.attributes), | ||
i = attr.length, | ||
name; | ||
ignore = "," + ignore + ","; | ||
while (--i > -1) { | ||
name = attr[i].nodeName.toLowerCase(); //in Microsoft Edge, if you don't set the attribute with a lowercase name, it doesn't render correctly! Super weird. | ||
let _createPath = (e, ignore) => { | ||
let path = document.createElementNS("http://www.w3.org/2000/svg", "path"), | ||
attr = [].slice.call(e.attributes), | ||
i = attr.length, | ||
name; | ||
ignore = "," + ignore + ","; | ||
while (--i > -1) { | ||
name = attr[i].nodeName.toLowerCase(); //in Microsoft Edge, if you don't set the attribute with a lowercase name, it doesn't render correctly! Super weird. | ||
if (ignore.indexOf("," + name + ",") < 0) { | ||
path.setAttributeNS(null, name, attr[i].nodeValue); | ||
} | ||
} | ||
return path; | ||
}, | ||
_typeAttrs = { | ||
rect:"rx,ry,x,y,width,height", | ||
circle:"r,cx,cy", | ||
ellipse:"rx,ry,cx,cy", | ||
line:"x1,x2,y1,y2" | ||
}, | ||
_attrToObj = (e, attrs) => { | ||
let props = attrs ? attrs.split(",") : [], | ||
obj = {}, | ||
i = props.length; | ||
while (--i > -1) { | ||
obj[props[i]] = +e.getAttribute(props[i]) || 0; | ||
} | ||
return obj; | ||
}; | ||
if (ignore.indexOf("," + name + ",") < 0) { | ||
path.setAttributeNS(null, name, attr[i].nodeValue); | ||
} | ||
} | ||
//converts an SVG shape like <circle>, <rect>, <polygon>, <polyline>, <ellipse>, etc. to a <path>, swapping it in and copying the attributes to match. | ||
return path; | ||
}, | ||
_typeAttrs = { | ||
rect: "rx,ry,x,y,width,height", | ||
circle: "r,cx,cy", | ||
ellipse: "rx,ry,cx,cy", | ||
line: "x1,x2,y1,y2" | ||
}, | ||
_attrToObj = function _attrToObj(e, attrs) { | ||
var props = attrs ? attrs.split(",") : [], | ||
obj = {}, | ||
i = props.length; | ||
while (--i > -1) { | ||
obj[props[i]] = +e.getAttribute(props[i]) || 0; | ||
} | ||
return obj; | ||
}; //converts an SVG shape like <circle>, <rect>, <polygon>, <polyline>, <ellipse>, etc. to a <path>, swapping it in and copying the attributes to match. | ||
export function convertToPath(element, swap) { | ||
let type = element.tagName.toLowerCase(), | ||
circ = 0.552284749831, | ||
data, x, y, r, ry, path, rcirc, rycirc, points, w, h, x2, x3, x4, x5, x6, y2, y3, y4, y5, y6, attr; | ||
if (type === "path" || !element.getBBox) { | ||
return element; | ||
} | ||
path = _createPath(element, "x,y,width,height,cx,cy,rx,ry,r,x1,x2,y1,y2,points"); | ||
attr = _attrToObj(element, _typeAttrs[type]); | ||
if (type === "rect") { | ||
r = attr.rx; | ||
ry = attr.ry; | ||
x = attr.x; | ||
y = attr.y; | ||
w = attr.width - r * 2; | ||
h = attr.height - ry * 2; | ||
if (r || ry) { //if there are rounded corners, render cubic beziers | ||
x2 = x + r * (1 - circ); | ||
x3 = x + r; | ||
x4 = x3 + w; | ||
x5 = x4 + r * circ; | ||
x6 = x4 + r; | ||
y2 = y + ry * (1 - circ); | ||
y3 = y + ry; | ||
y4 = y3 + h; | ||
y5 = y4 + ry * circ; | ||
y6 = y4 + ry; | ||
data = "M" + x6 + "," + y3 + " V" + y4 + " C" + [x6, y5, x5, y6, x4, y6, x4 - (x4 - x3) / 3, y6, x3 + (x4 - x3) / 3, y6, x3, y6, x2, y6, x, y5, x, y4, x, y4 - (y4 - y3) / 3, x, y3 + (y4 - y3) / 3, x, y3, x, y2, x2, y, x3, y, x3 + (x4 - x3) / 3, y, x4 - (x4 - x3) / 3, y, x4, y, x5, y, x6, y2, x6, y3].join(",") + "z"; | ||
} else { | ||
data = "M" + (x + w) + "," + y + " v" + h + " h" + (-w) + " v" + (-h) + " h" + w + "z"; | ||
} | ||
var type = element.tagName.toLowerCase(), | ||
circ = 0.552284749831, | ||
data, | ||
x, | ||
y, | ||
r, | ||
ry, | ||
path, | ||
rcirc, | ||
rycirc, | ||
points, | ||
w, | ||
h, | ||
x2, | ||
x3, | ||
x4, | ||
x5, | ||
x6, | ||
y2, | ||
y3, | ||
y4, | ||
y5, | ||
y6, | ||
attr; | ||
} else if (type === "circle" || type === "ellipse") { | ||
if (type === "circle") { | ||
r = ry = attr.r; | ||
rycirc = r * circ; | ||
} else { | ||
r = attr.rx; | ||
ry = attr.ry; | ||
rycirc = ry * circ; | ||
} | ||
x = attr.cx; | ||
y = attr.cy; | ||
rcirc = r * circ; | ||
data = "M" + (x+r) + "," + y + " C" + [x+r, y + rycirc, x + rcirc, y + ry, x, y + ry, x - rcirc, y + ry, x - r, y + rycirc, x - r, y, x - r, y - rycirc, x - rcirc, y - ry, x, y - ry, x + rcirc, y - ry, x + r, y - rycirc, x + r, y].join(",") + "z"; | ||
} else if (type === "line") { | ||
data = "M" + attr.x1 + "," + attr.y1 + " L" + attr.x2 + "," + attr.y2; //previously, we just converted to "Mx,y Lx,y" but Safari has bugs that cause that not to render properly when using a stroke-dasharray that's not fully visible! Using a cubic bezier fixes that issue. | ||
} else if (type === "polyline" || type === "polygon") { | ||
points = (element.getAttribute("points") + "").match(_numbersExp) || []; | ||
x = points.shift(); | ||
y = points.shift(); | ||
data = "M" + x + "," + y + " L" + points.join(","); | ||
if (type === "polygon") { | ||
data += "," + x + "," + y + "z"; | ||
} | ||
} | ||
path.setAttribute("d", rawPathToString(path._gsRawPath = stringToRawPath(data))); | ||
if (swap && element.parentNode) { | ||
element.parentNode.insertBefore(path, element); | ||
element.parentNode.removeChild(element); | ||
} | ||
return path; | ||
} | ||
if (type === "path" || !element.getBBox) { | ||
return element; | ||
} | ||
path = _createPath(element, "x,y,width,height,cx,cy,rx,ry,r,x1,x2,y1,y2,points"); | ||
attr = _attrToObj(element, _typeAttrs[type]); | ||
if (type === "rect") { | ||
r = attr.rx; | ||
ry = attr.ry; | ||
x = attr.x; | ||
y = attr.y; | ||
w = attr.width - r * 2; | ||
h = attr.height - ry * 2; | ||
//returns the rotation (in degrees) at a particular progress on a rawPath (the slope of the tangent) | ||
if (r || ry) { | ||
//if there are rounded corners, render cubic beziers | ||
x2 = x + r * (1 - circ); | ||
x3 = x + r; | ||
x4 = x3 + w; | ||
x5 = x4 + r * circ; | ||
x6 = x4 + r; | ||
y2 = y + ry * (1 - circ); | ||
y3 = y + ry; | ||
y4 = y3 + h; | ||
y5 = y4 + ry * circ; | ||
y6 = y4 + ry; | ||
data = "M" + x6 + "," + y3 + " V" + y4 + " C" + [x6, y5, x5, y6, x4, y6, x4 - (x4 - x3) / 3, y6, x3 + (x4 - x3) / 3, y6, x3, y6, x2, y6, x, y5, x, y4, x, y4 - (y4 - y3) / 3, x, y3 + (y4 - y3) / 3, x, y3, x, y2, x2, y, x3, y, x3 + (x4 - x3) / 3, y, x4 - (x4 - x3) / 3, y, x4, y, x5, y, x6, y2, x6, y3].join(",") + "z"; | ||
} else { | ||
data = "M" + (x + w) + "," + y + " v" + h + " h" + -w + " v" + -h + " h" + w + "z"; | ||
} | ||
} else if (type === "circle" || type === "ellipse") { | ||
if (type === "circle") { | ||
r = ry = attr.r; | ||
rycirc = r * circ; | ||
} else { | ||
r = attr.rx; | ||
ry = attr.ry; | ||
rycirc = ry * circ; | ||
} | ||
x = attr.cx; | ||
y = attr.cy; | ||
rcirc = r * circ; | ||
data = "M" + (x + r) + "," + y + " C" + [x + r, y + rycirc, x + rcirc, y + ry, x, y + ry, x - rcirc, y + ry, x - r, y + rycirc, x - r, y, x - r, y - rycirc, x - rcirc, y - ry, x, y - ry, x + rcirc, y - ry, x + r, y - rycirc, x + r, y].join(",") + "z"; | ||
} else if (type === "line") { | ||
data = "M" + attr.x1 + "," + attr.y1 + " L" + attr.x2 + "," + attr.y2; //previously, we just converted to "Mx,y Lx,y" but Safari has bugs that cause that not to render properly when using a stroke-dasharray that's not fully visible! Using a cubic bezier fixes that issue. | ||
} else if (type === "polyline" || type === "polygon") { | ||
points = (element.getAttribute("points") + "").match(_numbersExp) || []; | ||
x = points.shift(); | ||
y = points.shift(); | ||
data = "M" + x + "," + y + " L" + points.join(","); | ||
if (type === "polygon") { | ||
data += "," + x + "," + y + "z"; | ||
} | ||
} | ||
path.setAttribute("d", rawPathToString(path._gsRawPath = stringToRawPath(data))); | ||
if (swap && element.parentNode) { | ||
element.parentNode.insertBefore(path, element); | ||
element.parentNode.removeChild(element); | ||
} | ||
return path; | ||
} //returns the rotation (in degrees) at a particular progress on a rawPath (the slope of the tangent) | ||
export function getRotationAtProgress(rawPath, progress) { | ||
let d = getProgressData(rawPath, progress >= 1 ? 1 - 1e-9 : progress ? progress : 1e-9); | ||
return getRotationAtBezierT(d.segment, d.i, d.t); | ||
var d = getProgressData(rawPath, progress >= 1 ? 1 - 1e-9 : progress ? progress : 1e-9); | ||
return getRotationAtBezierT(d.segment, d.i, d.t); | ||
} | ||
function getRotationAtBezierT(segment, i, t) { | ||
let a = segment[i], | ||
b = segment[i+2], | ||
c = segment[i+4], | ||
x; | ||
a += (b - a) * t; | ||
b += (c - b) * t; | ||
a += (b - a) * t; | ||
x = b + ((c + (segment[i+6] - c) * t) - b) * t - a; | ||
a = segment[i+1]; | ||
b = segment[i+3]; | ||
c = segment[i+5]; | ||
a += (b - a) * t; | ||
b += (c - b) * t; | ||
a += (b - a) * t; | ||
return _round(_atan2(b + ((c + (segment[i+7] - c) * t) - b) * t - a, x) * _RAD2DEG); | ||
var a = segment[i], | ||
b = segment[i + 2], | ||
c = segment[i + 4], | ||
x; | ||
a += (b - a) * t; | ||
b += (c - b) * t; | ||
a += (b - a) * t; | ||
x = b + (c + (segment[i + 6] - c) * t - b) * t - a; | ||
a = segment[i + 1]; | ||
b = segment[i + 3]; | ||
c = segment[i + 5]; | ||
a += (b - a) * t; | ||
b += (c - b) * t; | ||
a += (b - a) * t; | ||
return _round(_atan2(b + (c + (segment[i + 7] - c) * t - b) * t - a, x) * _RAD2DEG); | ||
} | ||
export function sliceRawPath(rawPath, start, end) { | ||
if (_isUndefined(end)) { | ||
end = 1; | ||
} | ||
start = start || 0; | ||
let reverse = start > end, | ||
loops = Math.max(0, ~~(_abs(end - start) - 1e-8)); | ||
if (reverse) { | ||
reverse = end; | ||
end = start; | ||
start = reverse; | ||
reverse = 1; | ||
loops -= loops ? 1 : 0; | ||
} | ||
if (start < 0 || end < 0) { | ||
let offset = ~~Math.min(start, end) + 1; | ||
start += offset; | ||
end += offset; | ||
} | ||
let path = copyRawPath(rawPath.totalLength ? rawPath : cacheRawPathMeasurements(rawPath)), | ||
wrap = (end > 1), | ||
s = getProgressData(path, start, _temp), | ||
e = getProgressData(path, end, _temp2), | ||
eSeg = e.segment, | ||
sSeg = s.segment, | ||
eSegIndex = e.segIndex, | ||
sSegIndex = s.segIndex, | ||
ei = e.i, | ||
si = s.i, | ||
sameSegment = (sSegIndex === eSegIndex), | ||
sameBezier = (ei === si && sameSegment), | ||
invertedOrder = ((sameSegment && si > ei) || (sameBezier && s.t > e.t)), | ||
sShift, eShift, i, copy, totalSegments, l, j; | ||
if (wrap || loops) { | ||
if (_splitSegment(path, sSegIndex, si, s.t)) { | ||
sShift = 1; | ||
sSegIndex++; | ||
if (sameBezier) { | ||
if (invertedOrder) { | ||
e.t /= s.t; | ||
} else { | ||
e.t = (e.t - s.t) / (1 - s.t); | ||
eSegIndex++; | ||
ei = 0; | ||
} | ||
} else if (sSegIndex <= eSegIndex + 1 && !invertedOrder) { | ||
eSegIndex++; | ||
if (sameSegment) { | ||
ei -= si; | ||
} | ||
} | ||
} | ||
if (!e.t) { | ||
eSegIndex--; | ||
if (reverse) { | ||
sSegIndex--; | ||
} | ||
} else if (_splitSegment(path, eSegIndex, ei, e.t)) { | ||
if (invertedOrder && sShift) { | ||
sSegIndex++; | ||
} | ||
if (reverse) { | ||
eSegIndex++; | ||
} | ||
} | ||
copy = []; | ||
totalSegments = path.length; | ||
l = 1 + totalSegments * loops; | ||
j = sSegIndex; | ||
if (reverse) { | ||
eSegIndex = (eSegIndex || totalSegments) - 1; | ||
l += (totalSegments - eSegIndex + sSegIndex) % totalSegments; | ||
for (i = 0; i < l; i++) { | ||
_appendOrMerge(copy, path[j]); | ||
j = (j || totalSegments) - 1; | ||
} | ||
} else { | ||
l += ((totalSegments - sSegIndex) + eSegIndex) % totalSegments; | ||
for (i = 0; i < l; i++) { | ||
_appendOrMerge(copy, path[j++ % totalSegments]); | ||
} | ||
} | ||
path = copy; | ||
} else { | ||
eShift = e.t === 1 ? 6 : subdivideSegment(eSeg, ei, e.t); | ||
if (start !== end) { | ||
sShift = subdivideSegment(sSeg, si, sameBezier ? s.t / e.t : s.t); | ||
if (sameSegment) { | ||
eShift += sShift; | ||
} | ||
eSeg.splice(ei + eShift + 2); | ||
if (sShift) { | ||
sSeg.splice(0, si + sShift); | ||
} | ||
i = path.length; | ||
while (i--) { | ||
//chop off any extra segments | ||
if (i < sSegIndex || i > eSegIndex) { | ||
path.splice(i, 1); | ||
} | ||
} | ||
} else { | ||
eSeg.angle = getRotationAtBezierT(eSeg, ei + eShift, 0); //record the value before we chop because it'll be impossible to determine the angle after its length is 0! | ||
ei += eShift; | ||
s = eSeg[ei]; | ||
e = eSeg[ei+1]; | ||
eSeg.length = eSeg.totalLength = 0; | ||
eSeg.totalPoints = path.totalPoints = 8; | ||
eSeg.push(s, e, s, e, s, e, s, e); | ||
} | ||
} | ||
if (reverse) { | ||
_reverseRawPath(path, wrap || loops); | ||
} | ||
path.totalLength = 0; | ||
return path; | ||
} | ||
if (_isUndefined(end)) { | ||
end = 1; | ||
} | ||
//measures a Segment according to its resolution (so if segment.resolution is 6, for example, it'll take 6 samples equally across each Bezier) and create/populate a "samples" array that has the length up to each of those sample points (always increasing from the start) as well as a "lookup" array that's broken up according to the smallest distance between 2 samples. This gives us a very fast way of looking up a progress position rather than looping through all the points/Beziers. You can optionally have it only measure a subset, starting at startIndex and going for a specific number of beziers (remember, there are 3 x/y pairs each, for a total of 6 elements for each Bezier). It will also populate a "totalLength" property, but that's not generally super accurate because by default it'll only take 6 samples per Bezier. But for performance reasons, it's perfectly adequate for measuring progress values along the path. If you need a more accurate totalLength, either increase the resolution or use the more advanced bezierToPoints() method which keeps adding points until they don't deviate by more than a certain precision value. | ||
start = start || 0; | ||
var reverse = start > end, | ||
loops = Math.max(0, ~~(_abs(end - start) - 1e-8)); | ||
if (reverse) { | ||
reverse = end; | ||
end = start; | ||
start = reverse; | ||
reverse = 1; | ||
loops -= loops ? 1 : 0; | ||
} | ||
if (start < 0 || end < 0) { | ||
var offset = ~~Math.min(start, end) + 1; | ||
start += offset; | ||
end += offset; | ||
} | ||
var path = copyRawPath(rawPath.totalLength ? rawPath : cacheRawPathMeasurements(rawPath)), | ||
wrap = end > 1, | ||
s = getProgressData(path, start, _temp), | ||
e = getProgressData(path, end, _temp2), | ||
eSeg = e.segment, | ||
sSeg = s.segment, | ||
eSegIndex = e.segIndex, | ||
sSegIndex = s.segIndex, | ||
ei = e.i, | ||
si = s.i, | ||
sameSegment = sSegIndex === eSegIndex, | ||
sameBezier = ei === si && sameSegment, | ||
invertedOrder = sameSegment && si > ei || sameBezier && s.t > e.t, | ||
sShift, | ||
eShift, | ||
i, | ||
copy, | ||
totalSegments, | ||
l, | ||
j; | ||
if (wrap || loops) { | ||
if (_splitSegment(path, sSegIndex, si, s.t)) { | ||
sShift = 1; | ||
sSegIndex++; | ||
if (sameBezier) { | ||
if (invertedOrder) { | ||
e.t /= s.t; | ||
} else { | ||
e.t = (e.t - s.t) / (1 - s.t); | ||
eSegIndex++; | ||
ei = 0; | ||
} | ||
} else if (sSegIndex <= eSegIndex + 1 && !invertedOrder) { | ||
eSegIndex++; | ||
if (sameSegment) { | ||
ei -= si; | ||
} | ||
} | ||
} | ||
if (!e.t) { | ||
eSegIndex--; | ||
if (reverse) { | ||
sSegIndex--; | ||
} | ||
} else if (_splitSegment(path, eSegIndex, ei, e.t)) { | ||
if (invertedOrder && sShift) { | ||
sSegIndex++; | ||
} | ||
if (reverse) { | ||
eSegIndex++; | ||
} | ||
} | ||
copy = []; | ||
totalSegments = path.length; | ||
l = 1 + totalSegments * loops; | ||
j = sSegIndex; | ||
if (reverse) { | ||
eSegIndex = (eSegIndex || totalSegments) - 1; | ||
l += (totalSegments - eSegIndex + sSegIndex) % totalSegments; | ||
for (i = 0; i < l; i++) { | ||
_appendOrMerge(copy, path[j]); | ||
j = (j || totalSegments) - 1; | ||
} | ||
} else { | ||
l += (totalSegments - sSegIndex + eSegIndex) % totalSegments; | ||
for (i = 0; i < l; i++) { | ||
_appendOrMerge(copy, path[j++ % totalSegments]); | ||
} | ||
} | ||
path = copy; | ||
} else { | ||
eShift = e.t === 1 ? 6 : subdivideSegment(eSeg, ei, e.t); | ||
if (start !== end) { | ||
sShift = subdivideSegment(sSeg, si, sameBezier ? s.t / e.t : s.t); | ||
if (sameSegment) { | ||
eShift += sShift; | ||
} | ||
eSeg.splice(ei + eShift + 2); | ||
if (sShift) { | ||
sSeg.splice(0, si + sShift); | ||
} | ||
i = path.length; | ||
while (i--) { | ||
//chop off any extra segments | ||
if (i < sSegIndex || i > eSegIndex) { | ||
path.splice(i, 1); | ||
} | ||
} | ||
} else { | ||
eSeg.angle = getRotationAtBezierT(eSeg, ei + eShift, 0); //record the value before we chop because it'll be impossible to determine the angle after its length is 0! | ||
ei += eShift; | ||
s = eSeg[ei]; | ||
e = eSeg[ei + 1]; | ||
eSeg.length = eSeg.totalLength = 0; | ||
eSeg.totalPoints = path.totalPoints = 8; | ||
eSeg.push(s, e, s, e, s, e, s, e); | ||
} | ||
} | ||
if (reverse) { | ||
_reverseRawPath(path, wrap || loops); | ||
} | ||
path.totalLength = 0; | ||
return path; | ||
} //measures a Segment according to its resolution (so if segment.resolution is 6, for example, it'll take 6 samples equally across each Bezier) and create/populate a "samples" array that has the length up to each of those sample points (always increasing from the start) as well as a "lookup" array that's broken up according to the smallest distance between 2 samples. This gives us a very fast way of looking up a progress position rather than looping through all the points/Beziers. You can optionally have it only measure a subset, starting at startIndex and going for a specific number of beziers (remember, there are 3 x/y pairs each, for a total of 6 elements for each Bezier). It will also populate a "totalLength" property, but that's not generally super accurate because by default it'll only take 6 samples per Bezier. But for performance reasons, it's perfectly adequate for measuring progress values along the path. If you need a more accurate totalLength, either increase the resolution or use the more advanced bezierToPoints() method which keeps adding points until they don't deviate by more than a certain precision value. | ||
function measureSegment(segment, startIndex, bezierQty) { | ||
startIndex = startIndex || 0; | ||
if (!segment.samples) { | ||
segment.samples = []; | ||
segment.lookup = []; | ||
} | ||
let resolution = ~~segment.resolution || 12, | ||
inc = 1 / resolution, | ||
endIndex = bezierQty ? startIndex + bezierQty * 6 + 1 : segment.length, | ||
x1 = segment[startIndex], | ||
y1 = segment[startIndex + 1], | ||
samplesIndex = startIndex ? (startIndex / 6) * resolution : 0, | ||
samples = segment.samples, | ||
lookup = segment.lookup, | ||
min = (startIndex ? segment.minLength : _largeNum) || _largeNum, | ||
prevLength = samples[samplesIndex + bezierQty * resolution - 1], | ||
length = startIndex ? samples[samplesIndex-1] : 0, | ||
i, j, x4, x3, x2, xd, xd1, y4, y3, y2, yd, yd1, inv, t, lengthIndex, l, segLength; | ||
samples.length = lookup.length = 0; | ||
for (j = startIndex + 2; j < endIndex; j += 6) { | ||
x4 = segment[j + 4] - x1; | ||
x3 = segment[j + 2] - x1; | ||
x2 = segment[j] - x1; | ||
y4 = segment[j + 5] - y1; | ||
y3 = segment[j + 3] - y1; | ||
y2 = segment[j + 1] - y1; | ||
xd = xd1 = yd = yd1 = 0; | ||
for (i = 1; i <= resolution; i++) { | ||
t = inc * i; | ||
inv = 1 - t; | ||
xd = xd1 - (xd1 = (t * t * x4 + 3 * inv * (t * x3 + inv * x2)) * t); | ||
yd = yd1 - (yd1 = (t * t * y4 + 3 * inv * (t * y3 + inv * y2)) * t); | ||
l = _sqrt(yd * yd + xd * xd); | ||
if (l < min) { | ||
min = l; | ||
} | ||
length += l; | ||
samples[samplesIndex++] = length; | ||
} | ||
x1 += x4; | ||
y1 += y4; | ||
} | ||
if (prevLength) { | ||
prevLength -= length; | ||
for (; samplesIndex < samples.length; samplesIndex++) { | ||
samples[samplesIndex] += prevLength; | ||
} | ||
} | ||
if (samples.length && min) { | ||
segment.totalLength = segLength = samples[samples.length-1] || 0; | ||
segment.minLength = min; | ||
l = lengthIndex = 0; | ||
for (i = 0; i < segLength; i += min) { | ||
lookup[l++] = (samples[lengthIndex] < i) ? ++lengthIndex : lengthIndex; | ||
} | ||
} else { | ||
segment.totalLength = samples[0] = 0; | ||
} | ||
return startIndex ? length - samples[startIndex / 2 - 1] : length; | ||
startIndex = startIndex || 0; | ||
if (!segment.samples) { | ||
segment.samples = []; | ||
segment.lookup = []; | ||
} | ||
var resolution = ~~segment.resolution || 12, | ||
inc = 1 / resolution, | ||
endIndex = bezierQty ? startIndex + bezierQty * 6 + 1 : segment.length, | ||
x1 = segment[startIndex], | ||
y1 = segment[startIndex + 1], | ||
samplesIndex = startIndex ? startIndex / 6 * resolution : 0, | ||
samples = segment.samples, | ||
lookup = segment.lookup, | ||
min = (startIndex ? segment.minLength : _largeNum) || _largeNum, | ||
prevLength = samples[samplesIndex + bezierQty * resolution - 1], | ||
length = startIndex ? samples[samplesIndex - 1] : 0, | ||
i, | ||
j, | ||
x4, | ||
x3, | ||
x2, | ||
xd, | ||
xd1, | ||
y4, | ||
y3, | ||
y2, | ||
yd, | ||
yd1, | ||
inv, | ||
t, | ||
lengthIndex, | ||
l, | ||
segLength; | ||
samples.length = lookup.length = 0; | ||
for (j = startIndex + 2; j < endIndex; j += 6) { | ||
x4 = segment[j + 4] - x1; | ||
x3 = segment[j + 2] - x1; | ||
x2 = segment[j] - x1; | ||
y4 = segment[j + 5] - y1; | ||
y3 = segment[j + 3] - y1; | ||
y2 = segment[j + 1] - y1; | ||
xd = xd1 = yd = yd1 = 0; | ||
for (i = 1; i <= resolution; i++) { | ||
t = inc * i; | ||
inv = 1 - t; | ||
xd = xd1 - (xd1 = (t * t * x4 + 3 * inv * (t * x3 + inv * x2)) * t); | ||
yd = yd1 - (yd1 = (t * t * y4 + 3 * inv * (t * y3 + inv * y2)) * t); | ||
l = _sqrt(yd * yd + xd * xd); | ||
if (l < min) { | ||
min = l; | ||
} | ||
length += l; | ||
samples[samplesIndex++] = length; | ||
} | ||
x1 += x4; | ||
y1 += y4; | ||
} | ||
if (prevLength) { | ||
prevLength -= length; | ||
for (; samplesIndex < samples.length; samplesIndex++) { | ||
samples[samplesIndex] += prevLength; | ||
} | ||
} | ||
if (samples.length && min) { | ||
segment.totalLength = segLength = samples[samples.length - 1] || 0; | ||
segment.minLength = min; | ||
l = lengthIndex = 0; | ||
for (i = 0; i < segLength; i += min) { | ||
lookup[l++] = samples[lengthIndex] < i ? ++lengthIndex : lengthIndex; | ||
} | ||
} else { | ||
segment.totalLength = samples[0] = 0; | ||
} | ||
return startIndex ? length - samples[startIndex / 2 - 1] : length; | ||
} | ||
export function cacheRawPathMeasurements(rawPath, resolution) { | ||
let pathLength, points, i; | ||
for (i = pathLength = points = 0; i < rawPath.length; i++) { | ||
rawPath[i].resolution = ~~resolution || 12; //steps per Bezier curve (anchor, 2 control points, to anchor) | ||
points += rawPath[i].length; | ||
pathLength += measureSegment(rawPath[i]); | ||
} | ||
rawPath.totalPoints = points; | ||
rawPath.totalLength = pathLength; | ||
return rawPath; | ||
} | ||
var pathLength, points, i; | ||
//divide segment[i] at position t (value between 0 and 1, progress along that particular cubic bezier segment that starts at segment[i]). Returns how many elements were spliced into the segment array (either 0 or 6) | ||
for (i = pathLength = points = 0; i < rawPath.length; i++) { | ||
rawPath[i].resolution = ~~resolution || 12; //steps per Bezier curve (anchor, 2 control points, to anchor) | ||
points += rawPath[i].length; | ||
pathLength += measureSegment(rawPath[i]); | ||
} | ||
rawPath.totalPoints = points; | ||
rawPath.totalLength = pathLength; | ||
return rawPath; | ||
} //divide segment[i] at position t (value between 0 and 1, progress along that particular cubic bezier segment that starts at segment[i]). Returns how many elements were spliced into the segment array (either 0 or 6) | ||
export function subdivideSegment(segment, i, t) { | ||
if (t <= 0 || t >= 1) { | ||
return 0; | ||
} | ||
let ax = segment[i], | ||
ay = segment[i+1], | ||
cp1x = segment[i+2], | ||
cp1y = segment[i+3], | ||
cp2x = segment[i+4], | ||
cp2y = segment[i+5], | ||
bx = segment[i+6], | ||
by = segment[i+7], | ||
x1a = ax + (cp1x - ax) * t, | ||
x2 = cp1x + (cp2x - cp1x) * t, | ||
y1a = ay + (cp1y - ay) * t, | ||
y2 = cp1y + (cp2y - cp1y) * t, | ||
x1 = x1a + (x2 - x1a) * t, | ||
y1 = y1a + (y2 - y1a) * t, | ||
x2a = cp2x + (bx - cp2x) * t, | ||
y2a = cp2y + (by - cp2y) * t; | ||
x2 += (x2a - x2) * t; | ||
y2 += (y2a - y2) * t; | ||
segment.splice(i + 2, 4, | ||
_round(x1a), //first control point | ||
_round(y1a), | ||
_round(x1), //second control point | ||
_round(y1), | ||
_round(x1 + (x2 - x1) * t), //new fabricated anchor on line | ||
_round(y1 + (y2 - y1) * t), | ||
_round(x2), //third control point | ||
_round(y2), | ||
_round(x2a), //fourth control point | ||
_round(y2a) | ||
); | ||
if (segment.samples) { | ||
segment.samples.splice(((i / 6) * segment.resolution) | 0, 0, 0, 0, 0, 0, 0, 0); | ||
} | ||
return 6; | ||
} | ||
if (t <= 0 || t >= 1) { | ||
return 0; | ||
} | ||
// returns an object {path, segment, segIndex, i, t} | ||
var ax = segment[i], | ||
ay = segment[i + 1], | ||
cp1x = segment[i + 2], | ||
cp1y = segment[i + 3], | ||
cp2x = segment[i + 4], | ||
cp2y = segment[i + 5], | ||
bx = segment[i + 6], | ||
by = segment[i + 7], | ||
x1a = ax + (cp1x - ax) * t, | ||
x2 = cp1x + (cp2x - cp1x) * t, | ||
y1a = ay + (cp1y - ay) * t, | ||
y2 = cp1y + (cp2y - cp1y) * t, | ||
x1 = x1a + (x2 - x1a) * t, | ||
y1 = y1a + (y2 - y1a) * t, | ||
x2a = cp2x + (bx - cp2x) * t, | ||
y2a = cp2y + (by - cp2y) * t; | ||
x2 += (x2a - x2) * t; | ||
y2 += (y2a - y2) * t; | ||
segment.splice(i + 2, 4, _round(x1a), //first control point | ||
_round(y1a), _round(x1), //second control point | ||
_round(y1), _round(x1 + (x2 - x1) * t), //new fabricated anchor on line | ||
_round(y1 + (y2 - y1) * t), _round(x2), //third control point | ||
_round(y2), _round(x2a), //fourth control point | ||
_round(y2a)); | ||
if (segment.samples) { | ||
segment.samples.splice(i / 6 * segment.resolution | 0, 0, 0, 0, 0, 0, 0, 0); | ||
} | ||
return 6; | ||
} // returns an object {path, segment, segIndex, i, t} | ||
function getProgressData(rawPath, progress, decoratee) { | ||
decoratee = decoratee || {}; | ||
if (!rawPath.totalLength) { | ||
cacheRawPathMeasurements(rawPath); | ||
} | ||
if (progress < 0 || progress > 1) { | ||
progress = _wrapProgress(progress); | ||
} | ||
let segIndex = 0, | ||
segment = rawPath[0], | ||
samples, resolution, length, min, max, i; | ||
if (rawPath.length > 1) { //speed optimization: most of the time, there's only one segment so skip the recursion. | ||
length = rawPath.totalLength * progress; | ||
max = i = 0; | ||
while ((max += rawPath[i++].totalLength) < length) { | ||
segIndex = i; | ||
} | ||
segment = rawPath[segIndex]; | ||
min = max - segment.totalLength; | ||
progress = ((length - min) / (max - min)) || 0; | ||
} | ||
samples = segment.samples; | ||
resolution = segment.resolution; //how many samples per cubic bezier chunk | ||
length = segment.totalLength * progress; | ||
i = segment.lookup[~~(length / segment.minLength)] || 0; | ||
min = i ? samples[i-1] : 0; | ||
max = samples[i]; | ||
if (max < length) { | ||
min = max; | ||
max = samples[++i]; | ||
} | ||
decoratee.path = rawPath; | ||
decoratee.segment = segment; | ||
decoratee.segIndex = segIndex; | ||
decoratee.i = ~~(i / resolution) * 6; | ||
decoratee.t = (1 / resolution) * (((length - min) / (max - min)) + ((i % resolution))); | ||
return decoratee; | ||
decoratee = decoratee || {}; | ||
if (!rawPath.totalLength) { | ||
cacheRawPathMeasurements(rawPath); | ||
} | ||
if (progress < 0 || progress > 1) { | ||
progress = _wrapProgress(progress); | ||
} | ||
var segIndex = 0, | ||
segment = rawPath[0], | ||
samples, | ||
resolution, | ||
length, | ||
min, | ||
max, | ||
i; | ||
if (rawPath.length > 1) { | ||
//speed optimization: most of the time, there's only one segment so skip the recursion. | ||
length = rawPath.totalLength * progress; | ||
max = i = 0; | ||
while ((max += rawPath[i++].totalLength) < length) { | ||
segIndex = i; | ||
} | ||
segment = rawPath[segIndex]; | ||
min = max - segment.totalLength; | ||
progress = (length - min) / (max - min) || 0; | ||
} | ||
samples = segment.samples; | ||
resolution = segment.resolution; //how many samples per cubic bezier chunk | ||
length = segment.totalLength * progress; | ||
i = segment.lookup[~~(length / segment.minLength)] || 0; | ||
min = i ? samples[i - 1] : 0; | ||
max = samples[i]; | ||
if (max < length) { | ||
min = max; | ||
max = samples[++i]; | ||
} | ||
decoratee.path = rawPath; | ||
decoratee.segment = segment; | ||
decoratee.segIndex = segIndex; | ||
decoratee.i = ~~(i / resolution) * 6; | ||
decoratee.t = 1 / resolution * ((length - min) / (max - min) + i % resolution); | ||
return decoratee; | ||
} | ||
export function getPositionOnPath(rawPath, progress, includeAngle, point) { | ||
let segment = rawPath[0], | ||
result = point || {}, | ||
samples, resolution, length, min, max, i, t, a, inv; | ||
if (progress < 0 || progress > 1) { | ||
progress = _wrapProgress(progress); | ||
} | ||
if (rawPath.length > 1) { //speed optimization: most of the time, there's only one segment so skip the recursion. | ||
length = rawPath.totalLength * progress; | ||
max = i = 0; | ||
while ((max += rawPath[i++].totalLength) < length) { | ||
segment = rawPath[i]; | ||
} | ||
min = max - segment.totalLength; | ||
progress = ((length - min) / (max - min)) || 0; | ||
} | ||
samples = segment.samples; | ||
resolution = segment.resolution; | ||
length = segment.totalLength * progress; | ||
i = segment.lookup[~~(length / segment.minLength)] || 0; | ||
min = i ? samples[i-1] : 0; | ||
max = samples[i]; | ||
if (max < length) { | ||
min = max; | ||
max = samples[++i]; | ||
} | ||
t = ((1 / resolution) * (((length - min) / (max - min)) + ((i % resolution)))) || 0; | ||
inv = 1 - t; | ||
i = ~~(i / resolution) * 6; | ||
a = segment[i]; | ||
result.x = _round((t * t * (segment[i + 6] - a) + 3 * inv * (t * (segment[i + 4] - a) + inv * (segment[i + 2] - a))) * t + a); | ||
result.y = _round((t * t * (segment[i + 7] - (a = segment[i+1])) + 3 * inv * (t * (segment[i + 5] - a) + inv * (segment[i + 3] - a))) * t + a); | ||
if (includeAngle) { | ||
result.angle = segment.totalLength ? getRotationAtBezierT(segment, i, t >= 1 ? 1 - 1e-9 : t ? t : 1e-9) : segment.angle || 0; | ||
} | ||
return result; | ||
} | ||
var segment = rawPath[0], | ||
result = point || {}, | ||
samples, | ||
resolution, | ||
length, | ||
min, | ||
max, | ||
i, | ||
t, | ||
a, | ||
inv; | ||
if (progress < 0 || progress > 1) { | ||
progress = _wrapProgress(progress); | ||
} | ||
if (rawPath.length > 1) { | ||
//speed optimization: most of the time, there's only one segment so skip the recursion. | ||
length = rawPath.totalLength * progress; | ||
max = i = 0; | ||
//applies a matrix transform to RawPath (or a segment in a RawPath) and returns whatever was passed in (it transforms the values in the array(s), not a copy). | ||
while ((max += rawPath[i++].totalLength) < length) { | ||
segment = rawPath[i]; | ||
} | ||
min = max - segment.totalLength; | ||
progress = (length - min) / (max - min) || 0; | ||
} | ||
samples = segment.samples; | ||
resolution = segment.resolution; | ||
length = segment.totalLength * progress; | ||
i = segment.lookup[~~(length / segment.minLength)] || 0; | ||
min = i ? samples[i - 1] : 0; | ||
max = samples[i]; | ||
if (max < length) { | ||
min = max; | ||
max = samples[++i]; | ||
} | ||
t = 1 / resolution * ((length - min) / (max - min) + i % resolution) || 0; | ||
inv = 1 - t; | ||
i = ~~(i / resolution) * 6; | ||
a = segment[i]; | ||
result.x = _round((t * t * (segment[i + 6] - a) + 3 * inv * (t * (segment[i + 4] - a) + inv * (segment[i + 2] - a))) * t + a); | ||
result.y = _round((t * t * (segment[i + 7] - (a = segment[i + 1])) + 3 * inv * (t * (segment[i + 5] - a) + inv * (segment[i + 3] - a))) * t + a); | ||
if (includeAngle) { | ||
result.angle = segment.totalLength ? getRotationAtBezierT(segment, i, t >= 1 ? 1 - 1e-9 : t ? t : 1e-9) : segment.angle || 0; | ||
} | ||
return result; | ||
} //applies a matrix transform to RawPath (or a segment in a RawPath) and returns whatever was passed in (it transforms the values in the array(s), not a copy). | ||
export function transformRawPath(rawPath, a, b, c, d, tx, ty) { | ||
let j = rawPath.length, | ||
segment, l, i, x, y; | ||
while (--j > -1) { | ||
segment = rawPath[j]; | ||
l = segment.length; | ||
for (i = 0; i < l; i += 2) { | ||
x = segment[i]; | ||
y = segment[i+1]; | ||
segment[i] = x * a + y * c + tx; | ||
segment[i+1] = x * b + y * d + ty; | ||
} | ||
} | ||
rawPath._dirty = 1; | ||
return rawPath; | ||
} | ||
var j = rawPath.length, | ||
segment, | ||
l, | ||
i, | ||
x, | ||
y; | ||
while (--j > -1) { | ||
segment = rawPath[j]; | ||
l = segment.length; | ||
for (i = 0; i < l; i += 2) { | ||
x = segment[i]; | ||
y = segment[i + 1]; | ||
segment[i] = x * a + y * c + tx; | ||
segment[i + 1] = x * b + y * d + ty; | ||
} | ||
} | ||
// translates SVG arc data into a segment (cubic beziers). Angle is in degrees. | ||
rawPath._dirty = 1; | ||
return rawPath; | ||
} // translates SVG arc data into a segment (cubic beziers). Angle is in degrees. | ||
function arcToSegment(lastX, lastY, rx, ry, angle, largeArcFlag, sweepFlag, x, y) { | ||
if (lastX === x && lastY === y) { | ||
return; | ||
} | ||
rx = _abs(rx); | ||
ry = _abs(ry); | ||
let angleRad = (angle % 360) * _DEG2RAD, | ||
cosAngle = _cos(angleRad), | ||
sinAngle = _sin(angleRad), | ||
PI = Math.PI, | ||
TWOPI = PI * 2, | ||
dx2 = (lastX - x) / 2, | ||
dy2 = (lastY - y) / 2, | ||
x1 = (cosAngle * dx2 + sinAngle * dy2), | ||
y1 = (-sinAngle * dx2 + cosAngle * dy2), | ||
x1_sq = x1 * x1, | ||
y1_sq = y1 * y1, | ||
radiiCheck = x1_sq / (rx * rx) + y1_sq / (ry * ry); | ||
if (radiiCheck > 1) { | ||
rx = _sqrt(radiiCheck) * rx; | ||
ry = _sqrt(radiiCheck) * ry; | ||
} | ||
let rx_sq = rx * rx, | ||
ry_sq = ry * ry, | ||
sq = ((rx_sq * ry_sq) - (rx_sq * y1_sq) - (ry_sq * x1_sq)) / ((rx_sq * y1_sq) + (ry_sq * x1_sq)); | ||
if (sq < 0) { | ||
sq = 0; | ||
} | ||
let coef = ((largeArcFlag === sweepFlag) ? -1 : 1) * _sqrt(sq), | ||
cx1 = coef * ((rx * y1) / ry), | ||
cy1 = coef * -((ry * x1) / rx), | ||
sx2 = (lastX + x) / 2, | ||
sy2 = (lastY + y) / 2, | ||
cx = sx2 + (cosAngle * cx1 - sinAngle * cy1), | ||
cy = sy2 + (sinAngle * cx1 + cosAngle * cy1), | ||
ux = (x1 - cx1) / rx, | ||
uy = (y1 - cy1) / ry, | ||
vx = (-x1 - cx1) / rx, | ||
vy = (-y1 - cy1) / ry, | ||
temp = ux * ux + uy * uy, | ||
angleStart = ((uy < 0) ? -1 : 1) * Math.acos(ux / _sqrt(temp)), | ||
angleExtent = ((ux * vy - uy * vx < 0) ? -1 : 1) * Math.acos((ux * vx + uy * vy) / _sqrt(temp * (vx * vx + vy * vy))); | ||
if (isNaN(angleExtent)) { //rare edge case. Math.cos(-1) is NaN. | ||
angleExtent = PI; | ||
} | ||
if (!sweepFlag && angleExtent > 0) { | ||
angleExtent -= TWOPI; | ||
} else if (sweepFlag && angleExtent < 0) { | ||
angleExtent += TWOPI; | ||
} | ||
angleStart %= TWOPI; | ||
angleExtent %= TWOPI; | ||
let segments = Math.ceil(_abs(angleExtent) / (TWOPI / 4)), | ||
rawPath = [], | ||
angleIncrement = angleExtent / segments, | ||
controlLength = 4 / 3 * _sin(angleIncrement / 2) / (1 + _cos(angleIncrement / 2)), | ||
ma = cosAngle * rx, | ||
mb = sinAngle * rx, | ||
mc = sinAngle * -ry, | ||
md = cosAngle * ry, | ||
i; | ||
for (i = 0; i < segments; i++) { | ||
angle = angleStart + i * angleIncrement; | ||
x1 = _cos(angle); | ||
y1 = _sin(angle); | ||
ux = _cos(angle += angleIncrement); | ||
uy = _sin(angle); | ||
rawPath.push(x1 - controlLength * y1, y1 + controlLength * x1, ux + controlLength * uy, uy - controlLength * ux, ux, uy); | ||
} | ||
//now transform according to the actual size of the ellipse/arc (the beziers were noramlized, between 0 and 1 on a circle). | ||
for (i = 0; i < rawPath.length; i+=2) { | ||
x1 = rawPath[i]; | ||
y1 = rawPath[i+1]; | ||
rawPath[i] = x1 * ma + y1 * mc + cx; | ||
rawPath[i+1] = x1 * mb + y1 * md + cy; | ||
} | ||
rawPath[i-2] = x; //always set the end to exactly where it's supposed to be | ||
rawPath[i-1] = y; | ||
return rawPath; | ||
} | ||
if (lastX === x && lastY === y) { | ||
return; | ||
} | ||
//Spits back a RawPath with absolute coordinates. Each segment starts with a "moveTo" command (x coordinate, then y) and then 2 control points (x, y, x, y), then anchor. The goal is to minimize memory and maximize speed. | ||
rx = _abs(rx); | ||
ry = _abs(ry); | ||
var angleRad = angle % 360 * _DEG2RAD, | ||
cosAngle = _cos(angleRad), | ||
sinAngle = _sin(angleRad), | ||
PI = Math.PI, | ||
TWOPI = PI * 2, | ||
dx2 = (lastX - x) / 2, | ||
dy2 = (lastY - y) / 2, | ||
x1 = cosAngle * dx2 + sinAngle * dy2, | ||
y1 = -sinAngle * dx2 + cosAngle * dy2, | ||
x1_sq = x1 * x1, | ||
y1_sq = y1 * y1, | ||
radiiCheck = x1_sq / (rx * rx) + y1_sq / (ry * ry); | ||
if (radiiCheck > 1) { | ||
rx = _sqrt(radiiCheck) * rx; | ||
ry = _sqrt(radiiCheck) * ry; | ||
} | ||
var rx_sq = rx * rx, | ||
ry_sq = ry * ry, | ||
sq = (rx_sq * ry_sq - rx_sq * y1_sq - ry_sq * x1_sq) / (rx_sq * y1_sq + ry_sq * x1_sq); | ||
if (sq < 0) { | ||
sq = 0; | ||
} | ||
var coef = (largeArcFlag === sweepFlag ? -1 : 1) * _sqrt(sq), | ||
cx1 = coef * (rx * y1 / ry), | ||
cy1 = coef * -(ry * x1 / rx), | ||
sx2 = (lastX + x) / 2, | ||
sy2 = (lastY + y) / 2, | ||
cx = sx2 + (cosAngle * cx1 - sinAngle * cy1), | ||
cy = sy2 + (sinAngle * cx1 + cosAngle * cy1), | ||
ux = (x1 - cx1) / rx, | ||
uy = (y1 - cy1) / ry, | ||
vx = (-x1 - cx1) / rx, | ||
vy = (-y1 - cy1) / ry, | ||
temp = ux * ux + uy * uy, | ||
angleStart = (uy < 0 ? -1 : 1) * Math.acos(ux / _sqrt(temp)), | ||
angleExtent = (ux * vy - uy * vx < 0 ? -1 : 1) * Math.acos((ux * vx + uy * vy) / _sqrt(temp * (vx * vx + vy * vy))); | ||
if (isNaN(angleExtent)) { | ||
//rare edge case. Math.cos(-1) is NaN. | ||
angleExtent = PI; | ||
} | ||
if (!sweepFlag && angleExtent > 0) { | ||
angleExtent -= TWOPI; | ||
} else if (sweepFlag && angleExtent < 0) { | ||
angleExtent += TWOPI; | ||
} | ||
angleStart %= TWOPI; | ||
angleExtent %= TWOPI; | ||
var segments = Math.ceil(_abs(angleExtent) / (TWOPI / 4)), | ||
rawPath = [], | ||
angleIncrement = angleExtent / segments, | ||
controlLength = 4 / 3 * _sin(angleIncrement / 2) / (1 + _cos(angleIncrement / 2)), | ||
ma = cosAngle * rx, | ||
mb = sinAngle * rx, | ||
mc = sinAngle * -ry, | ||
md = cosAngle * ry, | ||
i; | ||
for (i = 0; i < segments; i++) { | ||
angle = angleStart + i * angleIncrement; | ||
x1 = _cos(angle); | ||
y1 = _sin(angle); | ||
ux = _cos(angle += angleIncrement); | ||
uy = _sin(angle); | ||
rawPath.push(x1 - controlLength * y1, y1 + controlLength * x1, ux + controlLength * uy, uy - controlLength * ux, ux, uy); | ||
} //now transform according to the actual size of the ellipse/arc (the beziers were noramlized, between 0 and 1 on a circle). | ||
for (i = 0; i < rawPath.length; i += 2) { | ||
x1 = rawPath[i]; | ||
y1 = rawPath[i + 1]; | ||
rawPath[i] = x1 * ma + y1 * mc + cx; | ||
rawPath[i + 1] = x1 * mb + y1 * md + cy; | ||
} | ||
rawPath[i - 2] = x; //always set the end to exactly where it's supposed to be | ||
rawPath[i - 1] = y; | ||
return rawPath; | ||
} //Spits back a RawPath with absolute coordinates. Each segment starts with a "moveTo" command (x coordinate, then y) and then 2 control points (x, y, x, y), then anchor. The goal is to minimize memory and maximize speed. | ||
export function stringToRawPath(d) { | ||
let a = (d + "").replace(_scientific, m => { let n = +m; return (n < 0.0001 && n > -0.0001) ? 0 : n; }).match(_svgPathExp) || [], //some authoring programs spit out very small numbers in scientific notation like "1e-5", so make sure we round that down to 0 first. | ||
path = [], | ||
relativeX = 0, | ||
relativeY = 0, | ||
twoThirds = 2 / 3, | ||
elements = a.length, | ||
points = 0, | ||
errorMessage = "ERROR: malformed path: " + d, | ||
i, j, x, y, command, isRelative, segment, startX, startY, difX, difY, beziers, prevCommand, | ||
line = function(sx, sy, ex, ey) { | ||
difX = (ex - sx) / 3; | ||
difY = (ey - sy) / 3; | ||
segment.push(sx + difX, sy + difY, ex - difX, ey - difY, ex, ey); | ||
}; | ||
if (!d || !isNaN(a[0]) || isNaN(a[1])) { | ||
console.log(errorMessage); | ||
return path; | ||
} | ||
for (i = 0; i < elements; i++) { | ||
prevCommand = command; | ||
if (isNaN(a[i])) { | ||
command = a[i].toUpperCase(); | ||
isRelative = (command !== a[i]); //lower case means relative | ||
} else { //commands like "C" can be strung together without any new command characters between. | ||
i--; | ||
} | ||
x = +a[i + 1]; | ||
y = +a[i + 2]; | ||
if (isRelative) { | ||
x += relativeX; | ||
y += relativeY; | ||
} | ||
if (!i) { | ||
startX = x; | ||
startY = y; | ||
} | ||
var a = (d + "").replace(_scientific, function (m) { | ||
var n = +m; | ||
return n < 0.0001 && n > -0.0001 ? 0 : n; | ||
}).match(_svgPathExp) || [], | ||
//some authoring programs spit out very small numbers in scientific notation like "1e-5", so make sure we round that down to 0 first. | ||
path = [], | ||
relativeX = 0, | ||
relativeY = 0, | ||
twoThirds = 2 / 3, | ||
elements = a.length, | ||
points = 0, | ||
errorMessage = "ERROR: malformed path: " + d, | ||
i, | ||
j, | ||
x, | ||
y, | ||
command, | ||
isRelative, | ||
segment, | ||
startX, | ||
startY, | ||
difX, | ||
difY, | ||
beziers, | ||
prevCommand, | ||
line = function line(sx, sy, ex, ey) { | ||
difX = (ex - sx) / 3; | ||
difY = (ey - sy) / 3; | ||
segment.push(sx + difX, sy + difY, ex - difX, ey - difY, ex, ey); | ||
}; | ||
// "M" (move) | ||
if (command === "M") { | ||
if (segment) { | ||
if (segment.length < 8) { //if the path data was funky and just had a M with no actual drawing anywhere, skip it. | ||
path.length -= 1; | ||
} else { | ||
points += segment.length; | ||
} | ||
} | ||
relativeX = startX = x; | ||
relativeY = startY = y; | ||
segment = [x, y]; | ||
path.push(segment); | ||
i += 2; | ||
command = "L"; //an "M" with more than 2 values gets interpreted as "lineTo" commands ("L"). | ||
if (!d || !isNaN(a[0]) || isNaN(a[1])) { | ||
console.log(errorMessage); | ||
return path; | ||
} | ||
// "C" (cubic bezier) | ||
} else if (command === "C") { | ||
if (!segment) { | ||
segment = [0, 0]; | ||
} | ||
if (!isRelative) { | ||
relativeX = relativeY = 0; | ||
} | ||
//note: "*1" is just a fast/short way to cast the value as a Number. WAAAY faster in Chrome, slightly slower in Firefox. | ||
segment.push(x, y, relativeX + a[i + 3] * 1, relativeY + a[i + 4] * 1, (relativeX += a[i + 5] * 1), (relativeY += a[i + 6] * 1)); | ||
i += 6; | ||
for (i = 0; i < elements; i++) { | ||
prevCommand = command; | ||
// "S" (continuation of cubic bezier) | ||
} else if (command === "S") { | ||
difX = relativeX; | ||
difY = relativeY; | ||
if (prevCommand === "C" || prevCommand === "S") { | ||
difX += relativeX - segment[segment.length - 4]; | ||
difY += relativeY - segment[segment.length - 3]; | ||
} | ||
if (!isRelative) { | ||
relativeX = relativeY = 0; | ||
} | ||
segment.push(difX, difY, x, y, (relativeX += a[i + 3] * 1), (relativeY += a[i + 4] * 1)); | ||
i += 4; | ||
if (isNaN(a[i])) { | ||
command = a[i].toUpperCase(); | ||
isRelative = command !== a[i]; //lower case means relative | ||
} else { | ||
//commands like "C" can be strung together without any new command characters between. | ||
i--; | ||
} | ||
// "Q" (quadratic bezier) | ||
} else if (command === "Q") { | ||
difX = relativeX + (x - relativeX) * twoThirds; | ||
difY = relativeY + (y - relativeY) * twoThirds; | ||
if (!isRelative) { | ||
relativeX = relativeY = 0; | ||
} | ||
relativeX += a[i + 3] * 1; | ||
relativeY += a[i + 4] * 1; | ||
segment.push(difX, difY, relativeX + (x - relativeX) * twoThirds, relativeY + (y - relativeY) * twoThirds, relativeX, relativeY); | ||
i += 4; | ||
x = +a[i + 1]; | ||
y = +a[i + 2]; | ||
// "T" (continuation of quadratic bezier) | ||
} else if (command === "T") { | ||
difX = relativeX - segment[segment.length - 4]; | ||
difY = relativeY - segment[segment.length - 3]; | ||
segment.push(relativeX + difX, relativeY + difY, x + ((relativeX + difX * 1.5) - x) * twoThirds, y + ((relativeY + difY * 1.5) - y) * twoThirds, (relativeX = x), (relativeY = y)); | ||
i += 2; | ||
if (isRelative) { | ||
x += relativeX; | ||
y += relativeY; | ||
} | ||
// "H" (horizontal line) | ||
} else if (command === "H") { | ||
line(relativeX, relativeY, (relativeX = x), relativeY); | ||
i += 1; | ||
if (!i) { | ||
startX = x; | ||
startY = y; | ||
} // "M" (move) | ||
// "V" (vertical line) | ||
} else if (command === "V") { | ||
//adjust values because the first (and only one) isn't x in this case, it's y. | ||
line(relativeX, relativeY, relativeX, (relativeY = x + (isRelative ? relativeY - relativeX : 0))); | ||
i += 1; | ||
// "L" (line) or "Z" (close) | ||
} else if (command === "L" || command === "Z") { | ||
if (command === "Z") { | ||
x = startX; | ||
y = startY; | ||
segment.closed = true; | ||
} | ||
if (command === "L" || _abs(relativeX - x) > 0.5 || _abs(relativeY - y) > 0.5) { | ||
line(relativeX, relativeY, x, y); | ||
if (command === "L") { | ||
i += 2; | ||
} | ||
} | ||
relativeX = x; | ||
relativeY = y; | ||
if (command === "M") { | ||
if (segment) { | ||
if (segment.length < 8) { | ||
//if the path data was funky and just had a M with no actual drawing anywhere, skip it. | ||
path.length -= 1; | ||
} else { | ||
points += segment.length; | ||
} | ||
} | ||
// "A" (arc) | ||
} else if (command === "A") { | ||
beziers = arcToSegment(relativeX, relativeY, +a[i+1], +a[i+2], +a[i+3], +a[i+4], +a[i+5], (isRelative ? relativeX : 0) + a[i+6]*1, (isRelative ? relativeY : 0) + a[i+7]*1); | ||
if (beziers) { | ||
for (j = 0; j < beziers.length; j++) { | ||
segment.push(beziers[j]); | ||
} | ||
} | ||
relativeX = segment[segment.length-2]; | ||
relativeY = segment[segment.length-1]; | ||
i += 7; | ||
relativeX = startX = x; | ||
relativeY = startY = y; | ||
segment = [x, y]; | ||
path.push(segment); | ||
i += 2; | ||
command = "L"; //an "M" with more than 2 values gets interpreted as "lineTo" commands ("L"). | ||
// "C" (cubic bezier) | ||
} else if (command === "C") { | ||
if (!segment) { | ||
segment = [0, 0]; | ||
} | ||
} else { | ||
console.log(errorMessage); | ||
} | ||
} | ||
i = segment.length; | ||
if (i < 6) { //in case there's odd SVG like a M0,0 command at the very end. | ||
path.pop(); | ||
i = 0; | ||
} else if (segment[0] === segment[i-2] && segment[1] === segment[i-1]) { | ||
segment.closed = true; | ||
} | ||
path.totalPoints = points + i; | ||
return path; | ||
} | ||
if (!isRelative) { | ||
relativeX = relativeY = 0; | ||
} //note: "*1" is just a fast/short way to cast the value as a Number. WAAAY faster in Chrome, slightly slower in Firefox. | ||
//populates the points array in alternating x/y values (like [x, y, x, y...] instead of individual point objects [{x, y}, {x, y}...] to conserve memory and stay in line with how we're handling segment arrays | ||
segment.push(x, y, relativeX + a[i + 3] * 1, relativeY + a[i + 4] * 1, relativeX += a[i + 5] * 1, relativeY += a[i + 6] * 1); | ||
i += 6; // "S" (continuation of cubic bezier) | ||
} else if (command === "S") { | ||
difX = relativeX; | ||
difY = relativeY; | ||
if (prevCommand === "C" || prevCommand === "S") { | ||
difX += relativeX - segment[segment.length - 4]; | ||
difY += relativeY - segment[segment.length - 3]; | ||
} | ||
if (!isRelative) { | ||
relativeX = relativeY = 0; | ||
} | ||
segment.push(difX, difY, x, y, relativeX += a[i + 3] * 1, relativeY += a[i + 4] * 1); | ||
i += 4; // "Q" (quadratic bezier) | ||
} else if (command === "Q") { | ||
difX = relativeX + (x - relativeX) * twoThirds; | ||
difY = relativeY + (y - relativeY) * twoThirds; | ||
if (!isRelative) { | ||
relativeX = relativeY = 0; | ||
} | ||
relativeX += a[i + 3] * 1; | ||
relativeY += a[i + 4] * 1; | ||
segment.push(difX, difY, relativeX + (x - relativeX) * twoThirds, relativeY + (y - relativeY) * twoThirds, relativeX, relativeY); | ||
i += 4; // "T" (continuation of quadratic bezier) | ||
} else if (command === "T") { | ||
difX = relativeX - segment[segment.length - 4]; | ||
difY = relativeY - segment[segment.length - 3]; | ||
segment.push(relativeX + difX, relativeY + difY, x + (relativeX + difX * 1.5 - x) * twoThirds, y + (relativeY + difY * 1.5 - y) * twoThirds, relativeX = x, relativeY = y); | ||
i += 2; // "H" (horizontal line) | ||
} else if (command === "H") { | ||
line(relativeX, relativeY, relativeX = x, relativeY); | ||
i += 1; // "V" (vertical line) | ||
} else if (command === "V") { | ||
//adjust values because the first (and only one) isn't x in this case, it's y. | ||
line(relativeX, relativeY, relativeX, relativeY = x + (isRelative ? relativeY - relativeX : 0)); | ||
i += 1; // "L" (line) or "Z" (close) | ||
} else if (command === "L" || command === "Z") { | ||
if (command === "Z") { | ||
x = startX; | ||
y = startY; | ||
segment.closed = true; | ||
} | ||
if (command === "L" || _abs(relativeX - x) > 0.5 || _abs(relativeY - y) > 0.5) { | ||
line(relativeX, relativeY, x, y); | ||
if (command === "L") { | ||
i += 2; | ||
} | ||
} | ||
relativeX = x; | ||
relativeY = y; // "A" (arc) | ||
} else if (command === "A") { | ||
beziers = arcToSegment(relativeX, relativeY, +a[i + 1], +a[i + 2], +a[i + 3], +a[i + 4], +a[i + 5], (isRelative ? relativeX : 0) + a[i + 6] * 1, (isRelative ? relativeY : 0) + a[i + 7] * 1); | ||
if (beziers) { | ||
for (j = 0; j < beziers.length; j++) { | ||
segment.push(beziers[j]); | ||
} | ||
} | ||
relativeX = segment[segment.length - 2]; | ||
relativeY = segment[segment.length - 1]; | ||
i += 7; | ||
} else { | ||
console.log(errorMessage); | ||
} | ||
} | ||
i = segment.length; | ||
if (i < 6) { | ||
//in case there's odd SVG like a M0,0 command at the very end. | ||
path.pop(); | ||
i = 0; | ||
} else if (segment[0] === segment[i - 2] && segment[1] === segment[i - 1]) { | ||
segment.closed = true; | ||
} | ||
path.totalPoints = points + i; | ||
return path; | ||
} //populates the points array in alternating x/y values (like [x, y, x, y...] instead of individual point objects [{x, y}, {x, y}...] to conserve memory and stay in line with how we're handling segment arrays | ||
export function bezierToPoints(x1, y1, x2, y2, x3, y3, x4, y4, threshold, points, index) { | ||
let x12 = (x1 + x2) / 2, | ||
y12 = (y1 + y2) / 2, | ||
x23 = (x2 + x3) / 2, | ||
y23 = (y2 + y3) / 2, | ||
x34 = (x3 + x4) / 2, | ||
y34 = (y3 + y4) / 2, | ||
x123 = (x12 + x23) / 2, | ||
y123 = (y12 + y23) / 2, | ||
x234 = (x23 + x34) / 2, | ||
y234 = (y23 + y34) / 2, | ||
x1234 = (x123 + x234) / 2, | ||
y1234 = (y123 + y234) / 2, | ||
dx = x4 - x1, | ||
dy = y4 - y1, | ||
d2 = _abs((x2 - x4) * dy - (y2 - y4) * dx), | ||
d3 = _abs((x3 - x4) * dy - (y3 - y4) * dx), | ||
length; | ||
if (!points) { | ||
points = [x1, y1, x4, y4]; | ||
index = 2; | ||
} | ||
points.splice(index || points.length - 2, 0, x1234, y1234); | ||
if ((d2 + d3) * (d2 + d3) > threshold * (dx * dx + dy * dy)) { | ||
length = points.length; | ||
bezierToPoints(x1, y1, x12, y12, x123, y123, x1234, y1234, threshold, points, index); | ||
bezierToPoints(x1234, y1234, x234, y234, x34, y34, x4, y4, threshold, points, index + 2 + (points.length - length)); | ||
} | ||
return points; | ||
var x12 = (x1 + x2) / 2, | ||
y12 = (y1 + y2) / 2, | ||
x23 = (x2 + x3) / 2, | ||
y23 = (y2 + y3) / 2, | ||
x34 = (x3 + x4) / 2, | ||
y34 = (y3 + y4) / 2, | ||
x123 = (x12 + x23) / 2, | ||
y123 = (y12 + y23) / 2, | ||
x234 = (x23 + x34) / 2, | ||
y234 = (y23 + y34) / 2, | ||
x1234 = (x123 + x234) / 2, | ||
y1234 = (y123 + y234) / 2, | ||
dx = x4 - x1, | ||
dy = y4 - y1, | ||
d2 = _abs((x2 - x4) * dy - (y2 - y4) * dx), | ||
d3 = _abs((x3 - x4) * dy - (y3 - y4) * dx), | ||
length; | ||
if (!points) { | ||
points = [x1, y1, x4, y4]; | ||
index = 2; | ||
} | ||
points.splice(index || points.length - 2, 0, x1234, y1234); | ||
if ((d2 + d3) * (d2 + d3) > threshold * (dx * dx + dy * dy)) { | ||
length = points.length; | ||
bezierToPoints(x1, y1, x12, y12, x123, y123, x1234, y1234, threshold, points, index); | ||
bezierToPoints(x1234, y1234, x234, y234, x34, y34, x4, y4, threshold, points, index + 2 + (points.length - length)); | ||
} | ||
return points; | ||
} | ||
/* | ||
@@ -862,221 +1049,273 @@ function getAngleBetweenPoints(x0, y0, x1, y1, x2, y2) { //angle between 3 points in radians | ||
*/ | ||
//pointsToSegment() doesn't handle flat coordinates (where y is always 0) the way we need (the resulting control points are always right on top of the anchors), so this function basically makes the control points go directly up and down, varying in length based on the curviness (more curvy, further control points) | ||
export function flatPointsToSegment(points, curviness=1) { | ||
let x = points[0], | ||
y = 0, | ||
segment = [x, y], | ||
i = 2; | ||
for (; i < points.length; i+=2) { | ||
segment.push( | ||
x, | ||
y, | ||
points[i], | ||
(y = (points[i] - x) * curviness / 2), | ||
(x = points[i]), | ||
-y | ||
); | ||
} | ||
return segment; | ||
} | ||
//points is an array of x/y points, like [x, y, x, y, x, y] | ||
export function flatPointsToSegment(points, curviness) { | ||
if (curviness === void 0) { | ||
curviness = 1; | ||
} | ||
var x = points[0], | ||
y = 0, | ||
segment = [x, y], | ||
i = 2; | ||
for (; i < points.length; i += 2) { | ||
segment.push(x, y, points[i], y = (points[i] - x) * curviness / 2, x = points[i], -y); | ||
} | ||
return segment; | ||
} //points is an array of x/y points, like [x, y, x, y, x, y] | ||
export function pointsToSegment(points, curviness, cornerThreshold) { | ||
//points = simplifyPoints(points, tolerance); | ||
let l = points.length-2, | ||
x = +points[0], | ||
y = +points[1], | ||
nextX = +points[2], | ||
nextY = +points[3], | ||
segment = [x, y, x, y], | ||
dx2 = nextX - x, | ||
dy2 = nextY - y, | ||
prevX, prevY, angle, slope, i, dx1, dx3, dy1, dy3, d1, d2, a, b, c; | ||
if (isNaN(cornerThreshold)) { | ||
cornerThreshold = Math.PI / 10; | ||
} | ||
curviness = (curviness || curviness === 0) ? +curviness : 1; | ||
for (i = 2; i < l; i+=2) { | ||
prevX = x; | ||
prevY = y; | ||
x = nextX; | ||
y = nextY; | ||
nextX = +points[i+2]; | ||
nextY = +points[i+3]; | ||
dx1 = dx2; | ||
dy1 = dy2; | ||
dx2 = nextX - x; | ||
dy2 = nextY - y; | ||
dx3 = nextX - prevX; | ||
dy3 = nextY - prevY; | ||
a = dx1 * dx1 + dy1 * dy1; | ||
b = dx2 * dx2 + dy2 * dy2; | ||
c = dx3 * dx3 + dy3 * dy3; | ||
angle = Math.acos( (a + b - c) / _sqrt(4 * a * b) ); //angle between the 3 points | ||
d2 = (angle / Math.PI) * curviness; //temporary precalculation for speed (reusing d2 variable) | ||
d1 = _sqrt(a) * d2; //the tighter the angle, the shorter we make the handles in proportion. | ||
d2 *= _sqrt(b); | ||
if (x !== prevX || y !== prevY) { | ||
if (angle > cornerThreshold) { | ||
slope = _atan2(dy3, dx3); | ||
segment.push( | ||
_round(x - _cos(slope) * d1), //first control point | ||
_round(y - _sin(slope) * d1), | ||
_round(x), //anchor | ||
_round(y), | ||
_round(x + _cos(slope) * d2), //second control point | ||
_round(y + _sin(slope) * d2) | ||
); | ||
} else { | ||
slope = _atan2(dy1, dx1); | ||
segment.push( | ||
_round(x - _cos(slope) * d1), //first control point | ||
_round(y - _sin(slope) * d1)); | ||
slope = _atan2(dy2, dx2); | ||
segment.push( | ||
_round(x), //anchor | ||
_round(y), | ||
_round(x + _cos(slope) * d2), //second control point | ||
_round(y + _sin(slope) * d2) | ||
); | ||
} | ||
} | ||
} | ||
segment.push(_round(nextX), _round(nextY), _round(nextX), _round(nextY)); | ||
return segment; | ||
} | ||
//points = simplifyPoints(points, tolerance); | ||
var l = points.length - 2, | ||
x = +points[0], | ||
y = +points[1], | ||
nextX = +points[2], | ||
nextY = +points[3], | ||
segment = [x, y, x, y], | ||
dx2 = nextX - x, | ||
dy2 = nextY - y, | ||
prevX, | ||
prevY, | ||
angle, | ||
slope, | ||
i, | ||
dx1, | ||
dx3, | ||
dy1, | ||
dy3, | ||
d1, | ||
d2, | ||
a, | ||
b, | ||
c; | ||
//returns the squared distance between an x/y coordinate and a segment between x1/y1 and x2/y2 | ||
if (isNaN(cornerThreshold)) { | ||
cornerThreshold = Math.PI / 10; | ||
} | ||
curviness = curviness || curviness === 0 ? +curviness : 1; | ||
for (i = 2; i < l; i += 2) { | ||
prevX = x; | ||
prevY = y; | ||
x = nextX; | ||
y = nextY; | ||
nextX = +points[i + 2]; | ||
nextY = +points[i + 3]; | ||
dx1 = dx2; | ||
dy1 = dy2; | ||
dx2 = nextX - x; | ||
dy2 = nextY - y; | ||
dx3 = nextX - prevX; | ||
dy3 = nextY - prevY; | ||
a = dx1 * dx1 + dy1 * dy1; | ||
b = dx2 * dx2 + dy2 * dy2; | ||
c = dx3 * dx3 + dy3 * dy3; | ||
angle = Math.acos((a + b - c) / _sqrt(4 * a * b)); //angle between the 3 points | ||
d2 = angle / Math.PI * curviness; //temporary precalculation for speed (reusing d2 variable) | ||
d1 = _sqrt(a) * d2; //the tighter the angle, the shorter we make the handles in proportion. | ||
d2 *= _sqrt(b); | ||
if (x !== prevX || y !== prevY) { | ||
if (angle > cornerThreshold) { | ||
slope = _atan2(dy3, dx3); | ||
segment.push(_round(x - _cos(slope) * d1), //first control point | ||
_round(y - _sin(slope) * d1), _round(x), //anchor | ||
_round(y), _round(x + _cos(slope) * d2), //second control point | ||
_round(y + _sin(slope) * d2)); | ||
} else { | ||
slope = _atan2(dy1, dx1); | ||
segment.push(_round(x - _cos(slope) * d1), //first control point | ||
_round(y - _sin(slope) * d1)); | ||
slope = _atan2(dy2, dx2); | ||
segment.push(_round(x), //anchor | ||
_round(y), _round(x + _cos(slope) * d2), //second control point | ||
_round(y + _sin(slope) * d2)); | ||
} | ||
} | ||
} | ||
segment.push(_round(nextX), _round(nextY), _round(nextX), _round(nextY)); | ||
return segment; | ||
} //returns the squared distance between an x/y coordinate and a segment between x1/y1 and x2/y2 | ||
function pointToSegDist(x, y, x1, y1, x2, y2) { | ||
let dx = x2 - x1, | ||
dy = y2 - y1, | ||
t; | ||
if (dx || dy) { | ||
t = ((x - x1) * dx + (y - y1) * dy) / (dx * dx + dy * dy); | ||
if (t > 1) { | ||
x1 = x2; | ||
y1 = y2; | ||
} else if (t > 0) { | ||
x1 += dx * t; | ||
y1 += dy * t; | ||
} | ||
} | ||
return (x - x1) ** 2 + (y - y1) ** 2; | ||
var dx = x2 - x1, | ||
dy = y2 - y1, | ||
t; | ||
if (dx || dy) { | ||
t = ((x - x1) * dx + (y - y1) * dy) / (dx * dx + dy * dy); | ||
if (t > 1) { | ||
x1 = x2; | ||
y1 = y2; | ||
} else if (t > 0) { | ||
x1 += dx * t; | ||
y1 += dy * t; | ||
} | ||
} | ||
return Math.pow(x - x1, 2) + Math.pow(y - y1, 2); | ||
} | ||
function simplifyStep(points, first, last, tolerance, simplified) { | ||
let maxSqDist = tolerance, | ||
firstX = points[first], | ||
firstY = points[first+1], | ||
lastX = points[last], | ||
lastY = points[last+1], | ||
index, i, d; | ||
for (i = first + 2; i < last; i += 2) { | ||
d = pointToSegDist(points[i], points[i+1], firstX, firstY, lastX, lastY); | ||
if (d > maxSqDist) { | ||
index = i; | ||
maxSqDist = d; | ||
} | ||
} | ||
if (maxSqDist > tolerance) { | ||
if (index - first > 2) { | ||
simplifyStep(points, first, index, tolerance, simplified); | ||
} | ||
simplified.push(points[index], points[index+1]); | ||
if (last - index > 2) { | ||
simplifyStep(points, index, last, tolerance, simplified); | ||
} | ||
} | ||
} | ||
var maxSqDist = tolerance, | ||
firstX = points[first], | ||
firstY = points[first + 1], | ||
lastX = points[last], | ||
lastY = points[last + 1], | ||
index, | ||
i, | ||
d; | ||
//points is an array of x/y values like [x, y, x, y, x, y] | ||
for (i = first + 2; i < last; i += 2) { | ||
d = pointToSegDist(points[i], points[i + 1], firstX, firstY, lastX, lastY); | ||
if (d > maxSqDist) { | ||
index = i; | ||
maxSqDist = d; | ||
} | ||
} | ||
if (maxSqDist > tolerance) { | ||
if (index - first > 2) { | ||
simplifyStep(points, first, index, tolerance, simplified); | ||
} | ||
simplified.push(points[index], points[index + 1]); | ||
if (last - index > 2) { | ||
simplifyStep(points, index, last, tolerance, simplified); | ||
} | ||
} | ||
} //points is an array of x/y values like [x, y, x, y, x, y] | ||
export function simplifyPoints(points, tolerance) { | ||
let prevX = parseFloat(points[0]), | ||
prevY = parseFloat(points[1]), | ||
temp = [prevX, prevY], | ||
l = points.length - 2, | ||
i, x, y, dx, dy, result, last; | ||
tolerance = (tolerance || 1) ** 2; | ||
for (i = 2; i < l; i += 2) { | ||
x = parseFloat(points[i]); | ||
y = parseFloat(points[i+1]); | ||
dx = prevX - x; | ||
dy = prevY - y; | ||
if (dx * dx + dy * dy > tolerance) { | ||
temp.push(x, y); | ||
prevX = x; | ||
prevY = y; | ||
} | ||
} | ||
temp.push(parseFloat(points[l]), parseFloat(points[l+1])); | ||
last = temp.length - 2; | ||
result = [temp[0], temp[1]]; | ||
simplifyStep(temp, 0, last, tolerance, result); | ||
result.push(temp[last], temp[last+1]); | ||
return result; | ||
var prevX = parseFloat(points[0]), | ||
prevY = parseFloat(points[1]), | ||
temp = [prevX, prevY], | ||
l = points.length - 2, | ||
i, | ||
x, | ||
y, | ||
dx, | ||
dy, | ||
result, | ||
last; | ||
tolerance = Math.pow(tolerance || 1, 2); | ||
for (i = 2; i < l; i += 2) { | ||
x = parseFloat(points[i]); | ||
y = parseFloat(points[i + 1]); | ||
dx = prevX - x; | ||
dy = prevY - y; | ||
if (dx * dx + dy * dy > tolerance) { | ||
temp.push(x, y); | ||
prevX = x; | ||
prevY = y; | ||
} | ||
} | ||
temp.push(parseFloat(points[l]), parseFloat(points[l + 1])); | ||
last = temp.length - 2; | ||
result = [temp[0], temp[1]]; | ||
simplifyStep(temp, 0, last, tolerance, result); | ||
result.push(temp[last], temp[last + 1]); | ||
return result; | ||
} | ||
function getClosestProgressOnBezier(iterations, px, py, start, end, slices, x0, y0, x1, y1, x2, y2, x3, y3) { | ||
let inc = (end - start) / slices, | ||
best = 0, | ||
t = start, | ||
x, y, d, dx, dy, inv; | ||
_bestDistance = _largeNum; | ||
while (t <= end) { | ||
inv = 1 - t; | ||
x = inv * inv * inv * x0 + 3 * inv * inv * t * x1 + 3 * inv * t * t * x2 + t * t * t * x3; | ||
y = inv * inv * inv * y0 + 3 * inv * inv * t * y1 + 3 * inv * t * t * y2 + t * t * t * y3; | ||
dx = x - px; | ||
dy = y - py; | ||
d = dx * dx + dy * dy; | ||
if (d < _bestDistance) { | ||
_bestDistance = d; | ||
best = t; | ||
} | ||
t += inc; | ||
} | ||
return (iterations > 1) ? getClosestProgressOnBezier(iterations - 1, px, py, Math.max(best - inc, 0), Math.min(best + inc, 1), slices, x0, y0, x1, y1, x2, y2, x3, y3) : best; | ||
} | ||
var inc = (end - start) / slices, | ||
best = 0, | ||
t = start, | ||
x, | ||
y, | ||
d, | ||
dx, | ||
dy, | ||
inv; | ||
_bestDistance = _largeNum; | ||
export function getClosestData(rawPath, x, y, slices) { //returns an object with the closest j, i, and t (j is the segment index, i is the index of the point in that segment, and t is the time/progress along that bezier) | ||
let closest = {j:0, i:0, t:0}, | ||
bestDistance = _largeNum, | ||
i, j, t, segment; | ||
for (j = 0; j < rawPath.length; j++) { | ||
segment = rawPath[j]; | ||
for (i = 0; i < segment.length; i+=6) { | ||
t = getClosestProgressOnBezier(1, x, y, 0, 1, slices || 20, segment[i], segment[i+1], segment[i+2], segment[i+3], segment[i+4], segment[i+5], segment[i+6], segment[i+7]); | ||
if (bestDistance > _bestDistance) { | ||
bestDistance = _bestDistance; | ||
closest.j = j; | ||
closest.i = i; | ||
closest.t = t; | ||
} | ||
} | ||
} | ||
return closest; | ||
while (t <= end) { | ||
inv = 1 - t; | ||
x = inv * inv * inv * x0 + 3 * inv * inv * t * x1 + 3 * inv * t * t * x2 + t * t * t * x3; | ||
y = inv * inv * inv * y0 + 3 * inv * inv * t * y1 + 3 * inv * t * t * y2 + t * t * t * y3; | ||
dx = x - px; | ||
dy = y - py; | ||
d = dx * dx + dy * dy; | ||
if (d < _bestDistance) { | ||
_bestDistance = d; | ||
best = t; | ||
} | ||
t += inc; | ||
} | ||
return iterations > 1 ? getClosestProgressOnBezier(iterations - 1, px, py, Math.max(best - inc, 0), Math.min(best + inc, 1), slices, x0, y0, x1, y1, x2, y2, x3, y3) : best; | ||
} | ||
//subdivide a Segment closest to a specific x,y coordinate | ||
export function getClosestData(rawPath, x, y, slices) { | ||
//returns an object with the closest j, i, and t (j is the segment index, i is the index of the point in that segment, and t is the time/progress along that bezier) | ||
var closest = { | ||
j: 0, | ||
i: 0, | ||
t: 0 | ||
}, | ||
bestDistance = _largeNum, | ||
i, | ||
j, | ||
t, | ||
segment; | ||
for (j = 0; j < rawPath.length; j++) { | ||
segment = rawPath[j]; | ||
for (i = 0; i < segment.length; i += 6) { | ||
t = getClosestProgressOnBezier(1, x, y, 0, 1, slices || 20, segment[i], segment[i + 1], segment[i + 2], segment[i + 3], segment[i + 4], segment[i + 5], segment[i + 6], segment[i + 7]); | ||
if (bestDistance > _bestDistance) { | ||
bestDistance = _bestDistance; | ||
closest.j = j; | ||
closest.i = i; | ||
closest.t = t; | ||
} | ||
} | ||
} | ||
return closest; | ||
} //subdivide a Segment closest to a specific x,y coordinate | ||
export function subdivideSegmentNear(x, y, segment, slices, iterations) { | ||
let l = segment.length, | ||
bestDistance = _largeNum, | ||
bestT = 0, | ||
bestSegmentIndex = 0, | ||
t, i; | ||
slices = slices || 20; | ||
iterations = iterations || 3; | ||
for (i = 0; i < l; i += 6) { | ||
t = getClosestProgressOnBezier(1, x, y, 0, 1, slices, segment[i], segment[i+1], segment[i+2], segment[i+3], segment[i+4], segment[i+5], segment[i+6], segment[i+7]); | ||
if (bestDistance > _bestDistance) { | ||
bestDistance = _bestDistance; | ||
bestT = t; | ||
bestSegmentIndex = i; | ||
} | ||
} | ||
t = getClosestProgressOnBezier(iterations, x, y, bestT - 0.05, bestT + 0.05, slices, segment[bestSegmentIndex], segment[bestSegmentIndex+1], segment[bestSegmentIndex+2], segment[bestSegmentIndex+3], segment[bestSegmentIndex+4], segment[bestSegmentIndex+5], segment[bestSegmentIndex+6], segment[bestSegmentIndex+7]); | ||
subdivideSegment(segment, bestSegmentIndex, t); | ||
return bestSegmentIndex + 6; | ||
var l = segment.length, | ||
bestDistance = _largeNum, | ||
bestT = 0, | ||
bestSegmentIndex = 0, | ||
t, | ||
i; | ||
slices = slices || 20; | ||
iterations = iterations || 3; | ||
for (i = 0; i < l; i += 6) { | ||
t = getClosestProgressOnBezier(1, x, y, 0, 1, slices, segment[i], segment[i + 1], segment[i + 2], segment[i + 3], segment[i + 4], segment[i + 5], segment[i + 6], segment[i + 7]); | ||
if (bestDistance > _bestDistance) { | ||
bestDistance = _bestDistance; | ||
bestT = t; | ||
bestSegmentIndex = i; | ||
} | ||
} | ||
t = getClosestProgressOnBezier(iterations, x, y, bestT - 0.05, bestT + 0.05, slices, segment[bestSegmentIndex], segment[bestSegmentIndex + 1], segment[bestSegmentIndex + 2], segment[bestSegmentIndex + 3], segment[bestSegmentIndex + 4], segment[bestSegmentIndex + 5], segment[bestSegmentIndex + 6], segment[bestSegmentIndex + 7]); | ||
subdivideSegment(segment, bestSegmentIndex, t); | ||
return bestSegmentIndex + 6; | ||
} | ||
/* | ||
@@ -1090,23 +1329,32 @@ Takes any of the following and converts it to an all Cubic Bezier SVG data string: | ||
*/ | ||
export function rawPathToString(rawPath) { | ||
if (_isNumber(rawPath[0])) { //in case a segment is passed in instead | ||
rawPath = [rawPath]; | ||
} | ||
let result = "", | ||
l = rawPath.length, | ||
sl, s, i, segment; | ||
for (s = 0; s < l; s++) { | ||
segment = rawPath[s]; | ||
result += "M" + _round(segment[0]) + "," + _round(segment[1]) + " C"; | ||
sl = segment.length; | ||
for (i = 2; i < sl; i++) { | ||
result += _round(segment[i++]) + "," + _round(segment[i++]) + " " + _round(segment[i++]) + "," + _round(segment[i++]) + " " + _round(segment[i++]) + "," + _round(segment[i]) + " "; | ||
} | ||
if (segment.closed) { | ||
result += "z"; | ||
} | ||
} | ||
return result; | ||
if (_isNumber(rawPath[0])) { | ||
//in case a segment is passed in instead | ||
rawPath = [rawPath]; | ||
} | ||
var result = "", | ||
l = rawPath.length, | ||
sl, | ||
s, | ||
i, | ||
segment; | ||
for (s = 0; s < l; s++) { | ||
segment = rawPath[s]; | ||
result += "M" + _round(segment[0]) + "," + _round(segment[1]) + " C"; | ||
sl = segment.length; | ||
for (i = 2; i < sl; i++) { | ||
result += _round(segment[i++]) + "," + _round(segment[i++]) + " " + _round(segment[i++]) + "," + _round(segment[i++]) + " " + _round(segment[i++]) + "," + _round(segment[i]) + " "; | ||
} | ||
if (segment.closed) { | ||
result += "z"; | ||
} | ||
} | ||
return result; | ||
} | ||
/* | ||
@@ -1113,0 +1361,0 @@ // takes a segment with coordinates [x, y, x, y, ...] and converts the control points into angles and lengths [x, y, angle, length, angle, length, x, y, angle, length, ...] so that it animates more cleanly and avoids odd breaks/kinks. For example, if you animate from 1 o'clock to 6 o'clock, it'd just go directly/linearly rather than around. So the length would be very short in the middle of the tween. |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
1720375
59
26886