docs/source/ext-base-anim-extra.html

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