gsap = function (target, duration, vars) { TweenLite.call(this, target, duration, vars); this._cycle = 0; this._yoyo = (this.vars.yoyo === true); this._repeat = this.vars.repeat || 0; this._repeatDelay = this.vars.repeatDelay || 0; this._dirty = 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) }
n/a
BackIn = function (overshoot) { this._p1 = (overshoot || overshoot === 0) ? overshoot : 1.70158; this._p2 = this._p1 * 1.525; }
n/a
BackInOut = function (overshoot) { this._p1 = (overshoot || overshoot === 0) ? overshoot : 1.70158; this._p2 = this._p1 * 1.525; }
n/a
BackOut = function (overshoot) { this._p1 = (overshoot || overshoot === 0) ? overshoot : 1.70158; this._p2 = this._p1 * 1.525; }
n/a
BezierPlugin = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
BounceIn = function (){}
n/a
BounceInOut = function (){}
n/a
BounceOut = function (){}
n/a
CSSPlugin = function () { TweenPlugin.call(this, "css"); this._overwriteProps.length = 0; this.setRatio = CSSPlugin.prototype.setRatio; //speed optimization (avoid prototype lookup on this "hot" method) }
n/a
CSSRulePlugin = function () { TweenPlugin.call(this, "cssRule"); this._overwriteProps.length = 0; }
n/a
CircIn = function (){}
n/a
CircInOut = function (){}
n/a
CircOut = function (){}
n/a
ColorPropsPlugin = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
Cubic = function () {}
n/a
Ease = function (func, extraParams, type, power) { this._func = func; this._type = type || 0; this._power = power || 0; this._params = extraParams ? _baseParams.concat(extraParams) : _baseParams; }
n/a
ElasticIn = 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 }
n/a
ElasticInOut = 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 }
n/a
ElasticOut = 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 }
n/a
ExpoIn = function (){}
n/a
ExpoInOut = function (){}
n/a
ExpoOut = function (){}
n/a
Linear = function () {}
n/a
Power0 = function () {}
n/a
Power1 = function () {}
n/a
Power2 = function () {}
n/a
Power3 = function () {}
n/a
Power4 = function () {}
n/a
Quad = function () {}
n/a
Quart = function () {}
n/a
Quint = function () {}
n/a
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); }
n/a
SineIn = function (){}
n/a
SineInOut = function (){}
n/a
SineOut = function (){}
n/a
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); }
n/a
SteppedEase = function (steps) { steps = steps || 1; this._p1 = 1 / steps; this._p2 = steps + 1; }
n/a
Strong = function () {}
n/a
TimelineLite = function (vars) { SimpleTimeline.call(this, vars); this._labels = {}; this.autoRemoveChildren = (this.vars.autoRemoveChildren === true); this.smoothChildTiming = (this.vars.smoothChildTiming === true); this._sortChildren = true; this._onUpdate = this.vars.onUpdate; var v = this.vars, val, p; for (p in v) { val = v[p]; if (_isArray(val)) if (val.join("").indexOf("{self}") !== -1) { v[p] = this._swapSelfInParams(val); } } if (_isArray(v.tweens)) { this.add(v.tweens, 0, v.align, v.stagger); } }
n/a
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 === true); this._dirty = true; }
n/a
TweenLite = function (target, duration, vars) { Animation.call(this, duration, vars); this.render = TweenLite.prototype.render; //speed optimization (avoid prototype lookup on this "hot" method) if (target == null) { throw "Cannot tween a null target."; } this.target = target = (typeof(target) !== "string") ? target : TweenLite.selector(target) || target; var isSelector = (target.jquery || (target.length && target !== window && target[0] && (target[0] === window || (target[0].nodeType && target[0].style && !target.nodeType)))), overwrite = this.vars.overwrite, i, targ, targets; this._overwrite = overwrite = (overwrite == null) ? _overwriteLookup[TweenLite.defaultOverwrite] : (typeof(overwrite) === "number ") ? overwrite >> 0 : _overwriteLookup[overwrite]; if ((isSelector || target instanceof Array || (target.push && _isArray(target))) && typeof(target[0]) !== "number") { this._targets = targets = _slice(target); //don't use Array.prototype.slice.call(target, 0) because that doesn't work in IE8 with a NodeList that's returned by querySelectorAll() this._propLookup = []; this._siblings = []; for (i = 0; i < targets.length; i++) { targ = targets[i]; if (!targ) { targets.splice(i--, 1); continue; } else if (typeof(targ) === "string") { targ = targets[i--] = TweenLite.selector(targ); //in case it's an array of strings if (typeof(targ) === "string") { targets.splice(i+1, 1); //to avoid an endless loop (can't imagine why the selector would return a string, but just in case ) } continue; } else if (targ.length && targ !== window && targ[0] && (targ[0] === window || (targ[0].nodeType && targ[0].style && !targ .nodeType))) { //in case the user is passing in an array of selector objects (like jQuery objects), we need to check one more level and pull things out if necessary. Also note that <select> elements pass all the criteria regarding length and the first child having style, so we must also check to ensure the target isn't an HTML node itself. targets.splice(i--, 1); this._targets = targets = targets.concat(_slice(targ)); continue; } this._siblings[i] = _register(targ, this, false); if (overwrite === 1) if (this._siblings[i].length > 1) { _applyOverwrite(targ, this, null, 1, this._siblings[i]); } } } else { this._propLookup = {}; this._siblings = _register(target, this, false); if (overwrite === 1) if (this._siblings.length > 1) { _applyOverwrite(target, this, null, 1, this._siblings); } } if (this.vars.immediateRender || (duration === 0 && this._delay === 0 && this.vars.immediateRender !== false)) { this._time = -_tinyNum; //forces a render without having to set the render() "force" parameter to true because we want to allow lazying by default (using the "force" parameter always forces an immediate full render) this.render(Math.min(0, -this._delay)); //in case delay is negative } }
n/a
TweenMax = function (target, duration, vars) { TweenLite.call(this, target, duration, vars); this._cycle = 0; this._yoyo = (this.vars.yoyo === true); this._repeat = this.vars.repeat || 0; this._repeatDelay = this.vars.repeatDelay || 0; this._dirty = 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) }
n/a
TweenPlugin = function (props, priority) { this._overwriteProps = (props || "").split(","); this._propName = this._overwriteProps[0]; this._priority = priority || 0; this._super = TweenPlugin.prototype; }
n/a
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); }
n/a
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); }
n/a
allTo = function (targets, duration, vars, stagger, onCompleteAll, onCompleteAllParams, onCompleteAllScope) { stagger = stagger || 0; var delay = 0, a = [], finalComplete = function() { if (vars.onComplete) { vars.onComplete.apply(vars.onCompleteScope || this, arguments); } onCompleteAll.apply(onCompleteAllScope || vars.callbackScope || this, onCompleteAllParams || _blankArray); }, cycle = vars.cycle, fromCycle = (vars.startAt && vars.startAt.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 || []; if (stagger < 0) { targets = _slice(targets); targets.reverse(); stagger *= -1; } 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 = delay + (copy.delay || 0); if (i === l && onCompleteAll) { copy.onComplete = finalComplete; } a[i] = new TweenMax(targets[i], duration, copy); delay += stagger; } return a; }
n/a
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}); }
...
}
}
//DEBUG: _log("parsed rotation of " + t.getAttribute("id")+": "+(tm.rotationX)+", "+(
tm.rotationY)+", "+(tm.rotation)+", scale: "+tm.scaleX+", "+tm.scaleY+", "+tm.scaleZ+"
;, position: "+tm.x+", "+tm.y+", "+tm.z+", perspective: "+tm.perspective+ ", origin: "
;+ tm.xOrigin+ ","+ tm.yOrigin);
if (rec) {
t._gsTransform = tm; //record to the object's _gsTransform which we use so that tweens can control individual properties
independently (we need all the properties to accurately recompose the matrix in the setRatio() method)
if (tm.svg) { //if we're supposed to apply transforms to the SVG element's "transform" attribute, make
sure there aren't any CSS transforms applied or they'll override the attribute ones. Also clear the transform attribute
if we're using CSS, just to be clean.
if (_useSVGTransformAttr && t.style[_transformProp]) {
TweenLite.delayedCall(0.001, function(){ //if we apply this right away (before
anything has rendered), we risk there being no transforms for a brief moment and it also interferes with adjusting the transformOrigin
in a tween with immediateRender:true (it'd try reading the matrix and it wouldn't have the appropriate data in place
because we just removed it).
_removeProp(t.style, _transformProp);
});
} else if (!_useSVGTransformAttr && t.getAttribute("transform")) {
TweenLite.delayedCall(0.001, function(){
t.removeAttribute("transform");
});
}
...
from = function (target, duration, vars) { vars.runBackwards = true; vars.immediateRender = (vars.immediateRender != false); return new TweenMax(target, duration, vars); }
...
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, vars), position);
};
p.fromTo = function(target, duration, fromVars, toVars, position) {
var Engine = (toVars.repeat && _globals.TweenMax) || TweenLite;
return duration ? this.add( Engine.fromTo(target, duration, fromVars, toVars), position) : this.set(target, toVars, position);
};
...
fromTo = function (target, duration, fromVars, toVars) { toVars.startAt = fromVars; toVars.immediateRender = (toVars.immediateRender != false && fromVars.immediateRender != false); return new TweenMax(target, duration, toVars); }
...
}
orig = v.transformOrigin;
if (m1.svg && (orig || v.svgOrigin)) {
x = m1.xOffset; //when we change the origin, in order to prevent things from jumping we adjust the x/y so we must record those
here so that we can create PropTweens for them and flip them at the same time as the origin
y = m1.yOffset;
_parseSVGOrigin(t, _parsePosition(orig), m2, v.svgOrigin, v.smoothOrigin);
pt = _addNonTweeningNumericPT(m1, "xOrigin", (originalGSTransform ? m1 : m2).xOrigin, m2.xOrigin, pt, transformOriginString
); //note: if there wasn't a transformOrigin defined yet, just start with the destination one; it's wasteful otherwise
, and it causes problems with fromTo() tweens. For example, TweenLite.to("#wheel", 3, {rotation:180, transformOrigin:
x22;50% 50%", delay:1}); TweenLite.fromTo("#wheel", 3, {scale:0.5, transformOrigin
:"50% 50%"}, {scale:1, delay:2}); would cause a jump when the from values revert at the beginning of the 2nd tween.
pt = _addNonTweeningNumericPT(m1, "yOrigin", (originalGSTransform ? m1 : m2).yOrigin, m2.yOrigin, pt, transformOriginString
);
if (x !== m1.xOffset || y !== m1.yOffset) {
pt = _addNonTweeningNumericPT(m1, "xOffset", (originalGSTransform ? x : m1.xOffset), m1.xOffset, pt, transformOriginString
);
pt = _addNonTweeningNumericPT(m1, "yOffset", (originalGSTransform ? y : m1.yOffset), m1.yOffset, pt, transformOriginString
);
}
orig = "0px 0px"; //certain browsers (like firefox) completely botch transform-origin, so we must remove it to prevent
it from contaminating transforms. We manage it ourselves with xOrigin and yOrigin
}
...
getAllTweens = function (includeTimelines) { return _getChildrenOf(Animation._rootTimeline, includeTimelines).concat( _getChildrenOf(Animation._rootFramesTimeline, includeTimelines ) ); }
n/a
getTweensOf = function (target, onlyActive) { if (target == null) { return []; } target = (typeof(target) !== "string") ? target : TweenLite.selector(target) || target; var i, a, j, t; if ((_isArray(target) || _isSelector(target)) && typeof(target[0]) !== "number") { i = target.length; a = []; while (--i > -1) { a = a.concat(TweenLite.getTweensOf(target[i], onlyActive)); } i = a.length; //now get rid of any duplicates (tweens of arrays of objects could cause duplicates) while (--i > -1) { t = a[i]; j = i; while (--j > -1) { if (t === a[j]) { a.splice(i, 1); } } } } else { a = _register(target).concat(); i = a.length; while (--i > -1) { if (a[i]._gc || (onlyActive && !a[i].isActive())) { a.splice(i, 1); } } } return a; }
...
};
$.fn.stop = function(clearQueue, gotoEnd) {
_stop.call(this, clearQueue, gotoEnd);
if (TweenLite) {
if (gotoEnd) {
var tweens = TweenLite.getTweensOf(this),
i = tweens.length,
progress;
while (--i > -1) {
progress = tweens[i].totalTime() / tweens[i].totalDuration();
if (progress > 0 && progress < 1) {
tweens[i].seek(tweens[i].totalDuration());
}
...
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; }
n/a
isTweening = function (target) { return (TweenLite.getTweensOf(target, true).length > 0); }
n/a
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); } } } }
n/a
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); } }
...
}
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) {
...
killDelayedCallsTo = function (target, onlyActive, vars) { if (typeof(onlyActive) === "object") { vars = onlyActive; //for backwards compatibility (before "onlyActive" parameter was inserted) onlyActive = false; } var a = TweenLite.getTweensOf(target, onlyActive), i = a.length; while (--i > -1) { a[i]._kill(vars, target); } }
n/a
killTweensOf = function (target, onlyActive, vars) { if (typeof(onlyActive) === "object") { vars = onlyActive; //for backwards compatibility (before "onlyActive" parameter was inserted) onlyActive = false; } var a = TweenLite.getTweensOf(target, onlyActive), i = a.length; while (--i > -1) { a[i]._kill(vars, target); } }
...
if (!arguments.length) {
return -(element.scrollLeft + offsetLeft);
}
var dif = element.scrollLeft - prevLeft,
oldOffset = offsetLeft;
if ((dif > 2 || dif < -2) && !force) { //if the user interacts with the scrollbar (or something else scrolls
it, like the mouse wheel), we should kill any tweens of the ScrollProxy.
prevLeft = element.scrollLeft;
TweenLite.killTweensOf(this, true, {left:1, scrollLeft:1});
this.left(-prevLeft);
if (vars.onKill) {
vars.onKill();
}
return;
}
value = -value; //invert because scrolling works in the opposite direction
...
lagSmoothing = function (threshold, adjustedLag) { _ticker.lagSmoothing(threshold, adjustedLag); }
...
TweenLite.version = "1.19.1";
TweenLite.defaultEase = p._ease = new Ease(null, null, 1, 1);
TweenLite.defaultOverwrite = "auto";
TweenLite.ticker = _ticker;
TweenLite.autoSleep = 120;
TweenLite.lagSmoothing = function(threshold, adjustedLag) {
_ticker.lagSmoothing(threshold, adjustedLag);
};
TweenLite.selector = window.$ || window.jQuery || function(e) {
var selector = window.$ || window.jQuery;
if (selector) {
TweenLite.selector = selector;
return selector(e);
...
pauseAll = function (tweens, delayedCalls, timelines) { _changePause(true, tweens, delayedCalls, timelines); }
n/a
render = function () { var i, a, p; if (_lazyTweens.length) { //if code is run outside of the requestAnimationFrame loop, there may be tweens queued AFTER the engine refreshed, so we need to ensure any pending renders occur before we refresh again. _lazyRender(); } _rootTimeline.render((_ticker.time - _rootTimeline._startTime) * _rootTimeline._timeScale, false, false); _rootFramesTimeline.render((_ticker.frame - _rootFramesTimeline._startTime) * _rootFramesTimeline._timeScale, false, false); if (_lazyTweens.length) { _lazyRender(); } if (_ticker.frame >= _nextGCFrame) { //dump garbage every 120 frames or whatever the user sets TweenLite.autoSleep to _nextGCFrame = _ticker.frame + (parseInt(TweenLite.autoSleep, 10) || 120); for (p in _tweenLookup) { a = _tweenLookup[p].tweens; i = a.length; while (--i > -1) { if (a[i]._gc) { a.splice(i, 1); } } if (a.length === 0) { delete _tweenLookup[p]; } } //if there are no more tweens in the root timelines, or if they're all paused, make the _timer sleep to reduce load on the CPU slightly p = _rootTimeline._first; if (!p || p._paused) if (TweenLite.autoSleep && !_rootFramesTimeline._first && _ticker._listeners.tick.length === 1) { while (p && p._paused) { p = p._next; } if (!p) { _ticker.sleep(); } } } }
...
b = [],
e = [],
targets = [],
_reservedProps = TweenLite._internals.reservedProps,
i, difs, p, from;
target = tween._targets || tween.target;
_getChildStyles(target, b, targets);
tween.render(duration, true, true);
_getChildStyles(target, e);
tween.render(0, true, true);
tween._enabled(true);
i = targets.length;
while (--i > -1) {
difs = _cssDif(targets[i], b[i], e[i]);
if (difs.firstMPT) {
...
resumeAll = function (tweens, delayedCalls, timelines) { _changePause(false, tweens, delayedCalls, timelines); }
n/a
set = function (target, vars) { return new TweenMax(target, 0, vars); }
...
var _gsScope = (typeof(module) !== "undefined" && module.exports && typeof(global) !== "undefined
") ? global : this || window; //helps ensure compatibility with AMD/RequireJS and CommonJS/Node
(_gsScope._gsQueue || (_gsScope._gsQueue = [])).push( function() {
"use strict";
_gsScope._gsDefine("utils.Draggable", ["events.EventDispatcher","TweenLite","plugins.CSSPlugin
"], function(EventDispatcher, TweenLite, CSSPlugin) {
var _tempVarsXY = {css:{}}, //speed optimization - we reuse the same vars object for x/y TweenLite.set() calls to minimize garbage collection tasks and improve performance.
_tempVarsX = {css:{}},
_tempVarsY = {css:{}},
_tempVarsRotation = {css:{}},
_globals = _gsScope._gsDefine.globals,
_tempEvent = {}, //for populating with pageX/pageY in old versions of IE
_dummyElement = {style:{}},
_doc = _gsScope.document || {createElement: function() {return _dummyElement;}},
...
staggerFrom = 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); }
n/a
staggerFromTo = 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); }
n/a
staggerTo = function (targets, duration, vars, stagger, onCompleteAll, onCompleteAllParams, onCompleteAllScope) { stagger = stagger || 0; var delay = 0, a = [], finalComplete = function() { if (vars.onComplete) { vars.onComplete.apply(vars.onCompleteScope || this, arguments); } onCompleteAll.apply(onCompleteAllScope || vars.callbackScope || this, onCompleteAllParams || _blankArray); }, cycle = vars.cycle, fromCycle = (vars.startAt && vars.startAt.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 || []; if (stagger < 0) { targets = _slice(targets); targets.reverse(); stagger *= -1; } 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 = delay + (copy.delay || 0); if (i === l && onCompleteAll) { copy.onComplete = finalComplete; } a[i] = new TweenMax(targets[i], duration, copy); delay += stagger; } return a; }
...
}
return this.add(tl, position);
};
p.staggerFrom = function(targets, duration, vars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope) {
vars.immediateRender = (vars.immediateRender != false);
vars.runBackwards = true;
return this.staggerTo(targets, duration, vars, stagger, position, onCompleteAll, onCompleteAllParams
, onCompleteAllScope);
};
p.staggerFromTo = function(targets, duration, fromVars, toVars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope
) {
toVars.startAt = fromVars;
toVars.immediateRender = (toVars.immediateRender != false && fromVars.immediateRender != false);
return this.staggerTo(targets, duration, toVars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope);
};
...
to = function (target, duration, vars) { return new TweenMax(target, duration, vars); }
...
* target.style.width = (start + value * ratio) + "px";
* console.log("set width to " + target.style.width);
* }
* }, 0);
*
* Then, when I do this tween, it will trigger my special property:
*
* TweenLite.to(element, 1, {css:{myCustomProp:100}});
*
* In the example, of course, we're just changing the width, but you can do anything you want.
*
* @param {!string} name Property name (or comma-delimited list of property names) that should be intercepted and handled by your
function. For example, if I define "myCustomProp", then it would handle that portion of the following tween: TweenLite
.to(element, 1, {css:{myCustomProp:100}})
* @param {!function(Object, Object, Object, string):function(number)} onInitTween The function that will be called when a tween
of this special property is performed. The function will receive 4 parameters: 1) Target object that should be tweened, 2) Value
that was passed to the tween, 3) The tween instance itself (rarely used), and 4) The property name that's being tweened. Your
function should return a function that should be called on every update of the tween. That function will receive a single parameter
that is a "change factor" value (typically between 0 and 1) indicating the amount of change as a ratio. You can use this
to determine how to set the values appropriately in your function.
* @param {number=} priority Priority that helps the engine determine the order in which to set the properties (default: 0). Higher
priority properties will be updated before lower priority ones.
*/
...
BackIn = function (overshoot) { this._p1 = (overshoot || overshoot === 0) ? overshoot : 1.70158; this._p2 = this._p1 * 1.525; }
n/a
config = function (overshoot) { return new C(overshoot); }
n/a
constructor = function (overshoot) { this._p1 = (overshoot || overshoot === 0) ? overshoot : 1.70158; this._p2 = this._p1 * 1.525; }
n/a
getRatio = function (p) { return p * p * ((this._p1 + 1) * p - this._p1); }
...
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;
...
BackInOut = function (overshoot) { this._p1 = (overshoot || overshoot === 0) ? overshoot : 1.70158; this._p2 = this._p1 * 1.525; }
n/a
config = function (overshoot) { return new C(overshoot); }
n/a
constructor = function (overshoot) { this._p1 = (overshoot || overshoot === 0) ? overshoot : 1.70158; this._p2 = this._p1 * 1.525; }
n/a
getRatio = 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); }
...
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;
...
BackOut = function (overshoot) { this._p1 = (overshoot || overshoot === 0) ? overshoot : 1.70158; this._p2 = this._p1 * 1.525; }
n/a
config = function (overshoot) { return new C(overshoot); }
n/a
constructor = function (overshoot) { this._p1 = (overshoot || overshoot === 0) ? overshoot : 1.70158; this._p2 = this._p1 * 1.525; }
n/a
getRatio = function (p) { return ((p = p - 1) * p * ((this._p1 + 1) * p + this._p1) + 1); }
...
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;
...
BezierPlugin = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
_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; }}); }
...
var pluginName = p.charAt(0).toUpperCase() + p.substr(1) + "Plugin";
_registerComplexSpecialProp(p, {parser:function(t, e, p, cssp, pt, plugin, vars) {
var pluginClass = _globals.com.greensock.plugins[pluginName];
if (!pluginClass) {
_log("Error: " + pluginName + " js file not loaded.");
return pt;
}
pluginClass._cssRegister();
return _specialProps[p].parse(t, e, p, cssp, pt, plugin, vars);
}});
}
};
p = SpecialProp.prototype;
...
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; }
n/a
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]; }
n/a
quadraticToCubic = function (a, b, c) { return new Segment(a, (2 * b + a) / 3, (2 * b + c) / 3, c); }
n/a
_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); }
...
prev._next = pt._next;
}
} else {
prev = pt;
}
pt = pt._next;
}
return this._super._kill(lookup);
};
}); if (_gsScope._gsDefine) { _gsScope._gsQueue.pop()(); }
//export to AMD/RequireJS and CommonJS/Node (precursor to full modular build system coming at a later date)
(function(name) {
"use strict";
...
_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; } } }
...
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._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;
} else {
this._add(pt.t, pt.p, pt.s, pt.c, val);
//remove from linked list
...
_onInitTween = 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; }
...
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,
...
constructor = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
setRatio = 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; } } } } }
...
}
return cssp.parse(t, vars, pt, plugin);
};
},
// @private used when other plugins must tween values first, like BezierPlugin or ThrowPropsPlugin, etc. That plugin's setRatio
() gets called first so that the values are updated, and then we loop through the MiniPropTweens which handle copying the values
into their appropriate slots so that they can then be applied correctly in the main CSSPlugin setRatio() method. Remember, we typically
create a proxy object that has a bunch of uniquely-named properties that we feed to the sub-plugin and it does its magic normally
, and then we must interpret those values and apply them to the css because often numbers must get combined/concatenated, suffixes
added, etc. to work with css, like boxShadow could have 4 values plus a color.
_setPluginRatio = _internals._setPluginRatio = function(v) {
this.plugin.setRatio(v);
var d = this.data,
proxy = d.proxy,
mpt = d.firstMPT,
min = 0.000001,
val, pt, i, str, p;
while (mpt) {
val = proxy[mpt.v];
...
BounceIn = function (){}
n/a
constructor = function (){}
n/a
getRatio = 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); }
...
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;
...
BounceInOut = function (){}
n/a
constructor = function (){}
n/a
getRatio = 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; }
...
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;
...
BounceOut = function (){}
n/a
constructor = function (){}
n/a
getRatio = 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; }
...
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;
...
CSSPlugin = function () { TweenPlugin.call(this, "css"); this._overwriteProps.length = 0; this.setRatio = CSSPlugin.prototype.setRatio; //speed optimization (avoid prototype lookup on this "hot" method) }
n/a
cascadeTo = function (target, duration, vars) { var tween = TweenLite.to(target, duration, vars), results = [tween], b = [], e = [], targets = [], _reservedProps = TweenLite._internals.reservedProps, i, difs, p, from; target = tween._targets || tween.target; _getChildStyles(target, b, targets); tween.render(duration, true, true); _getChildStyles(target, e); tween.render(0, true, true); tween._enabled(true); i = targets.length; while (--i > -1) { difs = _cssDif(targets[i], b[i], e[i]); if (difs.firstMPT) { difs = difs.difs; for (p in vars) { if (_reservedProps[p]) { difs[p] = vars[p]; } } from = {}; for (p in difs) { from[p] = b[i][p]; } results.push(TweenLite.fromTo(targets[i], duration, from, difs)); } } return results; }
n/a
colorStringFilter = function (a) { var combined = a[0] + a[1], toHSL; 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); } _colorExp.lastIndex = 0; }
...
if (typeof(e) === "function") {
e = e(_index, _target);
}
pt = new CSSPropTween(t, p, 0, 0, pt, (setRatio ? 2 : 1), null, false, pr, b, e);
e += ""; //ensures it's a string
if (clrs && _colorExp.test(e + b)) { //if colors are found, normalize the formatting to rgba() or hsla().
e = [b, e];
CSSPlugin.colorStringFilter(e);
b = e[0];
e = e[1];
}
var ba = b.split(", ").join(",").split(" "), //beginning array
ea = e.split(", ").join(",").split(" "), //ending array
l = ba.length,
autoRound = (_autoRound !== false),
...
getStyle = function (t, p, cs, calc, dflt) { var rv; if (!_supportsOpacity) if (p === "opacity") { //several versions of IE don't use the standard "opacity" property - they use things like filter:alpha(opacity=50), so we parse that here. return _getIEOpacity(t); } if (!calc && t.style[p]) { rv = t.style[p]; } else if ((cs = cs || _getComputedStyle(t))) { rv = cs[p] || cs.getPropertyValue(p) || cs.getPropertyValue(p.replace(_capsExp, "-$1").toLowerCase()); } else if (t.currentStyle) { rv = t.currentStyle[p]; } return (dflt != null && (!rv || rv === "none" || rv === "auto" || rv === "auto auto")) ? dflt : rv; }
...
return null;
},
_getComputedStyle = _doc.defaultView ? _doc.defaultView.getComputedStyle : function() {},
/**
* @private Returns the css style for a particular property of an element. For example, to get whatever the current "left
" css value for an element with an ID of "myElement", you could do:
* var currentLeft = CSSPlugin.getStyle( document.getElementById("myElement
x22;), "left");
*
* @param {!Object} t Target element whose style property you want to query
* @param {!string} p Property name (like "left" or "top" or "marginTop", etc.)
* @param {Object=} cs Computed style object. This just provides a way to speed processing if you're going to get several
properties on the same element in quick succession - you can reuse the result of the getComputedStyle() call.
* @param {boolean=} calc If true, the value will not be read directly from the element's "style" property (if
it exists there), but instead the getComputedStyle() result will be used. This can be useful when you want to ensure that the browser
itself is interpreting the value.
* @param {string=} dflt Default value that should be returned in the place of null, "none", "auto" or
x22;auto auto".
* @return {?string} The current property value
...
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(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 a; }
n/a
parseComplex = function (t, p, b, e, clrs, dflt, pt, pr, plugin, setRatio) { //DEBUG: _log("parseComplex: "+p+", b: "+b+", e: "+e); b = b || dflt || ""; if (typeof(e) === "function") { e = e(_index, _target); } pt = new CSSPropTween(t, p, 0, 0, pt, (setRatio ? 2 : 1), null, false, pr, b, e); e += ""; //ensures it's a string if (clrs && _colorExp.test(e + b)) { //if colors are found, normalize the formatting to rgba() or hsla(). e = [b, e]; CSSPlugin.colorStringFilter(e); b = e[0]; e = e[1]; } var ba = b.split(", ").join(",").split(" "), //beginning array ea = e.split(", ").join(",").split(" "), //ending array l = ba.length, autoRound = (_autoRound !== false), i, xi, ni, bv, ev, bnums, enums, bn, hasAlpha, temp, cv, str, useHSL; if (e.indexOf(",") !== -1 || b.indexOf(",") !== -1) { ba = ba.join(" ").replace(_commasOutsideParenExp, ", ").split(" "); ea = ea.join(" ").replace(_commasOutsideParenExp, ", ").split(" "); l = ba.length; } if (l !== ea.length) { //DEBUG: _log("mismatched formatting detected on " + p + " (" + b + " vs " + e + ")"); ba = (dflt || "").split(" "); l = ba.length; } pt.plugin = plugin; pt.setRatio = setRatio; _colorExp.lastIndex = 0; for (i = 0; i < l; i++) { bv = ba[i]; ev = ea[i]; bn = parseFloat(bv); //if the value begins with a number (most common). It's fine if it has a suffix like px if (bn || bn === 0) { pt.appendXtra("", bn, _parseChange(ev, bn), ev.replace(_relNumExp, ""), (autoRound && ev.indexOf("px") !== -1), true); //if the value is a color } else if (clrs && _colorExp.test(bv)) { str = ev.indexOf(")") + 1; str = ")" + (str ? ev.substr(str) : ""); //if there's a comma or ) at the end, retain it. useHSL = (ev.indexOf("hsl") !== -1 && _supportsOpacity); bv = _parseColor(bv, useHSL); ev = _parseColor(ev, useHSL); hasAlpha = (bv.length + ev.length > 6); if (hasAlpha && !_supportsOpacity && ev[3] === 0) { //older versions of IE don't support rgba(), so if the destination alpha is 0, just use "transparent" for the end color pt["xs" + pt.l] += pt.l ? " transparent" : "transparent"; pt.e = pt.e.split(ea[i]).join("transparent"); } else { if (!_supportsOpacity) { //old versions of IE don't support rgba(). hasAlpha = false; } if (useHSL) { pt.appendXtra((hasAlpha ? "hsla(" : "hsl("), bv[0], _parseChange(ev[0], bv[0]), ",", false, true) .appendXtra("", bv[1], _parseChange(ev[1], bv[1]), "%,", false) .appendXtra("", bv[2], _parseChange(ev[2], bv[2]), (hasAlpha ? "%," : "%" + str), false); } else { pt.appendXtra((hasAlpha ? "rgba(" : "rgb("), bv[0], ev[0] - bv[0], ",", true, true) .appendXtra("", bv[1], ev[1] - bv[1], ",", true) .appendXtra("", bv[2], ev[2] - bv[2], (hasAlpha ? "," : str), true); } if (hasAlpha) { bv = (bv.length < 4) ? 1 : bv[3]; pt.appendXtra("", bv, ((ev.length < 4) ? 1 : ev[3]) - bv, str, false); } } _colorExp.lastIndex = 0; //otherwise the test() on the RegExp could move the lastIndex and taint future results. } else { bnums = bv.match(_numExp); //gets each group of numbers in the beginning value string and drops them into an array //if no number is found, treat it as a non-tweening value and just append the string to the current xs. if (!bnums) { pt["xs" + pt.l] += (pt.l || pt["xs" + pt.l]) ? " " + ev : ev; //loop through all the numbers that are found and construct the extra values on the pt. } else { enums = ev.match(_relNumExp); //get each group of numbers in the end value string and drop them into an array. We allow relative values too, like +=50 or -=.5 if (!enums || enums.length !== bnums.length) { //DEBUG: _log("mismatched formatting detected on " + p + " (" + b + " vs " + e + ")"); return pt; } ni = 0; for (xi = 0 ...
...
pt.b = start;
pt.e = pt.xs0 = end;
return pt;
},
/**
* Takes a target, the beginning value and ending value (as strings) and parses them into a CSSPropTween (possibly with child
CSSPropTweens) that accommodates multiple numbers, colors, comma-delimited values, etc. For example:
* sp.parseComplex(element, "boxShadow", "5px 10px 20px rgb(255,102
,51)", "0px 0px 0px red", true, "0px 0px 0px rgb(0,0,0,0)", pt);
* It will walk through the beginning and ending values (which should be in the same format with the same number and type of
values) and figure out which parts are numbers, what strings separate the numeric/tweenable values, and then create the CSSPropTweens
accordingly. If a plugin is defined, no child CSSPropTweens will be created. Instead, the ending values will be stored in the
x22;data" property of the returned CSSPropTween like: {s:-5, xn1:-10, xn2:-20, xn3:255, xn4:0, xn5:0} so that it can be fed
to any other plugin and it'll be plain numeric tweens but the recomposition of the complex value will be handled inside CSSPlugin
's setRatio().
* If a setRatio is defined, the type of the CSSPropTween will be set to 2 and recomposition of the values will be the responsibility
of that method.
*
* @param {!Object} t Target whose property will be tweened
* @param {!string} p Property that will be tweened (its name, like "left" or "backgroundColor" or "
boxShadow")
* @param {string} b Beginning value
* @param {string} e Ending value
...
registerSpecialProp = function (name, onInitTween, priority) { _registerComplexSpecialProp(name, {parser:function(t, e, p, cssp, pt, plugin, vars) { var rv = new CSSPropTween(t, p, 0, 0, pt, 2, p, false, priority); rv.plugin = plugin; rv.setRatio = onInitTween(t, e, cssp._tween, p); return rv; }, priority:priority}); }
...
* Registers a special property that should be intercepted from any "css" objects defined in tweens. This allows you
to handle them however you want without CSSPlugin doing it for you. The 2nd parameter should be a function that accepts 3 parameters
:
* 1) Target object whose property should be tweened (typically a DOM element)
* 2) The end/destination value (could be a string, number, object, or whatever you want)
* 3) The tween instance (you probably don't need to worry about this, but it can be useful for looking up information like
the duration)
*
* Then, your function should return a function which will be called each time the tween gets rendered, passing a numeric "
;ratio" parameter to your function that indicates the change factor (usually between 0 and 1). For example:
*
* CSSPlugin.registerSpecialProp("myCustomProp", function(target, value,
tween) {
* var start = target.style.width;
* return function(ratio) {
* target.style.width = (start + value * ratio) + "px";
* console.log("set width to " + target.style.width);
* }
* }, 0);
*
...
CSSPropTween = function (t, p, s, c, next, type, n, r, pr, b, e) { this.t = t; //target this.p = p; //property this.s = s; //starting value this.c = c; //change value this.n = n || p; //name that this CSSPropTween should be associated to (usually the same as p, but not always - n is what overwriting looks at) if (!(t instanceof CSSPropTween)) { _overwriteProps.push(this.n); } this.r = r; //round (boolean) this.type = type || 0; //0 = normal tween, -1 = non-tweening (in which case xs0 will be applied to the target's property, like tp.t[tp.p] = tp.xs0), 1 = complex-value SpecialProp, 2 = custom setRatio() that does all the work if (pr) { this.pr = pr; _hasPriority = true; } this.b = (b === undefined) ? s : b; this.e = (e === undefined) ? s + c : e; if (next) { this._next = next; next._prev = this; } }
n/a
Transform = function () { this.perspective = parseFloat(CSSPlugin.defaultTransformPerspective) || 0; this.force3D = (CSSPlugin.defaultForce3D === false || !_supports3D) ? false : CSSPlugin.defaultForce3D || "auto"; }
n/a
_parseToProxy = function (t, vars, cssp, pt, plugin, shallow) { var bpt = pt, start = {}, end = {}, transform = cssp._transform, oldForce = _forcePT, i, p, xp, mpt, firstPT; cssp._transform = null; _forcePT = vars; pt = firstPT = cssp.parse(t, vars, pt, plugin); _forcePT = oldForce; //break off from the linked list so the new ones are isolated. if (shallow) { cssp._transform = transform; if (bpt) { bpt._prev = null; if (bpt._prev) { bpt._prev._next = null; } } } while (pt && pt !== bpt) { if (pt.type <= 1) { p = pt.p; end[p] = pt.s + pt.c; start[p] = pt.s; if (!shallow) { mpt = new MiniPropTween(pt, "s", p, mpt, pt.r); pt.c = 0; } if (pt.type === 1) { i = pt.l; while (--i > 0) { xp = "xn" + i; p = pt.p + "_" + xp; end[p] = pt.data[xp]; start[p] = pt[xp]; if (!shallow) { mpt = new MiniPropTween(pt, xp, p, mpt, pt.rxp[xp]); } } } } pt = pt._next; } return {proxy:start, end:end, firstMPT:mpt, pt:firstPT}; }
n/a
_registerComplexSpecialProp = function (p, options, defaults) { if (typeof(options) !== "object") { options = {parser:defaults}; //to make backwards compatible with older versions of BezierPlugin and ThrowPropsPlugin } var a = p.split(","), d = options.defaultValue, i, temp; defaults = defaults || [d]; for (i = 0; i < a.length; i++) { options.prefix = (i === 0 && options.prefix); options.defaultValue = defaults[i] || d; temp = new SpecialProp(a[i], options); } }
...
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 = [],
...
_registerPluginProp = function (p) { if (!_specialProps[p]) { var pluginName = p.charAt(0).toUpperCase() + p.substr(1) + "Plugin"; _registerComplexSpecialProp(p, {parser:function(t, e, p, cssp, pt, plugin, vars) { var pluginClass = _globals.com.greensock.plugins[pluginName]; if (!pluginClass) { _log("Error: " + pluginName + " js file not loaded."); return pt; } pluginClass._cssRegister(); return _specialProps[p].parse(t, e, p, cssp, pt, plugin, vars); }}); } }
n/a
_setPluginRatio = function (v) { this.plugin.setRatio(v); var d = this.data, proxy = d.proxy, mpt = d.firstMPT, min = 0.000001, val, pt, i, str, p; while (mpt) { val = proxy[mpt.v]; if (mpt.r) { val = Math.round(val); } else if (val < min && val > -min) { val = 0; } mpt.t[mpt.p] = val; mpt = mpt._next; } if (d.autoRotate) { d.autoRotate.rotation = d.mod ? d.mod(proxy.rotation, this.t) : proxy.rotation; //special case for ModifyPlugin to hook into an auto-rotating bezier } //at the end, we must set the CSSPropTween's "e" (end) value dynamically here because that's what is used in the final setRatio () method. Same for "b" at the beginning. if (v === 1 || v === 0) { mpt = d.firstMPT; p = (v === 1) ? "e" : "b"; while (mpt) { pt = mpt.t; if (!pt.type) { pt[p] = pt.s + pt.xs0; } else if (pt.type === 1) { str = pt.xs0 + pt.s + pt.xs1; for (i = 1; i < pt.l; i++) { str += pt["xn"+i] + pt["xs"+(i+1)]; } pt[p] = str; } mpt = mpt._next; } } }
n/a
calculateOffset = function (t, p, cs) { //for figuring out "top" or "left" in px when it's "auto". We need to factor in margin with the offsetLeft /offsetTop if (_getStyle(t, "position", cs) !== "absolute") { return 0; } var dim = ((p === "left") ? "Left" : "Top"), v = _getStyle(t, "margin" + dim, cs); return t["offset" + dim] - (_convertToPixels(t, p, parseFloat(v), v.replace(_suffixExp, "")) || 0); }
n/a
convertToPixels = function (t, p, v, sfx, recurse) { if (sfx === "px" || !sfx) { return v; } if (sfx === "auto" || !v) { return 0; } var horiz = _horizExp.test(p), node = t, style = _tempDiv.style, neg = (v < 0), precise = (v === 1), pix, cache, time; if (neg) { v = -v; } if (precise) { v *= 100; } if (sfx === "%" && p.indexOf("border") !== -1) { pix = (v / 100) * (horiz ? t.clientWidth : t.clientHeight); } else { style.cssText = "border:0 solid red;position:" + _getStyle(t, "position") + ";line-height:0;"; if (sfx === "%" || !node.appendChild || sfx.charAt(0) === "v" || sfx === "rem") { node = t.parentNode || _doc.body; cache = node._gsCache; time = TweenLite.ticker.frame; if (cache && horiz && cache.time === time) { //performance optimization: we record the width of elements along with the ticker frame so that we can quickly get it again on the same tick (seems relatively safe to assume it wouldn't change on the same tick ) return cache.width * v / 100; } style[(horiz ? "width" : "height")] = v + sfx; } else { style[(horiz ? "borderLeftWidth" : "borderTopWidth")] = v + sfx; } node.appendChild(_tempDiv); pix = parseFloat(_tempDiv[(horiz ? "offsetWidth" : "offsetHeight")]); node.removeChild(_tempDiv); if (horiz && sfx === "%" && CSSPlugin.cacheWidths !== false) { cache = node._gsCache = node._gsCache || {}; cache.time = time; cache.width = pix / v * 100; } if (pix === 0 && !recurse) { pix = _convertToPixels(t, p, v, sfx, true); } } if (precise) { pix /= 100; } return neg ? -pix : pix; }
n/a
getTransform = function (t, cs, rec, parse) { if (t._gsTransform && rec && !parse) { return t._gsTransform; //if the element already has a _gsTransform, use that. Note: some browsers don't accurately return the calculated style for the transform (particularly for SVG), so it's almost always safest to just use the values we've already applied rather than re-parsing things. } var tm = rec ? t._gsTransform || new Transform() : new Transform(), invX = (tm.scaleX < 0), //in order to interpret things properly, we need to know if the user applied a negative scaleX previously so that we can adjust the rotation and skewX accordingly. Otherwise, if we always interpret a flipped matrix as affecting scaleY and the user only wants to tween the scaleX on multiple sequential tweens, it would keep the negative scaleY without that being the user's intent. min = 0.00002, rnd = 100000, zOrigin = _supports3D ? parseFloat(_getStyle(t, _transformOriginProp, cs, false, "0 0 0").split(" ")[2]) || tm.zOrigin || 0 : 0, defaultTransformPerspective = parseFloat(CSSPlugin.defaultTransformPerspective) || 0, m, i, scaleX, scaleY, rotation, skewX; tm.svg = !!(t.getCTM && _isSVG(t)); if (tm.svg) { _parseSVGOrigin(t, _getStyle(t, _transformOriginProp, cs, false, "50% 50%") + "", tm, t.getAttribute("data-svg-origin")); _useSVGTransformAttr = CSSPlugin.useSVGTransformAttr || _forceSVGTransformAttr; } m = _getMatrix(t); if (m !== _identity2DMatrix) { if (m.length === 16) { //we'll only look at these position-related 6 variables first because if x/y/z all match, it's relatively safe to assume we don't need to re-parse everything which risks losing important rotational information (like rotationX:180 plus rotationY:180 would look the same as rotation:180 - there's no way to know for sure which direction was taken based solely on the matrix3d() values ) var a11 = m[0], a21 = m[1], a31 = m[2], a41 = m[3], a12 = m[4], a22 = m[5], a32 = m[6], a42 = m[7], a13 = m[8], a23 = m[9], a33 = m[10], a14 = m[12], a24 = m[13], a34 = m[14], a43 = m[11], angle = Math.atan2(a32, a33), t1, t2, t3, t4, cos, sin; //we manually compensate for non-zero z component of transformOrigin to work around bugs in Safari if (tm.zOrigin) { a34 = -tm.zOrigin; a14 = a13*a34-m[12]; a24 = a23*a34-m[13]; a34 = a33*a34+tm.zOrigin-m[14]; } tm.rotationX = angle * _RAD2DEG; //rotationX if (angle) { cos = Math.cos(-angle); sin = Math.sin(-angle); t1 = a12*cos+a13*sin; t2 = a22*cos+a23*sin; t3 = a32*cos+a33*sin; a13 = a12*-sin+a13*cos; a23 = a22*-sin+a23*cos; a33 = a32*-sin+a33*cos; a43 = a42*-sin+a43*cos; a12 = t1; a22 = t2; a32 = t3; } //rotationY angle = Math.atan2(-a31, a33); tm.rotationY = angle * _RAD2DEG; if (angle) { cos = Math.cos(-angle); sin = Math.sin(-angle); t1 = a11*cos-a13*sin; t2 = a21*cos-a23*sin; t3 = a31*cos-a33*sin; a23 = a21*sin+a23*cos; a33 = a31*sin+a33*cos; a43 = a41*sin+a43*cos; a11 = t1; a21 = t2; a31 = t3; } //rotationZ angle = Math.atan2(a21, a11); tm.rotation = angle * _RAD2DEG; if (angle) { cos = Math.cos(-angle); sin = Math.sin(-angle); a11 = a11*cos+a12*sin; t2 = a21*cos+a22*sin; a22 = a21*-sin+a22*cos; a32 = a31*-sin+a32*cos; a21 = t2; } if (tm.rotationX && Math.abs(tm.rotationX) + Math.abs(tm.rotation) > 359.9) { //when rotationY is set, it will often be parsed as 180 degrees different than it should be, and rotationX and rotation both being 180 (it looks the same), so we adjust for that here. tm.rotationX = tm.rotation = 0; tm.rotationY = 180 - tm.rotationY; } tm.scaleX = ((Math.sqrt(a11 * a11 + a21 * a21) * rnd + 0.5) | 0) / rnd; tm.scaleY = ((Math.sqrt(a22 * a ...
n/a
set3DTransformRatio = function (v) { var t = this.data, //refers to the element's _gsTransform object style = this.t.style, angle = t.rotation, rotationX = t.rotationX, rotationY = t.rotationY, sx = t.scaleX, sy = t.scaleY, sz = t.scaleZ, x = t.x, y = t.y, z = t.z, isSVG = t.svg, perspective = t.perspective, force3D = t.force3D, skewY = t.skewY, skewX = t.skewX, t1, a11, a12, a13, a21, a22, a23, a31, a32, a33, a41, a42, a43, zOrigin, min, cos, sin, t2, transform, comma, zero, skew, rnd; if (skewY) { //for performance reasons, we combine all skewing into the skewX and rotation values. Remember, a skewY of 10 degrees looks the same as a rotation of 10 degrees plus a skewX of 10 degrees. skewX += skewY; angle += skewY; } //check to see if we should render as 2D (and SVGs must use 2D when _useSVGTransformAttr is true) if (((((v === 1 || v === 0) && force3D === "auto" && (this.tween._totalTime === this.tween._totalDuration || !this.tween._totalTime )) || !force3D) && !z && !perspective && !rotationY && !rotationX && sz === 1) || (_useSVGTransformAttr && isSVG) || !_supports3D ) { //on the final render (which could be 0 for a from tween), if there are no 3D aspects, render in 2D to free up memory and improve performance especially on mobile devices. Check the tween's totalTime/totalDuration too in order to make sure it doesn't happen between repeats if it's a repeating tween. //2D if (angle || skewX || isSVG) { angle *= _DEG2RAD; skew = skewX * _DEG2RAD; rnd = 100000; a11 = Math.cos(angle) * sx; a21 = Math.sin(angle) * sx; a12 = Math.sin(angle - skew) * -sy; a22 = Math.cos(angle - skew) * sy; if (skew && t.skewType === "simple") { //by default, we compensate skewing on the other axis to make it look more natural, but you can set the skewType to "simple" to use the uncompensated skewing that CSS does t1 = Math.tan(skew - skewY * _DEG2RAD); t1 = Math.sqrt(1 + t1 * t1); a12 *= t1; a22 *= t1; if (skewY) { t1 = Math.tan(skewY * _DEG2RAD); t1 = Math.sqrt(1 + t1 * t1); a11 *= t1; a21 *= t1; } } if (isSVG) { x += t.xOrigin - (t.xOrigin * a11 + t.yOrigin * a12) + t.xOffset; y += t.yOrigin - (t.xOrigin * a21 + t.yOrigin * a22) + t.yOffset; if (_useSVGTransformAttr && (t.xPercent || t.yPercent)) { //The SVG spec doesn't support percentage-based translation in the "transform" attribute, so we merge it into the matrix to simulate it. min = this.t.getBBox(); x += t.xPercent * 0.01 * min.width; y += t.yPercent * 0.01 * min.height; } min = 0.000001; if (x < min) if (x > -min) { x = 0; } if (y < min) if (y > -min) { y = 0; } } transform = (((a11 * rnd) | 0) / rnd) + "," + (((a21 * rnd) | 0) / rnd) + "," + (((a12 * rnd) | 0) / rnd) + "," + (((a22 * rnd) | 0) / rnd) + "," + x + "," + y + ")"; if (isSVG && _useSVGTransformAttr) { this.t.setAttribute("transform", "matrix(" + transform); } else { //some browsers have a hard time with very small values like 2.4492935982947064e-16 (notice the "e-" towards the end) and would render the object slightly off. So we round to 5 decimal places. style[_transformProp] = ((t.xPercent || t.yPercent) ? "translate(" + t.xPercent + "%," + t.yPercent + "%) matrix(" : "matrix (") + transform; } } else { style[_transformProp] = ((t.xPercent || t.yPercent) ? "translate(" + t.xPercent + "%," + t.yPercent + "%) matrix(" : "matrix (") + sx + ",0,0," + sy + "," + x + "," + y + ")"; } return; } if (_isFirefox) { //Firefox has a bug (at least in v25) that causes it to render the transparent part of 32-bit PNG images as black when displayed inside an iframe and the 3D scale is very small and doesn't change sufficiently enough between renders (like if you use a Power4.easeInOut to scale from 0 to 1 whe ...
n/a
setTransformRatio = function (v) { var t = this.data, //refers to the element's _gsTransform object style = this.t.style, angle = t.rotation, rotationX = t.rotationX, rotationY = t.rotationY, sx = t.scaleX, sy = t.scaleY, sz = t.scaleZ, x = t.x, y = t.y, z = t.z, isSVG = t.svg, perspective = t.perspective, force3D = t.force3D, skewY = t.skewY, skewX = t.skewX, t1, a11, a12, a13, a21, a22, a23, a31, a32, a33, a41, a42, a43, zOrigin, min, cos, sin, t2, transform, comma, zero, skew, rnd; if (skewY) { //for performance reasons, we combine all skewing into the skewX and rotation values. Remember, a skewY of 10 degrees looks the same as a rotation of 10 degrees plus a skewX of 10 degrees. skewX += skewY; angle += skewY; } //check to see if we should render as 2D (and SVGs must use 2D when _useSVGTransformAttr is true) if (((((v === 1 || v === 0) && force3D === "auto" && (this.tween._totalTime === this.tween._totalDuration || !this.tween._totalTime )) || !force3D) && !z && !perspective && !rotationY && !rotationX && sz === 1) || (_useSVGTransformAttr && isSVG) || !_supports3D ) { //on the final render (which could be 0 for a from tween), if there are no 3D aspects, render in 2D to free up memory and improve performance especially on mobile devices. Check the tween's totalTime/totalDuration too in order to make sure it doesn't happen between repeats if it's a repeating tween. //2D if (angle || skewX || isSVG) { angle *= _DEG2RAD; skew = skewX * _DEG2RAD; rnd = 100000; a11 = Math.cos(angle) * sx; a21 = Math.sin(angle) * sx; a12 = Math.sin(angle - skew) * -sy; a22 = Math.cos(angle - skew) * sy; if (skew && t.skewType === "simple") { //by default, we compensate skewing on the other axis to make it look more natural, but you can set the skewType to "simple" to use the uncompensated skewing that CSS does t1 = Math.tan(skew - skewY * _DEG2RAD); t1 = Math.sqrt(1 + t1 * t1); a12 *= t1; a22 *= t1; if (skewY) { t1 = Math.tan(skewY * _DEG2RAD); t1 = Math.sqrt(1 + t1 * t1); a11 *= t1; a21 *= t1; } } if (isSVG) { x += t.xOrigin - (t.xOrigin * a11 + t.yOrigin * a12) + t.xOffset; y += t.yOrigin - (t.xOrigin * a21 + t.yOrigin * a22) + t.yOffset; if (_useSVGTransformAttr && (t.xPercent || t.yPercent)) { //The SVG spec doesn't support percentage-based translation in the "transform" attribute, so we merge it into the matrix to simulate it. min = this.t.getBBox(); x += t.xPercent * 0.01 * min.width; y += t.yPercent * 0.01 * min.height; } min = 0.000001; if (x < min) if (x > -min) { x = 0; } if (y < min) if (y > -min) { y = 0; } } transform = (((a11 * rnd) | 0) / rnd) + "," + (((a21 * rnd) | 0) / rnd) + "," + (((a12 * rnd) | 0) / rnd) + "," + (((a22 * rnd) | 0) / rnd) + "," + x + "," + y + ")"; if (isSVG && _useSVGTransformAttr) { this.t.setAttribute("transform", "matrix(" + transform); } else { //some browsers have a hard time with very small values like 2.4492935982947064e-16 (notice the "e-" towards the end) and would render the object slightly off. So we round to 5 decimal places. style[_transformProp] = ((t.xPercent || t.yPercent) ? "translate(" + t.xPercent + "%," + t.yPercent + "%) matrix(" : "matrix (") + transform; } } else { style[_transformProp] = ((t.xPercent || t.yPercent) ? "translate(" + t.xPercent + "%," + t.yPercent + "%) matrix(" : "matrix (") + sx + ",0,0," + sy + "," + x + "," + y + ")"; } return; } if (_isFirefox) { //Firefox has a bug (at least in v25) that causes it to render the transparent part of 32-bit PNG images as black when displayed inside an iframe and the 3D scale is very small and doesn't change sufficiently enough between renders (like if you use a Power4.easeInOut to scale from 0 to 1 whe ...
n/a
appendXtra = function (pfx, s, c, sfx, r, pad) { var pt = this, l = pt.l; pt["xs" + l] += (pad && (l || pt["xs" + l])) ? " " + pfx : pfx || ""; if (!c) if (l !== 0 && !pt.plugin) { //typically we'll combine non-changing values right into the xs to optimize performance, but we don't combine them when there's a plugin that will be tweening the values because it may depend on the values being split apart, like for a bezier, if a value doesn't change between the first and second iteration but then it does on the 3rd, we'll run into trouble because there's no xn slot for that value! pt["xs" + l] += s + (sfx || ""); return pt; } pt.l++; pt.type = pt.setRatio ? 2 : 1; pt["xs" + pt.l] = sfx || ""; if (l > 0) { pt.data["xn" + l] = s + c; pt.rxp["xn" + l] = r; //round extra property (we need to tap into this in the _parseToProxy() method) pt["xn" + l] = s; if (!pt.plugin) { pt.xfirst = new CSSPropTween(pt, "xn" + l, s, c, pt.xfirst || pt, 0, pt.n, r, pt.pr); pt.xfirst.xs0 = 0; //just to ensure that the property stays numeric which helps modern browsers speed up processing. Remember , in the setRatio() method, we do pt.t[pt.p] = val + pt.xs0 so if pt.xs0 is "" (the default), it'll cast the end value as a string . When a property is a number sometimes and a string sometimes, it prevents the compiler from locking in the data type, slowing things down slightly. } return pt; } pt.data = {s:s + c}; pt.rxp = {}; pt.s = s; pt.c = c; pt.r = r; return pt; }
...
_colorExp.lastIndex = 0;
for (i = 0; i < l; i++) {
bv = ba[i];
ev = ea[i];
bn = parseFloat(bv);
//if the value begins with a number (most common). It's fine if it has a suffix like px
if (bn || bn === 0) {
pt.appendXtra("", bn, _parseChange(ev, bn), ev.replace(_relNumExp,
x22;"), (autoRound && ev.indexOf("px") !== -1), true);
//if the value is a color
} else if (clrs && _colorExp.test(bv)) {
str = ev.indexOf(")") + 1;
str = ")" + (str ? ev.substr(str) : ""); //if there's a comma or ) at the end, retain it.
useHSL = (ev.indexOf("hsl") !== -1 && _supportsOpacity);
bv = _parseColor(bv, useHSL);
...
_addLazySet = function (t, p, v) { var pt = this._firstPT = new CSSPropTween(t, p, 0, 0, this._firstPT, 2); pt.e = v; pt.setRatio = lazySet; pt.data = this; }
...
_overwriteProps = this._overwriteProps;
var style = target.style,
v, pt, pt2, first, last, next, zIndex, tpt, threeD;
if (_reqSafariFix) if (style.zIndex === "") {
v = _getStyle(target, "zIndex", _cs);
if (v === "auto" || v === "") {
//corrects a bug in [non-Android] Safari that prevents it from repainting elements in their new positions if they don'
t have a zIndex set. We also can't just apply this inside _parseTransform() because anything that's moved in any way (
like using "left" or "top" instead of transforms like "x" and "y") can be affected, so it
is best to ensure that anything that's tweening has a z-index. Setting "WebkitPerspective" to a non-zero value worked
too except that on iOS Safari things would flicker randomly. Plus zIndex is less memory-intensive.
this._addLazySet(style, "zIndex", 0);
}
}
if (typeof(vars) === "string") {
first = style.cssText;
v = _getAllStyles(target, _cs);
style.cssText = first + ";" + vars;
...
_enableTransforms = function (threeD) { this._transform = this._transform || _getTransform(this._target, _cs, true); //ensures that the element has a _gsTransform property with the appropriate values. this._transformType = (!(this._transform.svg && _useSVGTransformAttr) && (threeD || this._transformType === 3)) ? 3 : 2; }
...
}
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;
...
_kill = function (lookup) { var copy = lookup, pt, p, xfirst; if (lookup.autoAlpha || lookup.alpha) { copy = {}; for (p in lookup) { //copy the lookup so that we're not changing the original which may be passed elsewhere. copy[p] = lookup[p]; } copy.opacity = 1; if (copy.autoAlpha) { copy.visibility = 1; } } if (lookup.className && (pt = this._classNamePT)) { //for className tweens, we need to kill any associated CSSPropTweens too; a linked list starts at the className's "xfirst". xfirst = pt.xfirst; if (xfirst && xfirst._prev) { this._linkCSSP(xfirst._prev, pt._next, xfirst._prev._prev); //break off the prev } else if (xfirst === this._firstPT) { this._firstPT = pt._next; } if (pt._next) { this._linkCSSP(pt._next, pt._next._next, xfirst._prev); } this._classNamePT = null; } pt = this._firstPT; while (pt) { if (pt.plugin && pt.plugin !== p && pt.plugin._kill) { //for plugins that are registered with CSSPlugin, we should notify them of the kill. pt.plugin._kill(lookup); p = pt.plugin; } pt = pt._next; } return TweenPlugin.prototype._kill.call(this, copy); }
...
prev._next = pt._next;
}
} else {
prev = pt;
}
pt = pt._next;
}
return this._super._kill(lookup);
};
}); if (_gsScope._gsDefine) { _gsScope._gsQueue.pop()(); }
//export to AMD/RequireJS and CommonJS/Node (precursor to full modular build system coming at a later date)
(function(name) {
"use strict";
...
_linkCSSP = function (pt, next, prev, remove) { if (pt) { if (next) { next._prev = pt; } if (pt._next) { pt._next._prev = pt._prev; } if (pt._prev) { pt._prev._next = pt._next; } else if (this._firstPT === pt) { this._firstPT = pt._next; remove = true; //just to prevent resetting this._firstPT 5 lines down in case pt._next is null. (optimized for speed) } if (prev) { prev._next = pt; } else if (!remove && this._firstPT === null) { this._firstPT = pt; } pt._next = next; pt._prev = prev; } return pt; }
...
}
}
pt2 = pt;
while (pt2 && pt2._next) {
pt2 = pt2._next;
}
tpt = new CSSPropTween(target, "transform", 0, 0, null, 2);
this._linkCSSP(tpt, null, pt2);
tpt.setRatio = _transformProp ? _setTransformRatio : _setIETransformRatio;
tpt.data = this._transform || _getTransform(target, _cs, true);
tpt.tween = tween;
tpt.pr = -1; //ensures that the transforms get applied after the components are updated.
_overwriteProps.pop(); //we don't want to force the overwrite of all "transform" tweens of the target - we only
care about individual transform properties like scaleX, rotation, etc. The CSSPropTween constructor automatically adds the property
to _overwriteProps which is why we need to pop() here.
}
...
_mod = function (lookup) { var pt = this._firstPT; while (pt) { if (typeof(lookup[pt.p]) === "function" && lookup[pt.p] === Math.round) { //only gets called by RoundPropsPlugin (ModifyPlugin manages all the rendering internally for CSSPlugin properties that need modification). Remember, we handle rounding a bit differently in this plugin for performance reasons, leveraging "r" as an indicator that the value should be rounded internally.. pt.r = 1; } pt = pt._next; } }
...
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._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;
} else {
this._add(pt.t, pt.p, pt.s, pt.c, val);
//remove from linked list
...
_onInitTween = function (target, vars, tween, index) { if (!target.nodeType) { //css is only for dom elements return false; } this._target = _target = target; this._tween = tween; this._vars = vars; _index = index; _autoRound = vars.autoRound; _hasPriority = false; _suffixMap = vars.suffixMap || CSSPlugin.suffixMap; _cs = _getComputedStyle(target, ""); _overwriteProps = this._overwriteProps; var style = target.style, v, pt, pt2, first, last, next, zIndex, tpt, threeD; if (_reqSafariFix) if (style.zIndex === "") { v = _getStyle(target, "zIndex", _cs); if (v === "auto" || v === "") { //corrects a bug in [non-Android] Safari that prevents it from repainting elements in their new positions if they don't have a zIndex set. We also can't just apply this inside _parseTransform() because anything that's moved in any way (like using "left " or "top" instead of transforms like "x" and "y") can be affected, so it is best to ensure that anything that's tweening has a z-index. Setting "WebkitPerspective" to a non-zero value worked too except that on iOS Safari things would flicker randomly. Plus zIndex is less memory-intensive. this._addLazySet(style, "zIndex", 0); } } if (typeof(vars) === "string") { first = style.cssText; v = _getAllStyles(target, _cs); style.cssText = first + ";" + vars; v = _cssDif(target, v, _getAllStyles(target)).difs; if (!_supportsOpacity && _opacityValExp.test(vars)) { v.opacity = parseFloat( RegExp.$1 ); } vars = v; style.cssText = first; } if (vars.className) { //className tweens will combine any differences they find in the css with the vars that are passed in, so {className:"myClass", scale:0.5, left:20} would work. this._firstPT = pt = _specialProps.className.parse(target, vars.className, "className", this, null, null, vars); } else { this._firstPT = pt = this.parse(target, vars, null); } if (this._transformType) { threeD = (this._transformType === 3); if (!_transformProp) { style.zoom = 1; //helps correct an IE issue. } else if (_isSafari) { _reqSafariFix = true; //if zIndex isn't set, iOS Safari doesn't repaint things correctly sometimes (seemingly at random). if (style.zIndex === "") { zIndex = _getStyle(target, "zIndex", _cs); if (zIndex === "auto" || zIndex === "") { this._addLazySet(style, "zIndex", 0); } } //Setting WebkitBackfaceVisibility corrects 3 bugs: // 1) [non-Android] Safari skips rendering changes to "top" and "left" that are made on the same frame/render as a transform update. // 2) iOS Safari sometimes neglects to repaint elements in their new positions. Setting "WebkitPerspective" to a non-zero value worked too except that on iOS Safari things would flicker randomly. // 3) Safari sometimes displayed odd artifacts when tweening the transform (or WebkitTransform) property, like ghosts of the edges of the element remained. Definitely a browser bug. //Note: we allow the user to override the auto-setting by defining WebkitBackfaceVisibility in the vars of the tween. if (_isSafariLT6) { this._addLazySet(style, "WebkitBackfaceVisibility", this._vars.WebkitBackfaceVisibility || (threeD ? "visible" : "hidden")); } } pt2 = pt; while (pt2 && pt2._next) { pt2 = pt2._next; } tpt = new CSSPropTween(target, "transform", 0, 0, null, 2); this._linkCSSP(tpt, null, pt2); tpt.setRatio = _transformProp ? _setTransformRatio : _setIETransformRatio; tpt.data = this._transform || _getTransform(target, _cs, true); tpt.tween = tween; tpt.pr = -1; //ensures that the transforms get applied after the components are updated. _overwriteProps.pop(); //we don't want to force the overwrite of all "transform" tweens of the target - we only care about individual transform properties like scaleX, rotation, etc. The CSSPropTween constructor automatically adds the property to _overwriteProps which is why we need to pop() here. } if (_has ...
...
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,
...
constructor = function () { TweenPlugin.call(this, "css"); this._overwriteProps.length = 0; this.setRatio = CSSPlugin.prototype.setRatio; //speed optimization (avoid prototype lookup on this "hot" method) }
n/a
parse = function (target, vars, pt, plugin) { var style = target.style, p, sp, bn, en, bs, es, bsfx, esfx, isStr, rel; for (p in vars) { es = vars[p]; //ending value string if (typeof(es) === "function") { es = es(_index, _target); } sp = _specialProps[p]; //SpecialProp lookup. if (sp) { pt = sp.parse(target, es, p, this, pt, plugin, vars); } else { bs = _getStyle(target, p, _cs) + ""; isStr = (typeof(es) === "string"); if (p === "color" || p === "fill" || p === "stroke" || p.indexOf("Color") !== -1 || (isStr && _rgbhslExp.test(es))) { //Opera uses background: to define color sometimes in addition to backgroundColor: if (!isStr) { es = _parseColor(es); es = ((es.length > 3) ? "rgba(" : "rgb(") + es.join(",") + ")"; } pt = _parseComplex(style, p, bs, es, true, "transparent", pt, 0, plugin); } else if (isStr && _complexExp.test(es)) { pt = _parseComplex(style, p, bs, es, true, null, pt, 0, plugin); } else { bn = parseFloat(bs); bsfx = (bn || bn === 0) ? bs.substr((bn + "").length) : ""; //remember, bs could be non-numeric like "normal" for fontWeight , so we should default to a blank suffix in that case. if (bs === "" || bs === "auto") { if (p === "width" || p === "height") { bn = _getDimension(target, p, _cs); bsfx = "px"; } else if (p === "left" || p === "top") { bn = _calculateOffset(target, p, _cs); bsfx = "px"; } else { bn = (p !== "opacity") ? 0 : 1; bsfx = ""; } } rel = (isStr && es.charAt(1) === "="); if (rel) { en = parseInt(es.charAt(0) + "1", 10); es = es.substr(2); en *= parseFloat(es); esfx = es.replace(_suffixExp, ""); } else { en = parseFloat(es); esfx = isStr ? es.replace(_suffixExp, "") : ""; } if (esfx === "") { esfx = (p in _suffixMap) ? _suffixMap[p] : bsfx; //populate the end suffix, prioritizing the map, then if none is found, use the beginning suffix. } es = (en || en === 0) ? (rel ? en + bn : en) + esfx : vars[p]; //ensures that any += or -= prefixes are taken care of. Record the end value before normalizing the suffix because we always want to end the tween on exactly what they intended even if it doesn 't match the beginning value's suffix. //if the beginning/ending suffixes don't match, normalize them... if (bsfx !== esfx) if (esfx !== "") if (en || en === 0) if (bn) { //note: if the beginning value (bn) is 0, we don't need to convert units! bn = _convertToPixels(target, p, bn, bsfx); if (esfx === "%") { bn /= _convertToPixels(target, p, 100, "%") / 100; if (vars.strictUnits !== true) { //some browsers report only "px" values instead of allowing "%" with getComputedStyle(), so we assume that if we're tweening to a %, we should start there too unless strictUnits:true is defined. This approach is particularly useful for responsive designs that use from() tweens. bs = bn + "%"; } } else if (esfx === "em" || esfx === "rem" || esfx === "vw" || esfx === "vh") { bn /= _convertToPixels(target, p, 1, esfx); //otherwise convert to pixels. } else if (esfx !== "px") { en = _convertToPixels(target, p, en, esfx); esfx = "px"; //we don't use bsfx after this, so we don't need to set it to px too. } if (rel) if (en || en === 0) { es = (en + bn) + esfx; //the changes we made affect relative calculations, so adjust the end value here. } } if (rel) { en += bn; } if ((bn || bn === 0) && (en || en === 0)) { //faster than isNaN(). Also, previously we required en !== bn but that doesn't really gain much performance and it prevents _parseToProxy() from working properly if beginning and ending values match but need to get tweened by an external plugin anyway. For example, a bezier tween where the target starts at left:0 and has these points : [{left:50},{le ...
...
return function(t, e, p, cssp, pt, plugin, vars) {
var a = (e + "").split(" "),
i;
vars = {};
for (i = 0; i < 4; i++) {
vars[props[i]] = a[i] = a[i] || a[(((i - 1) / 2) >> 0)];
}
return cssp.parse(t, vars, pt, plugin);
};
},
// @private used when other plugins must tween values first, like BezierPlugin or ThrowPropsPlugin, etc. That plugin's setRatio
() gets called first so that the values are updated, and then we loop through the MiniPropTweens which handle copying the values
into their appropriate slots so that they can then be applied correctly in the main CSSPlugin setRatio() method. Remember, we typically
create a proxy object that has a bunch of uniquely-named properties that we feed to the sub-plugin and it does its magic normally
, and then we must interpret those values and apply them to the css because often numbers must get combined/concatenated, suffixes
added, etc. to work with css, like boxShadow could have 4 values plus a color.
_setPluginRatio = _internals._setPluginRatio = function(v) {
this.plugin.setRatio(v);
var d = this.data,
...
setRatio = function (v) { var pt = this._firstPT, min = 0.000001, val, str, i; //at the end of the tween, we set the values to exactly what we received in order to make sure non-tweening values (like "position " or "float" or whatever) are set and so that if the beginning/ending suffixes (units) didn't match and we normalized to px, the value that the user passed in is used here. We check to see if the tween is at its beginning in case it's a from() tween in which case the ratio will actually go from 1 to 0 over the course of the tween (backwards). if (v === 1 && (this._tween._time === this._tween._duration || this._tween._time === 0)) { while (pt) { if (pt.type !== 2) { if (pt.r && pt.type !== -1) { val = Math.round(pt.s + pt.c); if (!pt.type) { pt.t[pt.p] = val + pt.xs0; } else if (pt.type === 1) { //complex value (one that typically has multiple numbers inside a string, like "rect(5px,10px ,20px,25px)" i = pt.l; 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] = str; } } else { pt.t[pt.p] = pt.e; } } else { pt.setRatio(v); } pt = pt._next; } } else if (v || !(this._tween._time === this._tween._duration || this._tween._time === 0) || this._tween._rawPrevTime === -0. 000001) { while (pt) { val = pt.c * v + pt.s; if (pt.r) { val = Math.round(val); } else if (val < min) if (val > -min) { val = 0; } if (!pt.type) { pt.t[pt.p] = val + pt.xs0; } else if (pt.type === 1) { //complex value (one that typically has multiple numbers inside a string, like "rect(5px,10px,20px ,25px)" i = pt.l; if (i === 2) { pt.t[pt.p] = pt.xs0 + val + pt.xs1 + pt.xn1 + pt.xs2; } else if (i === 3) { pt.t[pt.p] = pt.xs0 + val + pt.xs1 + pt.xn1 + pt.xs2 + pt.xn2 + pt.xs3; } else if (i === 4) { pt.t[pt.p] = pt.xs0 + val + pt.xs1 + pt.xn1 + pt.xs2 + pt.xn2 + pt.xs3 + pt.xn3 + pt.xs4; } else if (i === 5) { pt.t[pt.p] = pt.xs0 + val + pt.xs1 + pt.xn1 + pt.xs2 + pt.xn2 + pt.xs3 + pt.xn3 + pt.xs4 + pt.xn4 + pt.xs5; } else { 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] = str; } } else if (pt.type === -1) { //non-tweening value pt.t[pt.p] = pt.xs0; } else if (pt.setRatio) { //custom setRatio() for things like SpecialProps, external plugins, etc. pt.setRatio(v); } pt = pt._next; } //if the tween is reversed all the way back to the beginning, we need to restore the original values which may have different units (like % instead of px or em or whatever). } else { while (pt) { if (pt.type !== 2) { pt.t[pt.p] = pt.b; } else { pt.setRatio(v); } pt = pt._next; } } }
...
}
return cssp.parse(t, vars, pt, plugin);
};
},
// @private used when other plugins must tween values first, like BezierPlugin or ThrowPropsPlugin, etc. That plugin's setRatio
() gets called first so that the values are updated, and then we loop through the MiniPropTweens which handle copying the values
into their appropriate slots so that they can then be applied correctly in the main CSSPlugin setRatio() method. Remember, we typically
create a proxy object that has a bunch of uniquely-named properties that we feed to the sub-plugin and it does its magic normally
, and then we must interpret those values and apply them to the css because often numbers must get combined/concatenated, suffixes
added, etc. to work with css, like boxShadow could have 4 values plus a color.
_setPluginRatio = _internals._setPluginRatio = function(v) {
this.plugin.setRatio(v);
var d = this.data,
proxy = d.proxy,
mpt = d.firstMPT,
min = 0.000001,
val, pt, i, str, p;
while (mpt) {
val = proxy[mpt.v];
...
CSSRulePlugin = function () { TweenPlugin.call(this, "cssRule"); this._overwriteProps.length = 0; }
n/a
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.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; }
n/a
_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; }
...
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,
...
constructor = function () { TweenPlugin.call(this, "cssRule"); this._overwriteProps.length = 0; }
n/a
setRatio = function (v) { _superSetRatio.call(this, v); this._ss.cssText = this._proxy.cssText; }
...
}
return cssp.parse(t, vars, pt, plugin);
};
},
// @private used when other plugins must tween values first, like BezierPlugin or ThrowPropsPlugin, etc. That plugin's setRatio
() gets called first so that the values are updated, and then we loop through the MiniPropTweens which handle copying the values
into their appropriate slots so that they can then be applied correctly in the main CSSPlugin setRatio() method. Remember, we typically
create a proxy object that has a bunch of uniquely-named properties that we feed to the sub-plugin and it does its magic normally
, and then we must interpret those values and apply them to the css because often numbers must get combined/concatenated, suffixes
added, etc. to work with css, like boxShadow could have 4 values plus a color.
_setPluginRatio = _internals._setPluginRatio = function(v) {
this.plugin.setRatio(v);
var d = this.data,
proxy = d.proxy,
mpt = d.firstMPT,
min = 0.000001,
val, pt, i, str, p;
while (mpt) {
val = proxy[mpt.v];
...
CircIn = function (){}
n/a
constructor = function (){}
n/a
getRatio = function (p) { return -(Math.sqrt(1 - (p * p)) - 1); }
...
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;
...
CircInOut = function (){}
n/a
constructor = function (){}
n/a
getRatio = function (p) { return ((p*=2) < 1) ? -0.5 * (Math.sqrt(1 - p * p) - 1) : 0.5 * (Math.sqrt(1 - (p -= 2) * p) + 1); }
...
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;
...
CircOut = function (){}
n/a
constructor = function (){}
n/a
getRatio = function (p) { return Math.sqrt(1 - (p = p - 1) * p); }
...
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;
...
ColorPropsPlugin = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
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 (typeof(e) === "function") {
e = e(_index, _target);
}
pt = new CSSPropTween(t, p, 0, 0, pt, (setRatio ? 2 : 1), null, false, pr, b, e);
e += ""; //ensures it's a string
if (clrs && _colorExp.test(e + b)) { //if colors are found, normalize the formatting to rgba() or hsla().
e = [b, e];
CSSPlugin.colorStringFilter(e);
b = e[0];
e = e[1];
}
var ba = b.split(", ").join(",").split(" "), //beginning array
ea = e.split(", ").join(",").split(" "), //ending array
l = ba.length,
autoRound = (_autoRound !== false),
...
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(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 a; }
n/a
_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); }
...
prev._next = pt._next;
}
} else {
prev = pt;
}
pt = pt._next;
}
return this._super._kill(lookup);
};
}); if (_gsScope._gsDefine) { _gsScope._gsQueue.pop()(); }
//export to AMD/RequireJS and CommonJS/Node (precursor to full modular build system coming at a later date)
(function(name) {
"use strict";
...
_onInitTween = 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; }
...
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,
...
constructor = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
setRatio = 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; } }
...
}
return cssp.parse(t, vars, pt, plugin);
};
},
// @private used when other plugins must tween values first, like BezierPlugin or ThrowPropsPlugin, etc. That plugin's setRatio
() gets called first so that the values are updated, and then we loop through the MiniPropTweens which handle copying the values
into their appropriate slots so that they can then be applied correctly in the main CSSPlugin setRatio() method. Remember, we typically
create a proxy object that has a bunch of uniquely-named properties that we feed to the sub-plugin and it does its magic normally
, and then we must interpret those values and apply them to the css because often numbers must get combined/concatenated, suffixes
added, etc. to work with css, like boxShadow could have 4 values plus a color.
_setPluginRatio = _internals._setPluginRatio = function(v) {
this.plugin.setRatio(v);
var d = this.data,
proxy = d.proxy,
mpt = d.firstMPT,
min = 0.000001,
val, pt, i, str, p;
while (mpt) {
val = proxy[mpt.v];
...
Ease = function (func, extraParams, type, power) { this._func = func; this._type = type || 0; this._power = power || 0; this._params = extraParams ? _baseParams.concat(extraParams) : _baseParams; }
n/a
register = function (ease, names, types, create) { var na = names.split(","), i = na.length, ta = (types || "easeIn,easeOut,easeInOut").split(","), e, name, j, type; while (--i > -1) { name = na[i]; e = create ? _class("easing."+name, null, true) : gs.easing[name] || {}; j = ta.length; while (--j > -1) { type = ta[j]; _easeMap[name + "." + type] = _easeMap[type + name] = e[type] = ease.getRatio ? ease : ease[type] || new ease(); } } }
n/a
getRatio = function (p) { if (this._func) { this._params[0] = p; return this._func.apply(null, this._params); } var t = this._type, pw = this._power, r = (t === 1) ? 1 - p : (t === 2) ? p : (p < 0.5) ? p * 2 : (1 - p) * 2; if (pw === 1) { r *= r; } else if (pw === 2) { r *= r * r; } else if (pw === 3) { r *= r * r * r; } else if (pw === 4) { r *= r * r * r * r; } return (t === 1) ? 1 - r : (t === 2) ? r : (p < 0.5) ? r / 2 : 1 - (r / 2); }
...
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;
...
find = function (s) { return Ease.map[s]; }
n/a
ElasticIn = 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 }
n/a
config = function (amplitude, period) { return new C(amplitude, period); }
n/a
constructor = 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 }
n/a
getRatio = function (p) { return -(this._p1 * Math.pow(2, 10 * (p -= 1)) * Math.sin( (p - this._p3) * this._p2 )); }
...
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;
...
ElasticInOut = 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 }
n/a
config = function (amplitude, period) { return new C(amplitude, period); }
n/a
constructor = 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 }
n/a
getRatio = 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; }
...
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;
...
ElasticOut = 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 }
n/a
config = function (amplitude, period) { return new C(amplitude, period); }
n/a
constructor = 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 }
n/a
getRatio = function (p) { return this._p1 * Math.pow(2, -10 * p) * Math.sin( (p - this._p3) * this._p2 ) + 1; }
...
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;
...
ExpoIn = function (){}
n/a
constructor = function (){}
n/a
getRatio = function (p) { return Math.pow(2, 10 * (p - 1)) - 0.001; }
...
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;
...
ExpoInOut = function (){}
n/a
constructor = function (){}
n/a
getRatio = function (p) { return ((p *= 2) < 1) ? 0.5 * Math.pow(2, 10 * (p - 1)) : 0.5 * (2 - Math.pow(2, -10 * (p - 1))); }
...
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;
...
ExpoOut = function (){}
n/a
constructor = function (){}
n/a
getRatio = function (p) { return 1 - Math.pow(2, -10 * p); }
...
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;
...
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); }
n/a
config = function (vars) { return new RoughEase(vars); }
n/a
constructor = 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); }
n/a
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); }
...
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;
...
SineIn = function (){}
n/a
constructor = function (){}
n/a
getRatio = function (p) { return -Math.cos(p * _HALF_PI) + 1; }
...
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;
...
SineInOut = function (){}
n/a
constructor = function (){}
n/a
getRatio = function (p) { return -0.5 * (Math.cos(Math.PI * p) - 1); }
...
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;
...
SineOut = function (){}
n/a
constructor = function (){}
n/a
getRatio = function (p) { return Math.sin(p * _HALF_PI); }
...
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;
...
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); }
n/a
config = function (linearRatio, power, yoyoMode) { return new SlowMo(linearRatio, power, yoyoMode); }
n/a
config = function (linearRatio, power, yoyoMode) { return new SlowMo(linearRatio, power, yoyoMode); }
n/a
constructor = 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); }
n/a
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 ? 1 - (p = (p - this._p3) / this._p1) * p : r + ((p - r) * (p = (p - this._p3) / this._p1) * p * p * p); } return this._calcEnd ? 1 : r; }
...
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;
...
SteppedEase = function (steps) { steps = steps || 1; this._p1 = 1 / steps; this._p2 = steps + 1; }
n/a
config = function (steps) { return new SteppedEase(steps); }
n/a
config = function (steps) { return new SteppedEase(steps); }
n/a
constructor = function (steps) { steps = steps || 1; this._p1 = 1 / steps; this._p2 = steps + 1; }
n/a
getRatio = function (p) { if (p < 0) { p = 0; } else if (p >= 1) { p = 0.999999999; } return ((this._p2 * p) >> 0) * this._p1; }
...
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;
...
TimelineLite = function (vars) { SimpleTimeline.call(this, vars); this._labels = {}; this.autoRemoveChildren = (this.vars.autoRemoveChildren === true); this.smoothChildTiming = (this.vars.smoothChildTiming === true); this._sortChildren = true; this._onUpdate = this.vars.onUpdate; var v = this.vars, val, p; for (p in v) { val = v[p]; if (_isArray(val)) if (val.join("").indexOf("{self}") !== -1) { v[p] = this._swapSelfInParams(val); } } if (_isArray(v.tweens)) { this.add(v.tweens, 0, v.align, v.stagger); } }
n/a
exportRoot = function (vars, ignoreDelayedCalls) { vars = vars || {}; if (vars.smoothChildTiming == null) { vars.smoothChildTiming = true; } var tl = new TimelineLite(vars), root = tl._timeline, 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)) { tl.add(tween, tween._startTime - tween._delay); } tween = next; } root.add(tl, 0); return tl; }
...
if (time > totalDuration && !uncapped) {
time = totalDuration;
}
this._startTime = (this._paused ? this._pauseTime : tl._time) - ((!this._reversed ? time : totalDuration - time) / this._timeScale
);
if (!tl._dirty) { //for performance improvement. If the parent's cache is already dirty, it already took care of marking
the ancestors as dirty too, so skip the function call here.
this._uncache(false);
}
//in case any of the ancestor timelines had completed but should now be enabled, we should reset their totalTime() which will
also ensure that they're lined up properly and enabled. Skip for animations that are on the root (wasteful). Example: a TimelineLite
.exportRoot() is performed when there's a paused tween on the root, the export will
not complete until that tween is unpaused, but imagine a child gets restarted later, after all [unpaused] tweens have completed
. The startTime of that child would get pushed out, but one of the ancestors may have completed.
if (tl._timeline) {
while (tl._timeline) {
if (tl._timeline._time !== (tl._startTime + tl._totalTime) / tl._timeScale) {
tl.totalTime(tl._totalTime, true);
}
tl = tl._timeline;
}
...
pauseCallback = function () {}
n/a
_contains = function (tween) { var tl = tween.timeline; while (tl) { if (tl === this) { return true; } tl = tl.timeline; } return false; }
...
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;
...
_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); }
...
_reservedProps = TweenLite._internals.reservedProps,
i, difs, p, from;
target = tween._targets || tween.target;
_getChildStyles(target, b, targets);
tween.render(duration, true, true);
_getChildStyles(target, e);
tween.render(0, true, true);
tween._enabled(true);
i = targets.length;
while (--i > -1) {
difs = _cssDif(targets[i], b[i], e[i]);
if (difs.firstMPT) {
difs = difs.difs;
for (p in vars) {
if (_reservedProps[p]) {
...
_hasPausedChild = function () { var tween = this._first; while (tween) { if (tween._paused || ((tween instanceof TimelineLite) && tween._hasPausedChild())) { return true; } tween = tween._next; } return false; }
...
prevTime = this._time,
prevStart = this._startTime,
prevTimeScale = this._timeScale,
prevPaused = this._paused,
tween, isComplete, next, callback, internalForce, pauseTween, curTime;
if (time >= totalDur - 0.0000001 && time >= 0) { //to work around occasional floating point math artifacts
.
this._totalTime = this._time = totalDur;
if (!this._reversed) if (!this._hasPausedChild()) {
isComplete = true;
callback = "onComplete";
internalForce = !!this._timeline.autoRemoveChildren; //otherwise, if the animation is unpaused/activated after it's already
finished, it doesn't get removed from the parent timeline.
if (this._duration === 0) if ((time <= 0 && time >= -0.0000001) || this._rawPrevTime < 0 || this._rawPrevTime
=== _tinyNum) if (this._rawPrevTime !== time && this._first) {
internalForce = true;
if (this._rawPrevTime > _tinyNum) {
callback = "onReverseComplete";
...
_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; }
...
prev._next = pt._next;
}
} else {
prev = pt;
}
pt = pt._next;
}
return this._super._kill(lookup);
};
}); if (_gsScope._gsDefine) { _gsScope._gsQueue.pop()(); }
//export to AMD/RequireJS and CommonJS/Node (precursor to full modular build system coming at a later date)
(function(name) {
"use strict";
...
_parseTimeOrLabel = function (timeOrLabel, offsetOrLabel, appendIfAbsent, ignore) { var 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]); } } } if (typeof(offsetOrLabel) === "string") { return this._parseTimeOrLabel(offsetOrLabel, (appendIfAbsent && typeof(timeOrLabel) === "number" && this._labels[offsetOrLabel ] == null) ? timeOrLabel - this.duration() : 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] = this.duration() + 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) : this.duration(); } else if (timeOrLabel == null) { timeOrLabel = this.duration(); } return Number(timeOrLabel) + offsetOrLabel; }
...
};
p.call = function(callback, params, scope, position) {
return this.add( TweenLite.delayedCall(0, callback, params, scope), position);
};
p.set = function(target, vars, position) {
position = this._parseTimeOrLabel(position, 0, true);
if (vars.immediateRender == null) {
vars.immediateRender = (position === this._time && !this._paused);
}
return this.add( new TweenLite(target, 0, vars), position);
};
TimelineLite.exportRoot = function(vars, ignoreDelayedCalls) {
...
_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; }
...
}
var tl = new TimelineLite(vars),
root = tl._timeline,
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)) {
tl.add(tween, tween._startTime - tween._delay);
...
add = function (value, position, align, stagger) { var curTime, l, i, child, tl, beforeRawTime; if (typeof(position) !== "number") { position = this._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}); } this.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 this._uncache(true); } else if (typeof(value) === "string") { return this.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(this, value, position); //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 (this._gc || this._time === this._duration) if (!this._paused) if (this._duration < this.duration()) { //in case any of the ancestors had completed but should now be enabled... tl = this; 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 this; }
...
for (p in v) {
val = v[p];
if (_isArray(val)) if (val.join("").indexOf("{self}") !== -1) {
v[p] = this._swapSelfInParams(val);
}
}
if (_isArray(v.tweens)) {
this.add(v.tweens, 0, v.align, v.stagger);
}
},
_tinyNum = 0.0000000001,
TweenLiteInternals = TweenLite._internals,
_internals = TimelineLite._internals = {},
_isSelector = TweenLiteInternals.isSelector,
_isArray = TweenLiteInternals.isArray,
...
addLabel = function (label, position) { this._labels[label] = this._parseTimeOrLabel(position); return this; }
...
child._startTime -= child.delay();
}
}
curTime += stagger;
}
return this._uncache(true);
} else if (typeof(value) === "string") {
return this.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.");
}
}
...
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); }
...
callback = "onComplete";
force = (force || this._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 (this._initted || !this.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 (this._startTime === this._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 >= -0.0000001) || (prevRawPrevTime === _tinyNum &
;& this.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";
}
}
this._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.
}
...
append = function (value, offsetOrLabel) { return this.add(value, this._parseTimeOrLabel(null, offsetOrLabel, true, value)); }
n/a
appendMultiple = function (tweens, offsetOrLabel, align, stagger) { return this.add(tweens, this._parseTimeOrLabel(null, offsetOrLabel, true, tweens), align, stagger); }
n/a
call = function (callback, params, scope, position) { return this.add( TweenLite.delayedCall(0, callback, params, scope), position); }
...
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[
x22;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;
},
...
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); }
n/a
constructor = function (vars) { SimpleTimeline.call(this, vars); this._labels = {}; this.autoRemoveChildren = (this.vars.autoRemoveChildren === true); this.smoothChildTiming = (this.vars.smoothChildTiming === true); this._sortChildren = true; this._onUpdate = this.vars.onUpdate; var v = this.vars, val, p; for (p in v) { val = v[p]; if (_isArray(val)) if (val.join("").indexOf("{self}") !== -1) { v[p] = this._swapSelfInParams(val); } } if (_isArray(v.tweens)) { this.add(v.tweens, 0, v.align, v.stagger); } }
n/a
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; }
...
overshootTolerance = (!isNaN(vars.overshootTolerance)) ? vars.overshootTolerance : (vars.edgeResistance === 1) ? 0 : (1 -
self.edgeResistance) + 0.2;
self.tween = tween = ThrowPropsPlugin.to(scrollProxy || target, {throwProps:throwProps, ease:(vars.ease || _globals.Power3
.easeOut), onComplete:onThrowComplete, onOverwrite:onThrowOverwrite, onUpdate:(vars.fastMode ? _dispatchEvent : syncXY), onUpdateParams
:(vars.fastMode ? [self, "onthrowupdate", "onThrowUpdate"] : (snap && snap.radius) ? [false, true] :
_emptyArray)}, (isNaN(vars.maxDuration) ? 2 : vars.maxDuration), (!isNaN(vars.minDuration) ? vars.minDuration : (overshootTolerance
=== 0) ? 0 : 0.5), overshootTolerance);
if (!vars.fastMode) {
//to populate the end values, we just scrub the tween to the end, record the values, and then jump back to the beginning
.
if (scrollProxy) {
scrollProxy._suspendTransforms = true; //Microsoft browsers have a bug that causes them to briefly render the position
incorrectly (it flashes to the end state when we seek() the tween even though we jump right back to the current position, and this
only seems to happen when we're affecting both top and left), so we set a _suspendTransforms flag to prevent it from actually
applying the values in the ScrollProxy.
}
tween.render(tween.duration(), true, true);
syncXY(true, true);
self.endX = self.x;
self.endY = self.y;
if (rotationMode) {
self.endRotation = self.x;
}
tween.play(0);
...
from = function (target, duration, vars, position) { return this.add( ((vars.repeat && _globals.TweenMax) || TweenLite).from(target, duration, vars), position); }
...
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, vars), position);
};
p.fromTo = function(target, duration, fromVars, toVars, position) {
var Engine = (toVars.repeat && _globals.TweenMax) || TweenLite;
return duration ? this.add( Engine.fromTo(target, duration, fromVars, toVars), position) : this.set(target, toVars, position);
};
...
fromTo = function (target, duration, fromVars, toVars, position) { var Engine = (toVars.repeat && _globals.TweenMax) || TweenLite; return duration ? this.add( Engine.fromTo(target, duration, fromVars, toVars), position) : this.set(target, toVars, position); }
...
}
orig = v.transformOrigin;
if (m1.svg && (orig || v.svgOrigin)) {
x = m1.xOffset; //when we change the origin, in order to prevent things from jumping we adjust the x/y so we must record those
here so that we can create PropTweens for them and flip them at the same time as the origin
y = m1.yOffset;
_parseSVGOrigin(t, _parsePosition(orig), m2, v.svgOrigin, v.smoothOrigin);
pt = _addNonTweeningNumericPT(m1, "xOrigin", (originalGSTransform ? m1 : m2).xOrigin, m2.xOrigin, pt, transformOriginString
); //note: if there wasn't a transformOrigin defined yet, just start with the destination one; it's wasteful otherwise
, and it causes problems with fromTo() tweens. For example, TweenLite.to("#wheel", 3, {rotation:180, transformOrigin:
x22;50% 50%", delay:1}); TweenLite.fromTo("#wheel", 3, {scale:0.5, transformOrigin
:"50% 50%"}, {scale:1, delay:2}); would cause a jump when the from values revert at the beginning of the 2nd tween.
pt = _addNonTweeningNumericPT(m1, "yOrigin", (originalGSTransform ? m1 : m2).yOrigin, m2.yOrigin, pt, transformOriginString
);
if (x !== m1.xOffset || y !== m1.yOffset) {
pt = _addNonTweeningNumericPT(m1, "xOffset", (originalGSTransform ? x : m1.xOffset), m1.xOffset, pt, transformOriginString
);
pt = _addNonTweeningNumericPT(m1, "yOffset", (originalGSTransform ? y : m1.yOffset), m1.yOffset, pt, transformOriginString
);
}
orig = "0px 0px"; //certain browsers (like firefox) completely botch transform-origin, so we must remove it to prevent
it from contaminating transforms. We manage it ourselves with xOrigin and yOrigin
}
...
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; }
...
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;
};
...
getLabelTime = function (label) { return (this._labels[label] != null) ? this._labels[label] : -1; }
n/a
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; }
...
};
$.fn.stop = function(clearQueue, gotoEnd) {
_stop.call(this, clearQueue, gotoEnd);
if (TweenLite) {
if (gotoEnd) {
var tweens = TweenLite.getTweensOf(this),
i = tweens.length,
progress;
while (--i > -1) {
progress = tweens[i].totalTime() / tweens[i].totalDuration();
if (progress > 0 && progress < 1) {
tweens[i].seek(tweens[i].totalDuration());
}
...
gotoAndPlay = function (position, suppressEvents) { return this.play(position, suppressEvents); }
n/a
gotoAndStop = function (position, suppressEvents) { return this.pause(position, suppressEvents); }
n/a
insert = function (value, position, align, stagger) { return this.add(value, position || 0, align, stagger); }
...
p;
if (resetDuration && this._startTime < this._timeline._time) {
this._startTime = this._timeline._time;
this._uncache(false);
if (this._gc) {
this._enabled(true, false);
} else {
this._timeline.insert(this, this._startTime - this._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) {
this.vars[p] = vars[p];
}
if (this._initted || immediate) {
if (resetDuration) {
...
insertMultiple = function (value, position, align, stagger) { return this.add(value, position || 0, align, stagger); }
n/a
invalidate = function () { var tween = this._first; while (tween) { tween.invalidate(); tween = tween._next; } return Animation.prototype.invalidate.call(this);; }
...
}
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) {
...
paused = function (value) { if (!value) { //if there's a pause directly at the spot from where we're unpausing, skip it. var tween = this._first, time = this._time; while (tween) { if (tween._startTime === 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.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) {
...
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; }
...
SimpleTimeline.prototype.add.call(this, value, position);
//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 (this._gc || this._time === this._duration) if (!this._paused) if (this._duration < this.duration()) {
//in case any of the ancestors had completed but should now be enabled...
tl = this;
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;
...
recent = function () { return this._recent; }
n/a
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); }
...
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);
};
...
removeLabel = function (label) { delete this._labels[label]; 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;
...
render = function (time, suppressEvents, force) { if (this._gc) { this._enabled(true, false); } var totalDur = (!this._dirty) ? this._totalDuration : this.totalDuration(), prevTime = this._time, prevStart = this._startTime, prevTimeScale = this._timeScale, prevPaused = this._paused, tween, isComplete, next, callback, internalForce, pauseTween, curTime; if (time >= totalDur - 0.0000001 && time >= 0) { //to work around occasional floating point math artifacts. this._totalTime = this._time = totalDur; if (!this._reversed) if (!this._hasPausedChild()) { isComplete = true; callback = "onComplete"; internalForce = !!this._timeline.autoRemoveChildren; //otherwise, if the animation is unpaused/activated after it's already finished, it doesn't get removed from the parent timeline. if (this._duration === 0) if ((time <= 0 && time >= -0.0000001) || this._rawPrevTime < 0 || this._rawPrevTime === _tinyNum) if (this._rawPrevTime !== time && this._first) { internalForce = true; if (this._rawPrevTime > _tinyNum) { callback = "onReverseComplete"; } } } this._rawPrevTime = (this._duration || !suppressEvents || time || this._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 < 0.0000001) { //to work around occasional floating point math artifacts, round super small values to 0. this._totalTime = this._time = 0; if (prevTime !== 0 || (this._duration === 0 && this._rawPrevTime !== _tinyNum && (this._rawPrevTime > 0 || (time < 0 && this ._rawPrevTime >= 0)))) { callback = "onReverseComplete"; isComplete = this._reversed; } if (time < 0) { this._active = false; if (this._timeline.autoRemoveChildren && this._reversed) { //ensures proper GC if a timeline is resumed after it's finished reversing. internalForce = isComplete = true; callback = "onReverseComplete"; } else if (this._rawPrevTime >= 0 && this._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; } this._rawPrevTime = time; } else { this._rawPrevTime = (this._duration || !suppressEvents || time || this._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 callbac ...
...
b = [],
e = [],
targets = [],
_reservedProps = TweenLite._internals.reservedProps,
i, difs, p, from;
target = tween._targets || tween.target;
_getChildStyles(target, b, targets);
tween.render(duration, true, true);
_getChildStyles(target, e);
tween.render(0, true, true);
tween._enabled(true);
i = targets.length;
while (--i > -1) {
difs = _cssDif(targets[i], b[i], e[i]);
if (difs.firstMPT) {
...
seek = function (position, suppressEvents) { return this.totalTime((typeof(position) === "number") ? position : this._parseTimeOrLabel(position), (suppressEvents !== false )); }
...
if (gotoEnd) {
var tweens = TweenLite.getTweensOf(this),
i = tweens.length,
progress;
while (--i > -1) {
progress = tweens[i].totalTime() / tweens[i].totalDuration();
if (progress > 0 && progress < 1) {
tweens[i].seek(tweens[i].totalDuration());
}
}
}
TweenLite.killTweensOf(this);
}
return this;
};
...
set = function (target, vars, position) { position = this._parseTimeOrLabel(position, 0, true); if (vars.immediateRender == null) { vars.immediateRender = (position === this._time && !this._paused); } return this.add( new TweenLite(target, 0, vars), position); }
...
var _gsScope = (typeof(module) !== "undefined" && module.exports && typeof(global) !== "undefined
") ? global : this || window; //helps ensure compatibility with AMD/RequireJS and CommonJS/Node
(_gsScope._gsQueue || (_gsScope._gsQueue = [])).push( function() {
"use strict";
_gsScope._gsDefine("utils.Draggable", ["events.EventDispatcher","TweenLite","plugins.CSSPlugin
"], function(EventDispatcher, TweenLite, CSSPlugin) {
var _tempVarsXY = {css:{}}, //speed optimization - we reuse the same vars object for x/y TweenLite.set() calls to minimize garbage collection tasks and improve performance.
_tempVarsX = {css:{}},
_tempVarsY = {css:{}},
_tempVarsRotation = {css:{}},
_globals = _gsScope._gsDefine.globals,
_tempEvent = {}, //for populating with pageX/pageY in old versions of IE
_dummyElement = {style:{}},
_doc = _gsScope.document || {createElement: function() {return _dummyElement;}},
...
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); }
...
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 (this._timeline.smoothChildTiming) {
this._startTime += tween._startTime / this._timeScale;
}
this.shiftChildren(-tween._startTime, false, -9999999999);
prevStart = 0;
}
end = tween._startTime + (tween._totalDuration / tween._timeScale);
if (end > max) {
max = end;
}
tween = prev;
...
staggerFrom = function (targets, duration, vars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope) { vars.immediateRender = (vars.immediateRender != false); vars.runBackwards = true; return this.staggerTo(targets, duration, vars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope); }
n/a
staggerFromTo = function (targets, duration, fromVars, toVars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope) { toVars.startAt = fromVars; toVars.immediateRender = (toVars.immediateRender != false && fromVars.immediateRender != false); return this.staggerTo(targets, duration, toVars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope); }
n/a
staggerTo = function (targets, duration, vars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope) { var tl = new TimelineLite({onComplete:onCompleteAll, onCompleteParams:onCompleteAllParams, callbackScope:onCompleteAllScope, smoothChildTiming:this.smoothChildTiming}), cycle = vars.cycle, copy, i; if (typeof(targets) === "string") { targets = TweenLite.selector(targets) || targets; } targets = targets || []; if (_isSelector(targets)) { //senses if the targets object is a selector. If it is, we should translate it into an array. targets = _slice(targets); } stagger = stagger || 0; if (stagger < 0) { targets = _slice(targets); targets.reverse(); stagger *= -1; } for (i = 0; i < targets.length; i++) { copy = _copy(vars); if (copy.startAt) { copy.startAt = _copy(copy.startAt); if (copy.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, i * stagger); } return this.add(tl, position); }
...
}
return this.add(tl, position);
};
p.staggerFrom = function(targets, duration, vars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope) {
vars.immediateRender = (vars.immediateRender != false);
vars.runBackwards = true;
return this.staggerTo(targets, duration, vars, stagger, position, onCompleteAll, onCompleteAllParams
, onCompleteAllScope);
};
p.staggerFromTo = function(targets, duration, fromVars, toVars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope
) {
toVars.startAt = fromVars;
toVars.immediateRender = (toVars.immediateRender != false && fromVars.immediateRender != false);
return this.staggerTo(targets, duration, toVars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope);
};
...
stop = function () { return this.paused(true); }
n/a
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); }
...
* target.style.width = (start + value * ratio) + "px";
* console.log("set width to " + target.style.width);
* }
* }, 0);
*
* Then, when I do this tween, it will trigger my special property:
*
* TweenLite.to(element, 1, {css:{myCustomProp:100}});
*
* In the example, of course, we're just changing the width, but you can do anything you want.
*
* @param {!string} name Property name (or comma-delimited list of property names) that should be intercepted and handled by your
function. For example, if I define "myCustomProp", then it would handle that portion of the following tween: TweenLite
.to(element, 1, {css:{myCustomProp:100}})
* @param {!function(Object, Object, Object, string):function(number)} onInitTween The function that will be called when a tween
of this special property is performed. The function will receive 4 parameters: 1) Target object that should be tweened, 2) Value
that was passed to the tween, 3) The tween instance itself (rarely used), and 4) The property name that's being tweened. Your
function should return a function that should be called on every update of the tween. That function will receive a single parameter
that is a "change factor" value (typically between 0 and 1) indicating the amount of change as a ratio. You can use this
to determine how to set the values appropriately in your function.
* @param {number=} priority Priority that helps the engine determine the order in which to set the properties (default: 0). Higher
priority properties will be updated before lower priority ones.
*/
...
totalDuration = function (value) { if (!arguments.length) { if (this._dirty) { var max = 0, tween = this._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 && this._sortChildren && !tween._paused) { //in case one of the tweens shifted out of order , it needs to be re-inserted into the correct position in the sequence this.add(tween, tween._startTime - tween._delay); } 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 (this._timeline.smoothChildTiming) { this._startTime += tween._startTime / this._timeScale; } this.shiftChildren(-tween._startTime, false, -9999999999); prevStart = 0; } end = tween._startTime + (tween._totalDuration / tween._timeScale); if (end > max) { max = end; } tween = prev; } this._duration = this._totalDuration = max; this._dirty = false; } return this._totalDuration; } return (value && this.totalDuration()) ? this.timeScale(this._totalDuration / value) : this; }
...
_stop.call(this, clearQueue, gotoEnd);
if (TweenLite) {
if (gotoEnd) {
var tweens = TweenLite.getTweensOf(this),
i = tweens.length,
progress;
while (--i > -1) {
progress = tweens[i].totalTime() / tweens[i].totalDuration();
if (progress > 0 && progress < 1) {
tweens[i].seek(tweens[i].totalDuration());
}
}
}
TweenLite.killTweensOf(this);
}
...
totalTime = function (time, suppressEvents, uncapped) { this._forcingPlayhead = true; var val = Animation.prototype.totalTime.apply(this, arguments); this._forcingPlayhead = false; return val; }
...
_stop.call(this, clearQueue, gotoEnd);
if (TweenLite) {
if (gotoEnd) {
var tweens = TweenLite.getTweensOf(this),
i = tweens.length,
progress;
while (--i > -1) {
progress = tweens[i].totalTime() / tweens[i].totalDuration();
if (progress > 0 && progress < 1) {
tweens[i].seek(tweens[i].totalDuration());
}
}
}
TweenLite.killTweensOf(this);
}
...
usesFrames = function () { var tl = this._timeline; while (tl._timeline) { tl = tl._timeline; } return (tl === Animation._rootFramesTimeline); }
...
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},
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;
...
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 === true); this._dirty = true; }
n/a
addCallback = function (callback, position, params, scope) { return this.add( TweenLite.delayedCall(0, callback, params, scope), position); }
n/a
constructor = 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 === true); this._dirty = true; }
n/a
currentLabel = function (value) { if (!arguments.length) { return this.getLabelBefore(this._time + 0.00000001); } return this.seek(value, true); }
n/a
getActive = function (nested, tweens, timelines) { if (nested == null) { nested = true; } if (tweens == null) { tweens = true; } if (timelines == null) { timelines = false; } var a = [], all = this.getChildren(nested, tweens, 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; }
n/a
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; }
n/a
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; }
...
}
this._yoyo = value;
return this;
};
p.currentLabel = function(value) {
if (!arguments.length) {
return this.getLabelBefore(this._time + 0.00000001);
}
return this.seek(value, true);
};
return TimelineMax;
}, true);
...
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.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;
}
}
...
invalidate = function () { this._locked = false; //unlock and set cycle in case invalidate() is called from inside an onRepeat return TimelineLite.prototype.invalidate.call(this); }
...
}
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) {
...
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); }
n/a
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; }
...
}
}
}
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},
Engine = (vars.repeat && _globals.TweenMax) || TweenLite,
duration, p, t;
...
removePause = function (position) { return this.removeCallback(TimelineLite._internals.pauseCallback, position); }
n/a
render = function (time, suppressEvents, force) { if (this._gc) { this._enabled(true, false); } var totalDur = (!this._dirty) ? this._totalDuration : this.totalDuration(), dur = this._duration, prevTime = this._time, prevTotalTime = this._totalTime, prevStart = this._startTime, prevTimeScale = this._timeScale, prevRawPrevTime = this._rawPrevTime, prevPaused = this._paused, prevCycle = this._cycle, tween, isComplete, next, callback, internalForce, cycleDuration, pauseTween, curTime; if (time >= totalDur - 0.0000001 && time >= 0) { //to work around occasional floating point math artifacts. if (!this._locked) { this._totalTime = totalDur; this._cycle = this._repeat; } if (!this._reversed) if (!this._hasPausedChild()) { isComplete = true; callback = "onComplete"; internalForce = !!this._timeline.autoRemoveChildren; //otherwise, if the animation is unpaused/activated after it's already finished, it doesn't get removed from the parent timeline. if (this._duration === 0) if ((time <= 0 && time >= -0.0000001) || prevRawPrevTime < 0 || prevRawPrevTime === _tinyNum) if ( prevRawPrevTime !== time && this._first) { internalForce = true; if (prevRawPrevTime > _tinyNum) { callback = "onReverseComplete"; } } } this._rawPrevTime = (this._duration || !suppressEvents || time || this._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 (this._yoyo && (this._cycle & 1) !== 0) { this._time = time = 0; } else { this._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 < 0.0000001) { //to work around occasional floating point math artifacts, round super small values to 0. if (!this._locked) { this._totalTime = this._cycle = 0; } this._time = 0; if (prevTime !== 0 || (dur === 0 && prevRawPrevTime !== _tinyNum && (prevRawPrevTime > 0 || (time < 0 && prevRawPrevTime >= 0)) && !this._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 = this._reversed; } if (time < 0) { this._active = false; if (this._timeline.autoRemoveChildren && this._reversed) { internalForce = isComplete = true; callback = "onReverseComplete"; } else if (prevRawPrevTime >= 0 && this._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 pl ...
...
b = [],
e = [],
targets = [],
_reservedProps = TweenLite._internals.reservedProps,
i, difs, p, from;
target = tween._targets || tween.target;
_getChildStyles(target, b, targets);
tween.render(duration, true, true);
_getChildStyles(target, e);
tween.render(0, true, true);
tween._enabled(true);
i = targets.length;
while (--i > -1) {
difs = _cssDif(targets[i], b[i], e[i]);
if (difs.firstMPT) {
...
repeat = function (value) { if (!arguments.length) { return this._repeat; } this._repeat = value; return this._uncache(true); }
n/a
repeatDelay = function (value) { if (!arguments.length) { return this._repeatDelay; } this._repeatDelay = value; return this._uncache(true); }
n/a
time = function (value, suppressEvents) { if (!arguments.length) { return this._time; } if (this._dirty) { this.totalDuration(); } if (value > this._duration) { value = this._duration; } if (this._yoyo && (this._cycle & 1) !== 0) { value = (this._duration - value) + (this._cycle * (this._duration + this._repeatDelay)); } else if (this._repeat !== 0) { value += this._cycle * (this._duration + this._repeatDelay); } return this.totalTime(value, suppressEvents); }
...
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);
...
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 ); }
...
_stop.call(this, clearQueue, gotoEnd);
if (TweenLite) {
if (gotoEnd) {
var tweens = TweenLite.getTweensOf(this),
i = tweens.length,
progress;
while (--i > -1) {
progress = tweens[i].totalTime() / tweens[i].totalDuration();
if (progress > 0 && progress < 1) {
tweens[i].seek(tweens[i].totalDuration());
}
}
}
TweenLite.killTweensOf(this);
}
...
totalProgress = function (value, suppressEvents) { return (!arguments.length) ? this._totalTime / this.totalDuration() : this.totalTime( this.totalDuration() * value, suppressEvents ); }
...
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);
...
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); return t.duration((Math.abs( t.vars.time - fromPosition) / this._timeScale) || 0.001); }
n/a
tweenTo = function (position, vars) { vars = vars || {}; var copy = {ease:_easeNone, useFrames:this.usesFrames(), immediateRender: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()) { //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 ); } 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);
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);
}
...
yoyo = function (value) { if (!arguments.length) { return this._yoyo; } this._yoyo = value; return this; }
n/a
TweenLite = function (target, duration, vars) { Animation.call(this, duration, vars); this.render = TweenLite.prototype.render; //speed optimization (avoid prototype lookup on this "hot" method) if (target == null) { throw "Cannot tween a null target."; } this.target = target = (typeof(target) !== "string") ? target : TweenLite.selector(target) || target; var isSelector = (target.jquery || (target.length && target !== window && target[0] && (target[0] === window || (target[0].nodeType && target[0].style && !target.nodeType)))), overwrite = this.vars.overwrite, i, targ, targets; this._overwrite = overwrite = (overwrite == null) ? _overwriteLookup[TweenLite.defaultOverwrite] : (typeof(overwrite) === "number ") ? overwrite >> 0 : _overwriteLookup[overwrite]; if ((isSelector || target instanceof Array || (target.push && _isArray(target))) && typeof(target[0]) !== "number") { this._targets = targets = _slice(target); //don't use Array.prototype.slice.call(target, 0) because that doesn't work in IE8 with a NodeList that's returned by querySelectorAll() this._propLookup = []; this._siblings = []; for (i = 0; i < targets.length; i++) { targ = targets[i]; if (!targ) { targets.splice(i--, 1); continue; } else if (typeof(targ) === "string") { targ = targets[i--] = TweenLite.selector(targ); //in case it's an array of strings if (typeof(targ) === "string") { targets.splice(i+1, 1); //to avoid an endless loop (can't imagine why the selector would return a string, but just in case ) } continue; } else if (targ.length && targ !== window && targ[0] && (targ[0] === window || (targ[0].nodeType && targ[0].style && !targ .nodeType))) { //in case the user is passing in an array of selector objects (like jQuery objects), we need to check one more level and pull things out if necessary. Also note that <select> elements pass all the criteria regarding length and the first child having style, so we must also check to ensure the target isn't an HTML node itself. targets.splice(i--, 1); this._targets = targets = targets.concat(_slice(targ)); continue; } this._siblings[i] = _register(targ, this, false); if (overwrite === 1) if (this._siblings[i].length > 1) { _applyOverwrite(targ, this, null, 1, this._siblings[i]); } } } else { this._propLookup = {}; this._siblings = _register(target, this, false); if (overwrite === 1) if (this._siblings.length > 1) { _applyOverwrite(target, this, null, 1, this._siblings); } } if (this.vars.immediateRender || (duration === 0 && this._delay === 0 && this.vars.immediateRender !== false)) { this._time = -_tinyNum; //forces a render without having to set the render() "force" parameter to true because we want to allow lazying by default (using the "force" parameter always forces an immediate full render) this.render(Math.min(0, -this._delay)); //in case delay is negative } }
n/a
_onPluginEvent = function (type, tween) { var pt = tween._firstPT, changed, pt2, first, last, next; if (type === "_onInitAllProps") { //sorts the PropTween linked list in order of priority because some plugins need to render earlier/later than others, like MotionBlurPlugin applies its effects after all x/y/alpha tweens have rendered on each frame. while (pt) { next = pt._next; pt2 = first; while (pt2 && pt2.pr > pt.pr) { pt2 = pt2._next; } if ((pt._prev = pt2 ? pt2._prev : last)) { pt._prev._next = pt; } else { first = pt; } if ((pt._next = pt2)) { pt2._prev = pt; } else { last = pt; } pt = next; } pt = tween._firstPT = first; } while (pt) { if (pt.pg) if (typeof(pt.t[type]) === "function") if (pt.t[type]()) { changed = true; } pt = pt._next; } return changed; }
...
}
}
} else {
initPlugins = this._initProps(this.target, this._propLookup, this._siblings, op, 0);
}
if (initPlugins) {
TweenLite._onPluginEvent("_onInitAllProps", this); //reorders the array
in order of priority. Uses a static TweenPlugin method in order to minimize file size in TweenLite
}
if (op) if (!this._firstPT) if (typeof(this.target) !== "function") { //if all tweening properties have been overwritten
, kill the tween. If the target is a function, it's probably a delayedCall so let it live.
this._enabled(false, false);
}
if (v.runBackwards) {
pt = this._firstPT;
while (pt) {
...
defaultStringFilter = function (a) { var combined = a[0] + a[1], toHSL; 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); } _colorExp.lastIndex = 0; }
n/a
delayedCall = function (delay, callback, params, scope, useFrames) { return new TweenLite(callback, 0, {delay:delay, onComplete:callback, onCompleteParams:params, callbackScope:scope, onReverseComplete :callback, onReverseCompleteParams:params, immediateRender:false, lazy:false, useFrames:useFrames, overwrite:0}); }
...
}
}
//DEBUG: _log("parsed rotation of " + t.getAttribute("id")+": "+(tm.rotationX)+", "+(
tm.rotationY)+", "+(tm.rotation)+", scale: "+tm.scaleX+", "+tm.scaleY+", "+tm.scaleZ+"
;, position: "+tm.x+", "+tm.y+", "+tm.z+", perspective: "+tm.perspective+ ", origin: "
;+ tm.xOrigin+ ","+ tm.yOrigin);
if (rec) {
t._gsTransform = tm; //record to the object's _gsTransform which we use so that tweens can control individual properties
independently (we need all the properties to accurately recompose the matrix in the setRatio() method)
if (tm.svg) { //if we're supposed to apply transforms to the SVG element's "transform" attribute, make
sure there aren't any CSS transforms applied or they'll override the attribute ones. Also clear the transform attribute
if we're using CSS, just to be clean.
if (_useSVGTransformAttr && t.style[_transformProp]) {
TweenLite.delayedCall(0.001, function(){ //if we apply this right away (before
anything has rendered), we risk there being no transforms for a brief moment and it also interferes with adjusting the transformOrigin
in a tween with immediateRender:true (it'd try reading the matrix and it wouldn't have the appropriate data in place
because we just removed it).
_removeProp(t.style, _transformProp);
});
} else if (!_useSVGTransformAttr && t.getAttribute("transform")) {
TweenLite.delayedCall(0.001, function(){
t.removeAttribute("transform");
});
}
...
from = function (target, duration, vars) { vars.runBackwards = true; vars.immediateRender = (vars.immediateRender != false); return new TweenLite(target, duration, vars); }
...
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, vars), position);
};
p.fromTo = function(target, duration, fromVars, toVars, position) {
var Engine = (toVars.repeat && _globals.TweenMax) || TweenLite;
return duration ? this.add( Engine.fromTo(target, duration, fromVars, toVars), position) : this.set(target, toVars, position);
};
...
fromTo = function (target, duration, fromVars, toVars) { toVars.startAt = fromVars; toVars.immediateRender = (toVars.immediateRender != false && fromVars.immediateRender != false); return new TweenLite(target, duration, toVars); }
...
}
orig = v.transformOrigin;
if (m1.svg && (orig || v.svgOrigin)) {
x = m1.xOffset; //when we change the origin, in order to prevent things from jumping we adjust the x/y so we must record those
here so that we can create PropTweens for them and flip them at the same time as the origin
y = m1.yOffset;
_parseSVGOrigin(t, _parsePosition(orig), m2, v.svgOrigin, v.smoothOrigin);
pt = _addNonTweeningNumericPT(m1, "xOrigin", (originalGSTransform ? m1 : m2).xOrigin, m2.xOrigin, pt, transformOriginString
); //note: if there wasn't a transformOrigin defined yet, just start with the destination one; it's wasteful otherwise
, and it causes problems with fromTo() tweens. For example, TweenLite.to("#wheel", 3, {rotation:180, transformOrigin:
x22;50% 50%", delay:1}); TweenLite.fromTo("#wheel", 3, {scale:0.5, transformOrigin
:"50% 50%"}, {scale:1, delay:2}); would cause a jump when the from values revert at the beginning of the 2nd tween.
pt = _addNonTweeningNumericPT(m1, "yOrigin", (originalGSTransform ? m1 : m2).yOrigin, m2.yOrigin, pt, transformOriginString
);
if (x !== m1.xOffset || y !== m1.yOffset) {
pt = _addNonTweeningNumericPT(m1, "xOffset", (originalGSTransform ? x : m1.xOffset), m1.xOffset, pt, transformOriginString
);
pt = _addNonTweeningNumericPT(m1, "yOffset", (originalGSTransform ? y : m1.yOffset), m1.yOffset, pt, transformOriginString
);
}
orig = "0px 0px"; //certain browsers (like firefox) completely botch transform-origin, so we must remove it to prevent
it from contaminating transforms. We manage it ourselves with xOrigin and yOrigin
}
...
getTweensOf = function (target, onlyActive) { if (target == null) { return []; } target = (typeof(target) !== "string") ? target : TweenLite.selector(target) || target; var i, a, j, t; if ((_isArray(target) || _isSelector(target)) && typeof(target[0]) !== "number") { i = target.length; a = []; while (--i > -1) { a = a.concat(TweenLite.getTweensOf(target[i], onlyActive)); } i = a.length; //now get rid of any duplicates (tweens of arrays of objects could cause duplicates) while (--i > -1) { t = a[i]; j = i; while (--j > -1) { if (t === a[j]) { a.splice(i, 1); } } } } else { a = _register(target).concat(); i = a.length; while (--i > -1) { if (a[i]._gc || (onlyActive && !a[i].isActive())) { a.splice(i, 1); } } } return a; }
...
};
$.fn.stop = function(clearQueue, gotoEnd) {
_stop.call(this, clearQueue, gotoEnd);
if (TweenLite) {
if (gotoEnd) {
var tweens = TweenLite.getTweensOf(this),
i = tweens.length,
progress;
while (--i > -1) {
progress = tweens[i].totalTime() / tweens[i].totalDuration();
if (progress > 0 && progress < 1) {
tweens[i].seek(tweens[i].totalDuration());
}
...
killDelayedCallsTo = function (target, onlyActive, vars) { if (typeof(onlyActive) === "object") { vars = onlyActive; //for backwards compatibility (before "onlyActive" parameter was inserted) onlyActive = false; } var a = TweenLite.getTweensOf(target, onlyActive), i = a.length; while (--i > -1) { a[i]._kill(vars, target); } }
n/a
killTweensOf = function (target, onlyActive, vars) { if (typeof(onlyActive) === "object") { vars = onlyActive; //for backwards compatibility (before "onlyActive" parameter was inserted) onlyActive = false; } var a = TweenLite.getTweensOf(target, onlyActive), i = a.length; while (--i > -1) { a[i]._kill(vars, target); } }
...
if (!arguments.length) {
return -(element.scrollLeft + offsetLeft);
}
var dif = element.scrollLeft - prevLeft,
oldOffset = offsetLeft;
if ((dif > 2 || dif < -2) && !force) { //if the user interacts with the scrollbar (or something else scrolls
it, like the mouse wheel), we should kill any tweens of the ScrollProxy.
prevLeft = element.scrollLeft;
TweenLite.killTweensOf(this, true, {left:1, scrollLeft:1});
this.left(-prevLeft);
if (vars.onKill) {
vars.onKill();
}
return;
}
value = -value; //invert because scrolling works in the opposite direction
...
lagSmoothing = function (threshold, adjustedLag) { _ticker.lagSmoothing(threshold, adjustedLag); }
...
TweenLite.version = "1.19.1";
TweenLite.defaultEase = p._ease = new Ease(null, null, 1, 1);
TweenLite.defaultOverwrite = "auto";
TweenLite.ticker = _ticker;
TweenLite.autoSleep = 120;
TweenLite.lagSmoothing = function(threshold, adjustedLag) {
_ticker.lagSmoothing(threshold, adjustedLag);
};
TweenLite.selector = window.$ || window.jQuery || function(e) {
var selector = window.$ || window.jQuery;
if (selector) {
TweenLite.selector = selector;
return selector(e);
...
render = function () { var i, a, p; if (_lazyTweens.length) { //if code is run outside of the requestAnimationFrame loop, there may be tweens queued AFTER the engine refreshed, so we need to ensure any pending renders occur before we refresh again. _lazyRender(); } _rootTimeline.render((_ticker.time - _rootTimeline._startTime) * _rootTimeline._timeScale, false, false); _rootFramesTimeline.render((_ticker.frame - _rootFramesTimeline._startTime) * _rootFramesTimeline._timeScale, false, false); if (_lazyTweens.length) { _lazyRender(); } if (_ticker.frame >= _nextGCFrame) { //dump garbage every 120 frames or whatever the user sets TweenLite.autoSleep to _nextGCFrame = _ticker.frame + (parseInt(TweenLite.autoSleep, 10) || 120); for (p in _tweenLookup) { a = _tweenLookup[p].tweens; i = a.length; while (--i > -1) { if (a[i]._gc) { a.splice(i, 1); } } if (a.length === 0) { delete _tweenLookup[p]; } } //if there are no more tweens in the root timelines, or if they're all paused, make the _timer sleep to reduce load on the CPU slightly p = _rootTimeline._first; if (!p || p._paused) if (TweenLite.autoSleep && !_rootFramesTimeline._first && _ticker._listeners.tick.length === 1) { while (p && p._paused) { p = p._next; } if (!p) { _ticker.sleep(); } } } }
...
b = [],
e = [],
targets = [],
_reservedProps = TweenLite._internals.reservedProps,
i, difs, p, from;
target = tween._targets || tween.target;
_getChildStyles(target, b, targets);
tween.render(duration, true, true);
_getChildStyles(target, e);
tween.render(0, true, true);
tween._enabled(true);
i = targets.length;
while (--i > -1) {
difs = _cssDif(targets[i], b[i], e[i]);
if (difs.firstMPT) {
...
selector = function (e) { var selector = window.$ || window.jQuery; if (selector) { TweenLite.selector = selector; return selector(e); } return (typeof(_doc) === "undefined") ? e : (_doc.querySelectorAll ? _doc.querySelectorAll(e) : _doc.getElementById((e.charAt (0) === "#") ? e.substr(1) : e)); }
...
_isMultiTouching,
_isAndroid = (navigator.userAgent.toLowerCase().indexOf("android") !== -1), //Android handles touch events in an odd
way and it's virtually impossible to "feature test" so we resort to UA sniffing
_lastDragTime = 0,
_temp1 = {}, // a simple object we reuse and populate (usually x/y properties) to conserve memory and improve performance.
_windowProxy = {}, //memory/performance optimization - we reuse this object during autoScroll to store window-related bounds/
offsets.
_slice = function(a) { //don't use Array.prototype.slice.call(target, 0) because that doesn't work in IE8 with a NodeList
that's returned by querySelectorAll()
if (typeof(a) === "string") {
a = TweenLite.selector(a);
}
if (!a || a.nodeType) { //if it's not an array, wrap it in one.
return [a];
}
var b = [],
l = a.length,
i;
...
set = function (target, vars) { return new TweenLite(target, 0, vars); }
...
var _gsScope = (typeof(module) !== "undefined" && module.exports && typeof(global) !== "undefined
") ? global : this || window; //helps ensure compatibility with AMD/RequireJS and CommonJS/Node
(_gsScope._gsQueue || (_gsScope._gsQueue = [])).push( function() {
"use strict";
_gsScope._gsDefine("utils.Draggable", ["events.EventDispatcher","TweenLite","plugins.CSSPlugin
"], function(EventDispatcher, TweenLite, CSSPlugin) {
var _tempVarsXY = {css:{}}, //speed optimization - we reuse the same vars object for x/y TweenLite.set() calls to minimize garbage collection tasks and improve performance.
_tempVarsX = {css:{}},
_tempVarsY = {css:{}},
_tempVarsRotation = {css:{}},
_globals = _gsScope._gsDefine.globals,
_tempEvent = {}, //for populating with pageX/pageY in old versions of IE
_dummyElement = {style:{}},
_doc = _gsScope.document || {createElement: function() {return _dummyElement;}},
...
to = function (target, duration, vars) { return new TweenLite(target, duration, vars); }
...
* target.style.width = (start + value * ratio) + "px";
* console.log("set width to " + target.style.width);
* }
* }, 0);
*
* Then, when I do this tween, it will trigger my special property:
*
* TweenLite.to(element, 1, {css:{myCustomProp:100}});
*
* In the example, of course, we're just changing the width, but you can do anything you want.
*
* @param {!string} name Property name (or comma-delimited list of property names) that should be intercepted and handled by your
function. For example, if I define "myCustomProp", then it would handle that portion of the following tween: TweenLite
.to(element, 1, {css:{myCustomProp:100}})
* @param {!function(Object, Object, Object, string):function(number)} onInitTween The function that will be called when a tween
of this special property is performed. The function will receive 4 parameters: 1) Target object that should be tweened, 2) Value
that was passed to the tween, 3) The tween instance itself (rarely used), and 4) The property name that's being tweened. Your
function should return a function that should be called on every update of the tween. That function will receive a single parameter
that is a "change factor" value (typically between 0 and 1) indicating the amount of change as a ratio. You can use this
to determine how to set the values appropriately in your function.
* @param {number=} priority Priority that helps the engine determine the order in which to set the properties (default: 0). Higher
priority properties will be updated before lower priority ones.
*/
...
blobDif = function (start, end, filter, pt) { var a = [], charIndex = 0, s = "", color = 0, startNums, endNums, num, i, l, nonNumbers, currentNum; a.start = start; a.end = end; start = a[0] = start + ""; //ensure values are strings end = a[1] = end + ""; if (filter) { filter(a); //pass an array with the starting and ending values and let the filter do whatever it needs to the values. start = a[0]; end = a[1]; } a.length = 0; startNums = start.match(_numbersExp) || []; endNums = end.match(_numbersExp) || []; if (pt) { pt._next = null; pt.blob = 1; a._firstPT = a._applyPT = pt; //apply last in the linked list (which means inserting it first) } l = endNums.length; for (i = 0; i < l; i++) { currentNum = endNums[i]; nonNumbers = end.substr(charIndex, end.indexOf(currentNum, charIndex)-charIndex); s += (nonNumbers || !i) ? nonNumbers : ","; //note: SVG spec allows omission of comma/space when a negative sign is wedged between two numbers, like 2.5-5.3 instead of 2.5,-5.3 but when tweening, the negative value may switch to positive, so we insert the comma just in case. charIndex += nonNumbers.length; if (color) { //sense rgba() values and round them. color = (color + 1) % 5; } else if (nonNumbers.substr(-5) === "rgba(") { color = 1; } if (currentNum === startNums[i] || startNums.length <= i) { s += currentNum; } else { if (s) { a.push(s); s = ""; } num = parseFloat(startNums[i]); a.push(num); a._firstPT = {_next: a._firstPT, t:a, p: a.length-1, s:num, c:((currentNum.charAt(1) === "=") ? parseInt(currentNum.charAt (0) + "1", 10) * parseFloat(currentNum.substr(2)) : (parseFloat(currentNum) - num)) || 0, f:0, m:(color && color < 4) ? Math.round : 0}; //note: we don't set _prev because we'll never need to remove individual PropTweens from this list. } charIndex += currentNum.length; } s += end.substr(charIndex); if (s) { a.push(s); } a.setRatio = _setRatio; return a; }
n/a
isArray = function (obj) { return obj != null && (obj instanceof Array || (typeof(obj) === "object" && !!obj.push && toString.call(obj) === array)); }
n/a
isSelector = function (v) { return (v && v.length && v !== window && v[0] && (v[0] === window || (v[0].nodeType && v[0].style && !v.nodeType))); //we cannot check "nodeType" if the target is window from within an iframe, otherwise it will trigger a security error in some browsers like Firefox. }
n/a
lazyRender = function () { var i = _lazyTweens.length, tween; _lazyLookup = {}; while (--i > -1) { tween = _lazyTweens[i]; if (tween && tween._lazy !== false) { tween.render(tween._lazy[0], tween._lazy[1], true); tween._lazy = false; } } _lazyTweens.length = 0; }
n/a
attr = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
...
this._parseTransform(target, v);
continue;
} else if (_transformMap[p] || p === "pivot") {
this._parseTransform(target, value);
continue;
}
s = target.attr(p);
//Some of these properties are in place in order to conform with the standard PropTweens in TweenPlugins so that overwriting
and roundProps occur properly. For example, f and r may seem unnecessary here, but they enable other functionality.
//_next:* next linked list node [object]
//t: * target [object]
//p: * property (camelCase) [string]
//s: * starting value [number]
//c: * change value [number]
...
bezier = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
colorProps = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
css = function () { TweenPlugin.call(this, "css"); this._overwriteProps.length = 0; this.setRatio = CSSPlugin.prototype.setRatio; //speed optimization (avoid prototype lookup on this "hot" method) }
n/a
cssRule = function () { TweenPlugin.call(this, "cssRule"); this._overwriteProps.length = 0; }
n/a
directionalRotation = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
easel = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
endArray = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
modifiers = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
raphael = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
roundProps = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
text = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
yourCustomProperty = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
_onInitTween = 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; }
...
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,
...
constructor = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
_onInitTween = 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; }
...
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,
...
constructor = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
setRatio = 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; } } }
...
}
return cssp.parse(t, vars, pt, plugin);
};
},
// @private used when other plugins must tween values first, like BezierPlugin or ThrowPropsPlugin, etc. That plugin's setRatio
() gets called first so that the values are updated, and then we loop through the MiniPropTweens which handle copying the values
into their appropriate slots so that they can then be applied correctly in the main CSSPlugin setRatio() method. Remember, we typically
create a proxy object that has a bunch of uniquely-named properties that we feed to the sub-plugin and it does its magic normally
, and then we must interpret those values and apply them to the css because often numbers must get combined/concatenated, suffixes
added, etc. to work with css, like boxShadow could have 4 values plus a color.
_setPluginRatio = _internals._setPluginRatio = function(v) {
this.plugin.setRatio(v);
var d = this.data,
proxy = d.proxy,
mpt = d.firstMPT,
min = 0.000001,
val, pt, i, str, p;
while (mpt) {
val = proxy[mpt.v];
...
_onInitTween = 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; }
...
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,
...
constructor = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
setRatio = 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(); } }
...
}
return cssp.parse(t, vars, pt, plugin);
};
},
// @private used when other plugins must tween values first, like BezierPlugin or ThrowPropsPlugin, etc. That plugin's setRatio
() gets called first so that the values are updated, and then we loop through the MiniPropTweens which handle copying the values
into their appropriate slots so that they can then be applied correctly in the main CSSPlugin setRatio() method. Remember, we typically
create a proxy object that has a bunch of uniquely-named properties that we feed to the sub-plugin and it does its magic normally
, and then we must interpret those values and apply them to the css because often numbers must get combined/concatenated, suffixes
added, etc. to work with css, like boxShadow could have 4 values plus a color.
_setPluginRatio = _internals._setPluginRatio = function(v) {
this.plugin.setRatio(v);
var d = this.data,
proxy = d.proxy,
mpt = d.firstMPT,
min = 0.000001,
val, pt, i, str, p;
while (mpt) {
val = proxy[mpt.v];
...
_mod = function (lookup) { if (typeof(lookup.endArray) === "function") { this._mod = lookup.endArray; } }
...
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._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;
} else {
this._add(pt.t, pt.p, pt.s, pt.c, val);
//remove from linked list
...
_onInitTween = 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; }
...
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,
...
constructor = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
setRatio = 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; } } }
...
}
return cssp.parse(t, vars, pt, plugin);
};
},
// @private used when other plugins must tween values first, like BezierPlugin or ThrowPropsPlugin, etc. That plugin's setRatio
() gets called first so that the values are updated, and then we loop through the MiniPropTweens which handle copying the values
into their appropriate slots so that they can then be applied correctly in the main CSSPlugin setRatio() method. Remember, we typically
create a proxy object that has a bunch of uniquely-named properties that we feed to the sub-plugin and it does its magic normally
, and then we must interpret those values and apply them to the css because often numbers must get combined/concatenated, suffixes
added, etc. to work with css, like boxShadow could have 4 values plus a color.
_setPluginRatio = _internals._setPluginRatio = function(v) {
this.plugin.setRatio(v);
var d = this.data,
proxy = d.proxy,
mpt = d.firstMPT,
min = 0.000001,
val, pt, i, str, p;
while (mpt) {
val = proxy[mpt.v];
...
_add = function (target, p, s, c, mod) { this._addTween(target, p, s, s + c, p, mod); this._overwriteProps.push(p); }
...
val = lookup[pt.t._propName];
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;
} 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) {
...
_onInitAllProps = function () { var tween = this._tween, lookup = this._vars, mpt = this, pt = tween._firstPT, val, next; 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._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; } 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; }
n/a
_onInitTween = function (target, value, tween) { this._tween = tween; this._vars = value; return true; }
...
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,
...
constructor = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
_onInitTween = function (target, value, tween) { if (!target.attr) { //raphael must have attr() method return false; } this._target = target; this._tween = tween; this._props = target._gsProps = target._gsProps || {}; var p, s, v, pt, clr1, clr2, rel; for (p in value) { v = value[p]; if (p === "transform") { this._parseTransform(target, v); continue; } else if (_transformMap[p] || p === "pivot") { this._parseTransform(target, value); continue; } s = target.attr(p); //Some of these properties are in place in order to conform with the standard PropTweens in TweenPlugins so that overwriting and roundProps occur properly. For example, f and r may seem unnecessary here, but they enable other functionality. //_next:* next linked list node [object] //t: * target [object] //p: * property (camelCase) [string] //s: * starting value [number] //c: * change value [number] //f: * is function [boolean] //n: * name (for overwriting) [string] //b: beginning value [string] //i: intermediate value [string] //e: ending value [string] //r: * round [boolean] //type: 0=normal, 1=color, 2=rgba, -1=non-tweening prop [number] this._firstPT = pt = {_next:this._firstPT, t:this._props, p:p, b:s, f:false, n:"raphael_" + p, r:false, type:0}; //color values must be split apart into their R, G, B (and sometimes alpha) values and tweened independently. if (p === "fill" || p === "stroke") { clr1 = _parseColor(s); clr2 = _parseColor(v); pt.e = v; pt.s = Number(clr1[0]); //red starting value pt.c = Number(clr2[0]) - pt.s; //red change pt.gs = Number(clr1[1]); //green starting value pt.gc = Number(clr2[1]) - pt.gs; //green change pt.bs = Number(clr1[2]); //blue starting value pt.bc = Number(clr2[2]) - pt.bs; //blue change if (clr1.length > 3 || clr2.length > 3) { //detect an rgba() value pt.as = (clr1.length < 4) ? 1 : Number(clr1[3]); pt.ac = ((clr2.length < 4) ? 1 : Number(clr2[3])) - pt.as; pt.type = 2; //2 = rgba() tween } else { pt.type = 1; //1 = color tween, -1 = no tween, just set the value at the end because there's no changes } } else { s = (typeof(s) === "string") ? parseFloat(s.replace(_NaNExp, "")) : Number(s); if (typeof(v) === "string") { rel = (v.charAt(1) === "="); v = parseFloat(v.replace(_NaNExp, "")); } else { rel = false; } pt.e = (v || v === 0) ? (rel ? v + s : v) : value[p]; //ensures that any += or -= prefixes are taken care of. if ((s || s === 0) && (v || v === 0) && (pt.c = (rel ? v : v - s))) { //faster than isNaN(). Also, we set pt.c (change) here because if it's 0, we'll just treat it like a non-tweening value. can't do (v !== start) because if it's a relative value and the CHANGE is identical to the START, the condition will fail unnecessarily. pt.s = s; } else { pt.type = -1; pt.i = value[p]; //intermediate value is typically the same as the end value. pt.s = pt.c = 0; } } this._overwriteProps.push("raphael_" + p); if (pt._next) { pt._next._prev = pt; } } return true; }
...
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,
...
_parseTransform = function (t, v) { if (this._transform) { return; } //only need to parse the transform once, and only if the browser supports it. var m1 = this._transform = _getTransform(t, true), min = 0.000001, m2, skewY, p, pt, copy, dx, dy, mtx, pivot; if (typeof(v) === "object") { //for values like scaleX, scaleY, rotation, x, y, skewX, and skewY or transform:{...} (object) m2 = {scaleX:_parseVal((v.scaleX != null) ? v.scaleX : v.scale, m1.scaleX), scaleY:_parseVal((v.scaleY != null) ? v.scaleY : v.scale, m1.scaleY), tx:_parseVal(v.tx, m1.tx), ty:_parseVal(v.ty, m1.ty)}; if (v.shortRotation != null) { m2.rotation = (typeof(v.shortRotation) === "number") ? v.shortRotation * _DEG2RAD : _parseAngle(v.shortRotation, m1.rotation ); var dif = (m2.rotation - m1.rotation) % (Math.PI * 2); if (dif !== dif % Math.PI) { dif += Math.PI * ((dif < 0) ? 2 : -2); } m2.rotation = m1.rotation + dif; } else { m2.rotation = (v.rotation == null) ? m1.rotation : (typeof(v.rotation) === "number") ? v.rotation * _DEG2RAD : _parseAngle(v .rotation, m1.rotation); } m2.skewX = (v.skewX == null) ? m1.skewX : (typeof(v.skewX) === "number") ? v.skewX * _DEG2RAD : _parseAngle(v.skewX, m1.skewX ); //note: for performance reasons, we combine all skewing into the skewX and rotation values, ignoring skewY but we must still record it so that we can discern how much of the overall skew is attributed to skewX vs. skewY. Otherwise, if the skewY would always act relative (tween skewY to 10deg, for example, multiple times and if we always combine things into skewX, we can't remember that skewY was 10 from last time). Remember, a skewY of 10 degrees looks the same as a rotation of 10 degrees plus a skewX of -10 degrees . m2.skewY = (v.skewY == null) ? m1.skewY : (typeof(v.skewY) === "number") ? v.skewY * _DEG2RAD : _parseAngle(v.skewY, m1.skewY ); if ((skewY = m2.skewY - m1.skewY)) { m2.skewX += skewY; m2.rotation += skewY; } //don't allow rotation/skew values to be a SUPER small decimal because when they're translated back to strings for setting the css property, the browser reports them in a funky way, like 1-e7. Of course we could use toFixed() to resolve that issue but that hurts performance quite a bit with all those function calls on every frame, plus it is virtually impossible to discern values that small visually (nobody will notice changing a rotation of 0.0000001 to 0, so the performance improvement is well worth it). if (m2.skewY < min) if (m2.skewY > -min) { m2.skewY = 0; } if (m2.skewX < min) if (m2.skewX > -min) { m2.skewX = 0; } if (m2.rotation < min) if (m2.rotation > -min) { m2.rotation = 0; } pivot = v.localPivot || v.globalPivot; if (typeof(pivot) === "string") { copy = pivot.split(","); dx = Number(copy[0]); dy = Number(copy[1]); } else if (typeof(pivot) === "object") { dx = Number(pivot.x); dy = Number(pivot.y); } else if (v.localPivot) { copy = t.getBBox(true); dx = copy.width / 2; dy = copy.height / 2; } else { copy = t.getBBox(); dx = copy.x + copy.width / 2; dy = copy.y + copy.height / 2; } if (v.localPivot) { mtx = t.matrix; dx += t.attr("x"); dy += t.attr("y"); this._pxl = dx; this._pyl = dy; this._pxg = dx * mtx.a + dy * mtx.c + mtx.e - m1.tx; this._pyg = dx * mtx.b + dy * mtx.d + mtx.f - m1.ty; } else { mtx = t.matrix.invert(); this._pxl = dx * mtx.a + dy * mtx.c + mtx.e; this._pyl = dx * mtx.b + dy * mtx.d + mtx.f; this._pxg = dx - m1.tx; this._pyg = dy - m1.ty; } } else if (typeof(v) === "string") { //for values like transform:"rotate(60deg) scale(0.5, 0.8)" copy = this._target.transform(); t.transform(v); m2 = _getTransform(t, false); t.transform(copy); } else { return; } for (p in _transformMap) { if (m1[p] !== m2[p]) if (p !== "shortRotation") if (p !== "scale") { this._firstPT = pt = {_next:this._firstPT, t:m1, p:p, s:m1[p], c:m2[p] - m1[p], n:p, f:fal ...
...
var p, s, v, pt, clr1, clr2, rel;
for (p in value) {
v = value[p];
if (p === "transform") {
this._parseTransform(target, v);
continue;
} else if (_transformMap[p] || p === "pivot") {
this._parseTransform(target, value);
continue;
}
s = target.attr(p);
...
constructor = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
setRatio = function (v) { var pt = this._firstPT, val; while (pt) { val = pt.c * v + pt.s; if (pt.r) { val = Math.round(val); } if (!pt.type) { pt.t[pt.p] = val; } else if (pt.type === 1) { //rgb() pt.t[pt.p] = "rgb(" + (val >> 0) + ", " + ((pt.gs + (v * pt.gc)) >> 0) + ", " + ((pt.bs + (v * pt.bc)) >> 0) + ")"; } else if (pt.type === 2) { //rgba() pt.t[pt.p] = "rgba(" + (val >> 0) + ", " + ((pt.gs + (v * pt.gc)) >> 0) + ", " + ((pt.bs + (v * pt.bc)) >> 0) + ", " + (pt .as + (v * pt.ac)) + ")"; } else if (pt.type === -1) { //non-tweening pt.t[pt.p] = pt.i; } pt = pt._next; } this._target.attr(this._props); //apply transform values like x, y, scaleX, scaleY, rotation, skewX, or skewY. We do these after looping through all the PropTweens because those are where the changes are made to scaleX/scaleY/rotation/skewX/skewY/x/y. if (this._transform) { pt = this._transform; //to improve speed and reduce size, reuse the pt variable as an alias to the _transform property var ang = pt.rotation, skew = ang - pt.skewX, a = Math.cos(ang) * pt.scaleX, b = Math.sin(ang) * pt.scaleX, c = Math.sin(skew) * -pt.scaleY, d = Math.cos(skew) * pt.scaleY, min = 0.000001, pxl = this._pxl, pyl = this._pyl; //some browsers have a hard time with very small values like 2.4492935982947064e-16 (notice the "e-" towards the end) and would render the object slightly off. So we round to 0 in these cases for both b and c. The conditional logic here is faster than calling Math.abs(). if (b < min) if (b > -min) { b = 0; } if (c < min) if (c > -min) { c = 0; } pt.ox = this._pxg - (pxl * a + pyl * c); //we must record the offset x/y that we're making from the regular tx/ty (matrix.e and f) so that we can correctly interpret positional data in _getTransform(). See note there on tx and ox. pt.oy = this._pyg - (pxl * b + pyl * d); this._target.transform("m" + a + "," + b + "," + c + "," + d + "," + (pt.tx + pt.ox) + "," + (pt.ty + pt.oy)); } }
...
}
return cssp.parse(t, vars, pt, plugin);
};
},
// @private used when other plugins must tween values first, like BezierPlugin or ThrowPropsPlugin, etc. That plugin's setRatio
() gets called first so that the values are updated, and then we loop through the MiniPropTweens which handle copying the values
into their appropriate slots so that they can then be applied correctly in the main CSSPlugin setRatio() method. Remember, we typically
create a proxy object that has a bunch of uniquely-named properties that we feed to the sub-plugin and it does its magic normally
, and then we must interpret those values and apply them to the css because often numbers must get combined/concatenated, suffixes
added, etc. to work with css, like boxShadow could have 4 values plus a color.
_setPluginRatio = _internals._setPluginRatio = function(v) {
this.plugin.setRatio(v);
var d = this.data,
proxy = d.proxy,
mpt = d.firstMPT,
min = 0.000001,
val, pt, i, str, p;
while (mpt) {
val = proxy[mpt.v];
...
_add = function (target, p, s, c) { this._addTween(target, p, s, s + c, p, Math.round); this._overwriteProps.push(p); }
...
val = lookup[pt.t._propName];
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;
} 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) {
...
_onInitAllProps = function () { var tween = this._tween, rp = (tween.vars.roundProps.join) ? tween.vars.roundProps : tween.vars.roundProps.split(","), i = rp.length, lookup = {}, rpt = tween._propLookup.roundProps, prop, pt, next; while (--i > -1) { lookup[rp[i]] = Math.round; } i = rp.length; while (--i > -1) { prop = rp[i]; 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 === prop) { if (pt.f === 2 && pt.t) { //a blob (text containing multiple numeric values) _roundLinkedList(pt.t._firstPT); } else { this._add(pt.t, prop, pt.s, pt.c); //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[prop] = rpt; } } pt = next; } } return false; }
n/a
_onInitTween = function (target, value, tween) { this._tween = tween; return true; }
...
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,
...
constructor = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
_onInitTween = 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 = _getText(target).replace(/\s+/g, " ").split(this._delimiter); this._text = value.value.replace(/\s+/g, " ").split(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; }
...
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,
...
constructor = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
setRatio = 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; } }
...
}
return cssp.parse(t, vars, pt, plugin);
};
},
// @private used when other plugins must tween values first, like BezierPlugin or ThrowPropsPlugin, etc. That plugin's setRatio
() gets called first so that the values are updated, and then we loop through the MiniPropTweens which handle copying the values
into their appropriate slots so that they can then be applied correctly in the main CSSPlugin setRatio() method. Remember, we typically
create a proxy object that has a bunch of uniquely-named properties that we feed to the sub-plugin and it does its magic normally
, and then we must interpret those values and apply them to the css because often numbers must get combined/concatenated, suffixes
added, etc. to work with css, like boxShadow could have 4 values plus a color.
_setPluginRatio = _internals._setPluginRatio = function(v) {
this.plugin.setRatio(v);
var d = this.data,
proxy = d.proxy,
mpt = d.firstMPT,
min = 0.000001,
val, pt, i, str, p;
while (mpt) {
val = proxy[mpt.v];
...
_onInitTween = 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;
}
...
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,
...
constructor = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
setRatio = 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; }
...
}
return cssp.parse(t, vars, pt, plugin);
};
},
// @private used when other plugins must tween values first, like BezierPlugin or ThrowPropsPlugin, etc. That plugin's setRatio
() gets called first so that the values are updated, and then we loop through the MiniPropTweens which handle copying the values
into their appropriate slots so that they can then be applied correctly in the main CSSPlugin setRatio() method. Remember, we typically
create a proxy object that has a bunch of uniquely-named properties that we feed to the sub-plugin and it does its magic normally
, and then we must interpret those values and apply them to the css because often numbers must get combined/concatenated, suffixes
added, etc. to work with css, like boxShadow could have 4 values plus a color.
_setPluginRatio = _internals._setPluginRatio = function(v) {
this.plugin.setRatio(v);
var d = this.data,
proxy = d.proxy,
mpt = d.firstMPT,
min = 0.000001,
val, pt, i, str, p;
while (mpt) {
val = proxy[mpt.v];
...
_enabled = function (enabled, ignoreTimeline) { if (!_tickerActive) { _ticker.wake(); } if (enabled && this._gc) { var targets = this._targets, i; if (targets) { i = targets.length; while (--i > -1) { this._siblings[i] = _register(targets[i], this, true); } } else { this._siblings = _register(this.target, this, true); } } Animation.prototype._enabled.call(this, enabled, ignoreTimeline); if (this._notifyPluginsOfEnabled) if (this._firstPT) { return TweenLite._onPluginEvent((enabled ? "_onEnable" : "_onDisable"), this); } return false; }
...
_reservedProps = TweenLite._internals.reservedProps,
i, difs, p, from;
target = tween._targets || tween.target;
_getChildStyles(target, b, targets);
tween.render(duration, true, true);
_getChildStyles(target, e);
tween.render(0, true, true);
tween._enabled(true);
i = targets.length;
while (--i > -1) {
difs = _cssDif(targets[i], b[i], e[i]);
if (difs.firstMPT) {
difs = difs.difs;
for (p in vars) {
if (_reservedProps[p]) {
...
_init = function () { var v = this.vars, op = this._overwrittenProps, dur = this._duration, immediate = !!v.immediateRender, ease = v.ease, i, initPlugins, pt, p, startVars, l; if (v.startAt) { if (this._startAt) { this._startAt.render(-1, true); //if we've run a startAt previously (when the tween instantiated), we should revert it so that the values re-instantiate correctly particularly for relative tweens. Without this, a TweenLite.fromTo(obj, 1, {x:"+=100"}, {x:"-= 100"}), for example, would actually jump to +=200 because the startAt would run twice, doubling the relative change. this._startAt.kill(); } startVars = {}; for (p in v.startAt) { //copy the properties/values into a new object to avoid collisions, like var to = {x:0}, from = {x:500 }; timeline.fromTo(e, 1, from, to).fromTo(e, 1, to, from); startVars[p] = v.startAt[p]; } startVars.overwrite = false; startVars.immediateRender = true; startVars.lazy = (immediate && v.lazy !== false); startVars.startAt = startVars.delay = null; //no nesting of startAt objects allowed (otherwise it could cause an infinite loop ). this._startAt = TweenLite.to(this.target, 0, startVars); if (immediate) { if (this._time > 0) { this._startAt = null; //tweens that render immediately (like most from() and fromTo() tweens) shouldn't revert when their parent timeline's playhead goes backward past the startTime because the initial render could have happened anytime and it shouldn 't be directly correlated to this tween's startTime. Imagine setting up a complex animation where the beginning states of various objects are rendered immediately but the tween doesn't happen for quite some time - if we revert to the starting values as soon as the playhead goes backward past the tween's startTime, it will throw things off visually. Reversion should only happen in TimelineLite /Max instances where immediateRender was false (which is the default in the convenience methods like from()). } else if (dur !== 0) { return; //we skip initialization here so that overwriting doesn't occur until the tween actually begins. Otherwise, if you create several immediateRender:true tweens of the same target/properties to drop into a TimelineLite or TimelineMax, the last one created would overwrite the first ones because they didn't get placed into the timeline yet before the first render occurs and kicks in overwriting. } } } else if (v.runBackwards && dur !== 0) { //from() tweens must be handled uniquely: their beginning values must be rendered but we don't want overwriting to occur yet (when time is still 0). Wait until the tween actually begins before doing all the routines like overwriting. At that time, we should render at the END of the tween to ensure that things initialize correctly (remember, from() tweens go backwards) if (this._startAt) { this._startAt.render(-1, true); this._startAt.kill(); this._startAt = null; } else { if (this._time !== 0) { //in rare cases (like if a from() tween runs and then is invalidate()-ed), immediateRender could be true but the initial forced-render gets skipped, so there's no need to force the render in this context when the _time is greater than 0 immediate = false; } pt = {}; for (p in v) { //copy props into a new object and skip any reserved props, otherwise onComplete or onUpdate or onStart could fire. We should, however, permit autoCSS to go through. if (!_reservedProps[p] || p === "autoCSS") { pt[p] = v[p]; } } pt.overwrite = 0; pt.data = "isFromStart"; //we tag the tween with as "isFromStart" so that if [inside a plugin] we need to only do something at the very END of a tween, we have a way of identifying this tween as merely the one that's setting the beginning values for a "from()" tween. For example, clearProps in CSSPlugin should only get applied at the very END of a tween and without this tag, from (...{height:100, clearProps:"height", delay:1}) would wi ...
...
}
pt.overwrite = 0;
pt.data = "isFromStart"; //we tag the tween with as "isFromStart" so that if [inside a plugin] we need
to only do something at the very END of a tween, we have a way of identifying this tween as merely the one that's setting the
beginning values for a "from()" tween. For example, clearProps in CSSPlugin should only get applied at the very END of
a tween and without this tag, from(...{height:100, clearProps:"height", delay:1}) would wipe the height at the beginning
of the tween and after 1 second, it'd kick back in.
pt.lazy = (immediate && v.lazy !== false);
pt.immediateRender = immediate; //zero-duration tweens render immediately by default, but if we're not specifically instructed
to render this tween immediately, we should skip this and merely _init() to record the starting values (rendering them immediately
would push them to completion which is wasteful in that case - we'd have to render(-1) immediately after)
this._startAt = TweenLite.to(this.target, 0, pt);
if (!immediate) {
this._startAt._init(); //ensures that the initial values are recorded
this._startAt._enabled(false); //no need to have the tween render on the next cycle. Disable it because we'll always
manually control the renders of the _startAt tween.
if (this.vars.immediateRender) {
this._startAt = null;
}
} else if (this._time === 0) {
return;
}
...
_initProps = function (target, propLookup, siblings, overwrittenProps, index) { var p, i, initPlugins, plugin, pt, v; if (target == null) { return false; } if (_lazyLookup[target._gsTweenID]) { _lazyRender(); //if other tweens of the same target have recently initted but haven't rendered yet, we've got to force the render so that the starting values are correct (imagine populating a timeline with a bunch of sequential tweens and then jumping to the end) } if (!this.vars.css) if (target.style) if (target !== window && target.nodeType) if (_plugins.css) if (this.vars.autoCSS !== false ) { //it's so common to use TweenLite/Max to animate the css of DOM elements, we assume that if the target is a DOM element, that 's what is intended (a convenience so that users don't have to wrap things in css:{}, although we still recommend it for a slight performance boost and better specificity). Note: we cannot check "nodeType" on the window inside an iframe. _autoCSS(this.vars, target); } for (p in this.vars) { v = this.vars[p]; if (_reservedProps[p]) { if (v) if ((v instanceof Array) || (v.push && _isArray(v))) if (v.join("").indexOf("{self}") !== -1) { this.vars[p] = v = this._swapSelfInParams(v, this); } } else if (_plugins[p] && (plugin = new _plugins[p]())._onInitTween(target, this.vars[p], this, index)) { //t - target [object] //p - property [string] //s - start [number] //c - change [number] //f - isFunction [boolean] //n - name [string] //pg - isPlugin [boolean] //pr - priority [number] //m - mod [function | 0] this._firstPT = pt = {_next:this._firstPT, t:plugin, p:"setRatio", s:0, c:1, f:1, n:p, pg:1, pr:plugin._priority, m:0}; i = plugin._overwriteProps.length; while (--i > -1) { propLookup[plugin._overwriteProps[i]] = this._firstPT; } if (plugin._priority || plugin._onInitAllProps) { initPlugins = true; } if (plugin._onDisable || plugin._onEnable) { this._notifyPluginsOfEnabled = true; } if (pt._next) { pt._next._prev = pt; } } else { propLookup[p] = _addPropTween.call(this, target, p, "get", v, p, 0, null, this.vars.stringFilter, index); } } if (overwrittenProps) if (this._kill(overwrittenProps, target)) { //another tween may have tried to overwrite properties of this tween before init() was called (like if two tweens start at the same time, the one created second will run first) return this._initProps(target, propLookup, siblings, overwrittenProps, index); } if (this._overwrite > 1) if (this._firstPT) if (siblings.length > 1) if (_applyOverwrite(target, this, propLookup, this._overwrite , siblings)) { this._kill(propLookup, target); return this._initProps(target, propLookup, siblings, overwrittenProps, index); } if (this._firstPT) if ((this.vars.lazy !== false && this._duration) || (this.vars.lazy && !this._duration)) { //zero duration tweens don't lazy render by default; everything else does. _lazyLookup[target._gsTweenID] = true; } return initPlugins; }
...
this._easeType = this._ease._type;
this._easePower = this._ease._power;
this._firstPT = null;
if (this._targets) {
l = this._targets.length;
for (i = 0; i < l; i++) {
if ( this._initProps( this._targets[i], (this._propLookup[i] = {}), this._siblings
[i], (op ? op[i] : null), i) ) {
initPlugins = true;
}
}
} else {
initPlugins = this._initProps(this.target, this._propLookup, this._siblings, op, 0);
}
...
_kill = function (vars, target, overwritingTween) { if (vars === "all") { vars = null; } if (vars == null) if (target == null || target === this.target) { this._lazy = false; return this._enabled(false, false); } target = (typeof(target) !== "string") ? (target || this._targets || this.target) : TweenLite.selector(target) || target; var simultaneousOverwrite = (overwritingTween && this._time && overwritingTween._startTime === this._startTime && this._timeline === overwritingTween._timeline), i, overwrittenProps, p, pt, propLookup, changed, killProps, record, killed; if ((_isArray(target) || _isSelector(target)) && typeof(target[0]) !== "number") { i = target.length; while (--i > -1) { if (this._kill(vars, target[i], overwritingTween)) { changed = true; } } } else { if (this._targets) { i = this._targets.length; while (--i > -1) { if (target === this._targets[i]) { propLookup = this._propLookup[i] || {}; this._overwrittenProps = this._overwrittenProps || []; overwrittenProps = this._overwrittenProps[i] = vars ? this._overwrittenProps[i] || {} : "all"; break; } } } else if (target !== this.target) { return false; } else { propLookup = this._propLookup; overwrittenProps = this._overwrittenProps = vars ? this._overwrittenProps || {} : "all"; } if (propLookup) { killProps = vars || propLookup; record = (vars !== overwrittenProps && overwrittenProps !== "all" && vars !== propLookup && (typeof(vars) !== "object" || ! vars._tempKill)); //_tempKill is a super-secret way to delete a particular tweening property but NOT have it remembered as an official overwritten property (like in BezierPlugin) if (overwritingTween && (TweenLite.onOverwrite || this.vars.onOverwrite)) { for (p in killProps) { if (propLookup[p]) { if (!killed) { killed = []; } killed.push(p); } } if ((killed || !vars) && !_onOverwrite(this, overwritingTween, target, killed)) { //if the onOverwrite returned false, that means the user wants to override the overwriting (cancel it). return false; } } for (p in killProps) { if ((pt = propLookup[p])) { if (simultaneousOverwrite) { //if another tween overwrites this one and they both start at exactly the same time, yet this tween has already rendered once (for example, at 0.001) because it's first in the queue, we should revert the values to where they were at 0 so that the starting values aren't contaminated on the overwriting tween. if (pt.f) { pt.t[pt.p](pt.s); } else { pt.t[pt.p] = pt.s; } changed = true; } if (pt.pg && pt.t._kill(killProps)) { changed = true; //some plugins need to be notified so they can perform cleanup tasks first } if (!pt.pg || pt.t._overwriteProps.length === 0) { if (pt._prev) { pt._prev._next = pt._next; } else if (pt === this._firstPT) { this._firstPT = pt._next; } if (pt._next) { pt._next._prev = pt._prev; } pt._next = pt._prev = null; } delete propLookup[p]; } if (record) { overwrittenProps[p] = 1; } } if (!this._firstPT && this._initted) { //if all tweening properties are killed, kill the tween. Without this line, if there 's a tween with multiple targets and then you killTweensOf() each target individually, the tween would technically still remain active and fire its onComplete even though there aren't any more properties tweening. this._enabled(false, false); } } } return changed; }
...
prev._next = pt._next;
}
} else {
prev = pt;
}
pt = pt._next;
}
return this._super._kill(lookup);
};
}); if (_gsScope._gsDefine) { _gsScope._gsQueue.pop()(); }
//export to AMD/RequireJS and CommonJS/Node (precursor to full modular build system coming at a later date)
(function(name) {
"use strict";
...
constructor = function (target, duration, vars) { Animation.call(this, duration, vars); this.render = TweenLite.prototype.render; //speed optimization (avoid prototype lookup on this "hot" method) if (target == null) { throw "Cannot tween a null target."; } this.target = target = (typeof(target) !== "string") ? target : TweenLite.selector(target) || target; var isSelector = (target.jquery || (target.length && target !== window && target[0] && (target[0] === window || (target[0].nodeType && target[0].style && !target.nodeType)))), overwrite = this.vars.overwrite, i, targ, targets; this._overwrite = overwrite = (overwrite == null) ? _overwriteLookup[TweenLite.defaultOverwrite] : (typeof(overwrite) === "number ") ? overwrite >> 0 : _overwriteLookup[overwrite]; if ((isSelector || target instanceof Array || (target.push && _isArray(target))) && typeof(target[0]) !== "number") { this._targets = targets = _slice(target); //don't use Array.prototype.slice.call(target, 0) because that doesn't work in IE8 with a NodeList that's returned by querySelectorAll() this._propLookup = []; this._siblings = []; for (i = 0; i < targets.length; i++) { targ = targets[i]; if (!targ) { targets.splice(i--, 1); continue; } else if (typeof(targ) === "string") { targ = targets[i--] = TweenLite.selector(targ); //in case it's an array of strings if (typeof(targ) === "string") { targets.splice(i+1, 1); //to avoid an endless loop (can't imagine why the selector would return a string, but just in case ) } continue; } else if (targ.length && targ !== window && targ[0] && (targ[0] === window || (targ[0].nodeType && targ[0].style && !targ .nodeType))) { //in case the user is passing in an array of selector objects (like jQuery objects), we need to check one more level and pull things out if necessary. Also note that <select> elements pass all the criteria regarding length and the first child having style, so we must also check to ensure the target isn't an HTML node itself. targets.splice(i--, 1); this._targets = targets = targets.concat(_slice(targ)); continue; } this._siblings[i] = _register(targ, this, false); if (overwrite === 1) if (this._siblings[i].length > 1) { _applyOverwrite(targ, this, null, 1, this._siblings[i]); } } } else { this._propLookup = {}; this._siblings = _register(target, this, false); if (overwrite === 1) if (this._siblings.length > 1) { _applyOverwrite(target, this, null, 1, this._siblings); } } if (this.vars.immediateRender || (duration === 0 && this._delay === 0 && this.vars.immediateRender !== false)) { this._time = -_tinyNum; //forces a render without having to set the render() "force" parameter to true because we want to allow lazying by default (using the "force" parameter always forces an immediate full render) this.render(Math.min(0, -this._delay)); //in case delay is negative } }
n/a
invalidate = function () { if (this._notifyPluginsOfEnabled) { TweenLite._onPluginEvent("_onDisable", this); } this._firstPT = this._overwrittenProps = this._startAt = this._onUpdate = null; this._notifyPluginsOfEnabled = this._active = this._lazy = false; this._propLookup = (this._targets) ? {} : []; Animation.prototype.invalidate.call(this); if (this.vars.immediateRender) { this._time = -_tinyNum; //forces a render without having to set the render() "force" parameter to true because we want to allow lazying by default (using the "force" parameter always forces an immediate full render) this.render(Math.min(0, -this._delay)); //in case delay is negative. } return this; }
...
}
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) {
...
render = function (time, suppressEvents, force) { var prevTime = this._time, duration = this._duration, prevRawPrevTime = this._rawPrevTime, isComplete, callback, pt, rawPrevTime; if (time >= duration - 0.0000001 && time >= 0) { //to work around occasional floating point math artifacts. this._totalTime = this._time = duration; this.ratio = this._ease._calcEnd ? this._ease.getRatio(1) : 1; if (!this._reversed ) { isComplete = true; callback = "onComplete"; force = (force || this._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 (this._initted || !this.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 (this._startTime === this._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 >= -0.0000001) || (prevRawPrevTime === _tinyNum && this.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"; } } this._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 < 0.0000001) { //to work around occasional floating point math artifacts, round super small values to 0. this._totalTime = this._time = 0; this.ratio = this._ease._calcEnd ? this._ease.getRatio(0) : 0; if (prevTime !== 0 || (duration === 0 && prevRawPrevTime > 0)) { callback = "onReverseComplete"; isComplete = this._reversed; } if (time < 0) { this._active = false; if (duration === 0) if (this._initted || !this.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 v ...
...
b = [],
e = [],
targets = [],
_reservedProps = TweenLite._internals.reservedProps,
i, difs, p, from;
target = tween._targets || tween.target;
_getChildStyles(target, b, targets);
tween.render(duration, true, true);
_getChildStyles(target, e);
tween.render(0, true, true);
tween._enabled(true);
i = targets.length;
while (--i > -1) {
difs = _cssDif(targets[i], b[i], e[i]);
if (difs.firstMPT) {
...
TweenMax = function (target, duration, vars) { TweenLite.call(this, target, duration, vars); this._cycle = 0; this._yoyo = (this.vars.yoyo === true); this._repeat = this.vars.repeat || 0; this._repeatDelay = this.vars.repeatDelay || 0; this._dirty = 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) }
n/a
BackIn = function (overshoot) { this._p1 = (overshoot || overshoot === 0) ? overshoot : 1.70158; this._p2 = this._p1 * 1.525; }
n/a
BackInOut = function (overshoot) { this._p1 = (overshoot || overshoot === 0) ? overshoot : 1.70158; this._p2 = this._p1 * 1.525; }
n/a
BackOut = function (overshoot) { this._p1 = (overshoot || overshoot === 0) ? overshoot : 1.70158; this._p2 = this._p1 * 1.525; }
n/a
BezierPlugin = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
BounceIn = function (){}
n/a
BounceInOut = function (){}
n/a
BounceOut = function (){}
n/a
CSSPlugin = function () { TweenPlugin.call(this, "css"); this._overwriteProps.length = 0; this.setRatio = CSSPlugin.prototype.setRatio; //speed optimization (avoid prototype lookup on this "hot" method) }
n/a
CSSRulePlugin = function () { TweenPlugin.call(this, "cssRule"); this._overwriteProps.length = 0; }
n/a
CircIn = function (){}
n/a
CircInOut = function (){}
n/a
CircOut = function (){}
n/a
ColorPropsPlugin = function () { TweenPlugin.call(this, propName, priority); this._overwriteProps = overwriteProps || []; }
n/a
Cubic = function () {}
n/a
Ease = function (func, extraParams, type, power) { this._func = func; this._type = type || 0; this._power = power || 0; this._params = extraParams ? _baseParams.concat(extraParams) : _baseParams; }
n/a
ElasticIn = 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 }
n/a
ElasticInOut = 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 }
n/a
ElasticOut = 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 }
n/a
ExpoIn = function (){}
n/a
ExpoInOut = function (){}
n/a
ExpoOut = function (){}
n/a
Linear = function () {}
n/a
Power0 = function () {}
n/a
Power1 = function () {}
n/a
Power2 = function () {}
n/a
Power3 = function () {}
n/a
Power4 = function () {}
n/a
Quad = function () {}
n/a
Quart = function () {}
n/a
Quint = function () {}
n/a
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); }
n/a
SineIn = function (){}
n/a
SineInOut = function (){}
n/a
SineOut = function (){}
n/a
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); }
n/a
SteppedEase = function (steps) { steps = steps || 1; this._p1 = 1 / steps; this._p2 = steps + 1; }
n/a
Strong = function () {}
n/a
TimelineLite = function (vars) { SimpleTimeline.call(this, vars); this._labels = {}; this.autoRemoveChildren = (this.vars.autoRemoveChildren === true); this.smoothChildTiming = (this.vars.smoothChildTiming === true); this._sortChildren = true; this._onUpdate = this.vars.onUpdate; var v = this.vars, val, p; for (p in v) { val = v[p]; if (_isArray(val)) if (val.join("").indexOf("{self}") !== -1) { v[p] = this._swapSelfInParams(val); } } if (_isArray(v.tweens)) { this.add(v.tweens, 0, v.align, v.stagger); } }
n/a
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 === true); this._dirty = true; }
n/a
TweenLite = function (target, duration, vars) { Animation.call(this, duration, vars); this.render = TweenLite.prototype.render; //speed optimization (avoid prototype lookup on this "hot" method) if (target == null) { throw "Cannot tween a null target."; } this.target = target = (typeof(target) !== "string") ? target : TweenLite.selector(target) || target; var isSelector = (target.jquery || (target.length && target !== window && target[0] && (target[0] === window || (target[0].nodeType && target[0].style && !target.nodeType)))), overwrite = this.vars.overwrite, i, targ, targets; this._overwrite = overwrite = (overwrite == null) ? _overwriteLookup[TweenLite.defaultOverwrite] : (typeof(overwrite) === "number ") ? overwrite >> 0 : _overwriteLookup[overwrite]; if ((isSelector || target instanceof Array || (target.push && _isArray(target))) && typeof(target[0]) !== "number") { this._targets = targets = _slice(target); //don't use Array.prototype.slice.call(target, 0) because that doesn't work in IE8 with a NodeList that's returned by querySelectorAll() this._propLookup = []; this._siblings = []; for (i = 0; i < targets.length; i++) { targ = targets[i]; if (!targ) { targets.splice(i--, 1); continue; } else if (typeof(targ) === "string") { targ = targets[i--] = TweenLite.selector(targ); //in case it's an array of strings if (typeof(targ) === "string") { targets.splice(i+1, 1); //to avoid an endless loop (can't imagine why the selector would return a string, but just in case ) } continue; } else if (targ.length && targ !== window && targ[0] && (targ[0] === window || (targ[0].nodeType && targ[0].style && !targ .nodeType))) { //in case the user is passing in an array of selector objects (like jQuery objects), we need to check one more level and pull things out if necessary. Also note that <select> elements pass all the criteria regarding length and the first child having style, so we must also check to ensure the target isn't an HTML node itself. targets.splice(i--, 1); this._targets = targets = targets.concat(_slice(targ)); continue; } this._siblings[i] = _register(targ, this, false); if (overwrite === 1) if (this._siblings[i].length > 1) { _applyOverwrite(targ, this, null, 1, this._siblings[i]); } } } else { this._propLookup = {}; this._siblings = _register(target, this, false); if (overwrite === 1) if (this._siblings.length > 1) { _applyOverwrite(target, this, null, 1, this._siblings); } } if (this.vars.immediateRender || (duration === 0 && this._delay === 0 && this.vars.immediateRender !== false)) { this._time = -_tinyNum; //forces a render without having to set the render() "force" parameter to true because we want to allow lazying by default (using the "force" parameter always forces an immediate full render) this.render(Math.min(0, -this._delay)); //in case delay is negative } }
n/a
TweenPlugin = function (props, priority) { this._overwriteProps = (props || "").split(","); this._propName = this._overwriteProps[0]; this._priority = priority || 0; this._super = TweenPlugin.prototype; }
n/a
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); }
n/a
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); }
n/a
allTo = function (targets, duration, vars, stagger, onCompleteAll, onCompleteAllParams, onCompleteAllScope) { stagger = stagger || 0; var delay = 0, a = [], finalComplete = function() { if (vars.onComplete) { vars.onComplete.apply(vars.onCompleteScope || this, arguments); } onCompleteAll.apply(onCompleteAllScope || vars.callbackScope || this, onCompleteAllParams || _blankArray); }, cycle = vars.cycle, fromCycle = (vars.startAt && vars.startAt.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 || []; if (stagger < 0) { targets = _slice(targets); targets.reverse(); stagger *= -1; } 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 = delay + (copy.delay || 0); if (i === l && onCompleteAll) { copy.onComplete = finalComplete; } a[i] = new TweenMax(targets[i], duration, copy); delay += stagger; } return a; }
n/a
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}); }
...
}
}
//DEBUG: _log("parsed rotation of " + t.getAttribute("id")+": "+(tm.rotationX)+", "+(
tm.rotationY)+", "+(tm.rotation)+", scale: "+tm.scaleX+", "+tm.scaleY+", "+tm.scaleZ+"
;, position: "+tm.x+", "+tm.y+", "+tm.z+", perspective: "+tm.perspective+ ", origin: "
;+ tm.xOrigin+ ","+ tm.yOrigin);
if (rec) {
t._gsTransform = tm; //record to the object's _gsTransform which we use so that tweens can control individual properties
independently (we need all the properties to accurately recompose the matrix in the setRatio() method)
if (tm.svg) { //if we're supposed to apply transforms to the SVG element's "transform" attribute, make
sure there aren't any CSS transforms applied or they'll override the attribute ones. Also clear the transform attribute
if we're using CSS, just to be clean.
if (_useSVGTransformAttr && t.style[_transformProp]) {
TweenLite.delayedCall(0.001, function(){ //if we apply this right away (before
anything has rendered), we risk there being no transforms for a brief moment and it also interferes with adjusting the transformOrigin
in a tween with immediateRender:true (it'd try reading the matrix and it wouldn't have the appropriate data in place
because we just removed it).
_removeProp(t.style, _transformProp);
});
} else if (!_useSVGTransformAttr && t.getAttribute("transform")) {
TweenLite.delayedCall(0.001, function(){
t.removeAttribute("transform");
});
}
...
from = function (target, duration, vars) { vars.runBackwards = true; vars.immediateRender = (vars.immediateRender != false); return new TweenMax(target, duration, vars); }
...
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, vars), position);
};
p.fromTo = function(target, duration, fromVars, toVars, position) {
var Engine = (toVars.repeat && _globals.TweenMax) || TweenLite;
return duration ? this.add( Engine.fromTo(target, duration, fromVars, toVars), position) : this.set(target, toVars, position);
};
...
fromTo = function (target, duration, fromVars, toVars) { toVars.startAt = fromVars; toVars.immediateRender = (toVars.immediateRender != false && fromVars.immediateRender != false); return new TweenMax(target, duration, toVars); }
...
}
orig = v.transformOrigin;
if (m1.svg && (orig || v.svgOrigin)) {
x = m1.xOffset; //when we change the origin, in order to prevent things from jumping we adjust the x/y so we must record those
here so that we can create PropTweens for them and flip them at the same time as the origin
y = m1.yOffset;
_parseSVGOrigin(t, _parsePosition(orig), m2, v.svgOrigin, v.smoothOrigin);
pt = _addNonTweeningNumericPT(m1, "xOrigin", (originalGSTransform ? m1 : m2).xOrigin, m2.xOrigin, pt, transformOriginString
); //note: if there wasn't a transformOrigin defined yet, just start with the destination one; it's wasteful otherwise
, and it causes problems with fromTo() tweens. For example, TweenLite.to("#wheel", 3, {rotation:180, transformOrigin:
x22;50% 50%", delay:1}); TweenLite.fromTo("#wheel", 3, {scale:0.5, transformOrigin
:"50% 50%"}, {scale:1, delay:2}); would cause a jump when the from values revert at the beginning of the 2nd tween.
pt = _addNonTweeningNumericPT(m1, "yOrigin", (originalGSTransform ? m1 : m2).yOrigin, m2.yOrigin, pt, transformOriginString
);
if (x !== m1.xOffset || y !== m1.yOffset) {
pt = _addNonTweeningNumericPT(m1, "xOffset", (originalGSTransform ? x : m1.xOffset), m1.xOffset, pt, transformOriginString
);
pt = _addNonTweeningNumericPT(m1, "yOffset", (originalGSTransform ? y : m1.yOffset), m1.yOffset, pt, transformOriginString
);
}
orig = "0px 0px"; //certain browsers (like firefox) completely botch transform-origin, so we must remove it to prevent
it from contaminating transforms. We manage it ourselves with xOrigin and yOrigin
}
...
getAllTweens = function (includeTimelines) { return _getChildrenOf(Animation._rootTimeline, includeTimelines).concat( _getChildrenOf(Animation._rootFramesTimeline, includeTimelines ) ); }
n/a
getTweensOf = function (target, onlyActive) { if (target == null) { return []; } target = (typeof(target) !== "string") ? target : TweenLite.selector(target) || target; var i, a, j, t; if ((_isArray(target) || _isSelector(target)) && typeof(target[0]) !== "number") { i = target.length; a = []; while (--i > -1) { a = a.concat(TweenLite.getTweensOf(target[i], onlyActive)); } i = a.length; //now get rid of any duplicates (tweens of arrays of objects could cause duplicates) while (--i > -1) { t = a[i]; j = i; while (--j > -1) { if (t === a[j]) { a.splice(i, 1); } } } } else { a = _register(target).concat(); i = a.length; while (--i > -1) { if (a[i]._gc || (onlyActive && !a[i].isActive())) { a.splice(i, 1); } } } return a; }
...
};
$.fn.stop = function(clearQueue, gotoEnd) {
_stop.call(this, clearQueue, gotoEnd);
if (TweenLite) {
if (gotoEnd) {
var tweens = TweenLite.getTweensOf(this),
i = tweens.length,
progress;
while (--i > -1) {
progress = tweens[i].totalTime() / tweens[i].totalDuration();
if (progress > 0 && progress < 1) {
tweens[i].seek(tweens[i].totalDuration());
}
...
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; }
n/a
isTweening = function (target) { return (TweenLite.getTweensOf(target, true).length > 0); }
n/a
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); } } } }
n/a
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); } }
...
}
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) {
...
killDelayedCallsTo = function (target, onlyActive, vars) { if (typeof(onlyActive) === "object") { vars = onlyActive; //for backwards compatibility (before "onlyActive" parameter was inserted) onlyActive = false; } var a = TweenLite.getTweensOf(target, onlyActive), i = a.length; while (--i > -1) { a[i]._kill(vars, target); } }
n/a
killTweensOf = function (target, onlyActive, vars) { if (typeof(onlyActive) === "object") { vars = onlyActive; //for backwards compatibility (before "onlyActive" parameter was inserted) onlyActive = false; } var a = TweenLite.getTweensOf(target, onlyActive), i = a.length; while (--i > -1) { a[i]._kill(vars, target); } }
...
if (!arguments.length) {
return -(element.scrollLeft + offsetLeft);
}
var dif = element.scrollLeft - prevLeft,
oldOffset = offsetLeft;
if ((dif > 2 || dif < -2) && !force) { //if the user interacts with the scrollbar (or something else scrolls
it, like the mouse wheel), we should kill any tweens of the ScrollProxy.
prevLeft = element.scrollLeft;
TweenLite.killTweensOf(this, true, {left:1, scrollLeft:1});
this.left(-prevLeft);
if (vars.onKill) {
vars.onKill();
}
return;
}
value = -value; //invert because scrolling works in the opposite direction
...
lagSmoothing = function (threshold, adjustedLag) { _ticker.lagSmoothing(threshold, adjustedLag); }
...
TweenLite.version = "1.19.1";
TweenLite.defaultEase = p._ease = new Ease(null, null, 1, 1);
TweenLite.defaultOverwrite = "auto";
TweenLite.ticker = _ticker;
TweenLite.autoSleep = 120;
TweenLite.lagSmoothing = function(threshold, adjustedLag) {
_ticker.lagSmoothing(threshold, adjustedLag);
};
TweenLite.selector = window.$ || window.jQuery || function(e) {
var selector = window.$ || window.jQuery;
if (selector) {
TweenLite.selector = selector;
return selector(e);
...
pauseAll = function (tweens, delayedCalls, timelines) { _changePause(true, tweens, delayedCalls, timelines); }
n/a
render = function () { var i, a, p; if (_lazyTweens.length) { //if code is run outside of the requestAnimationFrame loop, there may be tweens queued AFTER the engine refreshed, so we need to ensure any pending renders occur before we refresh again. _lazyRender(); } _rootTimeline.render((_ticker.time - _rootTimeline._startTime) * _rootTimeline._timeScale, false, false); _rootFramesTimeline.render((_ticker.frame - _rootFramesTimeline._startTime) * _rootFramesTimeline._timeScale, false, false); if (_lazyTweens.length) { _lazyRender(); } if (_ticker.frame >= _nextGCFrame) { //dump garbage every 120 frames or whatever the user sets TweenLite.autoSleep to _nextGCFrame = _ticker.frame + (parseInt(TweenLite.autoSleep, 10) || 120); for (p in _tweenLookup) { a = _tweenLookup[p].tweens; i = a.length; while (--i > -1) { if (a[i]._gc) { a.splice(i, 1); } } if (a.length === 0) { delete _tweenLookup[p]; } } //if there are no more tweens in the root timelines, or if they're all paused, make the _timer sleep to reduce load on the CPU slightly p = _rootTimeline._first; if (!p || p._paused) if (TweenLite.autoSleep && !_rootFramesTimeline._first && _ticker._listeners.tick.length === 1) { while (p && p._paused) { p = p._next; } if (!p) { _ticker.sleep(); } } } }
...
b = [],
e = [],
targets = [],
_reservedProps = TweenLite._internals.reservedProps,
i, difs, p, from;
target = tween._targets || tween.target;
_getChildStyles(target, b, targets);
tween.render(duration, true, true);
_getChildStyles(target, e);
tween.render(0, true, true);
tween._enabled(true);
i = targets.length;
while (--i > -1) {
difs = _cssDif(targets[i], b[i], e[i]);
if (difs.firstMPT) {
...
resumeAll = function (tweens, delayedCalls, timelines) { _changePause(false, tweens, delayedCalls, timelines); }
n/a
set = function (target, vars) { return new TweenMax(target, 0, vars); }
...
var _gsScope = (typeof(module) !== "undefined" && module.exports && typeof(global) !== "undefined
") ? global : this || window; //helps ensure compatibility with AMD/RequireJS and CommonJS/Node
(_gsScope._gsQueue || (_gsScope._gsQueue = [])).push( function() {
"use strict";
_gsScope._gsDefine("utils.Draggable", ["events.EventDispatcher","TweenLite","plugins.CSSPlugin
"], function(EventDispatcher, TweenLite, CSSPlugin) {
var _tempVarsXY = {css:{}}, //speed optimization - we reuse the same vars object for x/y TweenLite.set() calls to minimize garbage collection tasks and improve performance.
_tempVarsX = {css:{}},
_tempVarsY = {css:{}},
_tempVarsRotation = {css:{}},
_globals = _gsScope._gsDefine.globals,
_tempEvent = {}, //for populating with pageX/pageY in old versions of IE
_dummyElement = {style:{}},
_doc = _gsScope.document || {createElement: function() {return _dummyElement;}},
...
staggerFrom = 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); }
n/a
staggerFromTo = 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); }
n/a
staggerTo = function (targets, duration, vars, stagger, onCompleteAll, onCompleteAllParams, onCompleteAllScope) { stagger = stagger || 0; var delay = 0, a = [], finalComplete = function() { if (vars.onComplete) { vars.onComplete.apply(vars.onCompleteScope || this, arguments); } onCompleteAll.apply(onCompleteAllScope || vars.callbackScope || this, onCompleteAllParams || _blankArray); }, cycle = vars.cycle, fromCycle = (vars.startAt && vars.startAt.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 || []; if (stagger < 0) { targets = _slice(targets); targets.reverse(); stagger *= -1; } 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 = delay + (copy.delay || 0); if (i === l && onCompleteAll) { copy.onComplete = finalComplete; } a[i] = new TweenMax(targets[i], duration, copy); delay += stagger; } return a; }
...
}
return this.add(tl, position);
};
p.staggerFrom = function(targets, duration, vars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope) {
vars.immediateRender = (vars.immediateRender != false);
vars.runBackwards = true;
return this.staggerTo(targets, duration, vars, stagger, position, onCompleteAll, onCompleteAllParams
, onCompleteAllScope);
};
p.staggerFromTo = function(targets, duration, fromVars, toVars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope
) {
toVars.startAt = fromVars;
toVars.immediateRender = (toVars.immediateRender != false && fromVars.immediateRender != false);
return this.staggerTo(targets, duration, toVars, stagger, position, onCompleteAll, onCompleteAllParams, onCompleteAllScope);
};
...
to = function (target, duration, vars) { return new TweenMax(target, duration, vars); }
...
* target.style.width = (start + value * ratio) + "px";
* console.log("set width to " + target.style.width);
* }
* }, 0);
*
* Then, when I do this tween, it will trigger my special property:
*
* TweenLite.to(element, 1, {css:{myCustomProp:100}});
*
* In the example, of course, we're just changing the width, but you can do anything you want.
*
* @param {!string} name Property name (or comma-delimited list of property names) that should be intercepted and handled by your
function. For example, if I define "myCustomProp", then it would handle that portion of the following tween: TweenLite
.to(element, 1, {css:{myCustomProp:100}})
* @param {!function(Object, Object, Object, string):function(number)} onInitTween The function that will be called when a tween
of this special property is performed. The function will receive 4 parameters: 1) Target object that should be tweened, 2) Value
that was passed to the tween, 3) The tween instance itself (rarely used), and 4) The property name that's being tweened. Your
function should return a function that should be called on every update of the tween. That function will receive a single parameter
that is a "change factor" value (typically between 0 and 1) indicating the amount of change as a ratio. You can use this
to determine how to set the values appropriately in your function.
* @param {number=} priority Priority that helps the engine determine the order in which to set the properties (default: 0). Higher
priority properties will be updated before lower priority ones.
*/
...
constructor = function (target, duration, vars) { TweenLite.call(this, target, duration, vars); this._cycle = 0; this._yoyo = (this.vars.yoyo === true); this._repeat = this.vars.repeat || 0; this._repeatDelay = this.vars.repeatDelay || 0; this._dirty = 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) }
n/a
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); }
...
overshootTolerance = (!isNaN(vars.overshootTolerance)) ? vars.overshootTolerance : (vars.edgeResistance === 1) ? 0 : (1 -
self.edgeResistance) + 0.2;
self.tween = tween = ThrowPropsPlugin.to(scrollProxy || target, {throwProps:throwProps, ease:(vars.ease || _globals.Power3
.easeOut), onComplete:onThrowComplete, onOverwrite:onThrowOverwrite, onUpdate:(vars.fastMode ? _dispatchEvent : syncXY), onUpdateParams
:(vars.fastMode ? [self, "onthrowupdate", "onThrowUpdate"] : (snap && snap.radius) ? [false, true] :
_emptyArray)}, (isNaN(vars.maxDuration) ? 2 : vars.maxDuration), (!isNaN(vars.minDuration) ? vars.minDuration : (overshootTolerance
=== 0) ? 0 : 0.5), overshootTolerance);
if (!vars.fastMode) {
//to populate the end values, we just scrub the tween to the end, record the values, and then jump back to the beginning
.
if (scrollProxy) {
scrollProxy._suspendTransforms = true; //Microsoft browsers have a bug that causes them to briefly render the position
incorrectly (it flashes to the end state when we seek() the tween even though we jump right back to the current position, and this
only seems to happen when we're affecting both top and left), so we set a _suspendTransforms flag to prevent it from actually
applying the values in the ScrollProxy.
}
tween.render(tween.duration(), true, true);
syncXY(true, true);
self.endX = self.x;
self.endY = self.y;
if (rotationMode) {
self.endRotation = self.x;
}
tween.play(0);
...
invalidate = function () { this._yoyo = (this.vars.yoyo === true); this._repeat = this.vars.repeat || 0; this._repeatDelay = this.vars.repeatDelay || 0; this._uncache(true); return TweenLite.prototype.invalidate.call(this); }
...
}
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) {
...
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); }
n/a
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 totalDur = (!this._dirty) ? this._totalDuration : this.totalDuration(), prevTime = this._time, prevTotalTime = this._totalTime, prevCycle = this._cycle, duration = this._duration, prevRawPrevTime = this._rawPrevTime, isComplete, callback, pt, cycleDuration, r, type, pow, rawPrevTime; if (time >= totalDur - 0.0000001 && time >= 0) { //to work around occasional floating point math artifacts. this._totalTime = totalDur; this._cycle = this._repeat; if (this._yoyo && (this._cycle & 1) !== 0) { this._time = 0; this.ratio = this._ease._calcEnd ? this._ease.getRatio(0) : 0; } else { this._time = duration; this.ratio = this._ease._calcEnd ? this._ease.getRatio(1) : 1; } if (!this._reversed) { isComplete = true; callback = "onComplete"; force = (force || this._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 (this._initted || !this.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 (this._startTime === this._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 >= -0.0000001) || (prevRawPrevTime === _tinyNum && this.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"; } } this._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 i ...
...
b = [],
e = [],
targets = [],
_reservedProps = TweenLite._internals.reservedProps,
i, difs, p, from;
target = tween._targets || tween.target;
_getChildStyles(target, b, targets);
tween.render(duration, true, true);
_getChildStyles(target, e);
tween.render(0, true, true);
tween._enabled(true);
i = targets.length;
while (--i > -1) {
difs = _cssDif(targets[i], b[i], e[i]);
if (difs.firstMPT) {
...
repeat = function (value) { if (!arguments.length) { return this._repeat; } this._repeat = value; return this._uncache(true); }
n/a
repeatDelay = function (value) { if (!arguments.length) { return this._repeatDelay; } this._repeatDelay = value; return this._uncache(true); }
n/a
time = function (value, suppressEvents) { if (!arguments.length) { return this._time; } if (this._dirty) { this.totalDuration(); } if (value > this._duration) { value = this._duration; } if (this._yoyo && (this._cycle & 1) !== 0) { value = (this._duration - value) + (this._cycle * (this._duration + this._repeatDelay)); } else if (this._repeat !== 0) { value += this._cycle * (this._duration + this._repeatDelay); } return this.totalTime(value, suppressEvents); }
...
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);
...
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) ); }
...
_stop.call(this, clearQueue, gotoEnd);
if (TweenLite) {
if (gotoEnd) {
var tweens = TweenLite.getTweensOf(this),
i = tweens.length,
progress;
while (--i > -1) {
progress = tweens[i].totalTime() / tweens[i].totalDuration();
if (progress > 0 && progress < 1) {
tweens[i].seek(tweens[i].totalDuration());
}
}
}
TweenLite.killTweensOf(this);
}
...
totalProgress = function (value, suppressEvents) { return (!arguments.length) ? this._totalTime / this.totalDuration() : this.totalTime( this.totalDuration() * value, suppressEvents ); }
...
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);
...
updateTo = function (vars, resetDuration) { var curRatio = this.ratio, immediate = this.vars.immediateRender || vars.immediateRender, p; if (resetDuration && this._startTime < this._timeline._time) { this._startTime = this._timeline._time; this._uncache(false); if (this._gc) { this._enabled(true, false); } else { this._timeline.insert(this, this._startTime - this._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) { this.vars[p] = vars[p]; } if (this._initted || immediate) { if (resetDuration) { this._initted = false; if (immediate) { this.render(0, true, true); } } else { if (this._gc) { this._enabled(true, false); } if (this._notifyPluginsOfEnabled && this._firstPT) { TweenLite._onPluginEvent("_onDisable", this); //in case a plugin like MotionBlur must perform some cleanup tasks } if (this._time / this._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 = this._totalTime; this.render(0, true, false); this._initted = false; this.render(prevTime, true, false); } else { this._initted = false; this._init(); if (this._time > 0 || immediate) { var inv = 1 / (1 - curRatio), pt = this._firstPT, endValue; while (pt) { endValue = pt.s + pt.c; pt.c *= inv; pt.s = endValue - pt.c; pt = pt._next; } } } } } return this; }
n/a
yoyo = function (value) { if (!arguments.length) { return this._yoyo; } this._yoyo = value; return this; }
n/a
TweenPlugin = function (props, priority) { this._overwriteProps = (props || "").split(","); this._propName = this._overwriteProps[0]; this._priority = priority || 0; this._super = TweenPlugin.prototype; }
n/a
activate = function (plugins) { var i = plugins.length; while (--i > -1) { if (plugins[i].API === TweenPlugin.API) { _plugins[(new plugins[i]())._propName] = plugins[i]; } } return true; }
...
}
results.push(TweenLite.fromTo(targets[i], duration, from, difs));
}
}
return results;
};
TweenPlugin.activate([CSSPlugin]);
return CSSPlugin;
}, true);
}); if (_gsScope._gsDefine) { _gsScope._gsQueue.pop()(); }
//export to AMD/RequireJS and CommonJS/Node (precursor to full modular build system coming at a later date)
...
_addTween = function (target, prop, start, end, overwriteProp, mod, funcParam, stringFilter, index) { if (typeof(end) === "function") { end = end(index || 0, target); } var type = typeof(target[prop]), getterName = (type !== "function") ? "" : ((prop.indexOf("set") || typeof(target["get" + prop.substr(3)]) !== "function") ? prop : "get" + prop.substr(3)), s = (start !== "get") ? start : !getterName ? target[prop] : funcParam ? target[getterName](funcParam) : target[getterName](), isRelative = (typeof(end) === "string" && end.charAt(1) === "="), pt = {t:target, p:prop, s:s, f:(type === "function"), pg:0, n:overwriteProp || prop, m:(!mod ? 0 : (typeof(mod) === "function ") ? mod : Math.round), pr:0, c:isRelative ? parseInt(end.charAt(0) + "1", 10) * parseFloat(end.substr(2)) : (parseFloat(end) - s) || 0}, blob; if (typeof(s) !== "number" || (typeof(end) !== "number" && !isRelative)) { if (funcParam || isNaN(s) || (!isRelative && isNaN(end)) || typeof(s) === "boolean" || typeof(end) === "boolean") { //a blob (string that has multiple numbers in it) pt.fp = funcParam; blob = _blobDif(s, (isRelative ? pt.s + pt.c : end), stringFilter || TweenLite.defaultStringFilter, pt); pt = {t: blob, p: "setRatio", s: 0, c: 1, f: 2, pg: 0, n: overwriteProp || prop, pr: 0, m: 0}; //"2" indicates it's a Blob property tween. Needed for RoundPropsPlugin for example. } else { pt.s = parseFloat(s); if (!isRelative) { pt.c = (parseFloat(end) - pt.s) || 0; } } } if (pt.c) { //only add it to the linked list if there's a change. if ((pt._next = this._firstPT)) { pt._next._prev = pt; } this._firstPT = pt; return pt; } }
...
return false;
}
for (p in value) {
end = value[p];
if (typeof(end) === "function") {
end = end(index, target);
}
this._addTween(target, "setAttribute", target.getAttribute(p) + "
x22;, end + "", p, false, p);
this._overwriteProps.push(p);
}
return true;
}
});
...
_kill = function (lookup) { var a = this._overwriteProps, pt = this._firstPT, i; if (lookup[this._propName] != null) { this._overwriteProps = []; } else { i = a.length; while (--i > -1) { if (lookup[a[i]] != null) { a.splice(i, 1); } } } while (pt) { if (lookup[pt.n] != null) { if (pt._next) { pt._next._prev = pt._prev; } if (pt._prev) { pt._prev._next = pt._next; pt._prev = null; } else if (this._firstPT === pt) { this._firstPT = pt._next; } } pt = pt._next; } return false; }
...
prev._next = pt._next;
}
} else {
prev = pt;
}
pt = pt._next;
}
return this._super._kill(lookup);
};
}); if (_gsScope._gsDefine) { _gsScope._gsQueue.pop()(); }
//export to AMD/RequireJS and CommonJS/Node (precursor to full modular build system coming at a later date)
(function(name) {
"use strict";
...
_mod = function (lookup) { var pt = this._firstPT, val; while (pt) { val = lookup[this._propName] || (pt.n != null && lookup[ pt.n.split(this._propName + "_").join("") ]); if (val && typeof(val) === "function") { //some properties that are very plugin-specific add a prefix named after the _propName plus an underscore, so we need to ignore that extra stuff here. if (pt.f === 2) { pt.t._applyPT.m = val; } else { pt.m = val; } } pt = pt._next; } }
...
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._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;
} else {
this._add(pt.t, pt.p, pt.s, pt.c, val);
//remove from linked list
...
_roundProps = function (lookup) { var pt = this._firstPT, val; while (pt) { val = lookup[this._propName] || (pt.n != null && lookup[ pt.n.split(this._propName + "_").join("") ]); if (val && typeof(val) === "function") { //some properties that are very plugin-specific add a prefix named after the _propName plus an underscore, so we need to ignore that extra stuff here. if (pt.f === 2) { pt.t._applyPT.m = val; } else { pt.m = val; } } pt = pt._next; } }
n/a
setRatio = function (v) { var pt = this._firstPT, min = 0.000001, val; while (pt) { val = !pt.blob ? pt.c * v + pt.s : (v === 1) ? this.end : v ? this.join("") : this.start; if (pt.m) { val = pt.m(val, this._target || pt.t); } else if (val < min) if (val > -min && !pt.blob) { //prevents issues with converting very small numbers to strings in the browser val = 0; } if (!pt.f) { pt.t[pt.p] = val; } else if (pt.fp) { pt.t[pt.p](pt.fp, val); } else { pt.t[pt.p](val); } pt = pt._next; } }
...
}
return cssp.parse(t, vars, pt, plugin);
};
},
// @private used when other plugins must tween values first, like BezierPlugin or ThrowPropsPlugin, etc. That plugin's setRatio
() gets called first so that the values are updated, and then we loop through the MiniPropTweens which handle copying the values
into their appropriate slots so that they can then be applied correctly in the main CSSPlugin setRatio() method. Remember, we typically
create a proxy object that has a bunch of uniquely-named properties that we feed to the sub-plugin and it does its magic normally
, and then we must interpret those values and apply them to the css because often numbers must get combined/concatenated, suffixes
added, etc. to work with css, like boxShadow could have 4 values plus a color.
_setPluginRatio = _internals._setPluginRatio = function(v) {
this.plugin.setRatio(v);
var d = this.data,
proxy = d.proxy,
mpt = d.firstMPT,
min = 0.000001,
val, pt, i, str, p;
while (mpt) {
val = proxy[mpt.v];
...
fps = function (value) { if (!arguments.length) { return _fps; } _fps = value; _gap = 1 / (_fps || 60); _nextTime = this.time + _gap; _self.wake(); }
...
_self.useRAF = function(value) {
if (!arguments.length) {
return _useRAF;
}
_self.sleep();
_useRAF = value;
_self.fps(_fps);
};
_self.fps(fps);
//a bug in iOS 6 Safari occasionally prevents the requestAnimationFrame from working initially, so we use a 1.5-second timeout
that automatically falls back to setTimeout() if it senses this condition.
setTimeout(function() {
if (_useRAF === "auto" && _self.frame < 5 && _doc.visibilityState !== "hidden") {
_self.useRAF(false);
...
lagSmoothing = function (threshold, adjustedLag) { _lagThreshold = threshold || (1 / _tinyNum); //zero should be interpreted as basically unlimited _adjustedLag = Math.min(adjustedLag, _lagThreshold, 0); }
...
TweenLite.version = "1.19.1";
TweenLite.defaultEase = p._ease = new Ease(null, null, 1, 1);
TweenLite.defaultOverwrite = "auto";
TweenLite.ticker = _ticker;
TweenLite.autoSleep = 120;
TweenLite.lagSmoothing = function(threshold, adjustedLag) {
_ticker.lagSmoothing(threshold, adjustedLag);
};
TweenLite.selector = window.$ || window.jQuery || function(e) {
var selector = window.$ || window.jQuery;
if (selector) {
TweenLite.selector = selector;
return selector(e);
...
sleep = function () { if (_id == null) { return; } if (!_useRAF || !_cancelAnimFrame) { clearTimeout(_id); } else { _cancelAnimFrame(_id); } _req = _emptyFunc; _id = null; if (_self === _ticker) { _tickerActive = false; } }
...
if (_self === _ticker) {
_tickerActive = false;
}
};
_self.wake = function(seamless) {
if (_id !== null) {
_self.sleep();
} else if (seamless) {
_startTime += -_lastUpdate + (_lastUpdate = _getTime());
} else if (_self.frame > 10) { //don't trigger lagSmoothing if we're just waking up, and make sure that at least
10 frames have elapsed because of the iOS bug that we work around below with the 1.5-second setTimout().
_lastUpdate = _getTime() - _lagThreshold + 5;
}
_req = (_fps === 0) ? _emptyFunc : (!_useRAF || !_reqAnimFrame) ? function(f) { return setTimeout(f, ((_nextTime - _self.time
) * 1000 + 1) | 0); } : _reqAnimFrame;
if (_self === _ticker) {
...
tick = function () { _tick(true); }
...
for (p in _defLookup) {
if (!_defLookup[p].func) {
window.console.log("GSAP encountered missing dependency: " + p);
}
}
}
_tickerActive = false; //ensures that the first official animation forces a ticker.tick() to update the time when it is instantiated
})((typeof(module) !== "undefined" && module.exports && typeof(global) !== "undefined") ?
global : this || window, "TweenLite");
...
useRAF = function (value) { if (!arguments.length) { return _useRAF; } _self.sleep(); _useRAF = value; _self.fps(_fps); }
...
_self.fps(_fps);
};
_self.fps(fps);
//a bug in iOS 6 Safari occasionally prevents the requestAnimationFrame from working initially, so we use a 1.5-second timeout
that automatically falls back to setTimeout() if it senses this condition.
setTimeout(function() {
if (_useRAF === "auto" && _self.frame < 5 && _doc.visibilityState !== "hidden") {
_self.useRAF(false);
}
}, 1500);
});
p = gs.Ticker.prototype = new gs.events.EventDispatcher();
p.constructor = gs.Ticker;
...
wake = function (seamless) { if (_id !== null) { _self.sleep(); } else if (seamless) { _startTime += -_lastUpdate + (_lastUpdate = _getTime()); } else if (_self.frame > 10) { //don't trigger lagSmoothing if we're just waking up, and make sure that at least 10 frames have elapsed because of the iOS bug that we work around below with the 1.5-second setTimout(). _lastUpdate = _getTime() - _lagThreshold + 5; } _req = (_fps === 0) ? _emptyFunc : (!_useRAF || !_reqAnimFrame) ? function(f) { return setTimeout(f, ((_nextTime - _self.time ) * 1000 + 1) | 0); } : _reqAnimFrame; if (_self === _ticker) { _tickerActive = true; } _tick(2); }
...
p.addEventListener = function(type, callback, scope, useParam, priority) {
priority = priority || 0;
var list = this._listeners[type],
index = 0,
listener, i;
if (this === _ticker && !_tickerActive) {
_ticker.wake();
}
if (list == null) {
this._listeners[type] = list = [];
}
i = list.length;
while (--i > -1) {
listener = list[i];
...