Added mousewheel support for PixiJS Lists.
This commit is contained in:
+43
@@ -0,0 +1,43 @@
|
||||
/*!
|
||||
* VERSION: 0.6.1
|
||||
* DATE: 2018-08-27
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
*/
|
||||
/* eslint-disable */
|
||||
|
||||
import { _gsScope } from "./TweenLite.js";
|
||||
|
||||
export var AttrPlugin = _gsScope._gsDefine.plugin({
|
||||
propName: "attr",
|
||||
API: 2,
|
||||
version: "0.6.1",
|
||||
|
||||
//called when the tween renders for the first time. This is where initial values should be recorded and any setup routines should run.
|
||||
init: function(target, value, tween, index) {
|
||||
var p, end;
|
||||
if (typeof(target.setAttribute) !== "function") {
|
||||
return false;
|
||||
}
|
||||
for (p in value) {
|
||||
end = value[p];
|
||||
if (typeof(end) === "function") {
|
||||
end = end(index, target);
|
||||
}
|
||||
this._addTween(target, "setAttribute", target.getAttribute(p) + "", end + "", p, false, p);
|
||||
this._overwriteProps.push(p);
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
export { AttrPlugin as default };
|
||||
|
||||
|
||||
|
||||
+604
@@ -0,0 +1,604 @@
|
||||
/*!
|
||||
* VERSION: 1.3.8
|
||||
* DATE: 2018-05-30
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
**/
|
||||
/* eslint-disable */
|
||||
import { _gsScope } from "./TweenLite.js";
|
||||
|
||||
var _RAD2DEG = 180 / Math.PI,
|
||||
_r1 = [],
|
||||
_r2 = [],
|
||||
_r3 = [],
|
||||
_corProps = {},
|
||||
_globals = _gsScope._gsDefine.globals,
|
||||
Segment = function(a, b, c, d) {
|
||||
if (c === d) { //if c and d match, the final autoRotate value could lock at -90 degrees, so differentiate them slightly.
|
||||
c = d - (d - b) / 1000000;
|
||||
}
|
||||
if (a === b) { //if a and b match, the starting autoRotate value could lock at -90 degrees, so differentiate them slightly.
|
||||
b = a + (c - a) / 1000000;
|
||||
}
|
||||
this.a = a;
|
||||
this.b = b;
|
||||
this.c = c;
|
||||
this.d = d;
|
||||
this.da = d - a;
|
||||
this.ca = c - a;
|
||||
this.ba = b - a;
|
||||
},
|
||||
_correlate = ",x,y,z,left,top,right,bottom,marginTop,marginLeft,marginRight,marginBottom,paddingLeft,paddingTop,paddingRight,paddingBottom,backgroundPosition,backgroundPosition_y,",
|
||||
cubicToQuadratic = function(a, b, c, d) {
|
||||
var q1 = {a:a},
|
||||
q2 = {},
|
||||
q3 = {},
|
||||
q4 = {c:d},
|
||||
mab = (a + b) / 2,
|
||||
mbc = (b + c) / 2,
|
||||
mcd = (c + d) / 2,
|
||||
mabc = (mab + mbc) / 2,
|
||||
mbcd = (mbc + mcd) / 2,
|
||||
m8 = (mbcd - mabc) / 8;
|
||||
q1.b = mab + (a - mab) / 4;
|
||||
q2.b = mabc + m8;
|
||||
q1.c = q2.a = (q1.b + q2.b) / 2;
|
||||
q2.c = q3.a = (mabc + mbcd) / 2;
|
||||
q3.b = mbcd - m8;
|
||||
q4.b = mcd + (d - mcd) / 4;
|
||||
q3.c = q4.a = (q3.b + q4.b) / 2;
|
||||
return [q1, q2, q3, q4];
|
||||
},
|
||||
_calculateControlPoints = function(a, curviness, quad, basic, correlate) {
|
||||
var l = a.length - 1,
|
||||
ii = 0,
|
||||
cp1 = a[0].a,
|
||||
i, p1, p2, p3, seg, m1, m2, mm, cp2, qb, r1, r2, tl;
|
||||
for (i = 0; i < l; i++) {
|
||||
seg = a[ii];
|
||||
p1 = seg.a;
|
||||
p2 = seg.d;
|
||||
p3 = a[ii+1].d;
|
||||
|
||||
if (correlate) {
|
||||
r1 = _r1[i];
|
||||
r2 = _r2[i];
|
||||
tl = ((r2 + r1) * curviness * 0.25) / (basic ? 0.5 : _r3[i] || 0.5);
|
||||
m1 = p2 - (p2 - p1) * (basic ? curviness * 0.5 : (r1 !== 0 ? tl / r1 : 0));
|
||||
m2 = p2 + (p3 - p2) * (basic ? curviness * 0.5 : (r2 !== 0 ? tl / r2 : 0));
|
||||
mm = p2 - (m1 + (((m2 - m1) * ((r1 * 3 / (r1 + r2)) + 0.5) / 4) || 0));
|
||||
} else {
|
||||
m1 = p2 - (p2 - p1) * curviness * 0.5;
|
||||
m2 = p2 + (p3 - p2) * curviness * 0.5;
|
||||
mm = p2 - (m1 + m2) / 2;
|
||||
}
|
||||
m1 += mm;
|
||||
m2 += mm;
|
||||
|
||||
seg.c = cp2 = m1;
|
||||
if (i !== 0) {
|
||||
seg.b = cp1;
|
||||
} else {
|
||||
seg.b = cp1 = seg.a + (seg.c - seg.a) * 0.6; //instead of placing b on a exactly, we move it inline with c so that if the user specifies an ease like Back.easeIn or Elastic.easeIn which goes BEYOND the beginning, it will do so smoothly.
|
||||
}
|
||||
|
||||
seg.da = p2 - p1;
|
||||
seg.ca = cp2 - p1;
|
||||
seg.ba = cp1 - p1;
|
||||
|
||||
if (quad) {
|
||||
qb = cubicToQuadratic(p1, cp1, cp2, p2);
|
||||
a.splice(ii, 1, qb[0], qb[1], qb[2], qb[3]);
|
||||
ii += 4;
|
||||
} else {
|
||||
ii++;
|
||||
}
|
||||
|
||||
cp1 = m2;
|
||||
}
|
||||
seg = a[ii];
|
||||
seg.b = cp1;
|
||||
seg.c = cp1 + (seg.d - cp1) * 0.4; //instead of placing c on d exactly, we move it inline with b so that if the user specifies an ease like Back.easeOut or Elastic.easeOut which goes BEYOND the end, it will do so smoothly.
|
||||
seg.da = seg.d - seg.a;
|
||||
seg.ca = seg.c - seg.a;
|
||||
seg.ba = cp1 - seg.a;
|
||||
if (quad) {
|
||||
qb = cubicToQuadratic(seg.a, cp1, seg.c, seg.d);
|
||||
a.splice(ii, 1, qb[0], qb[1], qb[2], qb[3]);
|
||||
}
|
||||
},
|
||||
_parseAnchors = function(values, p, correlate, prepend) {
|
||||
var a = [],
|
||||
l, i, p1, p2, p3, tmp;
|
||||
if (prepend) {
|
||||
values = [prepend].concat(values);
|
||||
i = values.length;
|
||||
while (--i > -1) {
|
||||
if (typeof( (tmp = values[i][p]) ) === "string") if (tmp.charAt(1) === "=") {
|
||||
values[i][p] = prepend[p] + Number(tmp.charAt(0) + tmp.substr(2)); //accommodate relative values. Do it inline instead of breaking it out into a function for speed reasons
|
||||
}
|
||||
}
|
||||
}
|
||||
l = values.length - 2;
|
||||
if (l < 0) {
|
||||
a[0] = new Segment(values[0][p], 0, 0, values[0][p]);
|
||||
return a;
|
||||
}
|
||||
for (i = 0; i < l; i++) {
|
||||
p1 = values[i][p];
|
||||
p2 = values[i+1][p];
|
||||
a[i] = new Segment(p1, 0, 0, p2);
|
||||
if (correlate) {
|
||||
p3 = values[i+2][p];
|
||||
_r1[i] = (_r1[i] || 0) + (p2 - p1) * (p2 - p1);
|
||||
_r2[i] = (_r2[i] || 0) + (p3 - p2) * (p3 - p2);
|
||||
}
|
||||
}
|
||||
a[i] = new Segment(values[i][p], 0, 0, values[i+1][p]);
|
||||
return a;
|
||||
},
|
||||
bezierThrough = function(values, curviness, quadratic, basic, correlate, prepend) {
|
||||
var obj = {},
|
||||
props = [],
|
||||
first = prepend || values[0],
|
||||
i, p, a, j, r, l, seamless, last;
|
||||
correlate = (typeof(correlate) === "string") ? ","+correlate+"," : _correlate;
|
||||
if (curviness == null) {
|
||||
curviness = 1;
|
||||
}
|
||||
for (p in values[0]) {
|
||||
props.push(p);
|
||||
}
|
||||
//check to see if the last and first values are identical (well, within 0.05). If so, make seamless by appending the second element to the very end of the values array and the 2nd-to-last element to the very beginning (we'll remove those segments later)
|
||||
if (values.length > 1) {
|
||||
last = values[values.length - 1];
|
||||
seamless = true;
|
||||
i = props.length;
|
||||
while (--i > -1) {
|
||||
p = props[i];
|
||||
if (Math.abs(first[p] - last[p]) > 0.05) { //build in a tolerance of +/-0.05 to accommodate rounding errors.
|
||||
seamless = false;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (seamless) {
|
||||
values = values.concat(); //duplicate the array to avoid contaminating the original which the user may be reusing for other tweens
|
||||
if (prepend) {
|
||||
values.unshift(prepend);
|
||||
}
|
||||
values.push(values[1]);
|
||||
prepend = values[values.length - 3];
|
||||
}
|
||||
}
|
||||
_r1.length = _r2.length = _r3.length = 0;
|
||||
i = props.length;
|
||||
while (--i > -1) {
|
||||
p = props[i];
|
||||
_corProps[p] = (correlate.indexOf(","+p+",") !== -1);
|
||||
obj[p] = _parseAnchors(values, p, _corProps[p], prepend);
|
||||
}
|
||||
i = _r1.length;
|
||||
while (--i > -1) {
|
||||
_r1[i] = Math.sqrt(_r1[i]);
|
||||
_r2[i] = Math.sqrt(_r2[i]);
|
||||
}
|
||||
if (!basic) {
|
||||
i = props.length;
|
||||
while (--i > -1) {
|
||||
if (_corProps[p]) {
|
||||
a = obj[props[i]];
|
||||
l = a.length - 1;
|
||||
for (j = 0; j < l; j++) {
|
||||
r = (a[j+1].da / _r2[j] + a[j].da / _r1[j]) || 0;
|
||||
_r3[j] = (_r3[j] || 0) + r * r;
|
||||
}
|
||||
}
|
||||
}
|
||||
i = _r3.length;
|
||||
while (--i > -1) {
|
||||
_r3[i] = Math.sqrt(_r3[i]);
|
||||
}
|
||||
}
|
||||
i = props.length;
|
||||
j = quadratic ? 4 : 1;
|
||||
while (--i > -1) {
|
||||
p = props[i];
|
||||
a = obj[p];
|
||||
_calculateControlPoints(a, curviness, quadratic, basic, _corProps[p]); //this method requires that _parseAnchors() and _setSegmentRatios() ran first so that _r1, _r2, and _r3 values are populated for all properties
|
||||
if (seamless) {
|
||||
a.splice(0, j);
|
||||
a.splice(a.length - j, j);
|
||||
}
|
||||
}
|
||||
return obj;
|
||||
},
|
||||
_parseBezierData = function(values, type, prepend) {
|
||||
type = type || "soft";
|
||||
var obj = {},
|
||||
inc = (type === "cubic") ? 3 : 2,
|
||||
soft = (type === "soft"),
|
||||
props = [],
|
||||
a, b, c, d, cur, i, j, l, p, cnt, tmp;
|
||||
if (soft && prepend) {
|
||||
values = [prepend].concat(values);
|
||||
}
|
||||
if (values == null || values.length < inc + 1) { throw "invalid Bezier data"; }
|
||||
for (p in values[0]) {
|
||||
props.push(p);
|
||||
}
|
||||
i = props.length;
|
||||
while (--i > -1) {
|
||||
p = props[i];
|
||||
obj[p] = cur = [];
|
||||
cnt = 0;
|
||||
l = values.length;
|
||||
for (j = 0; j < l; j++) {
|
||||
a = (prepend == null) ? values[j][p] : (typeof( (tmp = values[j][p]) ) === "string" && tmp.charAt(1) === "=") ? prepend[p] + Number(tmp.charAt(0) + tmp.substr(2)) : Number(tmp);
|
||||
if (soft) if (j > 1) if (j < l - 1) {
|
||||
cur[cnt++] = (a + cur[cnt-2]) / 2;
|
||||
}
|
||||
cur[cnt++] = a;
|
||||
}
|
||||
l = cnt - inc + 1;
|
||||
cnt = 0;
|
||||
for (j = 0; j < l; j += inc) {
|
||||
a = cur[j];
|
||||
b = cur[j+1];
|
||||
c = cur[j+2];
|
||||
d = (inc === 2) ? 0 : cur[j+3];
|
||||
cur[cnt++] = tmp = (inc === 3) ? new Segment(a, b, c, d) : new Segment(a, (2 * b + a) / 3, (2 * b + c) / 3, c);
|
||||
}
|
||||
cur.length = cnt;
|
||||
}
|
||||
return obj;
|
||||
},
|
||||
_addCubicLengths = function(a, steps, resolution) {
|
||||
var inc = 1 / resolution,
|
||||
j = a.length,
|
||||
d, d1, s, da, ca, ba, p, i, inv, bez, index;
|
||||
while (--j > -1) {
|
||||
bez = a[j];
|
||||
s = bez.a;
|
||||
da = bez.d - s;
|
||||
ca = bez.c - s;
|
||||
ba = bez.b - s;
|
||||
d = d1 = 0;
|
||||
for (i = 1; i <= resolution; i++) {
|
||||
p = inc * i;
|
||||
inv = 1 - p;
|
||||
d = d1 - (d1 = (p * p * da + 3 * inv * (p * ca + inv * ba)) * p);
|
||||
index = j * resolution + i - 1;
|
||||
steps[index] = (steps[index] || 0) + d * d;
|
||||
}
|
||||
}
|
||||
},
|
||||
_parseLengthData = function(obj, resolution) {
|
||||
resolution = resolution >> 0 || 6;
|
||||
var a = [],
|
||||
lengths = [],
|
||||
d = 0,
|
||||
total = 0,
|
||||
threshold = resolution - 1,
|
||||
segments = [],
|
||||
curLS = [], //current length segments array
|
||||
p, i, l, index;
|
||||
for (p in obj) {
|
||||
_addCubicLengths(obj[p], a, resolution);
|
||||
}
|
||||
l = a.length;
|
||||
for (i = 0; i < l; i++) {
|
||||
d += Math.sqrt(a[i]);
|
||||
index = i % resolution;
|
||||
curLS[index] = d;
|
||||
if (index === threshold) {
|
||||
total += d;
|
||||
index = (i / resolution) >> 0;
|
||||
segments[index] = curLS;
|
||||
lengths[index] = total;
|
||||
d = 0;
|
||||
curLS = [];
|
||||
}
|
||||
}
|
||||
return {length:total, lengths:lengths, segments:segments};
|
||||
},
|
||||
|
||||
|
||||
|
||||
BezierPlugin = _gsScope._gsDefine.plugin({
|
||||
propName: "bezier",
|
||||
priority: -1,
|
||||
version: "1.3.8",
|
||||
API: 2,
|
||||
global:true,
|
||||
|
||||
//gets called when the tween renders for the first time. This is where initial values should be recorded and any setup routines should run.
|
||||
init: function(target, vars, tween) {
|
||||
this._target = target;
|
||||
if (vars instanceof Array) {
|
||||
vars = {values:vars};
|
||||
}
|
||||
this._func = {};
|
||||
this._mod = {};
|
||||
this._props = [];
|
||||
this._timeRes = (vars.timeResolution == null) ? 6 : parseInt(vars.timeResolution, 10);
|
||||
var values = vars.values || [],
|
||||
first = {},
|
||||
second = values[0],
|
||||
autoRotate = vars.autoRotate || tween.vars.orientToBezier,
|
||||
p, isFunc, i, j, prepend;
|
||||
|
||||
this._autoRotate = autoRotate ? (autoRotate instanceof Array) ? autoRotate : [["x","y","rotation",((autoRotate === true) ? 0 : Number(autoRotate) || 0)]] : null;
|
||||
for (p in second) {
|
||||
this._props.push(p);
|
||||
}
|
||||
|
||||
i = this._props.length;
|
||||
while (--i > -1) {
|
||||
p = this._props[i];
|
||||
|
||||
this._overwriteProps.push(p);
|
||||
isFunc = this._func[p] = (typeof(target[p]) === "function");
|
||||
first[p] = (!isFunc) ? parseFloat(target[p]) : target[ ((p.indexOf("set") || typeof(target["get" + p.substr(3)]) !== "function") ? p : "get" + p.substr(3)) ]();
|
||||
if (!prepend) if (first[p] !== values[0][p]) {
|
||||
prepend = first;
|
||||
}
|
||||
}
|
||||
this._beziers = (vars.type !== "cubic" && vars.type !== "quadratic" && vars.type !== "soft") ? bezierThrough(values, isNaN(vars.curviness) ? 1 : vars.curviness, false, (vars.type === "thruBasic"), vars.correlate, prepend) : _parseBezierData(values, vars.type, first);
|
||||
this._segCount = this._beziers[p].length;
|
||||
|
||||
if (this._timeRes) {
|
||||
var ld = _parseLengthData(this._beziers, this._timeRes);
|
||||
this._length = ld.length;
|
||||
this._lengths = ld.lengths;
|
||||
this._segments = ld.segments;
|
||||
this._l1 = this._li = this._s1 = this._si = 0;
|
||||
this._l2 = this._lengths[0];
|
||||
this._curSeg = this._segments[0];
|
||||
this._s2 = this._curSeg[0];
|
||||
this._prec = 1 / this._curSeg.length;
|
||||
}
|
||||
|
||||
if ((autoRotate = this._autoRotate)) {
|
||||
this._initialRotations = [];
|
||||
if (!(autoRotate[0] instanceof Array)) {
|
||||
this._autoRotate = autoRotate = [autoRotate];
|
||||
}
|
||||
i = autoRotate.length;
|
||||
while (--i > -1) {
|
||||
for (j = 0; j < 3; j++) {
|
||||
p = autoRotate[i][j];
|
||||
this._func[p] = (typeof(target[p]) === "function") ? target[ ((p.indexOf("set") || typeof(target["get" + p.substr(3)]) !== "function") ? p : "get" + p.substr(3)) ] : false;
|
||||
}
|
||||
p = autoRotate[i][2];
|
||||
this._initialRotations[i] = (this._func[p] ? this._func[p].call(this._target) : this._target[p]) || 0;
|
||||
this._overwriteProps.push(p);
|
||||
}
|
||||
}
|
||||
this._startRatio = tween.vars.runBackwards ? 1 : 0; //we determine the starting ratio when the tween inits which is always 0 unless the tween has runBackwards:true (indicating it's a from() tween) in which case it's 1.
|
||||
return true;
|
||||
},
|
||||
|
||||
//called each time the values should be updated, and the ratio gets passed as the only parameter (typically it's a value between 0 and 1, but it can exceed those when using an ease like Elastic.easeOut or Back.easeOut, etc.)
|
||||
set: function(v) {
|
||||
var segments = this._segCount,
|
||||
func = this._func,
|
||||
target = this._target,
|
||||
notStart = (v !== this._startRatio),
|
||||
curIndex, inv, i, p, b, t, val, l, lengths, curSeg;
|
||||
if (!this._timeRes) {
|
||||
curIndex = (v < 0) ? 0 : (v >= 1) ? segments - 1 : (segments * v) >> 0;
|
||||
t = (v - (curIndex * (1 / segments))) * segments;
|
||||
} else {
|
||||
lengths = this._lengths;
|
||||
curSeg = this._curSeg;
|
||||
v *= this._length;
|
||||
i = this._li;
|
||||
//find the appropriate segment (if the currently cached one isn't correct)
|
||||
if (v > this._l2 && i < segments - 1) {
|
||||
l = segments - 1;
|
||||
while (i < l && (this._l2 = lengths[++i]) <= v) { }
|
||||
this._l1 = lengths[i-1];
|
||||
this._li = i;
|
||||
this._curSeg = curSeg = this._segments[i];
|
||||
this._s2 = curSeg[(this._s1 = this._si = 0)];
|
||||
} else if (v < this._l1 && i > 0) {
|
||||
while (i > 0 && (this._l1 = lengths[--i]) >= v) { }
|
||||
if (i === 0 && v < this._l1) {
|
||||
this._l1 = 0;
|
||||
} else {
|
||||
i++;
|
||||
}
|
||||
this._l2 = lengths[i];
|
||||
this._li = i;
|
||||
this._curSeg = curSeg = this._segments[i];
|
||||
this._s1 = curSeg[(this._si = curSeg.length - 1) - 1] || 0;
|
||||
this._s2 = curSeg[this._si];
|
||||
}
|
||||
curIndex = i;
|
||||
//now find the appropriate sub-segment (we split it into the number of pieces that was defined by "precision" and measured each one)
|
||||
v -= this._l1;
|
||||
i = this._si;
|
||||
if (v > this._s2 && i < curSeg.length - 1) {
|
||||
l = curSeg.length - 1;
|
||||
while (i < l && (this._s2 = curSeg[++i]) <= v) { }
|
||||
this._s1 = curSeg[i-1];
|
||||
this._si = i;
|
||||
} else if (v < this._s1 && i > 0) {
|
||||
while (i > 0 && (this._s1 = curSeg[--i]) >= v) { }
|
||||
if (i === 0 && v < this._s1) {
|
||||
this._s1 = 0;
|
||||
} else {
|
||||
i++;
|
||||
}
|
||||
this._s2 = curSeg[i];
|
||||
this._si = i;
|
||||
}
|
||||
t = ((i + (v - this._s1) / (this._s2 - this._s1)) * this._prec) || 0;
|
||||
}
|
||||
inv = 1 - t;
|
||||
|
||||
i = this._props.length;
|
||||
while (--i > -1) {
|
||||
p = this._props[i];
|
||||
b = this._beziers[p][curIndex];
|
||||
val = (t * t * b.da + 3 * inv * (t * b.ca + inv * b.ba)) * t + b.a;
|
||||
if (this._mod[p]) {
|
||||
val = this._mod[p](val, target);
|
||||
}
|
||||
if (func[p]) {
|
||||
target[p](val);
|
||||
} else {
|
||||
target[p] = val;
|
||||
}
|
||||
}
|
||||
|
||||
if (this._autoRotate) {
|
||||
var ar = this._autoRotate,
|
||||
b2, x1, y1, x2, y2, add, conv;
|
||||
i = ar.length;
|
||||
while (--i > -1) {
|
||||
p = ar[i][2];
|
||||
add = ar[i][3] || 0;
|
||||
conv = (ar[i][4] === true) ? 1 : _RAD2DEG;
|
||||
b = this._beziers[ar[i][0]];
|
||||
b2 = this._beziers[ar[i][1]];
|
||||
|
||||
if (b && b2) { //in case one of the properties got overwritten.
|
||||
b = b[curIndex];
|
||||
b2 = b2[curIndex];
|
||||
|
||||
x1 = b.a + (b.b - b.a) * t;
|
||||
x2 = b.b + (b.c - b.b) * t;
|
||||
x1 += (x2 - x1) * t;
|
||||
x2 += ((b.c + (b.d - b.c) * t) - x2) * t;
|
||||
|
||||
y1 = b2.a + (b2.b - b2.a) * t;
|
||||
y2 = b2.b + (b2.c - b2.b) * t;
|
||||
y1 += (y2 - y1) * t;
|
||||
y2 += ((b2.c + (b2.d - b2.c) * t) - y2) * t;
|
||||
|
||||
val = notStart ? Math.atan2(y2 - y1, x2 - x1) * conv + add : this._initialRotations[i];
|
||||
|
||||
if (this._mod[p]) {
|
||||
val = this._mod[p](val, target); //for modProps
|
||||
}
|
||||
|
||||
if (func[p]) {
|
||||
target[p](val);
|
||||
} else {
|
||||
target[p] = val;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}),
|
||||
p = BezierPlugin.prototype;
|
||||
|
||||
|
||||
BezierPlugin.bezierThrough = bezierThrough;
|
||||
BezierPlugin.cubicToQuadratic = cubicToQuadratic;
|
||||
BezierPlugin._autoCSS = true; //indicates that this plugin can be inserted into the "css" object using the autoCSS feature of TweenLite
|
||||
BezierPlugin.quadraticToCubic = function(a, b, c) {
|
||||
return new Segment(a, (2 * b + a) / 3, (2 * b + c) / 3, c);
|
||||
};
|
||||
|
||||
BezierPlugin._cssRegister = function() {
|
||||
var CSSPlugin = _globals.CSSPlugin;
|
||||
if (!CSSPlugin) {
|
||||
return;
|
||||
}
|
||||
var _internals = CSSPlugin._internals,
|
||||
_parseToProxy = _internals._parseToProxy,
|
||||
_setPluginRatio = _internals._setPluginRatio,
|
||||
CSSPropTween = _internals.CSSPropTween;
|
||||
_internals._registerComplexSpecialProp("bezier", {parser:function(t, e, prop, cssp, pt, plugin) {
|
||||
if (e instanceof Array) {
|
||||
e = {values:e};
|
||||
}
|
||||
plugin = new BezierPlugin();
|
||||
var values = e.values,
|
||||
l = values.length - 1,
|
||||
pluginValues = [],
|
||||
v = {},
|
||||
i, p, data;
|
||||
if (l < 0) {
|
||||
return pt;
|
||||
}
|
||||
for (i = 0; i <= l; i++) {
|
||||
data = _parseToProxy(t, values[i], cssp, pt, plugin, (l !== i));
|
||||
pluginValues[i] = data.end;
|
||||
}
|
||||
for (p in e) {
|
||||
v[p] = e[p]; //duplicate the vars object because we need to alter some things which would cause problems if the user plans to reuse the same vars object for another tween.
|
||||
}
|
||||
v.values = pluginValues;
|
||||
pt = new CSSPropTween(t, "bezier", 0, 0, data.pt, 2);
|
||||
pt.data = data;
|
||||
pt.plugin = plugin;
|
||||
pt.setRatio = _setPluginRatio;
|
||||
if (v.autoRotate === 0) {
|
||||
v.autoRotate = true;
|
||||
}
|
||||
if (v.autoRotate && !(v.autoRotate instanceof Array)) {
|
||||
i = (v.autoRotate === true) ? 0 : Number(v.autoRotate);
|
||||
v.autoRotate = (data.end.left != null) ? [["left","top","rotation",i,false]] : (data.end.x != null) ? [["x","y","rotation",i,false]] : false;
|
||||
}
|
||||
if (v.autoRotate) {
|
||||
if (!cssp._transform) {
|
||||
cssp._enableTransforms(false);
|
||||
}
|
||||
data.autoRotate = cssp._target._gsTransform;
|
||||
data.proxy.rotation = data.autoRotate.rotation || 0;
|
||||
cssp._overwriteProps.push("rotation");
|
||||
}
|
||||
plugin._onInitTween(data.proxy, v, cssp._tween);
|
||||
return pt;
|
||||
}});
|
||||
};
|
||||
|
||||
p._mod = function(lookup) {
|
||||
var op = this._overwriteProps,
|
||||
i = op.length,
|
||||
val;
|
||||
while (--i > -1) {
|
||||
val = lookup[op[i]];
|
||||
if (val && typeof(val) === "function") {
|
||||
this._mod[op[i]] = val;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
p._kill = function(lookup) {
|
||||
var a = this._props,
|
||||
p, i;
|
||||
for (p in this._beziers) {
|
||||
if (p in lookup) {
|
||||
delete this._beziers[p];
|
||||
delete this._func[p];
|
||||
i = a.length;
|
||||
while (--i > -1) {
|
||||
if (a[i] === p) {
|
||||
a.splice(i, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
a = this._autoRotate;
|
||||
if (a) {
|
||||
i = a.length;
|
||||
while (--i > -1) {
|
||||
if (lookup[a[i][2]]) {
|
||||
a.splice(i, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
return this._super._kill.call(this, lookup);
|
||||
};
|
||||
|
||||
export { BezierPlugin, BezierPlugin as default };
|
||||
+2917
File diff suppressed because it is too large
Load Diff
+106
@@ -0,0 +1,106 @@
|
||||
/*!
|
||||
* VERSION: 0.6.7
|
||||
* DATE: 2018-08-27
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
*/
|
||||
/* eslint-disable */
|
||||
|
||||
import TweenLite, { _gsScope, globals, TweenPlugin } from "./TweenLite.js";
|
||||
import CSSPlugin from "./CSSPlugin.js";
|
||||
|
||||
_gsScope._gsDefine("plugins.CSSRulePlugin", ["plugins.TweenPlugin","TweenLite","plugins.CSSPlugin"], function() {
|
||||
|
||||
/** @constructor **/
|
||||
var CSSRulePlugin = function() {
|
||||
TweenPlugin.call(this, "cssRule");
|
||||
this._overwriteProps.length = 0;
|
||||
},
|
||||
_doc = _gsScope.document,
|
||||
_superSetRatio = CSSPlugin.prototype.setRatio,
|
||||
p = CSSRulePlugin.prototype = new CSSPlugin();
|
||||
|
||||
p._propName = "cssRule";
|
||||
p.constructor = CSSRulePlugin;
|
||||
CSSRulePlugin.version = "0.6.7";
|
||||
CSSRulePlugin.API = 2;
|
||||
|
||||
/**
|
||||
* Searches the style sheets in the document for a particular selector like ".myClass" or "a" or "a:hover" or ":after" and
|
||||
* returns a reference to that style sheet (or an array of them in the case of a pseudo selector like ":after"). Then you
|
||||
* can animate the individual properties of the style sheet.
|
||||
*
|
||||
* @param {!string} selector a string describing the selector, like ".myClass" or "a" or "a:hover" or ":after"
|
||||
* @return a reference to the style sheet (or an array of them in the case of a pseudo selector). If none was found, null is returned (or an empty array for a pseudo selector)
|
||||
*/
|
||||
CSSRulePlugin.getRule = function(selector) {
|
||||
var ruleProp = _doc.all ? "rules" : "cssRules",
|
||||
ss = _doc.styleSheets,
|
||||
i = ss.length,
|
||||
pseudo = (selector.charAt(0) === ":"),
|
||||
j, curSS, cs, a;
|
||||
selector = (pseudo ? "" : ",") + selector.split("::").join(":").toLowerCase() + ","; //note: old versions of IE report tag name selectors as upper case, so we just change everything to lowercase.
|
||||
if (pseudo) {
|
||||
a = [];
|
||||
}
|
||||
while (--i > -1) {
|
||||
//Firefox may throw insecure operation errors when css is loaded from other domains, so try/catch.
|
||||
try {
|
||||
curSS = ss[i][ruleProp];
|
||||
if (!curSS) {
|
||||
continue;
|
||||
}
|
||||
j = curSS.length;
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
continue;
|
||||
}
|
||||
while (--j > -1) {
|
||||
cs = curSS[j];
|
||||
if (cs.selectorText && ("," + cs.selectorText.split("::").join(":").toLowerCase() + ",").indexOf(selector) !== -1) { //note: IE adds an extra ":" to pseudo selectors, so .myClass:after becomes .myClass::after, so we need to strip the extra one out.
|
||||
if (pseudo) {
|
||||
a.push(cs.style);
|
||||
} else {
|
||||
return cs.style;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return a;
|
||||
};
|
||||
|
||||
|
||||
// @private gets called when the tween renders for the first time. This kicks everything off, recording start/end values, etc.
|
||||
p._onInitTween = function(target, value, tween) {
|
||||
if (target.cssText === undefined) {
|
||||
return false;
|
||||
}
|
||||
var div = target._gsProxy = target._gsProxy || _doc.createElement("div");
|
||||
this._ss = target;
|
||||
this._proxy = div.style;
|
||||
div.style.cssText = target.cssText;
|
||||
CSSPlugin.prototype._onInitTween.call(this, div, value, tween); //we just offload all the work to the regular CSSPlugin and then copy the cssText back over to the rule in the setRatio() method. This allows us to have all of the updates to CSSPlugin automatically flow through to CSSRulePlugin instead of having to maintain both
|
||||
return true;
|
||||
};
|
||||
|
||||
|
||||
|
||||
// @private gets called every time the tween updates, passing the new ratio (typically a value between 0 and 1, but not always (for example, if an Elastic.easeOut is used, the value can jump above 1 mid-tween). It will always start and 0 and end at 1.
|
||||
p.setRatio = function(v) {
|
||||
_superSetRatio.call(this, v);
|
||||
this._ss.cssText = this._proxy.cssText;
|
||||
};
|
||||
|
||||
|
||||
TweenPlugin.activate([CSSRulePlugin]);
|
||||
return CSSRulePlugin;
|
||||
|
||||
}, true);
|
||||
|
||||
export var CSSRulePlugin = globals.CSSRulePlugin;
|
||||
export { CSSRulePlugin as default };
|
||||
+232
@@ -0,0 +1,232 @@
|
||||
/*!
|
||||
* VERSION: 1.5.3
|
||||
* DATE: 2018-05-30
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
**/
|
||||
/* eslint-disable */
|
||||
|
||||
import { _gsScope } from "./TweenLite.js";
|
||||
|
||||
|
||||
var _numExp = /(\d|\.)+/g,
|
||||
_relNumExp = /(?:\d|\-\d|\.\d|\-\.\d|\+=\d|\-=\d|\+=.\d|\-=\.\d)+/g,
|
||||
_colorLookup = {aqua:[0,255,255],
|
||||
lime:[0,255,0],
|
||||
silver:[192,192,192],
|
||||
black:[0,0,0],
|
||||
maroon:[128,0,0],
|
||||
teal:[0,128,128],
|
||||
blue:[0,0,255],
|
||||
navy:[0,0,128],
|
||||
white:[255,255,255],
|
||||
fuchsia:[255,0,255],
|
||||
olive:[128,128,0],
|
||||
yellow:[255,255,0],
|
||||
orange:[255,165,0],
|
||||
gray:[128,128,128],
|
||||
purple:[128,0,128],
|
||||
green:[0,128,0],
|
||||
red:[255,0,0],
|
||||
pink:[255,192,203],
|
||||
cyan:[0,255,255],
|
||||
transparent:[255,255,255,0]},
|
||||
_hue = function(h, m1, m2) {
|
||||
h = (h < 0) ? h + 1 : (h > 1) ? h - 1 : h;
|
||||
return ((((h * 6 < 1) ? m1 + (m2 - m1) * h * 6 : (h < 0.5) ? m2 : (h * 3 < 2) ? m1 + (m2 - m1) * (2 / 3 - h) * 6 : m1) * 255) + 0.5) | 0;
|
||||
},
|
||||
/**
|
||||
* @private Parses a color (like #9F0, #FF9900, rgb(255,51,153) or hsl(108, 50%, 10%)) into an array with 3 elements for red, green, and blue or if toHSL parameter is true, it will populate the array with hue, saturation, and lightness values. If a relative value is found in an hsl() or hsla() string, it will preserve those relative prefixes and all the values in the array will be strings instead of numbers (in all other cases it will be populated with numbers).
|
||||
* @param {(string|number)} v The value the should be parsed which could be a string like #9F0 or rgb(255,102,51) or rgba(255,0,0,0.5) or it could be a number like 0xFF00CC or even a named color like red, blue, purple, etc.
|
||||
* @param {(boolean)} toHSL If true, an hsl() or hsla() value will be returned instead of rgb() or rgba()
|
||||
* @return {Array.<number>} An array containing red, green, and blue (and optionally alpha) in that order, or if the toHSL parameter was true, the array will contain hue, saturation and lightness (and optionally alpha) in that order. Always numbers unless there's a relative prefix found in an hsl() or hsla() string and toHSL is true.
|
||||
*/
|
||||
_parseColor = function(v, toHSL) {
|
||||
var a, r, g, b, h, s, l, max, min, d, wasHSL;
|
||||
if (!v) {
|
||||
a = _colorLookup.black;
|
||||
} else if (typeof(v) === "number") {
|
||||
a = [v >> 16, (v >> 8) & 255, v & 255];
|
||||
} else {
|
||||
if (v.charAt(v.length - 1) === ",") { //sometimes a trailing comma is included and we should chop it off (typically from a comma-delimited list of values like a textShadow:"2px 2px 2px blue, 5px 5px 5px rgb(255,0,0)" - in this example "blue," has a trailing comma. We could strip it out inside parseComplex() but we'd need to do it to the beginning and ending values plus it wouldn't provide protection from other potential scenarios like if the user passes in a similar value.
|
||||
v = v.substr(0, v.length - 1);
|
||||
}
|
||||
if (_colorLookup[v]) {
|
||||
a = _colorLookup[v];
|
||||
} else if (v.charAt(0) === "#") {
|
||||
if (v.length === 4) { //for shorthand like #9F0
|
||||
r = v.charAt(1);
|
||||
g = v.charAt(2);
|
||||
b = v.charAt(3);
|
||||
v = "#" + r + r + g + g + b + b;
|
||||
}
|
||||
v = parseInt(v.substr(1), 16);
|
||||
a = [v >> 16, (v >> 8) & 255, v & 255];
|
||||
} else if (v.substr(0, 3) === "hsl") {
|
||||
a = wasHSL = v.match(_numExp);
|
||||
if (!toHSL) {
|
||||
h = (Number(a[0]) % 360) / 360;
|
||||
s = Number(a[1]) / 100;
|
||||
l = Number(a[2]) / 100;
|
||||
g = (l <= 0.5) ? l * (s + 1) : l + s - l * s;
|
||||
r = l * 2 - g;
|
||||
if (a.length > 3) {
|
||||
a[3] = Number(a[3]);
|
||||
}
|
||||
a[0] = _hue(h + 1 / 3, r, g);
|
||||
a[1] = _hue(h, r, g);
|
||||
a[2] = _hue(h - 1 / 3, r, g);
|
||||
} else if (v.indexOf("=") !== -1) { //if relative values are found, just return the raw strings with the relative prefixes in place.
|
||||
return v.match(_relNumExp);
|
||||
}
|
||||
} else {
|
||||
a = v.match(_numExp) || _colorLookup.transparent;
|
||||
}
|
||||
a[0] = Number(a[0]);
|
||||
a[1] = Number(a[1]);
|
||||
a[2] = Number(a[2]);
|
||||
if (a.length > 3) {
|
||||
a[3] = Number(a[3]);
|
||||
}
|
||||
}
|
||||
if (toHSL && !wasHSL) {
|
||||
r = a[0] / 255;
|
||||
g = a[1] / 255;
|
||||
b = a[2] / 255;
|
||||
max = Math.max(r, g, b);
|
||||
min = Math.min(r, g, b);
|
||||
l = (max + min) / 2;
|
||||
if (max === min) {
|
||||
h = s = 0;
|
||||
} else {
|
||||
d = max - min;
|
||||
s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
|
||||
h = (max === r) ? (g - b) / d + (g < b ? 6 : 0) : (max === g) ? (b - r) / d + 2 : (r - g) / d + 4;
|
||||
h *= 60;
|
||||
}
|
||||
a[0] = (h + 0.5) | 0;
|
||||
a[1] = (s * 100 + 0.5) | 0;
|
||||
a[2] = (l * 100 + 0.5) | 0;
|
||||
}
|
||||
return a;
|
||||
},
|
||||
_formatColors = function(s, toHSL) {
|
||||
var colors = (s + "").match(_colorExp) || [],
|
||||
charIndex = 0,
|
||||
parsed = "",
|
||||
i, color, temp;
|
||||
if (!colors.length) {
|
||||
return s;
|
||||
}
|
||||
for (i = 0; i < colors.length; i++) {
|
||||
color = colors[i];
|
||||
temp = s.substr(charIndex, s.indexOf(color, charIndex)-charIndex);
|
||||
charIndex += temp.length + color.length;
|
||||
color = _parseColor(color, toHSL);
|
||||
if (color.length === 3) {
|
||||
color.push(1);
|
||||
}
|
||||
parsed += temp + (toHSL ? "hsla(" + color[0] + "," + color[1] + "%," + color[2] + "%," + color[3] : "rgba(" + color.join(",")) + ")";
|
||||
}
|
||||
return parsed + s.substr(charIndex);
|
||||
}, p, _colorStringFilter,
|
||||
TweenLite = (_gsScope.GreenSockGlobals || _gsScope).TweenLite,
|
||||
_colorExp = "(?:\\b(?:(?:rgb|rgba|hsl|hsla)\\(.+?\\))|\\B#(?:[0-9a-f]{3}){1,2}\\b", //we'll dynamically build this Regular Expression to conserve file size. After building it, it will be able to find rgb(), rgba(), # (hexadecimal), and named color values like red, blue, purple, etc.
|
||||
|
||||
ColorPropsPlugin = _gsScope._gsDefine.plugin({
|
||||
propName: "colorProps",
|
||||
version: "1.5.3",
|
||||
priority: -1,
|
||||
API: 2,
|
||||
global: true,
|
||||
|
||||
//called when the tween renders for the first time. This is where initial values should be recorded and any setup routines should run.
|
||||
init: function(target, value, tween, index) {
|
||||
var p, proxy, pt, val;
|
||||
this._target = target;
|
||||
this._proxy = proxy = ((value.format + "").toUpperCase() === "NUMBER") ? {} : 0;
|
||||
for (p in value) {
|
||||
if (p !== "format") {
|
||||
if (proxy) {
|
||||
this._firstNumPT = pt = {_next:this._firstNumPT, t:target, p:p, f:(typeof(target[p]) === "function")};
|
||||
proxy[p] = "rgb(" + _parseColor(!pt.f ? target[p] : target[ ((p.indexOf("set") || typeof(target["get" + p.substr(3)]) !== "function") ? p : "get" + p.substr(3)) ]()).join(",") + ")";
|
||||
val = value[p];
|
||||
if (typeof(val) === "function") {
|
||||
val = val(index, target);
|
||||
}
|
||||
this._addTween(proxy, p, "get", ((typeof(val) === "number") ? "rgb(" + _parseColor(val, false).join(",") + ")" : val), p, null, null, _colorStringFilter);
|
||||
} else {
|
||||
this._addTween(target, p, "get", value[p], p, null, null, _colorStringFilter, index);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
return true;
|
||||
},
|
||||
|
||||
//called each time the values should be updated, and the ratio gets passed as the only parameter (typically it's a value between 0 and 1, but it can exceed those when using an ease like Elastic.easeOut or Back.easeOut, etc.)
|
||||
set: function(v) {
|
||||
var pt = this._firstNumPT,
|
||||
val;
|
||||
this._super.setRatio.call(this, v);
|
||||
while (pt) {
|
||||
val = _parseColor(this._proxy[pt.p], false);
|
||||
val = val[0] << 16 | val[1] << 8 | val[2];
|
||||
if (pt.f) {
|
||||
this._target[pt.p](val);
|
||||
} else {
|
||||
this._target[pt.p] = val;
|
||||
}
|
||||
pt = pt._next;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
for (p in _colorLookup) {
|
||||
_colorExp += "|" + p + "\\b";
|
||||
}
|
||||
_colorExp = new RegExp(_colorExp+")", "gi");
|
||||
ColorPropsPlugin.colorStringFilter = _colorStringFilter = function(a) {
|
||||
var combined = a[0] + " " + a[1],
|
||||
toHSL;
|
||||
_colorExp.lastIndex = 0;
|
||||
if (_colorExp.test(combined)) {
|
||||
toHSL = (combined.indexOf("hsl(") !== -1 || combined.indexOf("hsla(") !== -1);
|
||||
a[0] = _formatColors(a[0], toHSL);
|
||||
a[1] = _formatColors(a[1], toHSL);
|
||||
}
|
||||
};
|
||||
|
||||
if (!TweenLite.defaultStringFilter) {
|
||||
TweenLite.defaultStringFilter = ColorPropsPlugin.colorStringFilter;
|
||||
}
|
||||
|
||||
ColorPropsPlugin.parseColor = _parseColor;
|
||||
p = ColorPropsPlugin.prototype;
|
||||
p._firstNumPT = null;
|
||||
p._kill = function(lookup) {
|
||||
var pt = this._firstNumPT,
|
||||
prev;
|
||||
while (pt) {
|
||||
if (pt.p in lookup) {
|
||||
if (pt === p._firstNumPT) {
|
||||
this._firstNumPT = pt._next;
|
||||
}
|
||||
if (prev) {
|
||||
prev._next = pt._next;
|
||||
}
|
||||
} else {
|
||||
prev = pt;
|
||||
}
|
||||
pt = pt._next;
|
||||
}
|
||||
return this._super._kill(lookup);
|
||||
};
|
||||
|
||||
|
||||
export { ColorPropsPlugin, ColorPropsPlugin as default };
|
||||
@@ -0,0 +1,86 @@
|
||||
/*!
|
||||
* VERSION: 0.3.1
|
||||
* DATE: 2018-08-27
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
**/
|
||||
/* eslint-disable */
|
||||
|
||||
import { _gsScope } from "./TweenLite.js";
|
||||
|
||||
export var DirectionalRotationPlugin = _gsScope._gsDefine.plugin({
|
||||
propName: "directionalRotation",
|
||||
version: "0.3.1",
|
||||
API: 2,
|
||||
|
||||
//called when the tween renders for the first time. This is where initial values should be recorded and any setup routines should run.
|
||||
init: function(target, value, tween, index) {
|
||||
if (typeof(value) !== "object") {
|
||||
value = {rotation:value};
|
||||
}
|
||||
this.finals = {};
|
||||
var cap = (value.useRadians === true) ? Math.PI * 2 : 360,
|
||||
min = 0.000001,
|
||||
p, v, start, end, dif, split;
|
||||
for (p in value) {
|
||||
if (p !== "useRadians") {
|
||||
end = value[p];
|
||||
if (typeof(end) === "function") {
|
||||
end = end(index, target);
|
||||
}
|
||||
split = (end + "").split("_");
|
||||
v = split[0];
|
||||
start = parseFloat( (typeof(target[p]) !== "function") ? target[p] : target[ ((p.indexOf("set") || typeof(target["get" + p.substr(3)]) !== "function") ? p : "get" + p.substr(3)) ]() );
|
||||
end = this.finals[p] = (typeof(v) === "string" && v.charAt(1) === "=") ? start + parseInt(v.charAt(0) + "1", 10) * Number(v.substr(2)) : Number(v) || 0;
|
||||
dif = end - start;
|
||||
if (split.length) {
|
||||
v = split.join("_");
|
||||
if (v.indexOf("short") !== -1) {
|
||||
dif = dif % cap;
|
||||
if (dif !== dif % (cap / 2)) {
|
||||
dif = (dif < 0) ? dif + cap : dif - cap;
|
||||
}
|
||||
}
|
||||
if (v.indexOf("_cw") !== -1 && dif < 0) {
|
||||
dif = ((dif + cap * 9999999999) % cap) - ((dif / cap) | 0) * cap;
|
||||
} else if (v.indexOf("ccw") !== -1 && dif > 0) {
|
||||
dif = ((dif - cap * 9999999999) % cap) - ((dif / cap) | 0) * cap;
|
||||
}
|
||||
}
|
||||
if (dif > min || dif < -min) {
|
||||
this._addTween(target, p, start, start + dif, p);
|
||||
this._overwriteProps.push(p);
|
||||
}
|
||||
}
|
||||
}
|
||||
return true;
|
||||
},
|
||||
|
||||
//called each time the values should be updated, and the ratio gets passed as the only parameter (typically it's a value between 0 and 1, but it can exceed those when using an ease like Elastic.easeOut or Back.easeOut, etc.)
|
||||
set: function(ratio) {
|
||||
var pt;
|
||||
if (ratio !== 1) {
|
||||
this._super.setRatio.call(this, ratio);
|
||||
} else {
|
||||
pt = this._firstPT;
|
||||
while (pt) {
|
||||
if (pt.f) {
|
||||
pt.t[pt.p](this.finals[pt.p]);
|
||||
} else {
|
||||
pt.t[pt.p] = this.finals[pt.p];
|
||||
}
|
||||
pt = pt._next;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
DirectionalRotationPlugin._autoCSS = true;
|
||||
|
||||
export { DirectionalRotationPlugin as default };
|
||||
+2502
File diff suppressed because it is too large
Load Diff
+375
@@ -0,0 +1,375 @@
|
||||
/*!
|
||||
* VERSION: 1.16.1
|
||||
* DATE: 2018-08-27
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
**/
|
||||
/* eslint-disable */
|
||||
|
||||
import { _gsScope, globals, Ease, Linear, Power0, Power1, Power2, Power3, Power4 } from "./TweenLite.js";
|
||||
|
||||
_gsScope._gsDefine("easing.Back", ["easing.Ease"], function() {
|
||||
|
||||
var w = (_gsScope.GreenSockGlobals || _gsScope),
|
||||
gs = w.com.greensock,
|
||||
_2PI = Math.PI * 2,
|
||||
_HALF_PI = Math.PI / 2,
|
||||
_class = gs._class,
|
||||
_create = function(n, f) {
|
||||
var C = _class("easing." + n, function(){}, true),
|
||||
p = C.prototype = new Ease();
|
||||
p.constructor = C;
|
||||
p.getRatio = f;
|
||||
return C;
|
||||
},
|
||||
_easeReg = Ease.register || function(){}, //put an empty function in place just as a safety measure in case someone loads an OLD version of TweenLite.js where Ease.register doesn't exist.
|
||||
_wrap = function(name, EaseOut, EaseIn, EaseInOut, aliases) {
|
||||
var C = _class("easing."+name, {
|
||||
easeOut:new EaseOut(),
|
||||
easeIn:new EaseIn(),
|
||||
easeInOut:new EaseInOut()
|
||||
}, true);
|
||||
_easeReg(C, name);
|
||||
return C;
|
||||
},
|
||||
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;
|
||||
}
|
||||
},
|
||||
|
||||
//Back
|
||||
_createBack = function(n, f) {
|
||||
var C = _class("easing." + n, function(overshoot) {
|
||||
this._p1 = (overshoot || overshoot === 0) ? overshoot : 1.70158;
|
||||
this._p2 = this._p1 * 1.525;
|
||||
}, true),
|
||||
p = C.prototype = new Ease();
|
||||
p.constructor = C;
|
||||
p.getRatio = f;
|
||||
p.config = function(overshoot) {
|
||||
return new C(overshoot);
|
||||
};
|
||||
return C;
|
||||
},
|
||||
|
||||
Back = _wrap("Back",
|
||||
_createBack("BackOut", function(p) {
|
||||
return ((p = p - 1) * p * ((this._p1 + 1) * p + this._p1) + 1);
|
||||
}),
|
||||
_createBack("BackIn", function(p) {
|
||||
return p * p * ((this._p1 + 1) * p - this._p1);
|
||||
}),
|
||||
_createBack("BackInOut", function(p) {
|
||||
return ((p *= 2) < 1) ? 0.5 * p * p * ((this._p2 + 1) * p - this._p2) : 0.5 * ((p -= 2) * p * ((this._p2 + 1) * p + this._p2) + 2);
|
||||
})
|
||||
),
|
||||
|
||||
|
||||
//SlowMo
|
||||
SlowMo = _class("easing.SlowMo", function(linearRatio, power, yoyoMode) {
|
||||
power = (power || power === 0) ? power : 0.7;
|
||||
if (linearRatio == null) {
|
||||
linearRatio = 0.7;
|
||||
} else if (linearRatio > 1) {
|
||||
linearRatio = 1;
|
||||
}
|
||||
this._p = (linearRatio !== 1) ? power : 0;
|
||||
this._p1 = (1 - linearRatio) / 2;
|
||||
this._p2 = linearRatio;
|
||||
this._p3 = this._p1 + this._p2;
|
||||
this._calcEnd = (yoyoMode === true);
|
||||
}, true),
|
||||
p = SlowMo.prototype = new Ease(),
|
||||
SteppedEase, ExpoScaleEase, RoughEase, _createElastic;
|
||||
|
||||
p.constructor = SlowMo;
|
||||
p.getRatio = function(p) {
|
||||
var r = p + (0.5 - p) * this._p;
|
||||
if (p < this._p1) {
|
||||
return this._calcEnd ? 1 - ((p = 1 - (p / this._p1)) * p) : r - ((p = 1 - (p / this._p1)) * p * p * p * r);
|
||||
} else if (p > this._p3) {
|
||||
return this._calcEnd ? (p === 1 ? 0 : 1 - (p = (p - this._p3) / this._p1) * p) : r + ((p - r) * (p = (p - this._p3) / this._p1) * p * p * p); //added p === 1 ? 0 to avoid floating point rounding errors from affecting the final value, like 1 - 0.7 = 0.30000000000000004 instead of 0.3
|
||||
}
|
||||
return this._calcEnd ? 1 : r;
|
||||
};
|
||||
SlowMo.ease = new SlowMo(0.7, 0.7);
|
||||
|
||||
p.config = SlowMo.config = function(linearRatio, power, yoyoMode) {
|
||||
return new SlowMo(linearRatio, power, yoyoMode);
|
||||
};
|
||||
|
||||
|
||||
//SteppedEase
|
||||
SteppedEase = _class("easing.SteppedEase", function(steps, immediateStart) {
|
||||
steps = steps || 1;
|
||||
this._p1 = 1 / steps;
|
||||
this._p2 = steps + (immediateStart ? 0 : 1);
|
||||
this._p3 = immediateStart ? 1 : 0;
|
||||
}, true);
|
||||
p = SteppedEase.prototype = new Ease();
|
||||
p.constructor = SteppedEase;
|
||||
p.getRatio = function(p) {
|
||||
if (p < 0) {
|
||||
p = 0;
|
||||
} else if (p >= 1) {
|
||||
p = 0.999999999;
|
||||
}
|
||||
return (((this._p2 * p) | 0) + this._p3) * this._p1;
|
||||
};
|
||||
p.config = SteppedEase.config = function(steps, immediateStart) {
|
||||
return new SteppedEase(steps, immediateStart);
|
||||
};
|
||||
|
||||
|
||||
//ExpoScaleEase
|
||||
ExpoScaleEase = _class("easing.ExpoScaleEase", function(start, end, ease) {
|
||||
this._p1 = Math.log(end / start);
|
||||
this._p2 = end - start;
|
||||
this._p3 = start;
|
||||
this._ease = ease;
|
||||
}, true);
|
||||
p = ExpoScaleEase.prototype = new Ease();
|
||||
p.constructor = ExpoScaleEase;
|
||||
p.getRatio = function(p) {
|
||||
if (this._ease) {
|
||||
p = this._ease.getRatio(p);
|
||||
}
|
||||
return (this._p3 * Math.exp(this._p1 * p) - this._p3) / this._p2;
|
||||
};
|
||||
p.config = ExpoScaleEase.config = function(start, end, ease) {
|
||||
return new ExpoScaleEase(start, end, ease);
|
||||
};
|
||||
|
||||
|
||||
//RoughEase
|
||||
RoughEase = _class("easing.RoughEase", function(vars) {
|
||||
vars = vars || {};
|
||||
var taper = vars.taper || "none",
|
||||
a = [],
|
||||
cnt = 0,
|
||||
points = (vars.points || 20) | 0,
|
||||
i = points,
|
||||
randomize = (vars.randomize !== false),
|
||||
clamp = (vars.clamp === true),
|
||||
template = (vars.template instanceof Ease) ? vars.template : null,
|
||||
strength = (typeof(vars.strength) === "number") ? vars.strength * 0.4 : 0.4,
|
||||
x, y, bump, invX, obj, pnt;
|
||||
while (--i > -1) {
|
||||
x = randomize ? Math.random() : (1 / points) * i;
|
||||
y = template ? template.getRatio(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 > -1) {
|
||||
obj = a[i];
|
||||
pnt = new EasePoint(obj.x, obj.y, pnt);
|
||||
}
|
||||
|
||||
this._prev = new EasePoint(0, 0, (pnt.t !== 0) ? pnt : pnt.next);
|
||||
}, true);
|
||||
p = RoughEase.prototype = new Ease();
|
||||
p.constructor = RoughEase;
|
||||
p.getRatio = function(p) {
|
||||
var pnt = this._prev;
|
||||
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;
|
||||
}
|
||||
}
|
||||
this._prev = pnt;
|
||||
return (pnt.v + ((p - pnt.t) / pnt.gap) * pnt.c);
|
||||
};
|
||||
p.config = function(vars) {
|
||||
return new RoughEase(vars);
|
||||
};
|
||||
RoughEase.ease = new RoughEase();
|
||||
|
||||
|
||||
//Bounce
|
||||
_wrap("Bounce",
|
||||
_create("BounceOut", function(p) {
|
||||
if (p < 1 / 2.75) {
|
||||
return 7.5625 * p * p;
|
||||
} else if (p < 2 / 2.75) {
|
||||
return 7.5625 * (p -= 1.5 / 2.75) * p + 0.75;
|
||||
} else if (p < 2.5 / 2.75) {
|
||||
return 7.5625 * (p -= 2.25 / 2.75) * p + 0.9375;
|
||||
}
|
||||
return 7.5625 * (p -= 2.625 / 2.75) * p + 0.984375;
|
||||
}),
|
||||
_create("BounceIn", function(p) {
|
||||
if ((p = 1 - p) < 1 / 2.75) {
|
||||
return 1 - (7.5625 * p * p);
|
||||
} else if (p < 2 / 2.75) {
|
||||
return 1 - (7.5625 * (p -= 1.5 / 2.75) * p + 0.75);
|
||||
} else if (p < 2.5 / 2.75) {
|
||||
return 1 - (7.5625 * (p -= 2.25 / 2.75) * p + 0.9375);
|
||||
}
|
||||
return 1 - (7.5625 * (p -= 2.625 / 2.75) * p + 0.984375);
|
||||
}),
|
||||
_create("BounceInOut", function(p) {
|
||||
var invert = (p < 0.5);
|
||||
if (invert) {
|
||||
p = 1 - (p * 2);
|
||||
} else {
|
||||
p = (p * 2) - 1;
|
||||
}
|
||||
if (p < 1 / 2.75) {
|
||||
p = 7.5625 * p * p;
|
||||
} else if (p < 2 / 2.75) {
|
||||
p = 7.5625 * (p -= 1.5 / 2.75) * p + 0.75;
|
||||
} else if (p < 2.5 / 2.75) {
|
||||
p = 7.5625 * (p -= 2.25 / 2.75) * p + 0.9375;
|
||||
} else {
|
||||
p = 7.5625 * (p -= 2.625 / 2.75) * p + 0.984375;
|
||||
}
|
||||
return invert ? (1 - p) * 0.5 : p * 0.5 + 0.5;
|
||||
})
|
||||
);
|
||||
|
||||
|
||||
//CIRC
|
||||
_wrap("Circ",
|
||||
_create("CircOut", function(p) {
|
||||
return Math.sqrt(1 - (p = p - 1) * p);
|
||||
}),
|
||||
_create("CircIn", function(p) {
|
||||
return -(Math.sqrt(1 - (p * p)) - 1);
|
||||
}),
|
||||
_create("CircInOut", function(p) {
|
||||
return ((p*=2) < 1) ? -0.5 * (Math.sqrt(1 - p * p) - 1) : 0.5 * (Math.sqrt(1 - (p -= 2) * p) + 1);
|
||||
})
|
||||
);
|
||||
|
||||
|
||||
//Elastic
|
||||
_createElastic = function(n, f, def) {
|
||||
var C = _class("easing." + n, function(amplitude, period) {
|
||||
this._p1 = (amplitude >= 1) ? amplitude : 1; //note: if amplitude is < 1, we simply adjust the period for a more natural feel. Otherwise the math doesn't work right and the curve starts at 1.
|
||||
this._p2 = (period || def) / (amplitude < 1 ? amplitude : 1);
|
||||
this._p3 = this._p2 / _2PI * (Math.asin(1 / this._p1) || 0);
|
||||
this._p2 = _2PI / this._p2; //precalculate to optimize
|
||||
}, true),
|
||||
p = C.prototype = new Ease();
|
||||
p.constructor = C;
|
||||
p.getRatio = f;
|
||||
p.config = function(amplitude, period) {
|
||||
return new C(amplitude, period);
|
||||
};
|
||||
return C;
|
||||
};
|
||||
_wrap("Elastic",
|
||||
_createElastic("ElasticOut", function(p) {
|
||||
return this._p1 * Math.pow(2, -10 * p) * Math.sin( (p - this._p3) * this._p2 ) + 1;
|
||||
}, 0.3),
|
||||
_createElastic("ElasticIn", function(p) {
|
||||
return -(this._p1 * Math.pow(2, 10 * (p -= 1)) * Math.sin( (p - this._p3) * this._p2 ));
|
||||
}, 0.3),
|
||||
_createElastic("ElasticInOut", function(p) {
|
||||
return ((p *= 2) < 1) ? -0.5 * (this._p1 * Math.pow(2, 10 * (p -= 1)) * Math.sin( (p - this._p3) * this._p2)) : this._p1 * Math.pow(2, -10 *(p -= 1)) * Math.sin( (p - this._p3) * this._p2 ) * 0.5 + 1;
|
||||
}, 0.45)
|
||||
);
|
||||
|
||||
|
||||
//Expo
|
||||
_wrap("Expo",
|
||||
_create("ExpoOut", function(p) {
|
||||
return 1 - Math.pow(2, -10 * p);
|
||||
}),
|
||||
_create("ExpoIn", function(p) {
|
||||
return Math.pow(2, 10 * (p - 1)) - 0.001;
|
||||
}),
|
||||
_create("ExpoInOut", function(p) {
|
||||
return ((p *= 2) < 1) ? 0.5 * Math.pow(2, 10 * (p - 1)) : 0.5 * (2 - Math.pow(2, -10 * (p - 1)));
|
||||
})
|
||||
);
|
||||
|
||||
|
||||
//Sine
|
||||
_wrap("Sine",
|
||||
_create("SineOut", function(p) {
|
||||
return Math.sin(p * _HALF_PI);
|
||||
}),
|
||||
_create("SineIn", function(p) {
|
||||
return -Math.cos(p * _HALF_PI) + 1;
|
||||
}),
|
||||
_create("SineInOut", function(p) {
|
||||
return -0.5 * (Math.cos(Math.PI * p) - 1);
|
||||
})
|
||||
);
|
||||
|
||||
_class("easing.EaseLookup", {
|
||||
find:function(s) {
|
||||
return Ease.map[s];
|
||||
}
|
||||
}, true);
|
||||
|
||||
//register the non-standard eases
|
||||
_easeReg(w.SlowMo, "SlowMo", "ease,");
|
||||
_easeReg(RoughEase, "RoughEase", "ease,");
|
||||
_easeReg(SteppedEase, "SteppedEase", "ease,");
|
||||
|
||||
return Back;
|
||||
|
||||
}, true);
|
||||
|
||||
export var Back = globals.Back;
|
||||
export var Elastic = globals.Elastic;
|
||||
export var Bounce = globals.Bounce;
|
||||
export var RoughEase = globals.RoughEase;
|
||||
export var SlowMo = globals.SlowMo;
|
||||
export var SteppedEase = globals.SteppedEase;
|
||||
export var Circ = globals.Circ;
|
||||
export var Expo = globals.Expo;
|
||||
export var Sine = globals.Sine;
|
||||
export var ExpoScaleEase = globals.ExpoScaleEase;
|
||||
export { Linear, Power0, Power1, Power2, Power3, Power4 };
|
||||
+312
@@ -0,0 +1,312 @@
|
||||
/*!
|
||||
* VERSION: 0.2.2
|
||||
* DATE: 2018-05-30
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
**/
|
||||
/* eslint-disable */
|
||||
|
||||
import { _gsScope } from "./TweenLite.js";
|
||||
|
||||
|
||||
var _numExp = /(\d|\.)+/g,
|
||||
_ColorFilter, _ColorMatrixFilter,
|
||||
_colorProps = ["redMultiplier","greenMultiplier","blueMultiplier","alphaMultiplier","redOffset","greenOffset","blueOffset","alphaOffset"],
|
||||
_colorLookup = {aqua:[0,255,255],
|
||||
lime:[0,255,0],
|
||||
silver:[192,192,192],
|
||||
black:[0,0,0],
|
||||
maroon:[128,0,0],
|
||||
teal:[0,128,128],
|
||||
blue:[0,0,255],
|
||||
navy:[0,0,128],
|
||||
white:[255,255,255],
|
||||
fuchsia:[255,0,255],
|
||||
olive:[128,128,0],
|
||||
yellow:[255,255,0],
|
||||
orange:[255,165,0],
|
||||
gray:[128,128,128],
|
||||
purple:[128,0,128],
|
||||
green:[0,128,0],
|
||||
red:[255,0,0],
|
||||
pink:[255,192,203],
|
||||
cyan:[0,255,255],
|
||||
transparent:[255,255,255,0]},
|
||||
_parseColor = function(color) {
|
||||
if (color === "" || color == null || color === "none") {
|
||||
return _colorLookup.transparent;
|
||||
} else if (_colorLookup[color]) {
|
||||
return _colorLookup[color];
|
||||
} else if (typeof(color) === "number") {
|
||||
return [color >> 16, (color >> 8) & 255, color & 255];
|
||||
} else if (color.charAt(0) === "#") {
|
||||
if (color.length === 4) { //for shorthand like #9F0
|
||||
color = "#" + color.charAt(1) + color.charAt(1) + color.charAt(2) + color.charAt(2) + color.charAt(3) + color.charAt(3);
|
||||
}
|
||||
color = parseInt(color.substr(1), 16);
|
||||
return [color >> 16, (color >> 8) & 255, color & 255];
|
||||
}
|
||||
return color.match(_numExp) || _colorLookup.transparent;
|
||||
},
|
||||
_parseColorFilter = function(t, v, pg) {
|
||||
if (!_ColorFilter) {
|
||||
_ColorFilter = (_gsScope.ColorFilter || _gsScope.createjs.ColorFilter);
|
||||
if (!_ColorFilter) {
|
||||
throw("EaselPlugin error: The EaselJS ColorFilter JavaScript file wasn't loaded.");
|
||||
}
|
||||
}
|
||||
var filters = t.filters || [],
|
||||
i = filters.length,
|
||||
c, s, e, a, p;
|
||||
while (--i > -1) {
|
||||
if (filters[i] instanceof _ColorFilter) {
|
||||
s = filters[i];
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (!s) {
|
||||
s = new _ColorFilter();
|
||||
filters.push(s);
|
||||
t.filters = filters;
|
||||
}
|
||||
e = s.clone();
|
||||
if (v.tint != null) {
|
||||
c = _parseColor(v.tint);
|
||||
a = (v.tintAmount != null) ? Number(v.tintAmount) : 1;
|
||||
e.redOffset = Number(c[0]) * a;
|
||||
e.greenOffset = Number(c[1]) * a;
|
||||
e.blueOffset = Number(c[2]) * a;
|
||||
e.redMultiplier = e.greenMultiplier = e.blueMultiplier = 1 - a;
|
||||
} else {
|
||||
for (p in v) {
|
||||
if (p !== "exposure") if (p !== "brightness") {
|
||||
e[p] = Number(v[p]);
|
||||
}
|
||||
}
|
||||
}
|
||||
if (v.exposure != null) {
|
||||
e.redOffset = e.greenOffset = e.blueOffset = 255 * (Number(v.exposure) - 1);
|
||||
e.redMultiplier = e.greenMultiplier = e.blueMultiplier = 1;
|
||||
} else if (v.brightness != null) {
|
||||
a = Number(v.brightness) - 1;
|
||||
e.redOffset = e.greenOffset = e.blueOffset = (a > 0) ? a * 255 : 0;
|
||||
e.redMultiplier = e.greenMultiplier = e.blueMultiplier = 1 - Math.abs(a);
|
||||
}
|
||||
i = 8;
|
||||
while (--i > -1) {
|
||||
p = _colorProps[i];
|
||||
if (s[p] !== e[p]) {
|
||||
pg._addTween(s, p, s[p], e[p], "easel_colorFilter");
|
||||
}
|
||||
}
|
||||
pg._overwriteProps.push("easel_colorFilter");
|
||||
if (!t.cacheID) {
|
||||
throw("EaselPlugin warning: for filters to display in EaselJS, you must call the object's cache() method first. " + t);
|
||||
}
|
||||
},
|
||||
|
||||
_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(m, m2) {
|
||||
if (!(m instanceof Array) || !(m2 instanceof Array)) {
|
||||
return m2;
|
||||
}
|
||||
var 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 = function(m, n) {
|
||||
if (isNaN(n)) {
|
||||
return m;
|
||||
}
|
||||
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(m, color, amount) {
|
||||
if (isNaN(amount)) {
|
||||
amount = 1;
|
||||
}
|
||||
var c = _parseColor(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 = function(m, n) {
|
||||
if (isNaN(n)) {
|
||||
return m;
|
||||
}
|
||||
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(m, n) {
|
||||
if (isNaN(n)) {
|
||||
return m;
|
||||
}
|
||||
n += 0.01;
|
||||
return _applyMatrix([n,0,0,0,128 * (1 - n), 0,n,0,0,128 * (1 - n), 0,0,n,0,128 * (1 - n), 0,0,0,1,0], m);
|
||||
},
|
||||
|
||||
_parseColorMatrixFilter = function(t, v, pg) {
|
||||
if (!_ColorMatrixFilter) {
|
||||
_ColorMatrixFilter = (_gsScope.ColorMatrixFilter || _gsScope.createjs.ColorMatrixFilter);
|
||||
if (!_ColorMatrixFilter) {
|
||||
throw("EaselPlugin error: The EaselJS ColorMatrixFilter JavaScript file wasn't loaded.");
|
||||
}
|
||||
}
|
||||
var filters = t.filters || [],
|
||||
i = filters.length,
|
||||
matrix, startMatrix, s;
|
||||
while (--i > -1) {
|
||||
if (filters[i] instanceof _ColorMatrixFilter) {
|
||||
s = filters[i];
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (!s) {
|
||||
s = new _ColorMatrixFilter(_idMatrix.slice());
|
||||
filters.push(s);
|
||||
t.filters = filters;
|
||||
}
|
||||
startMatrix = s.matrix;
|
||||
matrix = _idMatrix.slice();
|
||||
if (v.colorize != null) {
|
||||
matrix = _colorize(matrix, v.colorize, Number(v.colorizeAmount));
|
||||
}
|
||||
if (v.contrast != null) {
|
||||
matrix = _setContrast(matrix, Number(v.contrast));
|
||||
}
|
||||
if (v.hue != null) {
|
||||
matrix = _setHue(matrix, Number(v.hue));
|
||||
}
|
||||
if (v.saturation != null) {
|
||||
matrix = _setSaturation(matrix, Number(v.saturation));
|
||||
}
|
||||
|
||||
i = matrix.length;
|
||||
while (--i > -1) {
|
||||
if (matrix[i] !== startMatrix[i]) {
|
||||
pg._addTween(startMatrix, i, startMatrix[i], matrix[i], "easel_colorMatrixFilter");
|
||||
}
|
||||
}
|
||||
|
||||
pg._overwriteProps.push("easel_colorMatrixFilter");
|
||||
if (!t.cacheID) {
|
||||
throw("EaselPlugin warning: for filters to display in EaselJS, you must call the object's cache() method first. " + t);
|
||||
}
|
||||
|
||||
pg._matrix = startMatrix;
|
||||
};
|
||||
|
||||
|
||||
var EaselPlugin = _gsScope._gsDefine.plugin({
|
||||
propName: "easel",
|
||||
priority: -1,
|
||||
version: "0.2.2",
|
||||
API: 2,
|
||||
|
||||
//called when the tween renders for the first time. This is where initial values should be recorded and any setup routines should run.
|
||||
init: function(target, value, tween, index) {
|
||||
this._target = target;
|
||||
var p, pt, tint, colorMatrix, end, labels, i;
|
||||
for (p in value) {
|
||||
|
||||
end = value[p];
|
||||
if (typeof(end) === "function") {
|
||||
end = end(index, target);
|
||||
}
|
||||
if (p === "colorFilter" || p === "tint" || p === "tintAmount" || p === "exposure" || p === "brightness") {
|
||||
if (!tint) {
|
||||
_parseColorFilter(target, value.colorFilter || value, this);
|
||||
tint = true;
|
||||
}
|
||||
|
||||
} else if (p === "saturation" || p === "contrast" || p === "hue" || p === "colorize" || p === "colorizeAmount") {
|
||||
if (!colorMatrix) {
|
||||
_parseColorMatrixFilter(target, value.colorMatrixFilter || value, this);
|
||||
colorMatrix = true;
|
||||
}
|
||||
|
||||
} else if (p === "frame") {
|
||||
this._firstPT = pt = {_next:this._firstPT, t:target, p:"gotoAndStop", s:target.currentFrame, f:true, n:"frame", pr:0, type:0, m:Math.round};
|
||||
if (typeof(end) === "string" && end.charAt(1) !== "=" && (labels = target.labels)) {
|
||||
for (i = 0; i < labels.length; i++) {
|
||||
if (labels[i].label === end) {
|
||||
end = labels[i].position;
|
||||
}
|
||||
}
|
||||
}
|
||||
pt.c = (typeof(end) === "number") ? end - pt.s : parseFloat((end+"").split("=").join(""));
|
||||
if (pt._next) {
|
||||
pt._next._prev = pt;
|
||||
}
|
||||
|
||||
} else if (target[p] != null) {
|
||||
this._firstPT = pt = {_next:this._firstPT, t:target, p:p, f:(typeof(target[p]) === "function"), n:p, pr:0, type:0};
|
||||
pt.s = (!pt.f) ? parseFloat(target[p]) : target[ ((p.indexOf("set") || typeof(target["get" + p.substr(3)]) !== "function") ? p : "get" + p.substr(3)) ]();
|
||||
pt.c = (typeof(end) === "number") ? end - pt.s : (typeof(end) === "string") ? parseFloat(end.split("=").join("")) : 0;
|
||||
|
||||
if (pt._next) {
|
||||
pt._next._prev = pt;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
return true;
|
||||
},
|
||||
|
||||
//called each time the values should be updated, and the ratio gets passed as the only parameter (typically it's a value between 0 and 1, but it can exceed those when using an ease like Elastic.easeOut or Back.easeOut, etc.)
|
||||
set: function(v) {
|
||||
var pt = this._firstPT,
|
||||
min = 0.000001,
|
||||
val;
|
||||
while (pt) {
|
||||
val = pt.c * v + pt.s;
|
||||
if (pt.m) {
|
||||
val = pt.m(val, pt.t);
|
||||
} else if (val < min && val > -min) {
|
||||
val = 0;
|
||||
}
|
||||
if (pt.f) {
|
||||
pt.t[pt.p](val);
|
||||
} else {
|
||||
pt.t[pt.p] = val;
|
||||
}
|
||||
pt = pt._next;
|
||||
}
|
||||
if (this._target.cacheID) {
|
||||
this._target.updateCache();
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
export { EaselPlugin, EaselPlugin as default };
|
||||
+70
@@ -0,0 +1,70 @@
|
||||
/*!
|
||||
* VERSION: 0.1.3
|
||||
* DATE: 2018-08-27
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
*/
|
||||
/* eslint-disable */
|
||||
|
||||
import { _gsScope } from "./TweenLite.js";
|
||||
|
||||
export var EndArrayPlugin = _gsScope._gsDefine.plugin({
|
||||
propName: "endArray",
|
||||
API: 2,
|
||||
version: "0.1.3",
|
||||
|
||||
//called when the tween renders for the first time. This is where initial values should be recorded and any setup routines should run.
|
||||
init: function(target, value, tween) {
|
||||
var i = value.length,
|
||||
a = this.a = [],
|
||||
start, end;
|
||||
this.target = target;
|
||||
this._mod = 0;
|
||||
if (!i) {
|
||||
return false;
|
||||
}
|
||||
while (--i > -1) {
|
||||
start = target[i];
|
||||
end = value[i];
|
||||
if (start !== end) {
|
||||
a.push({i:i, s:start, c:end - start});
|
||||
}
|
||||
}
|
||||
return true;
|
||||
},
|
||||
|
||||
mod: function(lookup) {
|
||||
if (typeof(lookup.endArray) === "function") {
|
||||
this._mod = lookup.endArray;
|
||||
}
|
||||
},
|
||||
|
||||
//called each time the values should be updated, and the ratio gets passed as the only parameter (typically it's a value between 0 and 1, but it can exceed those when using an ease like Elastic.easeOut or Back.easeOut, etc.)
|
||||
set: function(ratio) {
|
||||
var target = this.target,
|
||||
a = this.a,
|
||||
i = a.length,
|
||||
mod = this._mod,
|
||||
e, val;
|
||||
if (mod) {
|
||||
while (--i > -1) {
|
||||
e = a[i];
|
||||
target[e.i] = mod(e.s + e.c * ratio, target);
|
||||
}
|
||||
} else {
|
||||
while (--i > -1) {
|
||||
e = a[i];
|
||||
val = e.s + e.c * ratio;
|
||||
target[e.i] = (val < 0.000001 && val > -0.000001) ? 0 : val;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
export { EndArrayPlugin as default };
|
||||
+170
@@ -0,0 +1,170 @@
|
||||
/*!
|
||||
* VERSION: 0.0.4
|
||||
* DATE: 2018-05-30
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
*/
|
||||
/* eslint-disable */
|
||||
|
||||
import { _gsScope } from "./TweenLite.js";
|
||||
|
||||
|
||||
var _cssRatioSetter = function(pt, cssp, mod) { //Takes an individual CSSPropTween and converts it into a type:2 that has a setRatio that does everything the regular CSSPlugin.setRatio() method does but applying the mod() too. We do this to keep the main CSSPlugin.setRatio() as fast as possible (the vast majority of times, no mod() will be necessary)
|
||||
var type = pt.type,
|
||||
oldSetRatio = pt.setRatio,
|
||||
tween = cssp._tween,
|
||||
target = cssp._target;
|
||||
pt.type = 2;
|
||||
pt.m = mod;
|
||||
pt.setRatio = function(v) {
|
||||
var min = 0.000001,
|
||||
val, str, i;
|
||||
if (v === 1 && (tween._time === tween._duration || tween._time === 0)) {
|
||||
|
||||
if (type !== 2) {
|
||||
if (pt.r && type !== -1) {
|
||||
val = Math.round(pt.s + pt.c);
|
||||
if (!type) {
|
||||
pt.t[pt.p] = mod.call(tween, val + pt.xs0, target, tween);
|
||||
} else if (type === 1) {
|
||||
str = pt.xs0 + val + pt.xs1;
|
||||
for (i = 1; i < pt.l; i++) {
|
||||
str += pt["xn"+i] + pt["xs"+(i+1)];
|
||||
}
|
||||
pt.t[pt.p] = mod.call(tween, str, target, tween);
|
||||
}
|
||||
} else {
|
||||
pt.t[pt.p] = mod.call(tween, pt.e, target, tween);
|
||||
}
|
||||
} else {
|
||||
oldSetRatio.call(pt, v);
|
||||
}
|
||||
|
||||
} else if (v || !(tween._time === tween._duration || tween._time === 0) || tween._rawPrevTime === -0.000001) {
|
||||
val = pt.c * v + pt.s;
|
||||
if (pt.r) {
|
||||
val = Math.round(val);
|
||||
} else if (val < min) if (val > -min) {
|
||||
val = 0;
|
||||
}
|
||||
if (!type) {
|
||||
pt.t[pt.p] = mod.call(tween, val + pt.xs0, target, tween);
|
||||
} else if (type === 1) {
|
||||
str = pt.xs0 + val + pt.xs1;
|
||||
for (i = 1; i < pt.l; i++) {
|
||||
str += pt["xn"+i] + pt["xs"+(i+1)];
|
||||
}
|
||||
pt.t[pt.p] = mod.call(tween, str, target, tween);
|
||||
|
||||
} else if (type === -1) { //non-tweening value
|
||||
pt.t[pt.p] = mod.call(tween, pt.xs0, target, tween);
|
||||
|
||||
} else if (oldSetRatio) {
|
||||
oldSetRatio.call(pt, v);
|
||||
}
|
||||
|
||||
} else {
|
||||
if (type !== 2) {
|
||||
pt.t[pt.p] = mod.call(tween, pt.b, target, tween);
|
||||
} else {
|
||||
oldSetRatio.call(pt, v);
|
||||
}
|
||||
}
|
||||
};
|
||||
},
|
||||
_modCSS = function(lookup, cssp) {
|
||||
var pt = cssp._firstPT,
|
||||
hasBezier = (lookup.rotation && cssp._overwriteProps.join("").indexOf("bezier") !== -1); //when a Bezier tween is applying autoRotation, it's a very special case we need to handle differently.
|
||||
if (lookup.scale) {
|
||||
lookup.scaleX = lookup.scaleY = lookup.scale;
|
||||
} else if (lookup.rotationZ) {
|
||||
lookup.rotation = lookup.rotationZ;
|
||||
}
|
||||
while (pt) {
|
||||
if (typeof(lookup[pt.p]) === "function") {
|
||||
_cssRatioSetter(pt, cssp, lookup[pt.p]);
|
||||
} else if (hasBezier && pt.n === "bezier" && pt.plugin._overwriteProps.join("").indexOf("rotation") !== -1) {
|
||||
pt.data.mod = lookup.rotation;
|
||||
}
|
||||
pt = pt._next;
|
||||
}
|
||||
},
|
||||
|
||||
ModifiersPlugin = _gsScope._gsDefine.plugin({
|
||||
propName: "modifiers",
|
||||
version: "0.0.4",
|
||||
API: 2,
|
||||
|
||||
//called when the tween renders for the first time. This is where initial values should be recorded and any setup routines should run.
|
||||
init: function(target, value, tween) {
|
||||
this._tween = tween;
|
||||
this._vars = value;
|
||||
return true;
|
||||
},
|
||||
|
||||
initAll: function() {
|
||||
var tween = this._tween,
|
||||
lookup = this._vars,
|
||||
mpt = this,
|
||||
pt = tween._firstPT,
|
||||
val, next;
|
||||
//initAll() gets called for each and every ModifiersPlugin instance in a tween, so if there are multiple targets, there will be multiple instances. Since we're ripping through the whole tween (and all the PropTweens), we only need to run this code ONCE. So we're setting a toggle on the first PropTween that just tells us if we've done it already. We don't set it on the tween instance because if it gets invalidated, we don't want to have to track this property and reset it. PropTweens get blown away when a tween is invalidated.
|
||||
if (pt._modInitted) {
|
||||
return false;
|
||||
} else {
|
||||
pt._modInitted = 1;
|
||||
}
|
||||
while (pt) {
|
||||
next = pt._next; //record here, because it may get removed
|
||||
val = lookup[pt.n];
|
||||
if (pt.pg) {
|
||||
if (pt.t._propName === "css") { //handle CSSPlugin uniquely (for performance, due to the fact that the values almost always are a concatenation of numbers and strings, like suffixes, and we don't want to slow down the regular CSSPlugin setRatio() performance with conditional checks for if the value needs to be modded, so we pull any modding prop out and change it to a type:2 one that simply calls a setRatio() method where we encapsulate the modding and update all together. That way, it says in the main CSSProp linked list and just has some custom logic applied to it inside its setRatio())
|
||||
_modCSS(lookup, pt.t);
|
||||
} else if (pt.t !== mpt) { //don't run modProps on modProps :)
|
||||
val = lookup[pt.t._propName];
|
||||
pt.t._tween = tween;
|
||||
pt.t._mod((typeof(val) === "object") ? val : lookup);
|
||||
}
|
||||
} else if (typeof(val) === "function") {
|
||||
if (pt.f === 2 && pt.t) { //a blob (text containing multiple numeric values)
|
||||
pt.t._applyPT.m = val;
|
||||
pt.t._tween = tween;
|
||||
} else {
|
||||
this._add(pt.t, pt.p, pt.s, pt.c, val);
|
||||
//remove from linked list
|
||||
if (next) {
|
||||
next._prev = pt._prev;
|
||||
}
|
||||
if (pt._prev) {
|
||||
pt._prev._next = next;
|
||||
} else if (tween._firstPT === pt) {
|
||||
tween._firstPT = next;
|
||||
}
|
||||
pt._next = pt._prev = null;
|
||||
tween._propLookup[pt.n] = mpt;
|
||||
}
|
||||
}
|
||||
pt = next;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
}),
|
||||
p = ModifiersPlugin.prototype;
|
||||
|
||||
p._add = function(target, p, s, c, mod) {
|
||||
this._addTween(target, p, s, s + c, p, mod);
|
||||
this._overwriteProps.push(p);
|
||||
};
|
||||
|
||||
p = _gsScope._gsDefine.globals.TweenLite.version.split(".");
|
||||
if (Number(p[0]) <= 1 && Number(p[1]) < 19 && _gsScope.console) {
|
||||
console.log("ModifiersPlugin requires GSAP 1.19.0 or later.");
|
||||
}
|
||||
|
||||
export { ModifiersPlugin, ModifiersPlugin as default };
|
||||
+464
@@ -0,0 +1,464 @@
|
||||
/*!
|
||||
* VERSION: 0.2.1
|
||||
* DATE: 2018-05-30
|
||||
* UPDATES AND DOCS AT: http://greensock.com
|
||||
*
|
||||
* @license Copyright (c) 2008-2019, GreenSock. All rights reserved.
|
||||
* PixiPlugin is subject to the terms at http://greensock.com/standard-license or for
|
||||
* Club GreenSock members, the software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
*/
|
||||
/* eslint-disable */
|
||||
|
||||
import { _gsScope } from "./TweenLite.js";
|
||||
|
||||
|
||||
var _numExp = /(\d|\.)+/g,
|
||||
_relNumExp = /(?:\d|\-\d|\.\d|\-\.\d|\+=\d|\-=\d|\+=.\d|\-=\.\d)+/g,
|
||||
_colorLookup = {aqua:[0,255,255],
|
||||
lime:[0,255,0],
|
||||
silver:[192,192,192],
|
||||
black:[0,0,0],
|
||||
maroon:[128,0,0],
|
||||
teal:[0,128,128],
|
||||
blue:[0,0,255],
|
||||
navy:[0,0,128],
|
||||
white:[255,255,255],
|
||||
fuchsia:[255,0,255],
|
||||
olive:[128,128,0],
|
||||
yellow:[255,255,0],
|
||||
orange:[255,165,0],
|
||||
gray:[128,128,128],
|
||||
purple:[128,0,128],
|
||||
green:[0,128,0],
|
||||
red:[255,0,0],
|
||||
pink:[255,192,203],
|
||||
cyan:[0,255,255],
|
||||
transparent:[255,255,255,0]},
|
||||
_hue = function(h, m1, m2) {
|
||||
h = (h < 0) ? h + 1 : (h > 1) ? h - 1 : h;
|
||||
return ((((h * 6 < 1) ? m1 + (m2 - m1) * h * 6 : (h < 0.5) ? m2 : (h * 3 < 2) ? m1 + (m2 - m1) * (2 / 3 - h) * 6 : m1) * 255) + 0.5) | 0;
|
||||
},
|
||||
/**
|
||||
* @private Parses a color (like #9F0, #FF9900, rgb(255,51,153) or hsl(108, 50%, 10%)) into an array with 3 elements for red, green, and blue or if "format" parameter is "hsl", it will populate the array with hue, saturation, and lightness values. Or if "format" is "number", it'll return a number like 0xFF0000 instead of an array. If a relative value is found in an hsl() or hsla() string, it will preserve those relative prefixes and all the values in the array will be strings instead of numbers (in all other cases it will be populated with numbers).
|
||||
* @param {(string|number)} v The value the should be parsed which could be a string like #9F0 or rgb(255,102,51) or rgba(255,0,0,0.5) or it could be a number like 0xFF00CC or even a named color like red, blue, purple, etc.
|
||||
* @param {(string)} format If "hsl", an hsl() or hsla() value will be returned instead of rgb() or rgba(). Or if "number", then a numeric value will be returned, like 0xFF0000. Default is rgb.
|
||||
* @return {(array|number)} An array containing red, green, and blue (and optionally alpha) in that order, or if the format parameter was "hsl", the array will contain hue, saturation and lightness (and optionally alpha) in that order. Or if "format" is defined as "number", it'll return a number like 0xFF0000. Always numbers unless there's a relative prefix found in an hsl() or hsla() string and "format" is "hsl".
|
||||
*/
|
||||
_parseColor = function(v, format) {
|
||||
var toHSL = (format === "hsl"),
|
||||
a, r, g, b, h, s, l, max, min, d, wasHSL;
|
||||
if (!v) {
|
||||
a = _colorLookup.black;
|
||||
} else if (typeof(v) === "number") {
|
||||
a = [v >> 16, (v >> 8) & 255, v & 255];
|
||||
} else {
|
||||
if (v.charAt(v.length - 1) === ",") { //sometimes a trailing comma is included and we should chop it off (typically from a comma-delimited list of values like a textShadow:"2px 2px 2px blue, 5px 5px 5px rgb(255,0,0)" - in this example "blue," has a trailing comma. We could strip it out inside parseComplex() but we'd need to do it to the beginning and ending values plus it wouldn't provide protection from other potential scenarios like if the user passes in a similar value.
|
||||
v = v.substr(0, v.length - 1);
|
||||
}
|
||||
if (_colorLookup[v]) {
|
||||
a = _colorLookup[v];
|
||||
} else if (v.charAt(0) === "#") {
|
||||
if (v.length === 4) { //for shorthand like #9F0
|
||||
r = v.charAt(1);
|
||||
g = v.charAt(2);
|
||||
b = v.charAt(3);
|
||||
v = "#" + r + r + g + g + b + b;
|
||||
}
|
||||
v = parseInt(v.substr(1), 16);
|
||||
a = [v >> 16, (v >> 8) & 255, v & 255];
|
||||
} else if (v.substr(0, 3) === "hsl") {
|
||||
a = wasHSL = v.match(_numExp);
|
||||
if (!toHSL) {
|
||||
h = (Number(a[0]) % 360) / 360;
|
||||
s = Number(a[1]) / 100;
|
||||
l = Number(a[2]) / 100;
|
||||
g = (l <= 0.5) ? l * (s + 1) : l + s - l * s;
|
||||
r = l * 2 - g;
|
||||
if (a.length > 3) {
|
||||
a[3] = Number(v[3]);
|
||||
}
|
||||
a[0] = _hue(h + 1 / 3, r, g);
|
||||
a[1] = _hue(h, r, g);
|
||||
a[2] = _hue(h - 1 / 3, r, g);
|
||||
} else if (v.indexOf("=") !== -1) { //if relative values are found, just return the raw strings with the relative prefixes in place.
|
||||
return v.match(_relNumExp);
|
||||
}
|
||||
} else {
|
||||
a = v.match(_numExp) || _colorLookup.transparent;
|
||||
}
|
||||
a[0] = Number(a[0]);
|
||||
a[1] = Number(a[1]);
|
||||
a[2] = Number(a[2]);
|
||||
if (a.length > 3) {
|
||||
a[3] = Number(a[3]);
|
||||
}
|
||||
}
|
||||
if (toHSL && !wasHSL) {
|
||||
r = a[0] / 255;
|
||||
g = a[1] / 255;
|
||||
b = a[2] / 255;
|
||||
max = Math.max(r, g, b);
|
||||
min = Math.min(r, g, b);
|
||||
l = (max + min) / 2;
|
||||
if (max === min) {
|
||||
h = s = 0;
|
||||
} else {
|
||||
d = max - min;
|
||||
s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
|
||||
h = (max === r) ? (g - b) / d + (g < b ? 6 : 0) : (max === g) ? (b - r) / d + 2 : (r - g) / d + 4;
|
||||
h *= 60;
|
||||
}
|
||||
a[0] = (h + 0.5) | 0;
|
||||
a[1] = (s * 100 + 0.5) | 0;
|
||||
a[2] = (l * 100 + 0.5) | 0;
|
||||
}
|
||||
return (format === "number") ? (a[0] << 16 | a[1] << 8 | a[2]) : a;
|
||||
},
|
||||
_formatColors = function(s, toHSL) {
|
||||
var colors = (s + "").match(_colorExp) || [],
|
||||
charIndex = 0,
|
||||
parsed = "",
|
||||
i, color, temp;
|
||||
if (!colors.length) {
|
||||
return s;
|
||||
}
|
||||
for (i = 0; i < colors.length; i++) {
|
||||
color = colors[i];
|
||||
temp = s.substr(charIndex, s.indexOf(color, charIndex)-charIndex);
|
||||
charIndex += temp.length + color.length;
|
||||
color = _parseColor(color, (toHSL ? "hsl" : "rgb"));
|
||||
if (color.length === 3) {
|
||||
color.push(1);
|
||||
}
|
||||
parsed += temp + (toHSL ? "hsla(" + color[0] + "," + color[1] + "%," + color[2] + "%," + color[3] : "rgba(" + color.join(",")) + ")";
|
||||
}
|
||||
return parsed + s.substr(charIndex);
|
||||
}, _colorStringFilter,
|
||||
TweenLite = (_gsScope.GreenSockGlobals || _gsScope).TweenLite,
|
||||
_colorExp = "(?:\\b(?:(?:rgb|rgba|hsl|hsla)\\(.+?\\))|\\B#(?:[0-9a-f]{3}){1,2}\\b", //we'll dynamically build this Regular Expression to conserve file size. After building it, it will be able to find rgb(), rgba(), # (hexadecimal), and named color values like red, blue, purple, etc.
|
||||
|
||||
_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(m, m2) {
|
||||
var 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 = function(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(m, color, amount) {
|
||||
var c = _parseColor(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 = function(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(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(t, type) {
|
||||
var filterClass = _gsScope.PIXI.filters[type],
|
||||
filters = t.filters || [],
|
||||
i = filters.length,
|
||||
filter;
|
||||
if (!filterClass) {
|
||||
throw("PixiPlugin error: " + type + " isn't present.");
|
||||
}
|
||||
while (--i > -1) {
|
||||
if (filters[i] instanceof filterClass) {
|
||||
return filters[i];
|
||||
}
|
||||
}
|
||||
filter = new filterClass();
|
||||
if (type === "BlurFilter") {
|
||||
filter.blur = 0;
|
||||
}
|
||||
filters.push(filter);
|
||||
t.filters = filters;
|
||||
return filter;
|
||||
},
|
||||
|
||||
_addColorMatrixFilterCacheTween = function(p, pg, 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.
|
||||
pg._addTween(cache, p, cache[p], vars[p], p);
|
||||
pg._overwriteProps.push(p);
|
||||
},
|
||||
|
||||
_applyBrightnessToMatrix = function(brightness, matrix) {
|
||||
var temp = new _gsScope.PIXI.filters.ColorMatrixFilter();
|
||||
temp.matrix = matrix;
|
||||
temp.brightness(brightness, true);
|
||||
return temp.matrix;
|
||||
},
|
||||
|
||||
_CMFdefaults = {contrast:1, saturation:1, colorizeAmount:0, colorize:"rgb(255,255,255)", hue:0, brightness:1},
|
||||
|
||||
_parseColorMatrixFilter = function(t, v, pg) {
|
||||
var filter = _getFilter(t, "ColorMatrixFilter"),
|
||||
cache = t._gsColorMatrixFilter = t._gsColorMatrixFilter || {contrast:1, saturation:1, colorizeAmount:0, colorize:"rgb(255,255,255)", hue:0, brightness:1},
|
||||
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, Number(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, Number(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(Number(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) ? Number(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, Number(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._addTween(startMatrix, i, startMatrix[i], matrix[i], "colorMatrixFilter");
|
||||
}
|
||||
}
|
||||
pg._overwriteProps.push("colorMatrixFilter");
|
||||
},
|
||||
|
||||
_addColorTween = function(target, p, value, colorSetter, plugin) {
|
||||
var pt = colorSetter._firstPT = {_next:colorSetter._firstPT, t:target, p:p, proxy:{}, f:(typeof(target[p]) === "function")};
|
||||
pt.proxy[p] = "rgb(" + _parseColor(!pt.f ? target[p] : target[ ((p.indexOf("set") || typeof(target["get" + p.substr(3)]) !== "function") ? p : "get" + p.substr(3)) ]()).join(",") + ")";
|
||||
plugin._addTween(pt.proxy, p, "get", ((typeof(value) === "number") ? "rgb(" + _parseColor(value, false).join(",") + ")" : value), p, null, null, _colorStringFilter);
|
||||
},
|
||||
|
||||
//to improve performance, when a color is sensed, we hijack the setRatio() method of the plugin instance with a new function that this method spits back. This is a special method that handles parsing color values on-the-fly and turns them into numeric values which PixiJS requires. In other words, instead of "rgb(255, 0, 0)", PixiJS wants 0xFF0000. This also works with hsl() values.
|
||||
_buildColorSetter = function(tween, plugin) {
|
||||
var setRatio = plugin.setRatio, //save the original (super) setRatio() function
|
||||
func = function(v) {
|
||||
var pt = func._firstPT,
|
||||
val;
|
||||
setRatio.call(plugin, v);
|
||||
while (pt) {
|
||||
val = _parseColor(pt.proxy[pt.p], "number");
|
||||
if (pt.f) {
|
||||
pt.t[pt.p](val);
|
||||
} else {
|
||||
pt.t[pt.p] = val;
|
||||
}
|
||||
pt = pt._next;
|
||||
}
|
||||
if (func.graphics) { //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.
|
||||
func.graphics.dirty++;
|
||||
func.graphics.clearDirty++;
|
||||
}
|
||||
};
|
||||
plugin.setRatio = func;
|
||||
return func;
|
||||
},
|
||||
|
||||
|
||||
_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(value) {
|
||||
return (typeof(value) === "string" && value.charAt(1) === "=") ? value.substr(0, 2) + (parseFloat(value.substr(2)) * _DEG2RAD) : value * _DEG2RAD;
|
||||
}, i, p;
|
||||
|
||||
//context setup...
|
||||
for (i = 0; i < _xyContexts.length; i++) {
|
||||
p = _xyContexts[i];
|
||||
_contexts[p + "X"] = p;
|
||||
_contexts[p + "Y"] = p;
|
||||
}
|
||||
|
||||
//color parsing setup...
|
||||
for (p in _colorLookup) {
|
||||
_colorExp += "|" + p + "\\b";
|
||||
}
|
||||
_colorExp = new RegExp(_colorExp+")", "gi");
|
||||
_colorStringFilter = function(a) {
|
||||
var combined = a[0] + " " + a[1],
|
||||
toHSL;
|
||||
_colorExp.lastIndex = 0;
|
||||
if (_colorExp.test(combined)) {
|
||||
toHSL = (combined.indexOf("hsl(") !== -1 || combined.indexOf("hsla(") !== -1);
|
||||
a[0] = _formatColors(a[0], toHSL);
|
||||
a[1] = _formatColors(a[1], toHSL);
|
||||
}
|
||||
};
|
||||
|
||||
if (!TweenLite.defaultStringFilter) {
|
||||
TweenLite.defaultStringFilter = _colorStringFilter;
|
||||
}
|
||||
|
||||
var PixiPlugin = _gsScope._gsDefine.plugin({
|
||||
propName: "pixi",
|
||||
priority: 0,
|
||||
API: 2,
|
||||
global: true,
|
||||
version: "0.2.1",
|
||||
|
||||
init: function (target, values, tween, index) {
|
||||
if (!target instanceof _gsScope.PIXI.DisplayObject) {
|
||||
return false;
|
||||
}
|
||||
var context, axis, value, colorMatrix, filter, p, padding, colorSetter, i, data, pt;
|
||||
for (p in values) {
|
||||
context = _contexts[p];
|
||||
value = values[p];
|
||||
if (typeof(value) === "function") {
|
||||
value = value(index || 0, target);
|
||||
}
|
||||
if (context) {
|
||||
axis = (p.charAt(p.length-1).toLowerCase().indexOf("x") !== -1) ? "x" : "y";
|
||||
this._addTween(target[context], axis, target[context][axis], (context === "skew") ? _degreesToRadians(value) : value, p);
|
||||
} else if (p === "scale" || p === "anchor" || p === "pivot" || p === "tileScale") {
|
||||
this._addTween(target[p], "x", target[p].x, value, p + "X");
|
||||
this._addTween(target[p], "y", target[p].y, value, p + "Y");
|
||||
} 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._addTween(target, p, target.rotation, _degreesToRadians(value), p);
|
||||
|
||||
} 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._addTween(filter, p, filter[p], value, p);
|
||||
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 (!colorSetter) {
|
||||
colorSetter = _buildColorSetter(tween, this);
|
||||
}
|
||||
if ((p === "lineColor" || p === "fillColor") && target instanceof _gsScope.PIXI.Graphics) {
|
||||
data = target.graphicsData;
|
||||
i = data.length;
|
||||
while (--i > -1) {
|
||||
_addColorTween(data[i], p, value, colorSetter, this);
|
||||
}
|
||||
colorSetter.graphics = target;
|
||||
} else {
|
||||
_addColorTween(target, p, value, colorSetter, this);
|
||||
}
|
||||
} else if (p === "autoAlpha") {
|
||||
this._firstPT = pt = {t: {setRatio:function() { target.visible = !!target.alpha; }}, p: "setRatio", s: 0, c: 1, f: 1, pg: 0, n: "visible", pr: 0, m: 0, _next:this._firstPT};
|
||||
if (pt._next) {
|
||||
pt._next._prev = pt;
|
||||
}
|
||||
this._addTween(target, "alpha", target.alpha, value, "alpha");
|
||||
this._overwriteProps.push("alpha", "visible");
|
||||
} else {
|
||||
this._addTween(target, p, target[p], value, p);
|
||||
}
|
||||
this._overwriteProps.push(p);
|
||||
}
|
||||
return true;
|
||||
}
|
||||
});
|
||||
|
||||
PixiPlugin.colorProps = _colorProps;
|
||||
PixiPlugin.parseColor = _parseColor;
|
||||
PixiPlugin.formatColors = _formatColors;
|
||||
PixiPlugin.colorStringFilter = _colorStringFilter;
|
||||
|
||||
export { PixiPlugin, PixiPlugin as default };
|
||||
+100
@@ -0,0 +1,100 @@
|
||||
/*!
|
||||
* VERSION: 1.6.0
|
||||
* DATE: 2018-08-27
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
**/
|
||||
/* eslint-disable */
|
||||
|
||||
import { _gsScope } from "./TweenLite.js";
|
||||
|
||||
export var RoundPropsPlugin = _gsScope._gsDefine.plugin({
|
||||
propName: "roundProps",
|
||||
version: "1.7.0",
|
||||
priority: -1,
|
||||
API: 2,
|
||||
|
||||
//called when the tween renders for the first time. This is where initial values should be recorded and any setup routines should run.
|
||||
init: function(target, value, tween) {
|
||||
this._tween = tween;
|
||||
return true;
|
||||
}
|
||||
|
||||
}),
|
||||
_getRoundFunc = function(v) { //pass in 0.1 get a function that'll round to the nearest tenth, or 5 to round to the closest 5, or 0.001 to the closest 1000th, etc.
|
||||
var p = v < 1 ? Math.pow(10, (v + "").length - 2) : 1; //to avoid floating point math errors (like 24 * 0.1 == 2.4000000000000004), we chop off at a specific number of decimal places (much faster than toFixed()
|
||||
return function(n) {
|
||||
return ((Math.round(n / v) * v * p) | 0) / p;
|
||||
};
|
||||
},
|
||||
_roundLinkedList = function(node, mod) {
|
||||
while (node) {
|
||||
if (!node.f && !node.blob) {
|
||||
node.m = mod || Math.round;
|
||||
}
|
||||
node = node._next;
|
||||
}
|
||||
},
|
||||
p = RoundPropsPlugin.prototype;
|
||||
|
||||
p._onInitAllProps = function() {
|
||||
var tween = this._tween,
|
||||
rp = tween.vars.roundProps,
|
||||
lookup = {},
|
||||
rpt = tween._propLookup.roundProps,
|
||||
pt, next, i, p;
|
||||
if (typeof(rp) === "object" && !rp.push) {
|
||||
for (p in rp) {
|
||||
lookup[p] = _getRoundFunc(rp[p]);
|
||||
}
|
||||
} else {
|
||||
if (typeof(rp) === "string") {
|
||||
rp = rp.split(",");
|
||||
}
|
||||
i = rp.length;
|
||||
while (--i > -1) {
|
||||
lookup[rp[i]] = Math.round;
|
||||
}
|
||||
}
|
||||
|
||||
for (p in lookup) {
|
||||
pt = tween._firstPT;
|
||||
while (pt) {
|
||||
next = pt._next; //record here, because it may get removed
|
||||
if (pt.pg) {
|
||||
pt.t._mod(lookup);
|
||||
} else if (pt.n === p) {
|
||||
if (pt.f === 2 && pt.t) { //a blob (text containing multiple numeric values)
|
||||
_roundLinkedList(pt.t._firstPT, lookup[p]);
|
||||
} else {
|
||||
this._add(pt.t, p, pt.s, pt.c, lookup[p]);
|
||||
//remove from linked list
|
||||
if (next) {
|
||||
next._prev = pt._prev;
|
||||
}
|
||||
if (pt._prev) {
|
||||
pt._prev._next = next;
|
||||
} else if (tween._firstPT === pt) {
|
||||
tween._firstPT = next;
|
||||
}
|
||||
pt._next = pt._prev = null;
|
||||
tween._propLookup[p] = rpt;
|
||||
}
|
||||
}
|
||||
pt = next;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
p._add = function(target, p, s, c, mod) {
|
||||
this._addTween(target, p, s, s + c, p, mod || Math.round);
|
||||
this._overwriteProps.push(p);
|
||||
};
|
||||
|
||||
export { RoundPropsPlugin as default };
|
||||
+182
@@ -0,0 +1,182 @@
|
||||
/*!
|
||||
* VERSION: 1.9.2
|
||||
* DATE: 2019-02-07
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
**/
|
||||
/* eslint-disable */
|
||||
|
||||
import { _gsScope } from "./TweenLite.js";
|
||||
|
||||
|
||||
var _doc = (_gsScope.document || {}).documentElement,
|
||||
_window = _gsScope,
|
||||
_max = function(element, axis) {
|
||||
var dim = (axis === "x") ? "Width" : "Height",
|
||||
scroll = "scroll" + dim,
|
||||
client = "client" + dim,
|
||||
body = document.body;
|
||||
return (element === _window || element === _doc || element === body) ? Math.max(_doc[scroll], body[scroll]) - (_window["inner" + dim] || _doc[client] || body[client]) : element[scroll] - element["offset" + dim];
|
||||
},
|
||||
_unwrapElement = function(value) {
|
||||
if (typeof(value) === "string") {
|
||||
value = TweenLite.selector(value);
|
||||
}
|
||||
if (value.length && value !== _window && value[0] && value[0].style && !value.nodeType) {
|
||||
value = value[0];
|
||||
}
|
||||
return (value === _window || (value.nodeType && value.style)) ? value : null;
|
||||
},
|
||||
_buildGetter = function(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");
|
||||
if (e === _window) {
|
||||
if (e.pageXOffset != null) {
|
||||
p = "page" + axis.toUpperCase() + "Offset";
|
||||
} else if (_doc[p] != null) {
|
||||
e = _doc;
|
||||
} else {
|
||||
e = document.body;
|
||||
}
|
||||
}
|
||||
return function() {
|
||||
return e[p];
|
||||
};
|
||||
},
|
||||
_getOffset = function(element, container) {
|
||||
var rect = _unwrapElement(element).getBoundingClientRect(),
|
||||
b = document.body,
|
||||
isRoot = (!container || container === _window || container === b),
|
||||
cRect = isRoot ? {top:_doc.clientTop - (window.pageYOffset || _doc.scrollTop || b.scrollTop || 0), left:_doc.clientLeft - (window.pageXOffset || _doc.scrollLeft || b.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;
|
||||
/* PREVIOUS
|
||||
var rect = _unwrapElement(element).getBoundingClientRect(),
|
||||
isRoot = (!container || container === _window || container === document.body),
|
||||
cRect = (isRoot ? _doc : 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 = function(value, target, axis, currentVal) {
|
||||
var type = typeof(value);
|
||||
return !isNaN(value) ? parseFloat(value) : (type === "string" && value.charAt(1) === "=") ? parseInt(value.charAt(0) + "1", 10) * parseFloat(value.substr(2)) + currentVal : (value === "max") ? _max(target, axis) : Math.min(_max(target, axis), _getOffset(value, target)[axis]);
|
||||
},
|
||||
|
||||
ScrollToPlugin = _gsScope._gsDefine.plugin({
|
||||
propName: "scrollTo",
|
||||
API: 2,
|
||||
global: true,
|
||||
version:"1.9.2",
|
||||
|
||||
//called when the tween renders for the first time. This is where initial values should be recorded and any setup routines should run.
|
||||
init: function(target, value, tween) {
|
||||
this._wdw = (target === _window);
|
||||
this._target = target;
|
||||
this._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 (typeof(value.y) === "string" && value.y !== "max" && value.y.charAt(1) !== "=") {
|
||||
value.x = value.y;
|
||||
}
|
||||
} else if (value.nodeType) {
|
||||
value = {y:value, x:value};
|
||||
}
|
||||
this.vars = value;
|
||||
this._autoKill = (value.autoKill !== false);
|
||||
this.getX = _buildGetter(target, "x");
|
||||
this.getY = _buildGetter(target, "y");
|
||||
this.x = this.xPrev = this.getX();
|
||||
this.y = this.yPrev = this.getY();
|
||||
if (value.x != null) {
|
||||
this._addTween(this, "x", this.x, _parseVal(value.x, target, "x", this.x) - (value.offsetX || 0), "scrollTo_x", true);
|
||||
this._overwriteProps.push("scrollTo_x");
|
||||
} else {
|
||||
this.skipX = true;
|
||||
}
|
||||
if (value.y != null) {
|
||||
this._addTween(this, "y", this.y, _parseVal(value.y, target, "y", this.y) - (value.offsetY || 0), "scrollTo_y", true);
|
||||
this._overwriteProps.push("scrollTo_y");
|
||||
} else {
|
||||
this.skipY = true;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
|
||||
//called each time the values should be updated, and the ratio gets passed as the only parameter (typically it's a value between 0 and 1, but it can exceed those when using an ease like Elastic.easeOut or Back.easeOut, etc.)
|
||||
set: function(v) {
|
||||
this._super.setRatio.call(this, v);
|
||||
|
||||
var x = (this._wdw || !this.skipX) ? this.getX() : this.xPrev,
|
||||
y = (this._wdw || !this.skipY) ? this.getY() : this.yPrev,
|
||||
yDif = y - this.yPrev,
|
||||
xDif = x - this.xPrev,
|
||||
threshold = ScrollToPlugin.autoKillThreshold;
|
||||
|
||||
if (this.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)
|
||||
this.x = 0;
|
||||
}
|
||||
if (this.y < 0) {
|
||||
this.y = 0;
|
||||
}
|
||||
if (this._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 (!this.skipX && (xDif > threshold || xDif < -threshold) && x < _max(this._target, "x")) {
|
||||
this.skipX = true; //if the user scrolls separately, we should stop tweening!
|
||||
}
|
||||
if (!this.skipY && (yDif > threshold || yDif < -threshold) && y < _max(this._target, "y")) {
|
||||
this.skipY = true; //if the user scrolls separately, we should stop tweening!
|
||||
}
|
||||
if (this.skipX && this.skipY) {
|
||||
this._tween.kill();
|
||||
if (this.vars.onAutoKill) {
|
||||
this.vars.onAutoKill.apply(this.vars.onAutoKillScope || this._tween, this.vars.onAutoKillParams || []);
|
||||
}
|
||||
}
|
||||
}
|
||||
if (this._wdw) {
|
||||
_window.scrollTo((!this.skipX) ? this.x : x, (!this.skipY) ? this.y : y);
|
||||
} else {
|
||||
if (!this.skipY) {
|
||||
this._target.scrollTop = this.y;
|
||||
}
|
||||
if (!this.skipX) {
|
||||
this._target.scrollLeft = this.x;
|
||||
}
|
||||
}
|
||||
this.xPrev = this.x;
|
||||
this.yPrev = this.y;
|
||||
}
|
||||
|
||||
}),
|
||||
p = ScrollToPlugin.prototype;
|
||||
|
||||
ScrollToPlugin.max = _max;
|
||||
ScrollToPlugin.getOffset = _getOffset;
|
||||
ScrollToPlugin.buildGetter = _buildGetter;
|
||||
ScrollToPlugin.autoKillThreshold = 7;
|
||||
|
||||
p._kill = function(lookup) {
|
||||
if (lookup.scrollTo_x) {
|
||||
this.skipX = true;
|
||||
}
|
||||
if (lookup.scrollTo_y) {
|
||||
this.skipY = true;
|
||||
}
|
||||
return this._super._kill.call(this, lookup);
|
||||
};
|
||||
|
||||
|
||||
export { ScrollToPlugin, ScrollToPlugin as default };
|
||||
+75
@@ -0,0 +1,75 @@
|
||||
/*!
|
||||
* VERSION: 1.2.0
|
||||
* DATE: 2018-08-27
|
||||
* UPDATES AND DOCS AT: http://greensock.com
|
||||
*
|
||||
* This file is to be used as a simple template for writing your own plugin. See the
|
||||
* TweenPlugin docs for more details.
|
||||
*
|
||||
* You can start by doing a search for "yourCustomProperty" and replace it with whatever the name
|
||||
* of your property is. This way of defining a plugin was introduced in version 1.9.0 - previous versions
|
||||
* of TweenLite won't work with this.
|
||||
*
|
||||
* @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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
**/
|
||||
/* eslint-disable */
|
||||
import { _gsScope } from "./TweenLite.js";
|
||||
|
||||
export var YourPlugin = _gsScope._gsDefine.plugin({
|
||||
propName: "yourCustomProperty", //the name of the property that will get intercepted and handled by this plugin (obviously change it to whatever you want, typically it is camelCase starting with lowercase).
|
||||
priority: 0, //the priority in the rendering pipeline (0 by default). A priority of -1 would mean this plugin will run after all those with 0 or greater. A priority of 1 would get run before 0, etc. This only matters when a plugin relies on other plugins finishing their work before it runs (or visa-versa)
|
||||
API: 2, //the API should stay 2 - it just gives us a way to know the method/property structure so that if in the future we change to a different TweenPlugin architecture, we can identify this plugin's structure.
|
||||
version: "1.0.0", //your plugin's version number
|
||||
overwriteProps: ["yourCustomProperty"], //an array of property names whose tweens should be overwritten by this plugin. For example, if you create a "scale" plugin that handles both "scaleX" and "scaleY", the overwriteProps would be ["scaleX","scaleY"] so that if there's a scaleX or scaleY tween in-progress when a new "scale" tween starts (using this plugin), it would overwrite the scaleX or scaleY tween.
|
||||
|
||||
/*
|
||||
* The init function is called when the tween renders for the first time. This is where initial values should be recorded and any setup routines should run. It receives 3 parameters:
|
||||
* 1) target [object] - the target of the tween. In cases where the tween's original target is an array (or jQuery object), this target will be the individual object inside that array (a new plugin instance is created for each target in the array). For example, TweenLite.to([obj1, obj2, obj3], 1, {x:100}) the target will be obj1 or obj2 or obj3 rather than the array containing them.
|
||||
* 2) value [*] - whatever value is passed as the special property value. For example, TweenLite.to(element, 1, {yourCustomProperty:3}) the value would be 3. Or for TweenLite.to(element, 1, {yourCustomProperty:{subProp1:3, subProp2:"whatever"}});, value would be {subProp1:3, subProp2:"whatever"}.
|
||||
* 3) tween [TweenLite] - the TweenLite (or TweenMax) instance that is managing this plugin instance. This can be useful if you need to check certain state-related properties on the tween (maybe in the set method) like its duration or time. Most of the time, however, you don't need to do anything with the tween. It is provided just in case you want to reference it.
|
||||
* 4) index [integer] - the index number of the target in the tween. For example, if an array is passed in as the target (or selector text), this would be 0 for the first one, 1 for the second, 2 for the third, etc. This was introduced in GSAP 1.19.0
|
||||
*
|
||||
* This function should return true unless you want to have TweenLite/Max skip the plugin altogether and instead treat the property/value like a normal tween (as if the plugin wasn't activated). This is rarely useful, so you should almost always return true.
|
||||
*/
|
||||
init: function(target, value, tween, index) {
|
||||
this._target = target; //we record the target so that we can refer to it in the set method when doing updates.
|
||||
|
||||
/* Next, we create a property tween for "scaleX" and "scaleY" properties of our target
|
||||
* (we're just using them as a examples of how to set up a property tween with a name, start, and end value).
|
||||
* the _addTween() method accepts the following parameters:
|
||||
* 1) target [object] - target object whose property this tween will control.
|
||||
* 2) property [string] - the name of the property, like "scaleX" or "scaleY"
|
||||
* 3) start [number] - The starting value of the property. For example, if you're tweening from 0 to 100, start would be 0.
|
||||
* 4) end [number] - the ending value of the property. For example, if you're tweening from 0 to 100, end would be 100.
|
||||
* 5) overwriteProperty [string] - the name that gets registered as the overwrite property so that if another concurrent tween of the same target gets created and it is tweening a property with this name, this one will be overwritten. Typically this is the same as "property".
|
||||
* 6) round [boolean] - if true, the updated value on each update will be rounded to the nearest integer. [false by default]
|
||||
* You do NOT need to use _addTween() at all. It is merely a convenience. You can record your own values internally or whatever you want.
|
||||
*/
|
||||
this._addTween(target, "scaleX", target.scaleX, value, "scaleX", false);
|
||||
this._addTween(target, "scaleY", target.scaleY, value, "scaleY", false);
|
||||
|
||||
//now, just for kicks, we'll record the starting "alpha" value and amount of change so that we can manage this manually rather than _addTween() (again, totally fictitious, just for an example)
|
||||
this._alphaStart = target.alpha;
|
||||
this._alphaChange = value.alpha - target.alpha;
|
||||
|
||||
//always return true unless we want to scrap the plugin and have the value treated as a normal property tween (very uncommon)
|
||||
return true;
|
||||
},
|
||||
|
||||
//[optional] - called each time the values should be updated, and the ratio gets passed as the only parameter (typically it's a value between 0 and 1, but it can exceed those when using an ease like Elastic.easeOut or Back.easeOut, etc.). If you're using this._super._addTween() for all your tweens and you don't need to do anything special on each frame besides updating those values, you can omit this "set" function altogether.
|
||||
set: function(ratio) {
|
||||
//since we used _addTween() inside init function, it created some property tweens that we'll update by calling the parent prototype's setRatio() (otherwise, the property tweens wouldn't get their values updated). this._super refers to the TweenPlugin prototype from which the plugin inherits (not that you need to worry about that).
|
||||
this._super.setRatio.call(this, ratio);
|
||||
|
||||
//now manually set the alpha
|
||||
this._target.alpha = this._alphaStart + this._alphaChange * ratio;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// Now export it for ES6
|
||||
export { YourPlugin as default };
|
||||
+157
@@ -0,0 +1,157 @@
|
||||
/*!
|
||||
* VERSION: 0.6.2
|
||||
* DATE: 2018-05-30
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
*/
|
||||
/* eslint-disable */
|
||||
|
||||
import { _gsScope } from "./TweenLite.js";
|
||||
|
||||
var _getText = function(e) {
|
||||
var type = e.nodeType,
|
||||
result = "";
|
||||
if (type === 1 || type === 9 || type === 11) {
|
||||
if (typeof(e.textContent) === "string") {
|
||||
return e.textContent;
|
||||
} else {
|
||||
for ( e = e.firstChild; e; e = e.nextSibling ) {
|
||||
result += _getText(e);
|
||||
}
|
||||
}
|
||||
} else if (type === 3 || type === 4) {
|
||||
return e.nodeValue;
|
||||
}
|
||||
return result;
|
||||
},
|
||||
_emoji = "[\uE000-\uF8FF]|\uD83C[\uDC00-\uDFFF]|\uD83D[\uDC00-\uDFFF]|[\u2694-\u2697]|\uD83E[\uDD10-\uDD5D]|[\uD800-\uDBFF][\uDC00-\uDFFF]",
|
||||
_emojiExp = new RegExp(_emoji),
|
||||
_emojiAndCharsExp = new RegExp(_emoji + "|.", "g"),
|
||||
_emojiSafeSplit = function(text, delimiter) {
|
||||
return ((delimiter === "" || !delimiter) && _emojiExp.test(text)) ? text.match(_emojiAndCharsExp) : text.split(delimiter || "");
|
||||
},
|
||||
/* //previous emoji-related splitting. New method above is faster and more concise.
|
||||
_emojiStart = 0xD800,
|
||||
_emojiEnd = 0xDBFF,
|
||||
_emojiLowStart = 0xDC00,
|
||||
_emojiRegionStart = 0x1F1E6,
|
||||
_emojiRegionEnd = 0x1F1FF,
|
||||
_emojiModStart = 0x1f3fb,
|
||||
_emojiModEnd = 0x1f3ff,
|
||||
_emojiPairCode = function(s) {
|
||||
return ((s.charCodeAt(0) - _emojiStart) << 10) + (s.charCodeAt(1) - _emojiLowStart) + 0x10000;
|
||||
},
|
||||
_emojiSafeSplit = function(text, delimiter) { //like calling String.split(delimiter) except that it keeps emoji characters together.
|
||||
if (delimiter !== "") {
|
||||
return text.split(delimiter);
|
||||
}
|
||||
var l = text.length,
|
||||
a = [],
|
||||
character, i, emojiPair1, emojiPair2, j;
|
||||
for (i = 0; i < l; i++) {
|
||||
character = text.charAt(i);
|
||||
if ((character.charCodeAt(0) >= _emojiStart && character.charCodeAt(0) <= _emojiEnd) || (text.charCodeAt(i+1) >= 0xFE00 && text.charCodeAt(i+1) <= 0xFE0F)) { //special emoji characters use 2 or 4 unicode characters that we must keep together.
|
||||
emojiPair1 = _emojiPairCode(text.substr(i, 2));
|
||||
emojiPair2 = _emojiPairCode(text.substr(i + 2, 2));
|
||||
j = ((emojiPair1 >= _emojiRegionStart && emojiPair1 <= _emojiRegionEnd && emojiPair2 >= _emojiRegionStart && emojiPair2 <= _emojiRegionEnd) || (emojiPair2 >= _emojiModStart && emojiPair2 <= _emojiModEnd)) ? 4 : 2;
|
||||
a.push(text.substr(i, j));
|
||||
i += j - 1;
|
||||
} else {
|
||||
a.push(character);
|
||||
}
|
||||
}
|
||||
return a;
|
||||
},
|
||||
*/
|
||||
TextPlugin = _gsScope._gsDefine.plugin({
|
||||
propName: "text",
|
||||
API: 2,
|
||||
version:"0.6.2",
|
||||
|
||||
//called when the tween renders for the first time. This is where initial values should be recorded and any setup routines should run.
|
||||
init: function(target, value, tween, index) {
|
||||
var i = target.nodeName.toUpperCase(),
|
||||
shrt;
|
||||
if (typeof(value) === "function") {
|
||||
value = value(index, target);
|
||||
}
|
||||
this._svg = (target.getBBox && (i === "TEXT" || i === "TSPAN"));
|
||||
if (!("innerHTML" in target) && !this._svg) {
|
||||
return false;
|
||||
}
|
||||
this._target = target;
|
||||
if (typeof(value) !== "object") {
|
||||
value = {value:value};
|
||||
}
|
||||
if (value.value === undefined) {
|
||||
this._text = this._original = [""];
|
||||
return true;
|
||||
}
|
||||
this._delimiter = value.delimiter || "";
|
||||
this._original = _emojiSafeSplit(_getText(target).replace(/\s+/g, " "), this._delimiter);
|
||||
this._text = _emojiSafeSplit(value.value.replace(/\s+/g, " "), this._delimiter);
|
||||
this._runBackwards = (tween.vars.runBackwards === true);
|
||||
if (this._runBackwards) {
|
||||
i = this._original;
|
||||
this._original = this._text;
|
||||
this._text = i;
|
||||
}
|
||||
if (typeof(value.newClass) === "string") {
|
||||
this._newClass = value.newClass;
|
||||
this._hasClass = true;
|
||||
}
|
||||
if (typeof(value.oldClass) === "string") {
|
||||
this._oldClass = value.oldClass;
|
||||
this._hasClass = true;
|
||||
}
|
||||
i = this._original.length - this._text.length;
|
||||
shrt = (i < 0) ? this._original : this._text;
|
||||
this._fillChar = value.fillChar || (value.padSpace ? " " : "");
|
||||
if (i < 0) {
|
||||
i = -i;
|
||||
}
|
||||
while (--i > -1) {
|
||||
shrt.push(this._fillChar);
|
||||
}
|
||||
return true;
|
||||
},
|
||||
|
||||
//called each time the values should be updated, and the ratio gets passed as the only parameter (typically it's a value between 0 and 1, but it can exceed those when using an ease like Elastic.easeOut or Back.easeOut, etc.)
|
||||
set: function(ratio) {
|
||||
if (ratio > 1) {
|
||||
ratio = 1;
|
||||
} else if (ratio < 0) {
|
||||
ratio = 0;
|
||||
}
|
||||
if (this._runBackwards) {
|
||||
ratio = 1 - ratio;
|
||||
}
|
||||
var l = this._text.length,
|
||||
i = (ratio * l + 0.5) | 0,
|
||||
applyNew, applyOld, str;
|
||||
if (this._hasClass) {
|
||||
applyNew = (this._newClass && i !== 0);
|
||||
applyOld = (this._oldClass && i !== l);
|
||||
str = (applyNew ? "<span class='" + this._newClass + "'>" : "") + this._text.slice(0, i).join(this._delimiter) + (applyNew ? "</span>" : "") + (applyOld ? "<span class='" + this._oldClass + "'>" : "") + this._delimiter + this._original.slice(i).join(this._delimiter) + (applyOld ? "</span>" : "");
|
||||
} else {
|
||||
str = this._text.slice(0, i).join(this._delimiter) + this._delimiter + this._original.slice(i).join(this._delimiter);
|
||||
}
|
||||
if (this._svg) { //SVG text elements don't have an "innerHTML" in Microsoft browsers.
|
||||
this._target.textContent = str;
|
||||
} else {
|
||||
this._target.innerHTML = (this._fillChar === " " && str.indexOf(" ") !== -1) ? str.split(" ").join(" ") : str;
|
||||
}
|
||||
}
|
||||
|
||||
}),
|
||||
p = TextPlugin.prototype;
|
||||
|
||||
p._newClass = p._oldClass = p._delimiter = "";
|
||||
|
||||
|
||||
export { TextPlugin, TextPlugin as default };
|
||||
+844
@@ -0,0 +1,844 @@
|
||||
/*!
|
||||
* VERSION: 2.1.0
|
||||
* DATE: 2019-02-15
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
*/
|
||||
/* eslint-disable */
|
||||
|
||||
import TweenLite, { _gsScope, globals, Animation, SimpleTimeline } from "./TweenLite.js";
|
||||
|
||||
_gsScope._gsDefine("TimelineLite", ["core.Animation","core.SimpleTimeline","TweenLite"], function() {
|
||||
|
||||
var TimelineLite = function(vars) {
|
||||
SimpleTimeline.call(this, vars);
|
||||
var self = this,
|
||||
v = self.vars,
|
||||
val, p;
|
||||
self._labels = {};
|
||||
self.autoRemoveChildren = !!v.autoRemoveChildren;
|
||||
self.smoothChildTiming = !!v.smoothChildTiming;
|
||||
self._sortChildren = true;
|
||||
self._onUpdate = v.onUpdate;
|
||||
for (p in v) {
|
||||
val = v[p];
|
||||
if (_isArray(val)) if (val.join("").indexOf("{self}") !== -1) {
|
||||
v[p] = self._swapSelfInParams(val);
|
||||
}
|
||||
}
|
||||
if (_isArray(v.tweens)) {
|
||||
self.add(v.tweens, 0, v.align, v.stagger);
|
||||
}
|
||||
},
|
||||
_tinyNum = 0.00000001,
|
||||
TweenLiteInternals = TweenLite._internals,
|
||||
_internals = TimelineLite._internals = {},
|
||||
_isSelector = TweenLiteInternals.isSelector,
|
||||
_isArray = TweenLiteInternals.isArray,
|
||||
_lazyTweens = TweenLiteInternals.lazyTweens,
|
||||
_lazyRender = TweenLiteInternals.lazyRender,
|
||||
_globals = _gsScope._gsDefine.globals,
|
||||
_copy = function(vars) {
|
||||
var copy = {}, p;
|
||||
for (p in vars) {
|
||||
copy[p] = vars[p];
|
||||
}
|
||||
return copy;
|
||||
},
|
||||
_applyCycle = function(vars, targets, i) {
|
||||
var alt = vars.cycle,
|
||||
p, val;
|
||||
for (p in alt) {
|
||||
val = alt[p];
|
||||
vars[p] = (typeof(val) === "function") ? val(i, targets[i], targets) : val[i % val.length];
|
||||
}
|
||||
delete vars.cycle;
|
||||
},
|
||||
_pauseCallback = _internals.pauseCallback = function() {},
|
||||
_slice = function(a) { //don't use [].slice because that doesn't work in IE8 with a NodeList that's returned by querySelectorAll()
|
||||
var b = [],
|
||||
l = a.length,
|
||||
i;
|
||||
for (i = 0; i !== l; b.push(a[i++]));
|
||||
return b;
|
||||
},
|
||||
_defaultImmediateRender = function(tl, toVars, fromVars, defaultFalse) { //default to immediateRender:true unless otherwise set in toVars, fromVars or if defaultFalse is passed in as true
|
||||
var ir = "immediateRender";
|
||||
if (!(ir in toVars)) {
|
||||
toVars[ir] = !(tl._paused || (fromVars && fromVars[ir] === false) || defaultFalse);
|
||||
}
|
||||
return toVars;
|
||||
},
|
||||
//for distributing values across an array. Can accept a number, a function or (most commonly) a function which can contain the following properties: {base, amount, from, ease, grid, axis, length}. Returns a function that expects the following parameters: index, target, array. Recognizes the following
|
||||
_distribute = function(v) {
|
||||
if (typeof(v) === "function") {
|
||||
return v;
|
||||
}
|
||||
var vars = isNaN(v) ? v : {n:1, from:(v < 0) ? ((v = -v) && "end") : 0}, //n:1 is just to indicate v was a number; we leverage that later to set v according to the length we get. If a number is passed in, we treat it like the old stagger value where 0.1, for example, would mean that things would be distributed with 0.1 between each element in the array rather than a total "amount" that's chunked out among them all.
|
||||
ease = vars.ease,
|
||||
from = vars.from || 0,
|
||||
base = vars.base || 0,
|
||||
cache = {},
|
||||
isFromKeyword = isNaN(from),
|
||||
axis = vars.axis,
|
||||
ratio = {center:0.5, end:1}[from] || 0;
|
||||
return function(i, target, a) {
|
||||
var l = (a || vars).length,
|
||||
distances = cache[l],
|
||||
originX, originY, x, y, d, j, max, min, wrap;
|
||||
if (!distances) {
|
||||
wrap = (vars.grid === "auto") ? 0 : (vars.grid || [Infinity])[0];
|
||||
if (!wrap) {
|
||||
max = -Infinity;
|
||||
while (max < (max = a[wrap++].getBoundingClientRect().left) && wrap < l) { }
|
||||
wrap--;
|
||||
}
|
||||
distances = cache[l] = [];
|
||||
originX = isFromKeyword ? (Math.min(wrap, l) * ratio) - 0.5 : from % wrap;
|
||||
originY = isFromKeyword ? l * ratio / wrap - 0.5 : (from / wrap) | 0;
|
||||
max = 0;
|
||||
min = Infinity;
|
||||
for (j = 0; j < l; j++) {
|
||||
x = (j % wrap) - originX;
|
||||
y = originY - ((j / wrap) | 0);
|
||||
distances[j] = d = !axis ? Math.sqrt(x * x + y * y) : Math.abs((axis === "y") ? y : x);
|
||||
if (d > max) {
|
||||
max = d;
|
||||
}
|
||||
if (d < min) {
|
||||
min = d;
|
||||
}
|
||||
}
|
||||
distances.max = max - min;
|
||||
distances.min = min;
|
||||
distances.v = vars.n ? l * (v || 0) : vars.amount;
|
||||
}
|
||||
l = (distances[i] - distances.min) / distances.max;
|
||||
return base + (ease ? ease.getRatio(l) : l) * distances.v;
|
||||
};
|
||||
},
|
||||
p = TimelineLite.prototype = new SimpleTimeline();
|
||||
|
||||
TimelineLite.version = "2.1.0";
|
||||
TimelineLite.distribute = _distribute;
|
||||
p.constructor = TimelineLite;
|
||||
p.kill()._gc = p._forcingPlayhead = p._hasPause = false;
|
||||
|
||||
/* might use later...
|
||||
//translates a local time inside an animation to the corresponding time on the root/global timeline, factoring in all nesting and timeScales.
|
||||
function localToGlobal(time, animation) {
|
||||
while (animation) {
|
||||
time = (time / animation._timeScale) + animation._startTime;
|
||||
animation = animation.timeline;
|
||||
}
|
||||
return time;
|
||||
}
|
||||
|
||||
//translates the supplied time on the root/global timeline into the corresponding local time inside a particular animation, factoring in all nesting and timeScales
|
||||
function globalToLocal(time, animation) {
|
||||
var scale = 1;
|
||||
time -= localToGlobal(0, animation);
|
||||
while (animation) {
|
||||
scale *= animation._timeScale;
|
||||
animation = animation.timeline;
|
||||
}
|
||||
return time * scale;
|
||||
}
|
||||
*/
|
||||
|
||||
p.to = function(target, duration, vars, position) {
|
||||
var Engine = (vars.repeat && _globals.TweenMax) || TweenLite;
|
||||
return duration ? this.add( new Engine(target, duration, vars), position) : this.set(target, vars, position);
|
||||
};
|
||||
|
||||
p.from = function(target, duration, vars, position) {
|
||||
return this.add( ((vars.repeat && _globals.TweenMax) || TweenLite).from(target, duration, _defaultImmediateRender(this, vars)), position);
|
||||
};
|
||||
|
||||
p.fromTo = function(target, duration, fromVars, toVars, position) {
|
||||
var Engine = (toVars.repeat && _globals.TweenMax) || TweenLite;
|
||||
toVars = _defaultImmediateRender(this, toVars, fromVars);
|
||||
return duration ? this.add( Engine.fromTo(target, duration, fromVars, toVars), position) : this.set(target, toVars, position);
|
||||
};
|
||||
|
||||
p.staggerTo = function(targets, duration, vars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope) {
|
||||
var tl = new TimelineLite({onComplete:onCompleteAll, onCompleteParams:onCompleteAllParams, callbackScope:onCompleteAllScope, smoothChildTiming:this.smoothChildTiming}),
|
||||
staggerFunc = _distribute(vars.stagger || stagger),
|
||||
startAt = vars.startAt,
|
||||
cycle = vars.cycle,
|
||||
copy, i;
|
||||
if (typeof(targets) === "string") {
|
||||
targets = TweenLite.selector(targets) || targets;
|
||||
}
|
||||
targets = targets || [];
|
||||
if (_isSelector(targets)) { //if the targets object is a selector, translate it into an array.
|
||||
targets = _slice(targets);
|
||||
}
|
||||
for (i = 0; i < targets.length; i++) {
|
||||
copy = _copy(vars);
|
||||
if (startAt) {
|
||||
copy.startAt = _copy(startAt);
|
||||
if (startAt.cycle) {
|
||||
_applyCycle(copy.startAt, targets, i);
|
||||
}
|
||||
}
|
||||
if (cycle) {
|
||||
_applyCycle(copy, targets, i);
|
||||
if (copy.duration != null) {
|
||||
duration = copy.duration;
|
||||
delete copy.duration;
|
||||
}
|
||||
}
|
||||
tl.to(targets[i], duration, copy, staggerFunc(i, targets[i], targets));
|
||||
}
|
||||
return this.add(tl, position);
|
||||
};
|
||||
|
||||
p.staggerFrom = function(targets, duration, vars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope) {
|
||||
vars.runBackwards = true;
|
||||
return this.staggerTo(targets, duration, _defaultImmediateRender(this, vars), stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope);
|
||||
};
|
||||
|
||||
p.staggerFromTo = function(targets, duration, fromVars, toVars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope) {
|
||||
toVars.startAt = fromVars;
|
||||
return this.staggerTo(targets, duration, _defaultImmediateRender(this, toVars, fromVars), stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope);
|
||||
};
|
||||
|
||||
p.call = function(callback, params, scope, position) {
|
||||
return this.add( TweenLite.delayedCall(0, callback, params, scope), position);
|
||||
};
|
||||
|
||||
p.set = function(target, vars, position) {
|
||||
return this.add( new TweenLite(target, 0, _defaultImmediateRender(this, vars, null, true)), position);
|
||||
};
|
||||
|
||||
TimelineLite.exportRoot = function(vars, ignoreDelayedCalls) {
|
||||
vars = vars || {};
|
||||
if (vars.smoothChildTiming == null) {
|
||||
vars.smoothChildTiming = true;
|
||||
}
|
||||
var tl = new TimelineLite(vars),
|
||||
root = tl._timeline,
|
||||
hasNegativeStart, time, tween, next;
|
||||
if (ignoreDelayedCalls == null) {
|
||||
ignoreDelayedCalls = true;
|
||||
}
|
||||
root._remove(tl, true);
|
||||
tl._startTime = 0;
|
||||
tl._rawPrevTime = tl._time = tl._totalTime = root._time;
|
||||
tween = root._first;
|
||||
while (tween) {
|
||||
next = tween._next;
|
||||
if (!ignoreDelayedCalls || !(tween instanceof TweenLite && tween.target === tween.vars.onComplete)) {
|
||||
time = tween._startTime - tween._delay;
|
||||
if (time < 0) {
|
||||
hasNegativeStart = 1;
|
||||
}
|
||||
tl.add(tween, time);
|
||||
}
|
||||
tween = next;
|
||||
}
|
||||
root.add(tl, 0);
|
||||
if (hasNegativeStart) { //calling totalDuration() will force the adjustment necessary to shift the children forward so none of them start before zero, and moves the timeline backwards the same amount, so the playhead is still aligned where it should be globally, but the timeline doesn't have illegal children that start before zero.
|
||||
tl.totalDuration();
|
||||
}
|
||||
return tl;
|
||||
};
|
||||
|
||||
p.add = function(value, position, align, stagger) {
|
||||
var self = this,
|
||||
curTime, l, i, child, tl, beforeRawTime;
|
||||
if (typeof(position) !== "number") {
|
||||
position = self._parseTimeOrLabel(position, 0, true, value);
|
||||
}
|
||||
if (!(value instanceof Animation)) {
|
||||
if ((value instanceof Array) || (value && value.push && _isArray(value))) {
|
||||
align = align || "normal";
|
||||
stagger = stagger || 0;
|
||||
curTime = position;
|
||||
l = value.length;
|
||||
for (i = 0; i < l; i++) {
|
||||
if (_isArray(child = value[i])) {
|
||||
child = new TimelineLite({tweens:child});
|
||||
}
|
||||
self.add(child, curTime);
|
||||
if (typeof(child) !== "string" && typeof(child) !== "function") {
|
||||
if (align === "sequence") {
|
||||
curTime = child._startTime + (child.totalDuration() / child._timeScale);
|
||||
} else if (align === "start") {
|
||||
child._startTime -= child.delay();
|
||||
}
|
||||
}
|
||||
curTime += stagger;
|
||||
}
|
||||
return self._uncache(true);
|
||||
} else if (typeof(value) === "string") {
|
||||
return self.addLabel(value, position);
|
||||
} else if (typeof(value) === "function") {
|
||||
value = TweenLite.delayedCall(0, value);
|
||||
} else {
|
||||
throw("Cannot add " + value + " into the timeline; it is not a tween, timeline, function, or string.");
|
||||
}
|
||||
}
|
||||
|
||||
SimpleTimeline.prototype.add.call(self, value, position);
|
||||
|
||||
if (value._time || (!value._duration && value._initted)) { //in case, for example, the _startTime is moved on a tween that has already rendered. Imagine it's at its end state, then the startTime is moved WAY later (after the end of this timeline), it should render at its beginning.
|
||||
curTime = (self.rawTime() - value._startTime) * value._timeScale;
|
||||
if (!value._duration || Math.abs(Math.max(0, Math.min(value.totalDuration(), curTime))) - value._totalTime > 0.00001) {
|
||||
value.render(curTime, false, false);
|
||||
}
|
||||
}
|
||||
|
||||
//if the timeline has already ended but the inserted tween/timeline extends the duration, we should enable this timeline again so that it renders properly. We should also align the playhead with the parent timeline's when appropriate.
|
||||
if (self._gc || self._time === self._duration) if (!self._paused) if (self._duration < self.duration()) {
|
||||
//in case any of the ancestors had completed but should now be enabled...
|
||||
tl = self;
|
||||
beforeRawTime = (tl.rawTime() > value._startTime); //if the tween is placed on the timeline so that it starts BEFORE the current rawTime, we should align the playhead (move the timeline). This is because sometimes users will create a timeline, let it finish, and much later append a tween and expect it to run instead of jumping to its end state. While technically one could argue that it should jump to its end state, that's not what users intuitively expect.
|
||||
while (tl._timeline) {
|
||||
if (beforeRawTime && tl._timeline.smoothChildTiming) {
|
||||
tl.totalTime(tl._totalTime, true); //moves the timeline (shifts its startTime) if necessary, and also enables it.
|
||||
} else if (tl._gc) {
|
||||
tl._enabled(true, false);
|
||||
}
|
||||
tl = tl._timeline;
|
||||
}
|
||||
}
|
||||
|
||||
return self;
|
||||
};
|
||||
|
||||
p.remove = function(value) {
|
||||
if (value instanceof Animation) {
|
||||
this._remove(value, false);
|
||||
var tl = value._timeline = value.vars.useFrames ? Animation._rootFramesTimeline : Animation._rootTimeline; //now that it's removed, default it to the root timeline so that if it gets played again, it doesn't jump back into this timeline.
|
||||
value._startTime = (value._paused ? value._pauseTime : tl._time) - ((!value._reversed ? value._totalTime : value.totalDuration() - value._totalTime) / value._timeScale); //ensure that if it gets played again, the timing is correct.
|
||||
return this;
|
||||
} else if (value instanceof Array || (value && value.push && _isArray(value))) {
|
||||
var i = value.length;
|
||||
while (--i > -1) {
|
||||
this.remove(value[i]);
|
||||
}
|
||||
return this;
|
||||
} else if (typeof(value) === "string") {
|
||||
return this.removeLabel(value);
|
||||
}
|
||||
return this.kill(null, value);
|
||||
};
|
||||
|
||||
p._remove = function(tween, skipDisable) {
|
||||
SimpleTimeline.prototype._remove.call(this, tween, skipDisable);
|
||||
var last = this._last;
|
||||
if (!last) {
|
||||
this._time = this._totalTime = this._duration = this._totalDuration = 0;
|
||||
} else if (this._time > this.duration()) {
|
||||
this._time = this._duration;
|
||||
this._totalTime = this._totalDuration;
|
||||
}
|
||||
return this;
|
||||
};
|
||||
|
||||
p.append = function(value, offsetOrLabel) {
|
||||
return this.add(value, this._parseTimeOrLabel(null, offsetOrLabel, true, value));
|
||||
};
|
||||
|
||||
p.insert = p.insertMultiple = function(value, position, align, stagger) {
|
||||
return this.add(value, position || 0, align, stagger);
|
||||
};
|
||||
|
||||
p.appendMultiple = function(tweens, offsetOrLabel, align, stagger) {
|
||||
return this.add(tweens, this._parseTimeOrLabel(null, offsetOrLabel, true, tweens), align, stagger);
|
||||
};
|
||||
|
||||
p.addLabel = function(label, position) {
|
||||
this._labels[label] = this._parseTimeOrLabel(position);
|
||||
return this;
|
||||
};
|
||||
|
||||
p.addPause = function(position, callback, params, scope) {
|
||||
var t = TweenLite.delayedCall(0, _pauseCallback, params, scope || this);
|
||||
t.vars.onComplete = t.vars.onReverseComplete = callback;
|
||||
t.data = "isPause";
|
||||
this._hasPause = true;
|
||||
return this.add(t, position);
|
||||
};
|
||||
|
||||
p.removeLabel = function(label) {
|
||||
delete this._labels[label];
|
||||
return this;
|
||||
};
|
||||
|
||||
p.getLabelTime = function(label) {
|
||||
return (this._labels[label] != null) ? this._labels[label] : -1;
|
||||
};
|
||||
|
||||
p._parseTimeOrLabel = function(timeOrLabel, offsetOrLabel, appendIfAbsent, ignore) {
|
||||
var clippedDuration, i;
|
||||
//if we're about to add a tween/timeline (or an array of them) that's already a child of this timeline, we should remove it first so that it doesn't contaminate the duration().
|
||||
if (ignore instanceof Animation && ignore.timeline === this) {
|
||||
this.remove(ignore);
|
||||
} else if (ignore && ((ignore instanceof Array) || (ignore.push && _isArray(ignore)))) {
|
||||
i = ignore.length;
|
||||
while (--i > -1) {
|
||||
if (ignore[i] instanceof Animation && ignore[i].timeline === this) {
|
||||
this.remove(ignore[i]);
|
||||
}
|
||||
}
|
||||
}
|
||||
clippedDuration = (typeof(timeOrLabel) === "number" && !offsetOrLabel) ? 0 : (this.duration() > 99999999999) ? this.recent().endTime(false) : this._duration; //in case there's a child that infinitely repeats, users almost never intend for the insertion point of a new child to be based on a SUPER long value like that so we clip it and assume the most recently-added child's endTime should be used instead.
|
||||
if (typeof(offsetOrLabel) === "string") {
|
||||
return this._parseTimeOrLabel(offsetOrLabel, (appendIfAbsent && typeof(timeOrLabel) === "number" && this._labels[offsetOrLabel] == null) ? timeOrLabel - clippedDuration : 0, appendIfAbsent);
|
||||
}
|
||||
offsetOrLabel = offsetOrLabel || 0;
|
||||
if (typeof(timeOrLabel) === "string" && (isNaN(timeOrLabel) || this._labels[timeOrLabel] != null)) { //if the string is a number like "1", check to see if there's a label with that name, otherwise interpret it as a number (absolute value).
|
||||
i = timeOrLabel.indexOf("=");
|
||||
if (i === -1) {
|
||||
if (this._labels[timeOrLabel] == null) {
|
||||
return appendIfAbsent ? (this._labels[timeOrLabel] = clippedDuration + offsetOrLabel) : offsetOrLabel;
|
||||
}
|
||||
return this._labels[timeOrLabel] + offsetOrLabel;
|
||||
}
|
||||
offsetOrLabel = parseInt(timeOrLabel.charAt(i-1) + "1", 10) * Number(timeOrLabel.substr(i+1));
|
||||
timeOrLabel = (i > 1) ? this._parseTimeOrLabel(timeOrLabel.substr(0, i-1), 0, appendIfAbsent) : clippedDuration;
|
||||
} else if (timeOrLabel == null) {
|
||||
timeOrLabel = clippedDuration;
|
||||
}
|
||||
return Number(timeOrLabel) + offsetOrLabel;
|
||||
};
|
||||
|
||||
p.seek = function(position, suppressEvents) {
|
||||
return this.totalTime((typeof(position) === "number") ? position : this._parseTimeOrLabel(position), (suppressEvents !== false));
|
||||
};
|
||||
|
||||
p.stop = function() {
|
||||
return this.paused(true);
|
||||
};
|
||||
|
||||
p.gotoAndPlay = function(position, suppressEvents) {
|
||||
return this.play(position, suppressEvents);
|
||||
};
|
||||
|
||||
p.gotoAndStop = function(position, suppressEvents) {
|
||||
return this.pause(position, suppressEvents);
|
||||
};
|
||||
|
||||
p.render = function(time, suppressEvents, force) {
|
||||
if (this._gc) {
|
||||
this._enabled(true, false);
|
||||
}
|
||||
var self = this,
|
||||
prevTime = self._time,
|
||||
totalDur = (!self._dirty) ? self._totalDuration : self.totalDuration(),
|
||||
prevStart = self._startTime,
|
||||
prevTimeScale = self._timeScale,
|
||||
prevPaused = self._paused,
|
||||
tween, isComplete, next, callback, internalForce, pauseTween, curTime, pauseTime;
|
||||
if (prevTime !== self._time) { //if totalDuration() finds a child with a negative startTime and smoothChildTiming is true, things get shifted around internally so we need to adjust the time accordingly. For example, if a tween starts at -30 we must shift EVERYTHING forward 30 seconds and move this timeline's startTime backward by 30 seconds so that things align with the playhead (no jump).
|
||||
time += self._time - prevTime;
|
||||
}
|
||||
if (time >= totalDur - _tinyNum && time >= 0) { //to work around occasional floating point math artifacts.
|
||||
self._totalTime = self._time = totalDur;
|
||||
if (!self._reversed) if (!self._hasPausedChild()) {
|
||||
isComplete = true;
|
||||
callback = "onComplete";
|
||||
internalForce = !!self._timeline.autoRemoveChildren; //otherwise, if the animation is unpaused/activated after it's already finished, it doesn't get removed from the parent timeline.
|
||||
if (self._duration === 0) if ((time <= 0 && time >= -_tinyNum) || self._rawPrevTime < 0 || self._rawPrevTime === _tinyNum) if (self._rawPrevTime !== time && self._first) {
|
||||
internalForce = true;
|
||||
if (self._rawPrevTime > _tinyNum) {
|
||||
callback = "onReverseComplete";
|
||||
}
|
||||
}
|
||||
}
|
||||
self._rawPrevTime = (self._duration || !suppressEvents || time || self._rawPrevTime === time) ? time : _tinyNum; //when the playhead arrives at EXACTLY time 0 (right on top) of a zero-duration timeline or tween, we need to discern if events are suppressed so that when the playhead moves again (next time), it'll trigger the callback. If events are NOT suppressed, obviously the callback would be triggered in this render. Basically, the callback should fire either when the playhead ARRIVES or LEAVES this exact spot, not both. Imagine doing a timeline.seek(0) and there's a callback that sits at 0. Since events are suppressed on that seek() by default, nothing will fire, but when the playhead moves off of that position, the callback should fire. This behavior is what people intuitively expect. We set the _rawPrevTime to be a precise tiny number to indicate this scenario rather than using another property/variable which would increase memory usage. This technique is less readable, but more efficient.
|
||||
time = totalDur + 0.0001; //to avoid occasional floating point rounding errors - sometimes child tweens/timelines were not being fully completed (their progress might be 0.999999999999998 instead of 1 because when _time - tween._startTime is performed, floating point errors would return a value that was SLIGHTLY off). Try (999999999999.7 - 999999999999) * 1 = 0.699951171875 instead of 0.7.
|
||||
|
||||
} else if (time < _tinyNum) { //to work around occasional floating point math artifacts, round super small values to 0.
|
||||
self._totalTime = self._time = 0;
|
||||
if (time > -_tinyNum) {
|
||||
time = 0;
|
||||
}
|
||||
if (prevTime !== 0 || (self._duration === 0 && self._rawPrevTime !== _tinyNum && (self._rawPrevTime > 0 || (time < 0 && self._rawPrevTime >= 0)))) {
|
||||
callback = "onReverseComplete";
|
||||
isComplete = self._reversed;
|
||||
}
|
||||
if (time < 0) {
|
||||
self._active = false;
|
||||
if (self._timeline.autoRemoveChildren && self._reversed) { //ensures proper GC if a timeline is resumed after it's finished reversing.
|
||||
internalForce = isComplete = true;
|
||||
callback = "onReverseComplete";
|
||||
} else if (self._rawPrevTime >= 0 && self._first) { //when going back beyond the start, force a render so that zero-duration tweens that sit at the very beginning render their start values properly. Otherwise, if the parent timeline's playhead lands exactly at this timeline's startTime, and then moves backwards, the zero-duration tweens at the beginning would still be at their end state.
|
||||
internalForce = true;
|
||||
}
|
||||
self._rawPrevTime = time;
|
||||
} else {
|
||||
self._rawPrevTime = (self._duration || !suppressEvents || time || self._rawPrevTime === time) ? time : _tinyNum; //when the playhead arrives at EXACTLY time 0 (right on top) of a zero-duration timeline or tween, we need to discern if events are suppressed so that when the playhead moves again (next time), it'll trigger the callback. If events are NOT suppressed, obviously the callback would be triggered in this render. Basically, the callback should fire either when the playhead ARRIVES or LEAVES this exact spot, not both. Imagine doing a timeline.seek(0) and there's a callback that sits at 0. Since events are suppressed on that seek() by default, nothing will fire, but when the playhead moves off of that position, the callback should fire. This behavior is what people intuitively expect. We set the _rawPrevTime to be a precise tiny number to indicate this scenario rather than using another property/variable which would increase memory usage. This technique is less readable, but more efficient.
|
||||
if (time === 0 && isComplete) { //if there's a zero-duration tween at the very beginning of a timeline and the playhead lands EXACTLY at time 0, that tween will correctly render its end values, but we need to keep the timeline alive for one more render so that the beginning values render properly as the parent's playhead keeps moving beyond the begining. Imagine obj.x starts at 0 and then we do tl.set(obj, {x:100}).to(obj, 1, {x:200}) and then later we tl.reverse()...the goal is to have obj.x revert to 0. If the playhead happens to land on exactly 0, without this chunk of code, it'd complete the timeline and remove it from the rendering queue (not good).
|
||||
tween = self._first;
|
||||
while (tween && tween._startTime === 0) {
|
||||
if (!tween._duration) {
|
||||
isComplete = false;
|
||||
}
|
||||
tween = tween._next;
|
||||
}
|
||||
}
|
||||
time = 0; //to avoid occasional floating point rounding errors (could cause problems especially with zero-duration tweens at the very beginning of the timeline)
|
||||
if (!self._initted) {
|
||||
internalForce = true;
|
||||
}
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
if (self._hasPause && !self._forcingPlayhead && !suppressEvents) {
|
||||
if (time >= prevTime) {
|
||||
tween = self._first;
|
||||
while (tween && tween._startTime <= time && !pauseTween) {
|
||||
if (!tween._duration) if (tween.data === "isPause" && !tween.ratio && !(tween._startTime === 0 && self._rawPrevTime === 0)) {
|
||||
pauseTween = tween;
|
||||
}
|
||||
tween = tween._next;
|
||||
}
|
||||
} else {
|
||||
tween = self._last;
|
||||
while (tween && tween._startTime >= time && !pauseTween) {
|
||||
if (!tween._duration) if (tween.data === "isPause" && tween._rawPrevTime > 0) {
|
||||
pauseTween = tween;
|
||||
}
|
||||
tween = tween._prev;
|
||||
}
|
||||
}
|
||||
if (pauseTween) {
|
||||
self._time = self._totalTime = time = pauseTween._startTime;
|
||||
pauseTime = self._startTime + (time / self._timeScale);
|
||||
}
|
||||
}
|
||||
|
||||
self._totalTime = self._time = self._rawPrevTime = time;
|
||||
}
|
||||
if ((self._time === prevTime || !self._first) && !force && !internalForce && !pauseTween) {
|
||||
return;
|
||||
} else if (!self._initted) {
|
||||
self._initted = true;
|
||||
}
|
||||
|
||||
if (!self._active) if (!self._paused && self._time !== prevTime && time > 0) {
|
||||
self._active = true; //so that if the user renders the timeline (as opposed to the parent timeline rendering it), it is forced to re-render and align it with the proper time/frame on the next rendering cycle. Maybe the timeline already finished but the user manually re-renders it as halfway done, for example.
|
||||
}
|
||||
|
||||
if (prevTime === 0) if (self.vars.onStart) if (self._time !== 0 || !self._duration) if (!suppressEvents) {
|
||||
self._callback("onStart");
|
||||
}
|
||||
|
||||
curTime = self._time;
|
||||
if (curTime >= prevTime) {
|
||||
tween = self._first;
|
||||
while (tween) {
|
||||
next = tween._next; //record it here because the value could change after rendering...
|
||||
if (curTime !== self._time || (self._paused && !prevPaused)) { //in case a tween pauses or seeks the timeline when rendering, like inside of an onUpdate/onComplete
|
||||
break;
|
||||
} else if (tween._active || (tween._startTime <= curTime && !tween._paused && !tween._gc)) {
|
||||
if (pauseTween === tween) {
|
||||
self.pause();
|
||||
self._pauseTime = pauseTime; //so that when we resume(), it's starting from exactly the right spot (the pause() method uses the rawTime for the parent, but that may be a bit too far ahead)
|
||||
}
|
||||
if (!tween._reversed) {
|
||||
tween.render((time - tween._startTime) * tween._timeScale, suppressEvents, force);
|
||||
} else {
|
||||
tween.render(((!tween._dirty) ? tween._totalDuration : tween.totalDuration()) - ((time - tween._startTime) * tween._timeScale), suppressEvents, force);
|
||||
}
|
||||
}
|
||||
tween = next;
|
||||
}
|
||||
} else {
|
||||
tween = self._last;
|
||||
while (tween) {
|
||||
next = tween._prev; //record it here because the value could change after rendering...
|
||||
if (curTime !== self._time || (self._paused && !prevPaused)) { //in case a tween pauses or seeks the timeline when rendering, like inside of an onUpdate/onComplete
|
||||
break;
|
||||
} else if (tween._active || (tween._startTime <= prevTime && !tween._paused && !tween._gc)) {
|
||||
if (pauseTween === tween) {
|
||||
pauseTween = tween._prev; //the linked list is organized by _startTime, thus it's possible that a tween could start BEFORE the pause and end after it, in which case it would be positioned before the pause tween in the linked list, but we should render it before we pause() the timeline and cease rendering. This is only a concern when going in reverse.
|
||||
while (pauseTween && pauseTween.endTime() > self._time) {
|
||||
pauseTween.render( (pauseTween._reversed ? pauseTween.totalDuration() - ((time - pauseTween._startTime) * pauseTween._timeScale) : (time - pauseTween._startTime) * pauseTween._timeScale), suppressEvents, force);
|
||||
pauseTween = pauseTween._prev;
|
||||
}
|
||||
pauseTween = null;
|
||||
self.pause();
|
||||
self._pauseTime = pauseTime; //so that when we resume(), it's starting from exactly the right spot (the pause() method uses the rawTime for the parent, but that may be a bit too far ahead)
|
||||
}
|
||||
if (!tween._reversed) {
|
||||
tween.render((time - tween._startTime) * tween._timeScale, suppressEvents, force);
|
||||
} else {
|
||||
tween.render(((!tween._dirty) ? tween._totalDuration : tween.totalDuration()) - ((time - tween._startTime) * tween._timeScale), suppressEvents, force);
|
||||
}
|
||||
}
|
||||
tween = next;
|
||||
}
|
||||
}
|
||||
|
||||
if (self._onUpdate) if (!suppressEvents) {
|
||||
if (_lazyTweens.length) { //in case rendering caused any tweens to lazy-init, we should render them because typically when a timeline finishes, users expect things to have rendered fully. Imagine an onUpdate on a timeline that reports/checks tweened values.
|
||||
_lazyRender();
|
||||
}
|
||||
self._callback("onUpdate");
|
||||
}
|
||||
|
||||
if (callback) if (!self._gc) if (prevStart === self._startTime || prevTimeScale !== self._timeScale) if (self._time === 0 || totalDur >= self.totalDuration()) { //if one of the tweens that was rendered altered this timeline's startTime (like if an onComplete reversed the timeline), it probably isn't complete. If it is, don't worry, because whatever call altered the startTime would complete if it was necessary at the new time. The only exception is the timeScale property. Also check _gc because there's a chance that kill() could be called in an onUpdate
|
||||
if (isComplete) {
|
||||
if (_lazyTweens.length) { //in case rendering caused any tweens to lazy-init, we should render them because typically when a timeline finishes, users expect things to have rendered fully. Imagine an onComplete on a timeline that reports/checks tweened values.
|
||||
_lazyRender();
|
||||
}
|
||||
if (self._timeline.autoRemoveChildren) {
|
||||
self._enabled(false, false);
|
||||
}
|
||||
self._active = false;
|
||||
}
|
||||
if (!suppressEvents && self.vars[callback]) {
|
||||
self._callback(callback);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
p._hasPausedChild = function() {
|
||||
var tween = this._first;
|
||||
while (tween) {
|
||||
if (tween._paused || ((tween instanceof TimelineLite) && tween._hasPausedChild())) {
|
||||
return true;
|
||||
}
|
||||
tween = tween._next;
|
||||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
p.getChildren = function(nested, tweens, timelines, ignoreBeforeTime) {
|
||||
ignoreBeforeTime = ignoreBeforeTime || -9999999999;
|
||||
var a = [],
|
||||
tween = this._first,
|
||||
cnt = 0;
|
||||
while (tween) {
|
||||
if (tween._startTime < ignoreBeforeTime) {
|
||||
//do nothing
|
||||
} else if (tween instanceof TweenLite) {
|
||||
if (tweens !== false) {
|
||||
a[cnt++] = tween;
|
||||
}
|
||||
} else {
|
||||
if (timelines !== false) {
|
||||
a[cnt++] = tween;
|
||||
}
|
||||
if (nested !== false) {
|
||||
a = a.concat(tween.getChildren(true, tweens, timelines));
|
||||
cnt = a.length;
|
||||
}
|
||||
}
|
||||
tween = tween._next;
|
||||
}
|
||||
return a;
|
||||
};
|
||||
|
||||
p.getTweensOf = function(target, nested) {
|
||||
var disabled = this._gc,
|
||||
a = [],
|
||||
cnt = 0,
|
||||
tweens, i;
|
||||
if (disabled) {
|
||||
this._enabled(true, true); //getTweensOf() filters out disabled tweens, and we have to mark them as _gc = true when the timeline completes in order to allow clean garbage collection, so temporarily re-enable the timeline here.
|
||||
}
|
||||
tweens = TweenLite.getTweensOf(target);
|
||||
i = tweens.length;
|
||||
while (--i > -1) {
|
||||
if (tweens[i].timeline === this || (nested && this._contains(tweens[i]))) {
|
||||
a[cnt++] = tweens[i];
|
||||
}
|
||||
}
|
||||
if (disabled) {
|
||||
this._enabled(false, true);
|
||||
}
|
||||
return a;
|
||||
};
|
||||
|
||||
p.recent = function() {
|
||||
return this._recent;
|
||||
};
|
||||
|
||||
p._contains = function(tween) {
|
||||
var tl = tween.timeline;
|
||||
while (tl) {
|
||||
if (tl === this) {
|
||||
return true;
|
||||
}
|
||||
tl = tl.timeline;
|
||||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
p.shiftChildren = function(amount, adjustLabels, ignoreBeforeTime) {
|
||||
ignoreBeforeTime = ignoreBeforeTime || 0;
|
||||
var tween = this._first,
|
||||
labels = this._labels,
|
||||
p;
|
||||
while (tween) {
|
||||
if (tween._startTime >= ignoreBeforeTime) {
|
||||
tween._startTime += amount;
|
||||
}
|
||||
tween = tween._next;
|
||||
}
|
||||
if (adjustLabels) {
|
||||
for (p in labels) {
|
||||
if (labels[p] >= ignoreBeforeTime) {
|
||||
labels[p] += amount;
|
||||
}
|
||||
}
|
||||
}
|
||||
return this._uncache(true);
|
||||
};
|
||||
|
||||
p._kill = function(vars, target) {
|
||||
if (!vars && !target) {
|
||||
return this._enabled(false, false);
|
||||
}
|
||||
var tweens = (!target) ? this.getChildren(true, true, false) : this.getTweensOf(target),
|
||||
i = tweens.length,
|
||||
changed = false;
|
||||
while (--i > -1) {
|
||||
if (tweens[i]._kill(vars, target)) {
|
||||
changed = true;
|
||||
}
|
||||
}
|
||||
return changed;
|
||||
};
|
||||
|
||||
p.clear = function(labels) {
|
||||
var tweens = this.getChildren(false, true, true),
|
||||
i = tweens.length;
|
||||
this._time = this._totalTime = 0;
|
||||
while (--i > -1) {
|
||||
tweens[i]._enabled(false, false);
|
||||
}
|
||||
if (labels !== false) {
|
||||
this._labels = {};
|
||||
}
|
||||
return this._uncache(true);
|
||||
};
|
||||
|
||||
p.invalidate = function() {
|
||||
var tween = this._first;
|
||||
while (tween) {
|
||||
tween.invalidate();
|
||||
tween = tween._next;
|
||||
}
|
||||
return Animation.prototype.invalidate.call(this);;
|
||||
};
|
||||
|
||||
p._enabled = function(enabled, ignoreTimeline) {
|
||||
if (enabled === this._gc) {
|
||||
var tween = this._first;
|
||||
while (tween) {
|
||||
tween._enabled(enabled, true);
|
||||
tween = tween._next;
|
||||
}
|
||||
}
|
||||
return SimpleTimeline.prototype._enabled.call(this, enabled, ignoreTimeline);
|
||||
};
|
||||
|
||||
p.totalTime = function(time, suppressEvents, uncapped) {
|
||||
this._forcingPlayhead = true;
|
||||
var val = Animation.prototype.totalTime.apply(this, arguments);
|
||||
this._forcingPlayhead = false;
|
||||
return val;
|
||||
};
|
||||
|
||||
p.duration = function(value) {
|
||||
if (!arguments.length) {
|
||||
if (this._dirty) {
|
||||
this.totalDuration(); //just triggers recalculation
|
||||
}
|
||||
return this._duration;
|
||||
}
|
||||
if (this.duration() !== 0 && value !== 0) {
|
||||
this.timeScale(this._duration / value);
|
||||
}
|
||||
return this;
|
||||
};
|
||||
|
||||
p.totalDuration = function(value) {
|
||||
if (!arguments.length) {
|
||||
if (this._dirty) {
|
||||
var max = 0,
|
||||
self = this,
|
||||
tween = self._last,
|
||||
prevStart = 999999999999,
|
||||
prev, end;
|
||||
while (tween) {
|
||||
prev = tween._prev; //record it here in case the tween changes position in the sequence...
|
||||
if (tween._dirty) {
|
||||
tween.totalDuration(); //could change the tween._startTime, so make sure the tween's cache is clean before analyzing it.
|
||||
}
|
||||
if (tween._startTime > prevStart && self._sortChildren && !tween._paused && !self._calculatingDuration) { //in case one of the tweens shifted out of order, it needs to be re-inserted into the correct position in the sequence
|
||||
self._calculatingDuration = 1; //prevent endless recursive calls - there are methods that get triggered that check duration/totalDuration when we add(), like _parseTimeOrLabel().
|
||||
self.add(tween, tween._startTime - tween._delay);
|
||||
self._calculatingDuration = 0;
|
||||
} else {
|
||||
prevStart = tween._startTime;
|
||||
}
|
||||
if (tween._startTime < 0 && !tween._paused) { //children aren't allowed to have negative startTimes unless smoothChildTiming is true, so adjust here if one is found.
|
||||
max -= tween._startTime;
|
||||
if (self._timeline.smoothChildTiming) {
|
||||
self._startTime += tween._startTime / self._timeScale;
|
||||
self._time -= tween._startTime;
|
||||
self._totalTime -= tween._startTime;
|
||||
self._rawPrevTime -= tween._startTime;
|
||||
}
|
||||
self.shiftChildren(-tween._startTime, false, -9999999999);
|
||||
prevStart = 0;
|
||||
}
|
||||
end = tween._startTime + (tween._totalDuration / tween._timeScale);
|
||||
if (end > max) {
|
||||
max = end;
|
||||
}
|
||||
tween = prev;
|
||||
}
|
||||
self._duration = self._totalDuration = max;
|
||||
self._dirty = false;
|
||||
}
|
||||
return this._totalDuration;
|
||||
}
|
||||
return (value && this.totalDuration()) ? this.timeScale(this._totalDuration / value) : this;
|
||||
};
|
||||
|
||||
p.paused = function(value) {
|
||||
if (value === false && this._paused) { //if there's a pause directly at the spot from where we're unpausing, skip it.
|
||||
var tween = this._first;
|
||||
while (tween) {
|
||||
if (tween._startTime === this._time && tween.data === "isPause") {
|
||||
tween._rawPrevTime = 0; //remember, _rawPrevTime is how zero-duration tweens/callbacks sense directionality and determine whether or not to fire. If _rawPrevTime is the same as _startTime on the next render, it won't fire.
|
||||
}
|
||||
tween = tween._next;
|
||||
}
|
||||
}
|
||||
return Animation.prototype.paused.apply(this, arguments);
|
||||
};
|
||||
|
||||
p.usesFrames = function() {
|
||||
var tl = this._timeline;
|
||||
while (tl._timeline) {
|
||||
tl = tl._timeline;
|
||||
}
|
||||
return (tl === Animation._rootFramesTimeline);
|
||||
};
|
||||
|
||||
p.rawTime = function(wrapRepeats) {
|
||||
return (wrapRepeats && (this._paused || (this._repeat && this.time() > 0 && this.totalProgress() < 1))) ? this._totalTime % (this._duration + this._repeatDelay) : this._paused ? this._totalTime : (this._timeline.rawTime(wrapRepeats) - this._startTime) * this._timeScale;
|
||||
};
|
||||
|
||||
return TimelineLite;
|
||||
|
||||
}, true);
|
||||
|
||||
export var TimelineLite = globals.TimelineLite;
|
||||
export { TimelineLite as default };
|
||||
+523
@@ -0,0 +1,523 @@
|
||||
/*!
|
||||
* VERSION: 2.1.0
|
||||
* DATE: 2019-02-15
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
*/
|
||||
/* eslint-disable */
|
||||
|
||||
import TweenLite, { _gsScope, globals, Ease, Animation } from "./TweenLite.js";
|
||||
import TimelineLite from "./TimelineLite.js";
|
||||
|
||||
_gsScope._gsDefine("TimelineMax", ["TimelineLite","TweenLite","easing.Ease"], function() {
|
||||
|
||||
var TimelineMax = function(vars) {
|
||||
TimelineLite.call(this, vars);
|
||||
this._repeat = this.vars.repeat || 0;
|
||||
this._repeatDelay = this.vars.repeatDelay || 0;
|
||||
this._cycle = 0;
|
||||
this._yoyo = !!this.vars.yoyo;
|
||||
this._dirty = true;
|
||||
},
|
||||
_tinyNum = 0.00000001,
|
||||
TweenLiteInternals = TweenLite._internals,
|
||||
_lazyTweens = TweenLiteInternals.lazyTweens,
|
||||
_lazyRender = TweenLiteInternals.lazyRender,
|
||||
_globals = _gsScope._gsDefine.globals,
|
||||
_easeNone = new Ease(null, null, 1, 0),
|
||||
p = TimelineMax.prototype = new TimelineLite();
|
||||
|
||||
p.constructor = TimelineMax;
|
||||
p.kill()._gc = false;
|
||||
TimelineMax.version = "2.1.0";
|
||||
|
||||
p.invalidate = function() {
|
||||
this._yoyo = !!this.vars.yoyo;
|
||||
this._repeat = this.vars.repeat || 0;
|
||||
this._repeatDelay = this.vars.repeatDelay || 0;
|
||||
this._uncache(true);
|
||||
return TimelineLite.prototype.invalidate.call(this);
|
||||
};
|
||||
|
||||
p.addCallback = function(callback, position, params, scope) {
|
||||
return this.add( TweenLite.delayedCall(0, callback, params, scope), position);
|
||||
};
|
||||
|
||||
p.removeCallback = function(callback, position) {
|
||||
if (callback) {
|
||||
if (position == null) {
|
||||
this._kill(null, callback);
|
||||
} else {
|
||||
var a = this.getTweensOf(callback, false),
|
||||
i = a.length,
|
||||
time = this._parseTimeOrLabel(position);
|
||||
while (--i > -1) {
|
||||
if (a[i]._startTime === time) {
|
||||
a[i]._enabled(false, false);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return this;
|
||||
};
|
||||
|
||||
p.removePause = function(position) {
|
||||
return this.removeCallback(TimelineLite._internals.pauseCallback, position);
|
||||
};
|
||||
|
||||
p.tweenTo = function(position, vars) {
|
||||
vars = vars || {};
|
||||
var copy = {ease:_easeNone, useFrames:this.usesFrames(), immediateRender:false, lazy:false},
|
||||
Engine = (vars.repeat && _globals.TweenMax) || TweenLite,
|
||||
duration, p, t;
|
||||
for (p in vars) {
|
||||
copy[p] = vars[p];
|
||||
}
|
||||
copy.time = this._parseTimeOrLabel(position);
|
||||
duration = (Math.abs(Number(copy.time) - this._time) / this._timeScale) || 0.001;
|
||||
t = new Engine(this, duration, copy);
|
||||
copy.onStart = function() {
|
||||
t.target.paused(true);
|
||||
if (t.vars.time !== t.target.time() && duration === t.duration() && !t.isFromTo) { //don't make the duration zero - if it's supposed to be zero, don't worry because it's already initting the tween and will complete immediately, effectively making the duration zero anyway. If we make duration zero, the tween won't run at all.
|
||||
t.duration( Math.abs( t.vars.time - t.target.time()) / t.target._timeScale ).render(t.time(), true, true); //render() right away to ensure that things look right, especially in the case of .tweenTo(0).
|
||||
}
|
||||
if (vars.onStart) { //in case the user had an onStart in the vars - we don't want to overwrite it.
|
||||
vars.onStart.apply(vars.onStartScope || vars.callbackScope || t, vars.onStartParams || []); //don't use t._callback("onStart") or it'll point to the copy.onStart and we'll get a recursion error.
|
||||
}
|
||||
};
|
||||
return t;
|
||||
};
|
||||
|
||||
p.tweenFromTo = function(fromPosition, toPosition, vars) {
|
||||
vars = vars || {};
|
||||
fromPosition = this._parseTimeOrLabel(fromPosition);
|
||||
vars.startAt = {onComplete:this.seek, onCompleteParams:[fromPosition], callbackScope:this};
|
||||
vars.immediateRender = (vars.immediateRender !== false);
|
||||
var t = this.tweenTo(toPosition, vars);
|
||||
t.isFromTo = 1; //to ensure we don't mess with the duration in the onStart (we've got the start and end values here, so lock it in)
|
||||
return t.duration((Math.abs( t.vars.time - fromPosition) / this._timeScale) || 0.001);
|
||||
};
|
||||
|
||||
p.render = function(time, suppressEvents, force) {
|
||||
if (this._gc) {
|
||||
this._enabled(true, false);
|
||||
}
|
||||
var self = this,
|
||||
prevTime = self._time,
|
||||
totalDur = (!self._dirty) ? self._totalDuration : self.totalDuration(),
|
||||
dur = self._duration,
|
||||
prevTotalTime = self._totalTime,
|
||||
prevStart = self._startTime,
|
||||
prevTimeScale = self._timeScale,
|
||||
prevRawPrevTime = self._rawPrevTime,
|
||||
prevPaused = self._paused,
|
||||
prevCycle = self._cycle,
|
||||
tween, isComplete, next, callback, internalForce, cycleDuration, pauseTween, curTime, pauseTime;
|
||||
if (prevTime !== self._time) { //if totalDuration() finds a child with a negative startTime and smoothChildTiming is true, things get shifted around internally so we need to adjust the time accordingly. For example, if a tween starts at -30 we must shift EVERYTHING forward 30 seconds and move this timeline's startTime backward by 30 seconds so that things align with the playhead (no jump).
|
||||
time += self._time - prevTime;
|
||||
}
|
||||
if (time >= totalDur - _tinyNum && time >= 0) { //to work around occasional floating point math artifacts.
|
||||
if (!self._locked) {
|
||||
self._totalTime = totalDur;
|
||||
self._cycle = self._repeat;
|
||||
}
|
||||
if (!self._reversed) if (!self._hasPausedChild()) {
|
||||
isComplete = true;
|
||||
callback = "onComplete";
|
||||
internalForce = !!self._timeline.autoRemoveChildren; //otherwise, if the animation is unpaused/activated after it's already finished, it doesn't get removed from the parent timeline.
|
||||
if (self._duration === 0) if ((time <= 0 && time >= -_tinyNum) || prevRawPrevTime < 0 || prevRawPrevTime === _tinyNum) if (prevRawPrevTime !== time && self._first) {
|
||||
internalForce = true;
|
||||
if (prevRawPrevTime > _tinyNum) {
|
||||
callback = "onReverseComplete";
|
||||
}
|
||||
}
|
||||
}
|
||||
self._rawPrevTime = (self._duration || !suppressEvents || time || self._rawPrevTime === time) ? time : _tinyNum; //when the playhead arrives at EXACTLY time 0 (right on top) of a zero-duration timeline or tween, we need to discern if events are suppressed so that when the playhead moves again (next time), it'll trigger the callback. If events are NOT suppressed, obviously the callback would be triggered in this render. Basically, the callback should fire either when the playhead ARRIVES or LEAVES this exact spot, not both. Imagine doing a timeline.seek(0) and there's a callback that sits at 0. Since events are suppressed on that seek() by default, nothing will fire, but when the playhead moves off of that position, the callback should fire. This behavior is what people intuitively expect. We set the _rawPrevTime to be a precise tiny number to indicate this scenario rather than using another property/variable which would increase memory usage. This technique is less readable, but more efficient.
|
||||
if (self._yoyo && (self._cycle & 1)) {
|
||||
self._time = time = 0;
|
||||
} else {
|
||||
self._time = dur;
|
||||
time = dur + 0.0001; //to avoid occasional floating point rounding errors - sometimes child tweens/timelines were not being fully completed (their progress might be 0.999999999999998 instead of 1 because when _time - tween._startTime is performed, floating point errors would return a value that was SLIGHTLY off). Try (999999999999.7 - 999999999999) * 1 = 0.699951171875 instead of 0.7. We cannot do less then 0.0001 because the same issue can occur when the duration is extremely large like 999999999999 in which case adding 0.00000001, for example, causes it to act like nothing was added.
|
||||
}
|
||||
|
||||
} else if (time < _tinyNum) { //to work around occasional floating point math artifacts, round super small values to 0.
|
||||
if (!self._locked) {
|
||||
self._totalTime = self._cycle = 0;
|
||||
}
|
||||
self._time = 0;
|
||||
if (time > -_tinyNum) {
|
||||
time = 0;
|
||||
}
|
||||
if (prevTime !== 0 || (dur === 0 && prevRawPrevTime !== _tinyNum && (prevRawPrevTime > 0 || (time < 0 && prevRawPrevTime >= 0)) && !self._locked)) { //edge case for checking time < 0 && prevRawPrevTime >= 0: a zero-duration fromTo() tween inside a zero-duration timeline (yeah, very rare)
|
||||
callback = "onReverseComplete";
|
||||
isComplete = self._reversed;
|
||||
}
|
||||
if (time < 0) {
|
||||
self._active = false;
|
||||
if (self._timeline.autoRemoveChildren && self._reversed) {
|
||||
internalForce = isComplete = true;
|
||||
callback = "onReverseComplete";
|
||||
} else if (prevRawPrevTime >= 0 && self._first) { //when going back beyond the start, force a render so that zero-duration tweens that sit at the very beginning render their start values properly. Otherwise, if the parent timeline's playhead lands exactly at this timeline's startTime, and then moves backwards, the zero-duration tweens at the beginning would still be at their end state.
|
||||
internalForce = true;
|
||||
}
|
||||
self._rawPrevTime = time;
|
||||
} else {
|
||||
self._rawPrevTime = (dur || !suppressEvents || time || self._rawPrevTime === time) ? time : _tinyNum; //when the playhead arrives at EXACTLY time 0 (right on top) of a zero-duration timeline or tween, we need to discern if events are suppressed so that when the playhead moves again (next time), it'll trigger the callback. If events are NOT suppressed, obviously the callback would be triggered in this render. Basically, the callback should fire either when the playhead ARRIVES or LEAVES this exact spot, not both. Imagine doing a timeline.seek(0) and there's a callback that sits at 0. Since events are suppressed on that seek() by default, nothing will fire, but when the playhead moves off of that position, the callback should fire. This behavior is what people intuitively expect. We set the _rawPrevTime to be a precise tiny number to indicate this scenario rather than using another property/variable which would increase memory usage. This technique is less readable, but more efficient.
|
||||
if (time === 0 && isComplete) { //if there's a zero-duration tween at the very beginning of a timeline and the playhead lands EXACTLY at time 0, that tween will correctly render its end values, but we need to keep the timeline alive for one more render so that the beginning values render properly as the parent's playhead keeps moving beyond the begining. Imagine obj.x starts at 0 and then we do tl.set(obj, {x:100}).to(obj, 1, {x:200}) and then later we tl.reverse()...the goal is to have obj.x revert to 0. If the playhead happens to land on exactly 0, without this chunk of code, it'd complete the timeline and remove it from the rendering queue (not good).
|
||||
tween = self._first;
|
||||
while (tween && tween._startTime === 0) {
|
||||
if (!tween._duration) {
|
||||
isComplete = false;
|
||||
}
|
||||
tween = tween._next;
|
||||
}
|
||||
}
|
||||
time = 0; //to avoid occasional floating point rounding errors (could cause problems especially with zero-duration tweens at the very beginning of the timeline)
|
||||
if (!self._initted) {
|
||||
internalForce = true;
|
||||
}
|
||||
}
|
||||
|
||||
} else {
|
||||
if (dur === 0 && prevRawPrevTime < 0) { //without this, zero-duration repeating timelines (like with a simple callback nested at the very beginning and a repeatDelay) wouldn't render the first time through.
|
||||
internalForce = true;
|
||||
}
|
||||
self._time = self._rawPrevTime = time;
|
||||
if (!self._locked) {
|
||||
self._totalTime = time;
|
||||
if (self._repeat !== 0) {
|
||||
cycleDuration = dur + self._repeatDelay;
|
||||
self._cycle = (self._totalTime / cycleDuration) >> 0; //originally _totalTime % cycleDuration but floating point errors caused problems, so I normalized it. (4 % 0.8 should be 0 but it gets reported as 0.79999999!)
|
||||
if (self._cycle) if (self._cycle === self._totalTime / cycleDuration && prevTotalTime <= time) {
|
||||
self._cycle--; //otherwise when rendered exactly at the end time, it will act as though it is repeating (at the beginning)
|
||||
}
|
||||
self._time = self._totalTime - (self._cycle * cycleDuration);
|
||||
if (self._yoyo) if (self._cycle & 1) {
|
||||
self._time = dur - self._time;
|
||||
}
|
||||
if (self._time > dur) {
|
||||
self._time = dur;
|
||||
time = dur + 0.0001; //to avoid occasional floating point rounding error
|
||||
} else if (self._time < 0) {
|
||||
self._time = time = 0;
|
||||
} else {
|
||||
time = self._time;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (self._hasPause && !self._forcingPlayhead && !suppressEvents) {
|
||||
time = self._time;
|
||||
if (time >= prevTime || (self._repeat && prevCycle !== self._cycle)) {
|
||||
tween = self._first;
|
||||
while (tween && tween._startTime <= time && !pauseTween) {
|
||||
if (!tween._duration) if (tween.data === "isPause" && !tween.ratio && !(tween._startTime === 0 && self._rawPrevTime === 0)) {
|
||||
pauseTween = tween;
|
||||
}
|
||||
tween = tween._next;
|
||||
}
|
||||
} else {
|
||||
tween = self._last;
|
||||
while (tween && tween._startTime >= time && !pauseTween) {
|
||||
if (!tween._duration) if (tween.data === "isPause" && tween._rawPrevTime > 0) {
|
||||
pauseTween = tween;
|
||||
}
|
||||
tween = tween._prev;
|
||||
}
|
||||
}
|
||||
if (pauseTween) {
|
||||
pauseTime = self._startTime + (pauseTween._startTime / self._timeScale);
|
||||
if (pauseTween._startTime < dur) {
|
||||
self._time = self._rawPrevTime = time = pauseTween._startTime;
|
||||
self._totalTime = time + (self._cycle * (self._totalDuration + self._repeatDelay));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if (self._cycle !== prevCycle) if (!self._locked) {
|
||||
/*
|
||||
make sure children at the end/beginning of the timeline are rendered properly. If, for example,
|
||||
a 3-second long timeline rendered at 2.9 seconds previously, and now renders at 3.2 seconds (which
|
||||
would get translated to 2.8 seconds if the timeline yoyos or 0.2 seconds if it just repeats), there
|
||||
could be a callback or a short tween that's at 2.95 or 3 seconds in which wouldn't render. So
|
||||
we need to push the timeline to the end (and/or beginning depending on its yoyo value). Also we must
|
||||
ensure that zero-duration tweens at the very beginning or end of the TimelineMax work.
|
||||
*/
|
||||
var backwards = (self._yoyo && (prevCycle & 1) !== 0),
|
||||
wrap = (backwards === (self._yoyo && (self._cycle & 1) !== 0)),
|
||||
recTotalTime = self._totalTime,
|
||||
recCycle = self._cycle,
|
||||
recRawPrevTime = self._rawPrevTime,
|
||||
recTime = self._time;
|
||||
|
||||
self._totalTime = prevCycle * dur;
|
||||
if (self._cycle < prevCycle) {
|
||||
backwards = !backwards;
|
||||
} else {
|
||||
self._totalTime += dur;
|
||||
}
|
||||
self._time = prevTime; //temporarily revert _time so that render() renders the children in the correct order. Without this, tweens won't rewind correctly. We could arhictect things in a "cleaner" way by splitting out the rendering queue into a separate method but for performance reasons, we kept it all inside this method.
|
||||
|
||||
self._rawPrevTime = (dur === 0) ? prevRawPrevTime - 0.0001 : prevRawPrevTime;
|
||||
self._cycle = prevCycle;
|
||||
self._locked = true; //prevents changes to totalTime and skips repeat/yoyo behavior when we recursively call render()
|
||||
prevTime = (backwards) ? 0 : dur;
|
||||
self.render(prevTime, suppressEvents, (dur === 0));
|
||||
if (!suppressEvents) if (!self._gc) {
|
||||
if (self.vars.onRepeat) {
|
||||
self._cycle = recCycle; //in case the onRepeat alters the playhead or invalidates(), we shouldn't stay locked or use the previous cycle.
|
||||
self._locked = false;
|
||||
self._callback("onRepeat");
|
||||
}
|
||||
}
|
||||
if (prevTime !== self._time) { //in case there's a callback like onComplete in a nested tween/timeline that changes the playhead position, like via seek(), we should just abort.
|
||||
return;
|
||||
}
|
||||
if (wrap) {
|
||||
self._cycle = prevCycle; //if there's an onRepeat, we reverted this above, so make sure it's set properly again. We also unlocked in that scenario, so reset that too.
|
||||
self._locked = true;
|
||||
prevTime = (backwards) ? dur + 0.0001 : -0.0001;
|
||||
self.render(prevTime, true, false);
|
||||
}
|
||||
self._locked = false;
|
||||
if (self._paused && !prevPaused) { //if the render() triggered callback that paused this timeline, we should abort (very rare, but possible)
|
||||
return;
|
||||
}
|
||||
self._time = recTime;
|
||||
self._totalTime = recTotalTime;
|
||||
self._cycle = recCycle;
|
||||
self._rawPrevTime = recRawPrevTime;
|
||||
}
|
||||
|
||||
if ((self._time === prevTime || !self._first) && !force && !internalForce && !pauseTween) {
|
||||
if (prevTotalTime !== self._totalTime) if (self._onUpdate) if (!suppressEvents) { //so that onUpdate fires even during the repeatDelay - as long as the totalTime changed, we should trigger onUpdate.
|
||||
self._callback("onUpdate");
|
||||
}
|
||||
return;
|
||||
} else if (!self._initted) {
|
||||
self._initted = true;
|
||||
}
|
||||
|
||||
if (!self._active) if (!self._paused && self._totalTime !== prevTotalTime && time > 0) {
|
||||
self._active = true; //so that if the user renders the timeline (as opposed to the parent timeline rendering it), it is forced to re-render and align it with the proper time/frame on the next rendering cycle. Maybe the timeline already finished but the user manually re-renders it as halfway done, for example.
|
||||
}
|
||||
|
||||
if (prevTotalTime === 0) if (self.vars.onStart) if (self._totalTime !== 0 || !self._totalDuration) if (!suppressEvents) {
|
||||
self._callback("onStart");
|
||||
}
|
||||
|
||||
curTime = self._time;
|
||||
if (curTime >= prevTime) {
|
||||
tween = self._first;
|
||||
while (tween) {
|
||||
next = tween._next; //record it here because the value could change after rendering...
|
||||
if (curTime !== self._time || (self._paused && !prevPaused)) { //in case a tween pauses or seeks the timeline when rendering, like inside of an onUpdate/onComplete
|
||||
break;
|
||||
} else if (tween._active || (tween._startTime <= self._time && !tween._paused && !tween._gc)) {
|
||||
if (pauseTween === tween) {
|
||||
self.pause();
|
||||
self._pauseTime = pauseTime; //so that when we resume(), it's starting from exactly the right spot (the pause() method uses the rawTime for the parent, but that may be a bit too far ahead)
|
||||
}
|
||||
if (!tween._reversed) {
|
||||
tween.render((time - tween._startTime) * tween._timeScale, suppressEvents, force);
|
||||
} else {
|
||||
tween.render(((!tween._dirty) ? tween._totalDuration : tween.totalDuration()) - ((time - tween._startTime) * tween._timeScale), suppressEvents, force);
|
||||
}
|
||||
}
|
||||
tween = next;
|
||||
}
|
||||
} else {
|
||||
tween = self._last;
|
||||
while (tween) {
|
||||
next = tween._prev; //record it here because the value could change after rendering...
|
||||
if (curTime !== self._time || (self._paused && !prevPaused)) { //in case a tween pauses or seeks the timeline when rendering, like inside of an onUpdate/onComplete
|
||||
break;
|
||||
} else if (tween._active || (tween._startTime <= prevTime && !tween._paused && !tween._gc)) {
|
||||
if (pauseTween === tween) {
|
||||
pauseTween = tween._prev; //the linked list is organized by _startTime, thus it's possible that a tween could start BEFORE the pause and end after it, in which case it would be positioned before the pause tween in the linked list, but we should render it before we pause() the timeline and cease rendering. This is only a concern when going in reverse.
|
||||
while (pauseTween && pauseTween.endTime() > self._time) {
|
||||
pauseTween.render( (pauseTween._reversed ? pauseTween.totalDuration() - ((time - pauseTween._startTime) * pauseTween._timeScale) : (time - pauseTween._startTime) * pauseTween._timeScale), suppressEvents, force);
|
||||
pauseTween = pauseTween._prev;
|
||||
}
|
||||
pauseTween = null;
|
||||
self.pause();
|
||||
self._pauseTime = pauseTime; //so that when we resume(), it's starting from exactly the right spot (the pause() method uses the rawTime for the parent, but that may be a bit too far ahead)
|
||||
}
|
||||
if (!tween._reversed) {
|
||||
tween.render((time - tween._startTime) * tween._timeScale, suppressEvents, force);
|
||||
} else {
|
||||
tween.render(((!tween._dirty) ? tween._totalDuration : tween.totalDuration()) - ((time - tween._startTime) * tween._timeScale), suppressEvents, force);
|
||||
}
|
||||
}
|
||||
tween = next;
|
||||
}
|
||||
}
|
||||
|
||||
if (self._onUpdate) if (!suppressEvents) {
|
||||
if (_lazyTweens.length) { //in case rendering caused any tweens to lazy-init, we should render them because typically when a timeline finishes, users expect things to have rendered fully. Imagine an onUpdate on a timeline that reports/checks tweened values.
|
||||
_lazyRender();
|
||||
}
|
||||
self._callback("onUpdate");
|
||||
}
|
||||
if (callback) if (!self._locked) if (!self._gc) if (prevStart === self._startTime || prevTimeScale !== self._timeScale) if (self._time === 0 || totalDur >= self.totalDuration()) { //if one of the tweens that was rendered altered this timeline's startTime (like if an onComplete reversed the timeline), it probably isn't complete. If it is, don't worry, because whatever call altered the startTime would complete if it was necessary at the new time. The only exception is the timeScale property. Also check _gc because there's a chance that kill() could be called in an onUpdate
|
||||
if (isComplete) {
|
||||
if (_lazyTweens.length) { //in case rendering caused any tweens to lazy-init, we should render them because typically when a timeline finishes, users expect things to have rendered fully. Imagine an onComplete on a timeline that reports/checks tweened values.
|
||||
_lazyRender();
|
||||
}
|
||||
if (self._timeline.autoRemoveChildren) {
|
||||
self._enabled(false, false);
|
||||
}
|
||||
self._active = false;
|
||||
}
|
||||
if (!suppressEvents && self.vars[callback]) {
|
||||
self._callback(callback);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
p.getActive = function(nested, tweens, timelines) {
|
||||
var a = [],
|
||||
all = this.getChildren(nested || (nested == null), tweens || (nested == null), !!timelines),
|
||||
cnt = 0,
|
||||
l = all.length,
|
||||
i, tween;
|
||||
for (i = 0; i < l; i++) {
|
||||
tween = all[i];
|
||||
if (tween.isActive()) {
|
||||
a[cnt++] = tween;
|
||||
}
|
||||
}
|
||||
return a;
|
||||
};
|
||||
|
||||
|
||||
p.getLabelAfter = function(time) {
|
||||
if (!time) if (time !== 0) { //faster than isNan()
|
||||
time = this._time;
|
||||
}
|
||||
var labels = this.getLabelsArray(),
|
||||
l = labels.length,
|
||||
i;
|
||||
for (i = 0; i < l; i++) {
|
||||
if (labels[i].time > time) {
|
||||
return labels[i].name;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
p.getLabelBefore = function(time) {
|
||||
if (time == null) {
|
||||
time = this._time;
|
||||
}
|
||||
var labels = this.getLabelsArray(),
|
||||
i = labels.length;
|
||||
while (--i > -1) {
|
||||
if (labels[i].time < time) {
|
||||
return labels[i].name;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
p.getLabelsArray = function() {
|
||||
var a = [],
|
||||
cnt = 0,
|
||||
p;
|
||||
for (p in this._labels) {
|
||||
a[cnt++] = {time:this._labels[p], name:p};
|
||||
}
|
||||
a.sort(function(a,b) {
|
||||
return a.time - b.time;
|
||||
});
|
||||
return a;
|
||||
};
|
||||
|
||||
p.invalidate = function() {
|
||||
this._locked = false; //unlock and set cycle in case invalidate() is called from inside an onRepeat
|
||||
return TimelineLite.prototype.invalidate.call(this);
|
||||
};
|
||||
|
||||
|
||||
//---- GETTERS / SETTERS -------------------------------------------------------------------------------------------------------
|
||||
|
||||
p.progress = function(value, suppressEvents) {
|
||||
return (!arguments.length) ? (this._time / this.duration()) || 0 : this.totalTime( this.duration() * ((this._yoyo && (this._cycle & 1) !== 0) ? 1 - value : value) + (this._cycle * (this._duration + this._repeatDelay)), suppressEvents);
|
||||
};
|
||||
|
||||
p.totalProgress = function(value, suppressEvents) {
|
||||
return (!arguments.length) ? (this._totalTime / this.totalDuration()) || 0 : this.totalTime( this.totalDuration() * value, suppressEvents);
|
||||
};
|
||||
|
||||
p.totalDuration = function(value) {
|
||||
if (!arguments.length) {
|
||||
if (this._dirty) {
|
||||
TimelineLite.prototype.totalDuration.call(this); //just forces refresh
|
||||
//Instead of Infinity, we use 999999999999 so that we can accommodate reverses.
|
||||
this._totalDuration = (this._repeat === -1) ? 999999999999 : this._duration * (this._repeat + 1) + (this._repeatDelay * this._repeat);
|
||||
}
|
||||
return this._totalDuration;
|
||||
}
|
||||
return (this._repeat === -1 || !value) ? this : this.timeScale( this.totalDuration() / value );
|
||||
};
|
||||
|
||||
p.time = function(value, suppressEvents) {
|
||||
if (!arguments.length) {
|
||||
return this._time;
|
||||
}
|
||||
if (this._dirty) {
|
||||
this.totalDuration();
|
||||
}
|
||||
var duration = this._duration,
|
||||
cycle = this._cycle,
|
||||
cycleDur = cycle * (duration * this._repeatDelay);
|
||||
if (value > duration) {
|
||||
value = duration;
|
||||
}
|
||||
return this.totalTime((this._yoyo && (cycle & 1)) ? duration - value + cycleDur : this._repeat ? value + cycleDur : value, suppressEvents);
|
||||
};
|
||||
|
||||
p.repeat = function(value) {
|
||||
if (!arguments.length) {
|
||||
return this._repeat;
|
||||
}
|
||||
this._repeat = value;
|
||||
return this._uncache(true);
|
||||
};
|
||||
|
||||
p.repeatDelay = function(value) {
|
||||
if (!arguments.length) {
|
||||
return this._repeatDelay;
|
||||
}
|
||||
this._repeatDelay = value;
|
||||
return this._uncache(true);
|
||||
};
|
||||
|
||||
p.yoyo = function(value) {
|
||||
if (!arguments.length) {
|
||||
return this._yoyo;
|
||||
}
|
||||
this._yoyo = value;
|
||||
return this;
|
||||
};
|
||||
|
||||
p.currentLabel = function(value) {
|
||||
if (!arguments.length) {
|
||||
return this.getLabelBefore(this._time + _tinyNum);
|
||||
}
|
||||
return this.seek(value, true);
|
||||
};
|
||||
|
||||
return TimelineMax;
|
||||
|
||||
}, true);
|
||||
|
||||
export var TimelineMax = globals.TimelineMax;
|
||||
export { TimelineLite, TimelineMax as default };
|
||||
+1975
File diff suppressed because it is too large
Load Diff
+30
@@ -0,0 +1,30 @@
|
||||
/*!
|
||||
* VERSION: 2.1.0
|
||||
* DATE: 2019-02-15
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
**/
|
||||
/* eslint-disable */
|
||||
|
||||
import TweenLite, { TweenPlugin, Ease, Power0, Power1, Power2, Power3, Power4, Linear } from "./TweenLite.js";
|
||||
import TweenMaxBase from "./TweenMaxBase.js";
|
||||
import CSSPlugin from "./CSSPlugin.js";
|
||||
import AttrPlugin from "./AttrPlugin.js";
|
||||
import RoundPropsPlugin from "./RoundPropsPlugin.js";
|
||||
import DirectionalRotationPlugin from "./DirectionalRotationPlugin.js";
|
||||
import TimelineLite from "./TimelineLite.js";
|
||||
import TimelineMax from "./TimelineMax.js";
|
||||
import BezierPlugin from "./BezierPlugin.js";
|
||||
import { Back, Elastic, Bounce, RoughEase, SlowMo, SteppedEase, Circ, Expo, Sine, ExpoScaleEase } from "./EasePack.js";
|
||||
|
||||
//the following two lines are designed to prevent tree shaking of the classes that were historically included with TweenMax (otherwise, folks would have to reference CSSPlugin, for example, to ensure their CSS-related animations worked)
|
||||
export var TweenMax = TweenMaxBase;
|
||||
TweenMax._autoActivated = [TimelineLite, TimelineMax, CSSPlugin, AttrPlugin, BezierPlugin, RoundPropsPlugin, DirectionalRotationPlugin, Back, Elastic, Bounce, RoughEase, SlowMo, SteppedEase, Circ, Expo, Sine, ExpoScaleEase];
|
||||
|
||||
export { TweenMax as default };
|
||||
export { TweenLite, TimelineLite, TimelineMax, CSSPlugin, AttrPlugin, BezierPlugin, DirectionalRotationPlugin, RoundPropsPlugin, TweenPlugin, Ease, Power0, Power1, Power2, Power3, Power4, Linear, Back, Elastic, Bounce, RoughEase, SlowMo, SteppedEase, Circ, Expo, Sine, ExpoScaleEase };
|
||||
+671
@@ -0,0 +1,671 @@
|
||||
/*!
|
||||
* VERSION: 2.1.0
|
||||
* DATE: 2019-02-15
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
**/
|
||||
/* eslint-disable */
|
||||
|
||||
import TweenLite, { _gsScope, globals, Animation, SimpleTimeline, Ease, Power0, Power1, Power2, Power3, Power4, Linear } from "./TweenLite.js";
|
||||
|
||||
|
||||
_gsScope._gsDefine("TweenMax", ["core.Animation","core.SimpleTimeline","TweenLite"], function() {
|
||||
|
||||
var _slice = function(a) { //don't use [].slice because that doesn't work in IE8 with a NodeList that's returned by querySelectorAll()
|
||||
var b = [],
|
||||
l = a.length,
|
||||
i;
|
||||
for (i = 0; i !== l; b.push(a[i++]));
|
||||
return b;
|
||||
},
|
||||
_applyCycle = function(vars, targets, i) {
|
||||
var alt = vars.cycle,
|
||||
p, val;
|
||||
for (p in alt) {
|
||||
val = alt[p];
|
||||
vars[p] = (typeof(val) === "function") ? val(i, targets[i], targets) : val[i % val.length];
|
||||
}
|
||||
delete vars.cycle;
|
||||
},
|
||||
//for distributing values across an array. Can accept a number, a function or (most commonly) a function which can contain the following properties: {base, amount, from, ease, grid, axis, length}. Returns a function that expects the following parameters: index, target, array. Recognizes the following
|
||||
_distribute = function(v) {
|
||||
if (typeof(v) === "function") {
|
||||
return v;
|
||||
}
|
||||
var vars = isNaN(v) ? v : {n:1, from:(v < 0) ? ((v = -v) && "end") : 0}, //n:1 is just to indicate v was a number; we leverage that later to set v according to the length we get. If a number is passed in, we treat it like the old stagger value where 0.1, for example, would mean that things would be distributed with 0.1 between each element in the array rather than a total "amount" that's chunked out among them all.
|
||||
ease = vars.ease,
|
||||
from = vars.from || 0,
|
||||
base = vars.base || 0,
|
||||
cache = {},
|
||||
isFromKeyword = isNaN(from),
|
||||
axis = vars.axis,
|
||||
ratio = {center:0.5, end:1}[from] || 0;
|
||||
return function(i, target, a) {
|
||||
var l = (a || vars).length,
|
||||
distances = cache[l],
|
||||
originX, originY, x, y, d, j, max, min, wrap;
|
||||
if (!distances) {
|
||||
wrap = (vars.grid === "auto") ? 0 : (vars.grid || [Infinity])[0];
|
||||
if (!wrap) {
|
||||
max = -Infinity;
|
||||
while (max < (max = a[wrap++].getBoundingClientRect().left) && wrap < l) { }
|
||||
wrap--;
|
||||
}
|
||||
distances = cache[l] = [];
|
||||
originX = isFromKeyword ? (Math.min(wrap, l) * ratio) - 0.5 : from % wrap;
|
||||
originY = isFromKeyword ? l * ratio / wrap - 0.5 : (from / wrap) | 0;
|
||||
max = 0;
|
||||
min = Infinity;
|
||||
for (j = 0; j < l; j++) {
|
||||
x = (j % wrap) - originX;
|
||||
y = originY - ((j / wrap) | 0);
|
||||
distances[j] = d = !axis ? Math.sqrt(x * x + y * y) : Math.abs((axis === "y") ? y : x);
|
||||
if (d > max) {
|
||||
max = d;
|
||||
}
|
||||
if (d < min) {
|
||||
min = d;
|
||||
}
|
||||
}
|
||||
distances.max = max - min;
|
||||
distances.min = min;
|
||||
distances.v = vars.n ? l * (v || 0) : vars.amount;
|
||||
}
|
||||
l = (distances[i] - distances.min) / distances.max;
|
||||
return base + (ease ? ease.getRatio(l) : l) * distances.v;
|
||||
};
|
||||
},
|
||||
TweenMax = function(target, duration, vars) {
|
||||
TweenLite.call(this, target, duration, vars);
|
||||
this._cycle = 0;
|
||||
this._yoyo = (this.vars.yoyo === true || !!this.vars.yoyoEase);
|
||||
this._repeat = this.vars.repeat || 0;
|
||||
this._repeatDelay = this.vars.repeatDelay || 0;
|
||||
if (this._repeat) {
|
||||
this._uncache(true); //ensures that if there is any repeat, the totalDuration will get recalculated to accurately report it.
|
||||
}
|
||||
this.render = TweenMax.prototype.render; //speed optimization (avoid prototype lookup on this "hot" method)
|
||||
},
|
||||
_tinyNum = 0.00000001,
|
||||
TweenLiteInternals = TweenLite._internals,
|
||||
_isSelector = TweenLiteInternals.isSelector,
|
||||
_isArray = TweenLiteInternals.isArray,
|
||||
p = TweenMax.prototype = TweenLite.to({}, 0.1, {}),
|
||||
_blankArray = [];
|
||||
|
||||
TweenMax.version = "2.1.0";
|
||||
p.constructor = TweenMax;
|
||||
p.kill()._gc = false;
|
||||
TweenMax.killTweensOf = TweenMax.killDelayedCallsTo = TweenLite.killTweensOf;
|
||||
TweenMax.getTweensOf = TweenLite.getTweensOf;
|
||||
TweenMax.lagSmoothing = TweenLite.lagSmoothing;
|
||||
TweenMax.ticker = TweenLite.ticker;
|
||||
TweenMax.render = TweenLite.render;
|
||||
TweenMax.distribute = _distribute;
|
||||
|
||||
p.invalidate = function() {
|
||||
this._yoyo = (this.vars.yoyo === true || !!this.vars.yoyoEase);
|
||||
this._repeat = this.vars.repeat || 0;
|
||||
this._repeatDelay = this.vars.repeatDelay || 0;
|
||||
this._yoyoEase = null;
|
||||
this._uncache(true);
|
||||
return TweenLite.prototype.invalidate.call(this);
|
||||
};
|
||||
|
||||
p.updateTo = function(vars, resetDuration) {
|
||||
var self = this,
|
||||
curRatio = self.ratio,
|
||||
immediate = self.vars.immediateRender || vars.immediateRender,
|
||||
p;
|
||||
if (resetDuration && self._startTime < self._timeline._time) {
|
||||
self._startTime = self._timeline._time;
|
||||
self._uncache(false);
|
||||
if (self._gc) {
|
||||
self._enabled(true, false);
|
||||
} else {
|
||||
self._timeline.insert(self, self._startTime - self._delay); //ensures that any necessary re-sequencing of Animations in the timeline occurs to make sure the rendering order is correct.
|
||||
}
|
||||
}
|
||||
for (p in vars) {
|
||||
self.vars[p] = vars[p];
|
||||
}
|
||||
if (self._initted || immediate) {
|
||||
if (resetDuration) {
|
||||
self._initted = false;
|
||||
if (immediate) {
|
||||
self.render(0, true, true);
|
||||
}
|
||||
} else {
|
||||
if (self._gc) {
|
||||
self._enabled(true, false);
|
||||
}
|
||||
if (self._notifyPluginsOfEnabled && self._firstPT) {
|
||||
TweenLite._onPluginEvent("_onDisable", self); //in case a plugin like MotionBlur must perform some cleanup tasks
|
||||
}
|
||||
if (self._time / self._duration > 0.998) { //if the tween has finished (or come extremely close to finishing), we just need to rewind it to 0 and then render it again at the end which forces it to re-initialize (parsing the new vars). We allow tweens that are close to finishing (but haven't quite finished) to work this way too because otherwise, the values are so small when determining where to project the starting values that binary math issues creep in and can make the tween appear to render incorrectly when run backwards.
|
||||
var prevTime = self._totalTime;
|
||||
self.render(0, true, false);
|
||||
self._initted = false;
|
||||
self.render(prevTime, true, false);
|
||||
} else {
|
||||
self._initted = false;
|
||||
self._init();
|
||||
if (self._time > 0 || immediate) {
|
||||
var inv = 1 / (1 - curRatio),
|
||||
pt = self._firstPT, endValue;
|
||||
while (pt) {
|
||||
endValue = pt.s + pt.c;
|
||||
pt.c *= inv;
|
||||
pt.s = endValue - pt.c;
|
||||
pt = pt._next;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return self;
|
||||
};
|
||||
|
||||
p.render = function(time, suppressEvents, force) {
|
||||
if (!this._initted) if (this._duration === 0 && this.vars.repeat) { //zero duration tweens that render immediately have render() called from TweenLite's constructor, before TweenMax's constructor has finished setting _repeat, _repeatDelay, and _yoyo which are critical in determining totalDuration() so we need to call invalidate() which is a low-kb way to get those set properly.
|
||||
this.invalidate();
|
||||
}
|
||||
var self = this,
|
||||
totalDur = (!self._dirty) ? self._totalDuration : self.totalDuration(),
|
||||
prevTime = self._time,
|
||||
prevTotalTime = self._totalTime,
|
||||
prevCycle = self._cycle,
|
||||
duration = self._duration,
|
||||
prevRawPrevTime = self._rawPrevTime,
|
||||
isComplete, callback, pt, cycleDuration, r, type, pow, rawPrevTime, yoyoEase;
|
||||
if (time >= totalDur - _tinyNum && time >= 0) { //to work around occasional floating point math artifacts.
|
||||
self._totalTime = totalDur;
|
||||
self._cycle = self._repeat;
|
||||
if (self._yoyo && (self._cycle & 1) !== 0) {
|
||||
self._time = 0;
|
||||
self.ratio = self._ease._calcEnd ? self._ease.getRatio(0) : 0;
|
||||
} else {
|
||||
self._time = duration;
|
||||
self.ratio = self._ease._calcEnd ? self._ease.getRatio(1) : 1;
|
||||
}
|
||||
if (!self._reversed) {
|
||||
isComplete = true;
|
||||
callback = "onComplete";
|
||||
force = (force || self._timeline.autoRemoveChildren); //otherwise, if the animation is unpaused/activated after it's already finished, it doesn't get removed from the parent timeline.
|
||||
}
|
||||
if (duration === 0) if (self._initted || !self.vars.lazy || force) { //zero-duration tweens are tricky because we must discern the momentum/direction of time in order to determine whether the starting values should be rendered or the ending values. If the "playhead" of its timeline goes past the zero-duration tween in the forward direction or lands directly on it, the end values should be rendered, but if the timeline's "playhead" moves past it in the backward direction (from a postitive time to a negative time), the starting values must be rendered.
|
||||
if (self._startTime === self._timeline._duration) { //if a zero-duration tween is at the VERY end of a timeline and that timeline renders at its end, it will typically add a tiny bit of cushion to the render time to prevent rounding errors from getting in the way of tweens rendering their VERY end. If we then reverse() that timeline, the zero-duration tween will trigger its onReverseComplete even though technically the playhead didn't pass over it again. It's a very specific edge case we must accommodate.
|
||||
time = 0;
|
||||
}
|
||||
if (prevRawPrevTime < 0 || (time <= 0 && time >= -_tinyNum) || (prevRawPrevTime === _tinyNum && self.data !== "isPause")) if (prevRawPrevTime !== time) { //note: when this.data is "isPause", it's a callback added by addPause() on a timeline that we should not be triggered when LEAVING its exact start time. In other words, tl.addPause(1).play(1) shouldn't pause.
|
||||
force = true;
|
||||
if (prevRawPrevTime > _tinyNum) {
|
||||
callback = "onReverseComplete";
|
||||
}
|
||||
}
|
||||
self._rawPrevTime = rawPrevTime = (!suppressEvents || time || prevRawPrevTime === time) ? time : _tinyNum; //when the playhead arrives at EXACTLY time 0 (right on top) of a zero-duration tween, we need to discern if events are suppressed so that when the playhead moves again (next time), it'll trigger the callback. If events are NOT suppressed, obviously the callback would be triggered in this render. Basically, the callback should fire either when the playhead ARRIVES or LEAVES this exact spot, not both. Imagine doing a timeline.seek(0) and there's a callback that sits at 0. Since events are suppressed on that seek() by default, nothing will fire, but when the playhead moves off of that position, the callback should fire. This behavior is what people intuitively expect. We set the _rawPrevTime to be a precise tiny number to indicate this scenario rather than using another property/variable which would increase memory usage. This technique is less readable, but more efficient.
|
||||
}
|
||||
|
||||
} else if (time < _tinyNum) { //to work around occasional floating point math artifacts, round super small values to 0.
|
||||
self._totalTime = self._time = self._cycle = 0;
|
||||
self.ratio = self._ease._calcEnd ? self._ease.getRatio(0) : 0;
|
||||
if (prevTotalTime !== 0 || (duration === 0 && prevRawPrevTime > 0)) {
|
||||
callback = "onReverseComplete";
|
||||
isComplete = self._reversed;
|
||||
}
|
||||
if (time > -_tinyNum) {
|
||||
time = 0;
|
||||
} else if (time < 0) {
|
||||
self._active = false;
|
||||
if (duration === 0) if (self._initted || !self.vars.lazy || force) { //zero-duration tweens are tricky because we must discern the momentum/direction of time in order to determine whether the starting values should be rendered or the ending values. If the "playhead" of its timeline goes past the zero-duration tween in the forward direction or lands directly on it, the end values should be rendered, but if the timeline's "playhead" moves past it in the backward direction (from a postitive time to a negative time), the starting values must be rendered.
|
||||
if (prevRawPrevTime >= 0) {
|
||||
force = true;
|
||||
}
|
||||
self._rawPrevTime = rawPrevTime = (!suppressEvents || time || prevRawPrevTime === time) ? time : _tinyNum; //when the playhead arrives at EXACTLY time 0 (right on top) of a zero-duration tween, we need to discern if events are suppressed so that when the playhead moves again (next time), it'll trigger the callback. If events are NOT suppressed, obviously the callback would be triggered in this render. Basically, the callback should fire either when the playhead ARRIVES or LEAVES this exact spot, not both. Imagine doing a timeline.seek(0) and there's a callback that sits at 0. Since events are suppressed on that seek() by default, nothing will fire, but when the playhead moves off of that position, the callback should fire. This behavior is what people intuitively expect. We set the _rawPrevTime to be a precise tiny number to indicate this scenario rather than using another property/variable which would increase memory usage. This technique is less readable, but more efficient.
|
||||
}
|
||||
}
|
||||
if (!self._initted) { //if we render the very beginning (time == 0) of a fromTo(), we must force the render (normal tweens wouldn't need to render at a time of 0 when the prevTime was also 0). This is also mandatory to make sure overwriting kicks in immediately.
|
||||
force = true;
|
||||
}
|
||||
} else {
|
||||
self._totalTime = self._time = time;
|
||||
if (self._repeat !== 0) {
|
||||
cycleDuration = duration + self._repeatDelay;
|
||||
self._cycle = (self._totalTime / cycleDuration) >> 0; //originally _totalTime % cycleDuration but floating point errors caused problems, so I normalized it. (4 % 0.8 should be 0 but some browsers report it as 0.79999999!)
|
||||
if (self._cycle !== 0) if (self._cycle === self._totalTime / cycleDuration && prevTotalTime <= time) {
|
||||
self._cycle--; //otherwise when rendered exactly at the end time, it will act as though it is repeating (at the beginning)
|
||||
}
|
||||
self._time = self._totalTime - (self._cycle * cycleDuration);
|
||||
if (self._yoyo) if ((self._cycle & 1) !== 0) {
|
||||
self._time = duration - self._time;
|
||||
yoyoEase = self._yoyoEase || self.vars.yoyoEase; //note: we don't set this._yoyoEase in _init() like we do other properties because it's TweenMax-specific and doing it here allows us to optimize performance (most tweens don't have a yoyoEase). Note that we also must skip the this.ratio calculation further down right after we _init() in this function, because we're doing it here.
|
||||
if (yoyoEase) {
|
||||
if (!self._yoyoEase) {
|
||||
if (yoyoEase === true && !self._initted) { //if it's not initted and yoyoEase is true, this._ease won't have been populated yet so we must discern it here.
|
||||
yoyoEase = self.vars.ease;
|
||||
self._yoyoEase = yoyoEase = !yoyoEase ? TweenLite.defaultEase : (yoyoEase instanceof Ease) ? yoyoEase : (typeof(yoyoEase) === "function") ? new Ease(yoyoEase, self.vars.easeParams) : Ease.map[yoyoEase] || TweenLite.defaultEase;
|
||||
} else {
|
||||
self._yoyoEase = yoyoEase = (yoyoEase === true) ? self._ease : (yoyoEase instanceof Ease) ? yoyoEase : Ease.map[yoyoEase];
|
||||
}
|
||||
}
|
||||
self.ratio = yoyoEase ? 1 - yoyoEase.getRatio((duration - self._time) / duration) : 0;
|
||||
}
|
||||
}
|
||||
if (self._time > duration) {
|
||||
self._time = duration;
|
||||
} else if (self._time < 0) {
|
||||
self._time = 0;
|
||||
}
|
||||
}
|
||||
if (self._easeType && !yoyoEase) {
|
||||
r = self._time / duration;
|
||||
type = self._easeType;
|
||||
pow = self._easePower;
|
||||
if (type === 1 || (type === 3 && r >= 0.5)) {
|
||||
r = 1 - r;
|
||||
}
|
||||
if (type === 3) {
|
||||
r *= 2;
|
||||
}
|
||||
if (pow === 1) {
|
||||
r *= r;
|
||||
} else if (pow === 2) {
|
||||
r *= r * r;
|
||||
} else if (pow === 3) {
|
||||
r *= r * r * r;
|
||||
} else if (pow === 4) {
|
||||
r *= r * r * r * r;
|
||||
}
|
||||
self.ratio = (type === 1) ? 1 - r : (type === 2) ? r : (self._time / duration < 0.5) ? r / 2 : 1 - (r / 2);
|
||||
|
||||
} else if (!yoyoEase) {
|
||||
self.ratio = self._ease.getRatio(self._time / duration);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if (prevTime === self._time && !force && prevCycle === self._cycle) {
|
||||
if (prevTotalTime !== self._totalTime) if (self._onUpdate) if (!suppressEvents) { //so that onUpdate fires even during the repeatDelay - as long as the totalTime changed, we should trigger onUpdate.
|
||||
self._callback("onUpdate");
|
||||
}
|
||||
return;
|
||||
} else if (!self._initted) {
|
||||
self._init();
|
||||
if (!self._initted || self._gc) { //immediateRender tweens typically won't initialize until the playhead advances (_time is greater than 0) in order to ensure that overwriting occurs properly. Also, if all of the tweening properties have been overwritten (which would cause _gc to be true, as set in _init()), we shouldn't continue otherwise an onStart callback could be called for example.
|
||||
return;
|
||||
} else if (!force && self._firstPT && ((self.vars.lazy !== false && self._duration) || (self.vars.lazy && !self._duration))) { //we stick it in the queue for rendering at the very end of the tick - this is a performance optimization because browsers invalidate styles and force a recalculation if you read, write, and then read style data (so it's better to read/read/read/write/write/write than read/write/read/write/read/write). The down side, of course, is that usually you WANT things to render immediately because you may have code running right after that which depends on the change. Like imagine running TweenLite.set(...) and then immediately after that, creating a nother tween that animates the same property to another value; the starting values of that 2nd tween wouldn't be accurate if lazy is true.
|
||||
self._time = prevTime;
|
||||
self._totalTime = prevTotalTime;
|
||||
self._rawPrevTime = prevRawPrevTime;
|
||||
self._cycle = prevCycle;
|
||||
TweenLiteInternals.lazyTweens.push(self);
|
||||
self._lazy = [time, suppressEvents];
|
||||
return;
|
||||
}
|
||||
//_ease is initially set to defaultEase, so now that init() has run, _ease is set properly and we need to recalculate the ratio. Overall this is faster than using conditional logic earlier in the method to avoid having to set ratio twice because we only init() once but renderTime() gets called VERY frequently.
|
||||
if (self._time && !isComplete && !yoyoEase) {
|
||||
self.ratio = self._ease.getRatio(self._time / duration);
|
||||
} else if (isComplete && this._ease._calcEnd && !yoyoEase) {
|
||||
self.ratio = self._ease.getRatio((self._time === 0) ? 0 : 1);
|
||||
}
|
||||
}
|
||||
if (self._lazy !== false) {
|
||||
self._lazy = false;
|
||||
}
|
||||
|
||||
if (!self._active) if (!self._paused && self._time !== prevTime && time >= 0) {
|
||||
self._active = true; //so that if the user renders a tween (as opposed to the timeline rendering it), the timeline is forced to re-render and align it with the proper time/frame on the next rendering cycle. Maybe the tween already finished but the user manually re-renders it as halfway done.
|
||||
}
|
||||
if (prevTotalTime === 0) {
|
||||
if (self._initted === 2 && time > 0) {
|
||||
self._init(); //will just apply overwriting since _initted of (2) means it was a from() tween that had immediateRender:true
|
||||
}
|
||||
if (self._startAt) {
|
||||
if (time >= 0) {
|
||||
self._startAt.render(time, true, force);
|
||||
} else if (!callback) {
|
||||
callback = "_dummyGS"; //if no callback is defined, use a dummy value just so that the condition at the end evaluates as true because _startAt should render AFTER the normal render loop when the time is negative. We could handle this in a more intuitive way, of course, but the render loop is the MOST important thing to optimize, so this technique allows us to avoid adding extra conditional logic in a high-frequency area.
|
||||
}
|
||||
}
|
||||
if (self.vars.onStart) if (self._totalTime !== 0 || duration === 0) if (!suppressEvents) {
|
||||
self._callback("onStart");
|
||||
}
|
||||
}
|
||||
|
||||
pt = self._firstPT;
|
||||
while (pt) {
|
||||
if (pt.f) {
|
||||
pt.t[pt.p](pt.c * self.ratio + pt.s);
|
||||
} else {
|
||||
pt.t[pt.p] = pt.c * self.ratio + pt.s;
|
||||
}
|
||||
pt = pt._next;
|
||||
}
|
||||
|
||||
if (self._onUpdate) {
|
||||
if (time < 0) if (self._startAt && self._startTime) { //if the tween is positioned at the VERY beginning (_startTime 0) of its parent timeline, it's illegal for the playhead to go back further, so we should not render the recorded startAt values.
|
||||
self._startAt.render(time, true, force); //note: for performance reasons, we tuck this conditional logic inside less traveled areas (most tweens don't have an onUpdate). We'd just have it at the end before the onComplete, but the values should be updated before any onUpdate is called, so we ALSO put it here and then if it's not called, we do so later near the onComplete.
|
||||
}
|
||||
if (!suppressEvents) if (self._totalTime !== prevTotalTime || callback) {
|
||||
self._callback("onUpdate");
|
||||
}
|
||||
}
|
||||
if (self._cycle !== prevCycle) if (!suppressEvents) if (!self._gc) if (self.vars.onRepeat) {
|
||||
self._callback("onRepeat");
|
||||
}
|
||||
if (callback) if (!self._gc || force) { //check gc because there's a chance that kill() could be called in an onUpdate
|
||||
if (time < 0 && self._startAt && !self._onUpdate && self._startTime) { //if the tween is positioned at the VERY beginning (_startTime 0) of its parent timeline, it's illegal for the playhead to go back further, so we should not render the recorded startAt values.
|
||||
self._startAt.render(time, true, force);
|
||||
}
|
||||
if (isComplete) {
|
||||
if (self._timeline.autoRemoveChildren) {
|
||||
self._enabled(false, false);
|
||||
}
|
||||
self._active = false;
|
||||
}
|
||||
if (!suppressEvents && self.vars[callback]) {
|
||||
self._callback(callback);
|
||||
}
|
||||
if (duration === 0 && self._rawPrevTime === _tinyNum && rawPrevTime !== _tinyNum) { //the onComplete or onReverseComplete could trigger movement of the playhead and for zero-duration tweens (which must discern direction) that land directly back on their start time, we don't want to fire again on the next render. Think of several addPause()'s in a timeline that forces the playhead to a certain spot, but what if it's already paused and another tween is tweening the "time" of the timeline? Each time it moves [forward] past that spot, it would move back, and since suppressEvents is true, it'd reset _rawPrevTime to _tinyNum so that when it begins again, the callback would fire (so ultimately it could bounce back and forth during that tween). Again, this is a very uncommon scenario, but possible nonetheless.
|
||||
self._rawPrevTime = 0;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
//---- STATIC FUNCTIONS -----------------------------------------------------------------------------------------------------------
|
||||
|
||||
TweenMax.to = function(target, duration, vars) {
|
||||
return new TweenMax(target, duration, vars);
|
||||
};
|
||||
|
||||
TweenMax.from = function(target, duration, vars) {
|
||||
vars.runBackwards = true;
|
||||
vars.immediateRender = (vars.immediateRender != false);
|
||||
return new TweenMax(target, duration, vars);
|
||||
};
|
||||
|
||||
TweenMax.fromTo = function(target, duration, fromVars, toVars) {
|
||||
toVars.startAt = fromVars;
|
||||
toVars.immediateRender = (toVars.immediateRender != false && fromVars.immediateRender != false);
|
||||
return new TweenMax(target, duration, toVars);
|
||||
};
|
||||
|
||||
TweenMax.staggerTo = TweenMax.allTo = function(targets, duration, vars, stagger, onCompleteAll, onCompleteAllParams, onCompleteAllScope) {
|
||||
var a = [],
|
||||
staggerFunc = _distribute(vars.stagger || stagger),
|
||||
cycle = vars.cycle,
|
||||
fromCycle = (vars.startAt || _blankArray).cycle,
|
||||
l, copy, i, p;
|
||||
if (!_isArray(targets)) {
|
||||
if (typeof(targets) === "string") {
|
||||
targets = TweenLite.selector(targets) || targets;
|
||||
}
|
||||
if (_isSelector(targets)) {
|
||||
targets = _slice(targets);
|
||||
}
|
||||
}
|
||||
targets = targets || [];
|
||||
l = targets.length - 1;
|
||||
for (i = 0; i <= l; i++) {
|
||||
copy = {};
|
||||
for (p in vars) {
|
||||
copy[p] = vars[p];
|
||||
}
|
||||
if (cycle) {
|
||||
_applyCycle(copy, targets, i);
|
||||
if (copy.duration != null) {
|
||||
duration = copy.duration;
|
||||
delete copy.duration;
|
||||
}
|
||||
}
|
||||
if (fromCycle) {
|
||||
fromCycle = copy.startAt = {};
|
||||
for (p in vars.startAt) {
|
||||
fromCycle[p] = vars.startAt[p];
|
||||
}
|
||||
_applyCycle(copy.startAt, targets, i);
|
||||
}
|
||||
copy.delay = staggerFunc(i, targets[i], targets) + (copy.delay || 0);
|
||||
if (i === l && onCompleteAll) {
|
||||
copy.onComplete = function() {
|
||||
if (vars.onComplete) {
|
||||
vars.onComplete.apply(vars.onCompleteScope || this, arguments);
|
||||
}
|
||||
onCompleteAll.apply(onCompleteAllScope || vars.callbackScope || this, onCompleteAllParams || _blankArray);
|
||||
};
|
||||
}
|
||||
a[i] = new TweenMax(targets[i], duration, copy);
|
||||
}
|
||||
return a;
|
||||
};
|
||||
|
||||
TweenMax.staggerFrom = TweenMax.allFrom = function(targets, duration, vars, stagger, onCompleteAll, onCompleteAllParams, onCompleteAllScope) {
|
||||
vars.runBackwards = true;
|
||||
vars.immediateRender = (vars.immediateRender != false);
|
||||
return TweenMax.staggerTo(targets, duration, vars, stagger, onCompleteAll, onCompleteAllParams, onCompleteAllScope);
|
||||
};
|
||||
|
||||
TweenMax.staggerFromTo = TweenMax.allFromTo = function(targets, duration, fromVars, toVars, stagger, onCompleteAll, onCompleteAllParams, onCompleteAllScope) {
|
||||
toVars.startAt = fromVars;
|
||||
toVars.immediateRender = (toVars.immediateRender != false && fromVars.immediateRender != false);
|
||||
return TweenMax.staggerTo(targets, duration, toVars, stagger, onCompleteAll, onCompleteAllParams, onCompleteAllScope);
|
||||
};
|
||||
|
||||
TweenMax.delayedCall = function(delay, callback, params, scope, useFrames) {
|
||||
return new TweenMax(callback, 0, {delay:delay, onComplete:callback, onCompleteParams:params, callbackScope:scope, onReverseComplete:callback, onReverseCompleteParams:params, immediateRender:false, useFrames:useFrames, overwrite:0});
|
||||
};
|
||||
|
||||
TweenMax.set = function(target, vars) {
|
||||
return new TweenMax(target, 0, vars);
|
||||
};
|
||||
|
||||
TweenMax.isTweening = function(target) {
|
||||
return (TweenLite.getTweensOf(target, true).length > 0);
|
||||
};
|
||||
|
||||
var _getChildrenOf = function(timeline, includeTimelines) {
|
||||
var a = [],
|
||||
cnt = 0,
|
||||
tween = timeline._first;
|
||||
while (tween) {
|
||||
if (tween instanceof TweenLite) {
|
||||
a[cnt++] = tween;
|
||||
} else {
|
||||
if (includeTimelines) {
|
||||
a[cnt++] = tween;
|
||||
}
|
||||
a = a.concat(_getChildrenOf(tween, includeTimelines));
|
||||
cnt = a.length;
|
||||
}
|
||||
tween = tween._next;
|
||||
}
|
||||
return a;
|
||||
},
|
||||
getAllTweens = TweenMax.getAllTweens = function(includeTimelines) {
|
||||
return _getChildrenOf(Animation._rootTimeline, includeTimelines).concat( _getChildrenOf(Animation._rootFramesTimeline, includeTimelines) );
|
||||
};
|
||||
|
||||
TweenMax.killAll = function(complete, tweens, delayedCalls, timelines) {
|
||||
if (tweens == null) {
|
||||
tweens = true;
|
||||
}
|
||||
if (delayedCalls == null) {
|
||||
delayedCalls = true;
|
||||
}
|
||||
var a = getAllTweens((timelines != false)),
|
||||
l = a.length,
|
||||
allTrue = (tweens && delayedCalls && timelines),
|
||||
isDC, tween, i;
|
||||
for (i = 0; i < l; i++) {
|
||||
tween = a[i];
|
||||
if (allTrue || (tween instanceof SimpleTimeline) || ((isDC = (tween.target === tween.vars.onComplete)) && delayedCalls) || (tweens && !isDC)) {
|
||||
if (complete) {
|
||||
tween.totalTime(tween._reversed ? 0 : tween.totalDuration());
|
||||
} else {
|
||||
tween._enabled(false, false);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
TweenMax.killChildTweensOf = function(parent, complete) {
|
||||
if (parent == null) {
|
||||
return;
|
||||
}
|
||||
var tl = TweenLiteInternals.tweenLookup,
|
||||
a, curParent, p, i, l;
|
||||
if (typeof(parent) === "string") {
|
||||
parent = TweenLite.selector(parent) || parent;
|
||||
}
|
||||
if (_isSelector(parent)) {
|
||||
parent = _slice(parent);
|
||||
}
|
||||
if (_isArray(parent)) {
|
||||
i = parent.length;
|
||||
while (--i > -1) {
|
||||
TweenMax.killChildTweensOf(parent[i], complete);
|
||||
}
|
||||
return;
|
||||
}
|
||||
a = [];
|
||||
for (p in tl) {
|
||||
curParent = tl[p].target.parentNode;
|
||||
while (curParent) {
|
||||
if (curParent === parent) {
|
||||
a = a.concat(tl[p].tweens);
|
||||
}
|
||||
curParent = curParent.parentNode;
|
||||
}
|
||||
}
|
||||
l = a.length;
|
||||
for (i = 0; i < l; i++) {
|
||||
if (complete) {
|
||||
a[i].totalTime(a[i].totalDuration());
|
||||
}
|
||||
a[i]._enabled(false, false);
|
||||
}
|
||||
};
|
||||
|
||||
var _changePause = function(pause, tweens, delayedCalls, timelines) {
|
||||
tweens = (tweens !== false);
|
||||
delayedCalls = (delayedCalls !== false);
|
||||
timelines = (timelines !== false);
|
||||
var a = getAllTweens(timelines),
|
||||
allTrue = (tweens && delayedCalls && timelines),
|
||||
i = a.length,
|
||||
isDC, tween;
|
||||
while (--i > -1) {
|
||||
tween = a[i];
|
||||
if (allTrue || (tween instanceof SimpleTimeline) || ((isDC = (tween.target === tween.vars.onComplete)) && delayedCalls) || (tweens && !isDC)) {
|
||||
tween.paused(pause);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
TweenMax.pauseAll = function(tweens, delayedCalls, timelines) {
|
||||
_changePause(true, tweens, delayedCalls, timelines);
|
||||
};
|
||||
|
||||
TweenMax.resumeAll = function(tweens, delayedCalls, timelines) {
|
||||
_changePause(false, tweens, delayedCalls, timelines);
|
||||
};
|
||||
|
||||
TweenMax.globalTimeScale = function(value) {
|
||||
var tl = Animation._rootTimeline,
|
||||
t = TweenLite.ticker.time;
|
||||
if (!arguments.length) {
|
||||
return tl._timeScale;
|
||||
}
|
||||
value = value || _tinyNum; //can't allow zero because it'll throw the math off
|
||||
tl._startTime = t - ((t - tl._startTime) * tl._timeScale / value);
|
||||
tl = Animation._rootFramesTimeline;
|
||||
t = TweenLite.ticker.frame;
|
||||
tl._startTime = t - ((t - tl._startTime) * tl._timeScale / value);
|
||||
tl._timeScale = Animation._rootTimeline._timeScale = value;
|
||||
return value;
|
||||
};
|
||||
|
||||
|
||||
//---- GETTERS / SETTERS ----------------------------------------------------------------------------------------------------------
|
||||
|
||||
p.progress = function(value, suppressEvents) {
|
||||
return (!arguments.length) ? this._time / this.duration() : this.totalTime( this.duration() * ((this._yoyo && (this._cycle & 1) !== 0) ? 1 - value : value) + (this._cycle * (this._duration + this._repeatDelay)), suppressEvents);
|
||||
};
|
||||
|
||||
p.totalProgress = function(value, suppressEvents) {
|
||||
return (!arguments.length) ? this._totalTime / this.totalDuration() : this.totalTime( this.totalDuration() * value, suppressEvents);
|
||||
};
|
||||
|
||||
p.time = function(value, suppressEvents) {
|
||||
if (!arguments.length) {
|
||||
return this._time;
|
||||
}
|
||||
if (this._dirty) {
|
||||
this.totalDuration();
|
||||
}
|
||||
var duration = this._duration,
|
||||
cycle = this._cycle,
|
||||
cycleDur = cycle * (duration * this._repeatDelay);
|
||||
if (value > duration) {
|
||||
value = duration;
|
||||
}
|
||||
return this.totalTime((this._yoyo && (cycle & 1)) ? duration - value + cycleDur : this._repeat ? value + cycleDur : value, suppressEvents);
|
||||
};
|
||||
|
||||
p.duration = function(value) {
|
||||
if (!arguments.length) {
|
||||
return this._duration; //don't set _dirty = false because there could be repeats that haven't been factored into the _totalDuration yet. Otherwise, if you create a repeated TweenMax and then immediately check its duration(), it would cache the value and the totalDuration would not be correct, thus repeats wouldn't take effect.
|
||||
}
|
||||
return Animation.prototype.duration.call(this, value);
|
||||
};
|
||||
|
||||
p.totalDuration = function(value) {
|
||||
if (!arguments.length) {
|
||||
if (this._dirty) {
|
||||
//instead of Infinity, we use 999999999999 so that we can accommodate reverses
|
||||
this._totalDuration = (this._repeat === -1) ? 999999999999 : this._duration * (this._repeat + 1) + (this._repeatDelay * this._repeat);
|
||||
this._dirty = false;
|
||||
}
|
||||
return this._totalDuration;
|
||||
}
|
||||
return (this._repeat === -1) ? this : this.duration( (value - (this._repeat * this._repeatDelay)) / (this._repeat + 1) );
|
||||
};
|
||||
|
||||
p.repeat = function(value) {
|
||||
if (!arguments.length) {
|
||||
return this._repeat;
|
||||
}
|
||||
this._repeat = value;
|
||||
return this._uncache(true);
|
||||
};
|
||||
|
||||
p.repeatDelay = function(value) {
|
||||
if (!arguments.length) {
|
||||
return this._repeatDelay;
|
||||
}
|
||||
this._repeatDelay = value;
|
||||
return this._uncache(true);
|
||||
};
|
||||
|
||||
p.yoyo = function(value) {
|
||||
if (!arguments.length) {
|
||||
return this._yoyo;
|
||||
}
|
||||
this._yoyo = value;
|
||||
return this;
|
||||
};
|
||||
|
||||
|
||||
return TweenMax;
|
||||
|
||||
}, true);
|
||||
|
||||
export var TweenMax = globals.TweenMax;
|
||||
export var TweenMaxBase = TweenMax;
|
||||
export { TweenMax as default };
|
||||
export { TweenLite, Ease, Power0, Power1, Power2, Power3, Power4, Linear };
|
||||
Vendored
+126
@@ -0,0 +1,126 @@
|
||||
/*!
|
||||
* VERSION: 2.1.0
|
||||
* DATE: 2019-02-15
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
**/
|
||||
import TweenLite, {Ease, Power0, Power1, Power2, Power3, Power4, Linear, _gsScope} from "./TweenLite.js";
|
||||
|
||||
import TweenMax from "./TweenMaxBase.js";
|
||||
import TimelineLite from "./TimelineLite.js";
|
||||
import TimelineMax from "./TimelineMax.js";
|
||||
|
||||
// plugins
|
||||
import AttrPlugin from "./AttrPlugin.js";
|
||||
import BezierPlugin from "./BezierPlugin.js";
|
||||
import ColorPropsPlugin from "./ColorPropsPlugin.js";
|
||||
import CSSPlugin from "./CSSPlugin.js";
|
||||
import CSSRulePlugin from "./CSSRulePlugin.js";
|
||||
import DirectionalRotationPlugin from "./DirectionalRotationPlugin.js";
|
||||
import EaselPlugin from "./EaselPlugin.js";
|
||||
import EndArrayPlugin from "./EndArrayPlugin.js";
|
||||
import ModifiersPlugin from "./ModifiersPlugin.js";
|
||||
import PixiPlugin from "./PixiPlugin.js";
|
||||
import RoundPropsPlugin from "./RoundPropsPlugin.js";
|
||||
import ScrollToPlugin from "./ScrollToPlugin.js";
|
||||
import TextPlugin from "./TextPlugin.js";
|
||||
|
||||
|
||||
// utils
|
||||
import Draggable from "./Draggable.js";
|
||||
|
||||
// easing
|
||||
import {
|
||||
Back,
|
||||
Elastic,
|
||||
Bounce,
|
||||
RoughEase,
|
||||
SlowMo,
|
||||
SteppedEase,
|
||||
Circ,
|
||||
Expo,
|
||||
Sine,
|
||||
ExpoScaleEase
|
||||
} from "./EasePack.js";
|
||||
|
||||
// bonus tools
|
||||
/*
|
||||
import DrawSVGPlugin from "./DrawSVGPlugin.js";
|
||||
import MorphSVGPlugin from "./MorphSVGPlugin.js";
|
||||
import Physics2DPlugin from "./Physics2DPlugin.js";
|
||||
import PhysicsPropsPlugin from "./PhysicsPropsPlugin.js";
|
||||
import ScrambleTextPlugin from "./ScrambleTextPlugin.js";
|
||||
import ThrowPropsPlugin from "./ThrowPropsPlugin.js";
|
||||
import GSDevTools from "./GSDevTools.js";
|
||||
import SplitText from "./SplitText.js";
|
||||
import CustomBounce from "./CustomBounce.js";
|
||||
import CustomEase from "./CustomEase.js";
|
||||
import CustomWiggle from "./CustomWiggle.js";
|
||||
|
||||
export {
|
||||
DrawSVGPlugin,
|
||||
MorphSVGPlugin,
|
||||
Physics2DPlugin,
|
||||
PhysicsPropsPlugin,
|
||||
ScrambleTextPlugin,
|
||||
ThrowPropsPlugin,
|
||||
GSDevTools,
|
||||
SplitText,
|
||||
CustomBounce,
|
||||
CustomEase,
|
||||
CustomWiggle
|
||||
}
|
||||
*/
|
||||
|
||||
|
||||
|
||||
export {
|
||||
TweenLite,
|
||||
TweenMax,
|
||||
TimelineLite,
|
||||
TimelineMax,
|
||||
_gsScope,
|
||||
|
||||
// plugins
|
||||
AttrPlugin,
|
||||
BezierPlugin,
|
||||
ColorPropsPlugin,
|
||||
CSSPlugin,
|
||||
CSSRulePlugin,
|
||||
DirectionalRotationPlugin,
|
||||
EaselPlugin,
|
||||
EndArrayPlugin,
|
||||
ModifiersPlugin,
|
||||
PixiPlugin,
|
||||
RoundPropsPlugin,
|
||||
ScrollToPlugin,
|
||||
TextPlugin,
|
||||
|
||||
// utils
|
||||
Draggable,
|
||||
|
||||
// easing
|
||||
Ease,
|
||||
Power0,
|
||||
Power1,
|
||||
Power2,
|
||||
Power3,
|
||||
Power4,
|
||||
Linear,
|
||||
Back,
|
||||
Elastic,
|
||||
Bounce,
|
||||
RoughEase,
|
||||
SlowMo,
|
||||
SteppedEase,
|
||||
Circ,
|
||||
Expo,
|
||||
Sine,
|
||||
ExpoScaleEase
|
||||
|
||||
};
|
||||
Vendored
+25
@@ -0,0 +1,25 @@
|
||||
/*!
|
||||
* VERSION: 2.1.0
|
||||
* DATE: 2019-02-07
|
||||
* UPDATES AND DOCS AT: 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 software agreement that was issued with your membership.
|
||||
*
|
||||
* @author: Jack Doyle, jack@greensock.com
|
||||
**/
|
||||
import TweenLite, { _gsScope, TweenPlugin, Ease, Power0, Power1, Power2, Power3, Power4, Linear } from "./TweenLite.js";
|
||||
import TimelineLite from "./TimelineLite.js";
|
||||
import TimelineMax from "./TimelineMax.js";
|
||||
import TweenMax from "./TweenMax.js";
|
||||
import CSSPlugin from "./CSSPlugin.js";
|
||||
import AttrPlugin from "./AttrPlugin.js";
|
||||
import RoundPropsPlugin from "./RoundPropsPlugin.js";
|
||||
import DirectionalRotationPlugin from "./DirectionalRotationPlugin.js";
|
||||
import BezierPlugin from "./BezierPlugin.js";
|
||||
import { Back, Elastic, Bounce, RoughEase, SlowMo, SteppedEase, Circ, Expo, Sine, ExpoScaleEase } from "./EasePack.js";
|
||||
|
||||
|
||||
export { TweenMax as default };
|
||||
export { TweenLite, TweenMax, TimelineLite, TimelineMax, CSSPlugin, AttrPlugin, BezierPlugin, RoundPropsPlugin, DirectionalRotationPlugin, TweenPlugin, Ease, Power0, Power1, Power2, Power3, Power4, Linear, Back, Elastic, Bounce, RoughEase, SlowMo, SteppedEase, Circ, Expo, Sine, ExpoScaleEase, _gsScope };
|
||||
+57
@@ -0,0 +1,57 @@
|
||||
{
|
||||
"name": "gsap",
|
||||
"version": "2.1.0",
|
||||
"description": "GSAP is a JavaScript library for creating high-performance animations that work in **every** major browser (or beyond the browser). No other library delivers such advanced sequencing, reliability, API efficiency, and tight control while solving real-world problems on over 4 million sites. GSAP works around countless browser inconsistencies; your animations 'just work'. Animate CSS properties, SVG, canvas libraries, 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.",
|
||||
"homepage": "https://greensock.com/gsap/",
|
||||
"filename": "index.js",
|
||||
"module": "index.js",
|
||||
"main": "index.js",
|
||||
"sideEffects": [
|
||||
"./TweenLite.js",
|
||||
"./TweenMax.js",
|
||||
"./index.js"
|
||||
],
|
||||
"keywords": [
|
||||
"animation",
|
||||
"TweenLite",
|
||||
"TweenMax",
|
||||
"TimelineLite",
|
||||
"TimelineMax",
|
||||
"GSAP",
|
||||
"GreenSock",
|
||||
"easing",
|
||||
"EasePack",
|
||||
"PixiPlugin",
|
||||
"CustomEase",
|
||||
"jQuery",
|
||||
"jquery.gsap.js",
|
||||
"Bezier",
|
||||
"SVG",
|
||||
"3D",
|
||||
"2D",
|
||||
"transform",
|
||||
"morph",
|
||||
"morphing",
|
||||
"svg",
|
||||
"tweening"
|
||||
],
|
||||
"browserify": {
|
||||
"transform": [["babelify", { "presets": ["@babel/preset-env"] }]]
|
||||
},
|
||||
"maintainers": [
|
||||
{
|
||||
"name": "Jack Doyle",
|
||||
"email": "jack@greensock.com",
|
||||
"web": "https://greensock.com"
|
||||
}
|
||||
],
|
||||
"license": "Standard 'no charge' license: https://greensock.com/standard-license. Club GreenSock members get more: https://greensock.com/licensing/. Why GreenSock doesn't employ an MIT license: https://greensock.com/why-license/",
|
||||
"bugs": {
|
||||
"url": "https://greensock.com/forums/"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/greensock/GreenSock-JS"
|
||||
}
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user