Upgrade to ExtJS 3.0.0 - Released 07/06/2009
[extjs.git] / docs / source / ext-base-anim-extra.html
1 <html>\r
2 <head>\r
3   <title>The source code</title>\r
4     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
5     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
6 </head>\r
7 <body  onload="prettyPrint();">\r
8     <pre class="prettyprint lang-js">// Easing functions\r
9 (function(){\r
10         // shortcuts to aid compression\r
11         var abs = Math.abs,\r
12                 pi = Math.PI,\r
13                 asin = Math.asin,\r
14                 pow = Math.pow,\r
15                 sin = Math.sin,\r
16                 EXTLIB = Ext.lib;\r
17                 \r
18     Ext.apply(EXTLIB.Easing, {\r
19         \r
20         easeBoth: function (t, b, c, d) {\r
21                 return ((t /= d / 2) < 1)  ?  c / 2 * t * t + b  :  -c / 2 * ((--t) * (t - 2) - 1) + b;               \r
22         },\r
23         \r
24         easeInStrong: function (t, b, c, d) {\r
25             return c * (t /= d) * t * t * t + b;\r
26         },\r
27 \r
28         easeOutStrong: function (t, b, c, d) {\r
29             return -c * ((t = t / d - 1) * t * t * t - 1) + b;\r
30         },\r
31 \r
32         easeBothStrong: function (t, b, c, d) {\r
33             return ((t /= d / 2) < 1)  ?  c / 2 * t * t * t * t + b  :  -c / 2 * ((t -= 2) * t * t * t - 2) + b;\r
34         },\r
35 \r
36         elasticIn: function (t, b, c, d, a, p) {\r
37                 if (t == 0 || (t /= d) == 1) {\r
38                 return t == 0 ? b : b + c;\r
39             }               \r
40             p = p || (d * .3);              \r
41 \r
42                         var s;\r
43                         if (a >= abs(c)) {\r
44                                 s = p / (2 * pi) * asin(c / a);\r
45                         } else {\r
46                                 a = c;\r
47                                 s = p / 4;\r
48                         }\r
49         \r
50             return -(a * pow(2, 10 * (t -= 1)) * sin((t * d - s) * (2 * pi) / p)) + b;\r
51                       \r
52         },      \r
53         \r
54                 elasticOut: function (t, b, c, d, a, p) {\r
55                 if (t == 0 || (t /= d) == 1) {\r
56                 return t == 0 ? b : b + c;\r
57             }               \r
58             p = p || (d * .3);              \r
59 \r
60                         var s;\r
61                         if (a >= abs(c)) {\r
62                                 s = p / (2 * pi) * asin(c / a);\r
63                         } else {\r
64                                 a = c;\r
65                                 s = p / 4;\r
66                         }\r
67         \r
68             return a * pow(2, -10 * t) * sin((t * d - s) * (2 * pi) / p) + c + b;        \r
69         },      \r
70         \r
71         elasticBoth: function (t, b, c, d, a, p) {\r
72             if (t == 0 || (t /= d / 2) == 2) {\r
73                 return t == 0 ? b : b + c;\r
74             }                           \r
75                     \r
76             p = p || (d * (.3 * 1.5));              \r
77 \r
78             var s;\r
79             if (a >= abs(c)) {\r
80                     s = p / (2 * pi) * asin(c / a);\r
81             } else {\r
82                     a = c;\r
83                 s = p / 4;\r
84             }\r
85 \r
86             return t < 1 ?\r
87                         -.5 * (a * pow(2, 10 * (t -= 1)) * sin((t * d - s) * (2 * pi) / p)) + b :\r
88                     a * pow(2, -10 * (t -= 1)) * sin((t * d - s) * (2 * pi) / p) * .5 + c + b;\r
89         },\r
90 \r
91         backIn: function (t, b, c, d, s) {\r
92             s = s ||  1.70158;              \r
93             return c * (t /= d) * t * ((s + 1) * t - s) + b;\r
94         },\r
95 \r
96 \r
97         backOut: function (t, b, c, d, s) {\r
98             if (!s) {\r
99                 s = 1.70158;\r
100             }\r
101             return c * ((t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b;\r
102         },\r
103 \r
104 \r
105         backBoth: function (t, b, c, d, s) {\r
106             s = s || 1.70158;               \r
107 \r
108             return ((t /= d / 2 ) < 1) ?\r
109                     c / 2 * (t * t * (((s *= (1.525)) + 1) * t - s)) + b :                  \r
110                         c / 2 * ((t -= 2) * t * (((s *= (1.525)) + 1) * t + s) + 2) + b;\r
111         },\r
112 \r
113 \r
114         bounceIn: function (t, b, c, d) {\r
115             return c - EXTLIB.Easing.bounceOut(d - t, 0, c, d) + b;\r
116         },\r
117 \r
118 \r
119         bounceOut: function (t, b, c, d) {\r
120         if ((t /= d) < (1 / 2.75)) {\r
121                 return c * (7.5625 * t * t) + b;\r
122             } else if (t < (2 / 2.75)) {\r
123                 return c * (7.5625 * (t -= (1.5 / 2.75)) * t + .75) + b;\r
124             } else if (t < (2.5 / 2.75)) {\r
125                 return c * (7.5625 * (t -= (2.25 / 2.75)) * t + .9375) + b;\r
126             }\r
127             return c * (7.5625 * (t -= (2.625 / 2.75)) * t + .984375) + b;\r
128         },\r
129 \r
130 \r
131         bounceBoth: function (t, b, c, d) {\r
132             return (t < d / 2) ?\r
133                    EXTLIB.Easing.bounceIn(t * 2, 0, c, d) * .5 + b : \r
134                    EXTLIB.Easing.bounceOut(t * 2 - d, 0, c, d) * .5 + c * .5 + b;\r
135         }\r
136     });\r
137 })();\r
138 \r
139 (function() {\r
140     var EXTLIB = Ext.lib;\r
141         // Color Animation\r
142         EXTLIB.Anim.color = function(el, args, duration, easing, cb, scope) {\r
143             return EXTLIB.Anim.run(el, args, duration, easing, cb, scope, EXTLIB.ColorAnim);\r
144         }\r
145         \r
146     EXTLIB.ColorAnim = function(el, attributes, duration, method) {\r
147         EXTLIB.ColorAnim.superclass.constructor.call(this, el, attributes, duration, method);\r
148     };\r
149 \r
150     Ext.extend(EXTLIB.ColorAnim, EXTLIB.AnimBase);\r
151 \r
152     var superclass = EXTLIB.ColorAnim.superclass,\r
153         colorRE = /color$/i,\r
154         transparentRE = /^transparent|rgba\(0, 0, 0, 0\)$/,\r
155         rgbRE = /^rgb\(([0-9]+)\s*,\s*([0-9]+)\s*,\s*([0-9]+)\)$/i,\r
156         hexRE= /^#?([0-9A-F]{2})([0-9A-F]{2})([0-9A-F]{2})$/i,\r
157         hex3RE = /^#?([0-9A-F]{1})([0-9A-F]{1})([0-9A-F]{1})$/i,\r
158         isset = function(v){\r
159             return typeof v !== 'undefined';\r
160         }\r
161                 \r
162         // private      \r
163     function parseColor(s) {    \r
164         var pi = parseInt,\r
165             base,\r
166             out = null,\r
167             c;\r
168         \r
169             if (s.length == 3) {\r
170             return s;\r
171         }\r
172         \r
173         Ext.each([hexRE, rgbRE, hex3RE], function(re, idx){\r
174             base = (idx % 2 == 0) ? 16 : 10;\r
175             c = re.exec(s);\r
176             if(c && c.length == 4){\r
177                 out = [pi(c[1], base), pi(c[2], base), pi(c[3], base)];\r
178                 return false;\r
179             }\r
180         });\r
181         return out;\r
182     }   \r
183 \r
184     Ext.apply(EXTLIB.ColorAnim.prototype, {\r
185         getAttr : function(attr) {\r
186             var me = this,\r
187                 el = me.el,\r
188                 val;                \r
189             if(colorRE.test(attr)){\r
190                 while(el && transparentRE.test(val = Ext.fly(el).getStyle(attr))){\r
191                     el = el.parentNode;\r
192                     val = "fff";\r
193                 }\r
194             }else{\r
195                 val = superclass.getAttr.call(me, attr);\r
196             }\r
197             return val;\r
198         },\r
199 \r
200         doMethod : function(attr, start, end) {\r
201             var me = this,\r
202                 val,\r
203                 floor = Math.floor;            \r
204 \r
205             if(colorRE.test(attr)){\r
206                 val = [];\r
207              \r
208                     Ext.each(start, function(v, i) {\r
209                     val[i] = superclass.doMethod.call(me, attr, v, end[i]);\r
210                 });\r
211 \r
212                 val = 'rgb(' + floor(val[0]) + ',' + floor(val[1]) + ',' + floor(val[2]) + ')';\r
213             }else{\r
214                 val = superclass.doMethod.call(me, attr, start, end);\r
215             }\r
216             return val;\r
217         },\r
218 \r
219         setRunAttr : function(attr) {\r
220             var me = this,\r
221                 a = me.attributes[attr],\r
222                 to = a.to,\r
223                 by = a.by,\r
224                 ra;\r
225                 \r
226             superclass.setRunAttr.call(me, attr);\r
227             ra = me.runAttrs[attr];\r
228             if(colorRE.test(attr)){\r
229                 var start = parseColor(ra.start),\r
230                     end = parseColor(ra.end);\r
231 \r
232                 if(!isset(to) && isset(by)){\r
233                     end = parseColor(by);\r
234                     Ext.each(start, function(item, i){\r
235                         end[i] = item + end[i];\r
236                     });\r
237                 }\r
238                 ra.start = start;\r
239                 ra.end = end;\r
240             }\r
241         }\r
242         });\r
243 })();   \r
244 \r
245         \r
246 (function() {\r
247             // Scroll Animation \r
248     var EXTLIB = Ext.lib;\r
249         EXTLIB.Anim.scroll = function(el, args, duration, easing, cb, scope) {          \r
250             return EXTLIB.Anim.run(el, args, duration, easing, cb, scope, EXTLIB.Scroll);\r
251         }\r
252         \r
253     EXTLIB.Scroll = function(el, attributes, duration, method) {\r
254         if(el){\r
255             EXTLIB.Scroll.superclass.constructor.call(this, el, attributes, duration, method);\r
256         }\r
257     };\r
258 \r
259     Ext.extend(EXTLIB.Scroll, EXTLIB.ColorAnim);\r
260 \r
261     var superclass = EXTLIB.Scroll.superclass,\r
262         SCROLL = 'scroll';\r
263 \r
264     Ext.apply(EXTLIB.Scroll.prototype, {\r
265 \r
266         doMethod : function(attr, start, end) {\r
267             var val,\r
268                 me = this,\r
269                 curFrame = me.curFrame,\r
270                 totalFrames = me.totalFrames;\r
271 \r
272             if(attr == SCROLL){\r
273                 val = [me.method(curFrame, start[0], end[0] - start[0], totalFrames),\r
274                        me.method(curFrame, start[1], end[1] - start[1], totalFrames)];\r
275             }else{\r
276                 val = superclass.doMethod.call(me, attr, start, end);\r
277             }\r
278             return val;\r
279         },\r
280 \r
281         getAttr : function(attr) {\r
282             var me = this;\r
283 \r
284             if (attr == SCROLL) {\r
285                 return [me.el.scrollLeft, me.el.scrollTop];\r
286             }else{\r
287                 return superclass.getAttr.call(me, attr);\r
288             }\r
289         },\r
290 \r
291         setAttr : function(attr, val, unit) {\r
292             var me = this;\r
293 \r
294             if(attr == SCROLL){\r
295                 me.el.scrollLeft = val[0];\r
296                 me.el.scrollTop = val[1];\r
297             }else{\r
298                 superclass.setAttr.call(me, attr, val, unit);\r
299             }\r
300         }\r
301     });\r
302 })();</pre>    \r
303 </body>\r
304 </html>