3 This file is part of Ext JS 4
5 Copyright (c) 2011 Sencha Inc
7 Contact: http://www.sencha.com/contact
9 GNU General Public License Usage
10 This file may be used under the terms of the GNU General Public License version 3.0 as published by the Free Software Foundation and appearing in the file LICENSE included in the packaging of this file. Please review the following information to ensure the GNU General Public License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html.
12 If you are unsure which license is appropriate for your use, please contact the sales department at http://www.sencha.com/contact.
16 * @class Ext.fx.Easing
18 * This class contains a series of function definitions used to modify values during an animation.
19 * They describe how the intermediate values used during a transition will be calculated. It allows for a transition to change
20 * speed over its duration. The following options are available:
22 * - linear The default easing type
33 * - cubic-bezier(x1, y1, x2, y2)
35 * Note that cubic-bezier will create a custom easing curve following the CSS3 [transition-timing-function][0]
36 * specification. The four values specify points P1 and P2 of the curve as (x1, y1, x2, y2). All values must
37 * be in the range [0, 1] or the definition is invalid.
39 * [0]: http://www.w3.org/TR/css3-transitions/#transition-timing-function_tag
45 Ext.require('Ext.fx.CubicBezier', function() {
54 // ease: Ext.fx.CubicBezier.cubicBezier(0.25, 0.1, 0.25, 1),
55 // linear: Ext.fx.CubicBezier.cubicBezier(0, 0, 1, 1),
56 // 'ease-in': Ext.fx.CubicBezier.cubicBezier(0.42, 0, 1, 1),
57 // 'ease-out': Ext.fx.CubicBezier.cubicBezier(0, 0.58, 1, 1),
58 // 'ease-in-out': Ext.fx.CubicBezier.cubicBezier(0.42, 0, 0.58, 1),
59 // 'easeIn': Ext.fx.CubicBezier.cubicBezier(0.42, 0, 1, 1),
60 // 'easeOut': Ext.fx.CubicBezier.cubicBezier(0, 0.58, 1, 1),
61 // 'easeInOut': Ext.fx.CubicBezier.cubicBezier(0.42, 0, 0.58, 1)
64 Ext.apply(Ext.fx.Easing, {
69 var q = 0.07813 - n / 2,
71 Q = sqrt(0.0066 + q * q),
73 X = pow(abs(x), 1/3) * (x < 0 ? -1 : 1),
75 Y = pow(abs(y), 1/3) * (y < 0 ? -1 : 1),
77 return pow(1 - t, 2) * 3 * t * 0.1 + (1 - t) * 3 * t * t + t * t * t;
79 easeIn: function (n) {
82 easeOut: function (n) {
85 easeInOut: function(n) {
86 var q = 0.48 - n / 1.04,
87 Q = sqrt(0.1734 + q * q),
89 X = pow(abs(x), 1/3) * (x < 0 ? -1 : 1),
91 Y = pow(abs(y), 1/3) * (y < 0 ? -1 : 1),
93 return (1 - t) * 3 * t * t + t * t * t;
95 backIn: function (n) {
96 return n * n * ((backInSeed + 1) * n - backInSeed);
98 backOut: function (n) {
100 return n * n * ((backInSeed + 1) * n + backInSeed) + 1;
102 elasticIn: function (n) {
103 if (n === 0 || n === 1) {
108 return pow(2, -10 * n) * sin((n - s) * (2 * pi) / p) + 1;
110 elasticOut: function (n) {
111 return 1 - Ext.fx.Easing.elasticIn(1 - n);
113 bounceIn: function (n) {
114 return 1 - Ext.fx.Easing.bounceOut(1 - n);
116 bounceOut: function (n) {
125 l = s * n * n + 0.75;
129 l = s * n * n + 0.9375;
132 l = s * n * n + 0.984375;
139 Ext.apply(Ext.fx.Easing, {
140 'back-in': Ext.fx.Easing.backIn,
141 'back-out': Ext.fx.Easing.backOut,
142 'ease-in': Ext.fx.Easing.easeIn,
143 'ease-out': Ext.fx.Easing.easeOut,
144 'elastic-in': Ext.fx.Easing.elasticIn,
145 'elastic-out': Ext.fx.Easing.elasticIn,
146 'bounce-in': Ext.fx.Easing.bounceIn,
147 'bounce-out': Ext.fx.Easing.bounceOut,
148 'ease-in-out': Ext.fx.Easing.easeInOut