lib/dojo/fx/easing.js.uncompressed.js

   1 define("dojo/fx/easing", ["../_base/lang"], function(lang) {
   2 // module:
   3 //              dojo/fx/easing
   4 // summary:
   5 //              This module defines standard easing functions that are useful for animations.
   6
   7 var easingFuncs = /*===== dojo.fx.easing= =====*/ {
   8         // summary:
   9         //              Collection of easing functions to use beyond the default
  10         //              `dojo._defaultEasing` function.
  11         //
  12         // description:
  13         //
  14         //              Easing functions are used to manipulate the iteration through
  15         //              an `dojo.Animation`s _Line. _Line being the properties of an Animation,
  16         //              and the easing function progresses through that Line determing
  17         //              how quickly (or slowly) it should go. Or more accurately: modify
  18         //              the value of the _Line based on the percentage of animation completed.
  19         //
  20         //              All functions follow a simple naming convention of "ease type" + "when".
  21         //              If the name of the function ends in Out, the easing described appears
  22         //              towards the end of the animation. "In" means during the beginning,
  23         //              and InOut means both ranges of the Animation will applied, both
  24         //              beginning and end.
  25         //
  26         //              One does not call the easing function directly, it must be passed to
  27         //              the `easing` property of an animation.
  28         //
  29         //      example:
  30         //      |       dojo.require("dojo.fx.easing");
  31         //      |       var anim = dojo.fadeOut({
  32         //      |               node: 'node',
  33         //      |               duration: 2000,
  34         //      |               //      note there is no ()
  35         //      |               easing: dojo.fx.easing.quadIn
  36         //      |       }).play();
  37         //
  38
  39         linear: function(/* Decimal? */n){
  40                 // summary: A linear easing function
  41                 return n;
  42         },
  43
  44         quadIn: function(/* Decimal? */n){
  45                 return Math.pow(n, 2);
  46         },
  47
  48         quadOut: function(/* Decimal? */n){
  49                 return n * (n - 2) * -1;
  50         },
  51
  52         quadInOut: function(/* Decimal? */n){
  53                 n = n * 2;
  54                 if(n < 1){ return Math.pow(n, 2) / 2; }
  55                 return -1 * ((--n) * (n - 2) - 1) / 2;
  56         },
  57
  58         cubicIn: function(/* Decimal? */n){
  59                 return Math.pow(n, 3);
  60         },
  61
  62         cubicOut: function(/* Decimal? */n){
  63                 return Math.pow(n - 1, 3) + 1;
  64         },
  65
  66         cubicInOut: function(/* Decimal? */n){
  67                 n = n * 2;
  68                 if(n < 1){ return Math.pow(n, 3) / 2; }
  69                 n -= 2;
  70                 return (Math.pow(n, 3) + 2) / 2;
  71         },
  72
  73         quartIn: function(/* Decimal? */n){
  74                 return Math.pow(n, 4);
  75         },
  76
  77         quartOut: function(/* Decimal? */n){
  78                 return -1 * (Math.pow(n - 1, 4) - 1);
  79         },
  80
  81         quartInOut: function(/* Decimal? */n){
  82                 n = n * 2;
  83                 if(n < 1){ return Math.pow(n, 4) / 2; }
  84                 n -= 2;
  85                 return -1 / 2 * (Math.pow(n, 4) - 2);
  86         },
  87
  88         quintIn: function(/* Decimal? */n){
  89                 return Math.pow(n, 5);
  90         },
  91
  92         quintOut: function(/* Decimal? */n){
  93                 return Math.pow(n - 1, 5) + 1;
  94         },
  95
  96         quintInOut: function(/* Decimal? */n){
  97                 n = n * 2;
  98                 if(n < 1){ return Math.pow(n, 5) / 2; }
  99                 n -= 2;
 100                 return (Math.pow(n, 5) + 2) / 2;
 101         },
 102
 103         sineIn: function(/* Decimal? */n){
 104                 return -1 * Math.cos(n * (Math.PI / 2)) + 1;
 105         },
 106
 107         sineOut: function(/* Decimal? */n){
 108                 return Math.sin(n * (Math.PI / 2));
 109         },
 110
 111         sineInOut: function(/* Decimal? */n){
 112                 return -1 * (Math.cos(Math.PI * n) - 1) / 2;
 113         },
 114
 115         expoIn: function(/* Decimal? */n){
 116                 return (n == 0) ? 0 : Math.pow(2, 10 * (n - 1));
 117         },
 118
 119         expoOut: function(/* Decimal? */n){
 120                 return (n == 1) ? 1 : (-1 * Math.pow(2, -10 * n) + 1);
 121         },
 122
 123         expoInOut: function(/* Decimal? */n){
 124                 if(n == 0){ return 0; }
 125                 if(n == 1){ return 1; }
 126                 n = n * 2;
 127                 if(n < 1){ return Math.pow(2, 10 * (n - 1)) / 2; }
 128                 --n;
 129                 return (-1 * Math.pow(2, -10 * n) + 2) / 2;
 130         },
 131
 132         circIn: function(/* Decimal? */n){
 133                 return -1 * (Math.sqrt(1 - Math.pow(n, 2)) - 1);
 134         },
 135
 136         circOut: function(/* Decimal? */n){
 137                 n = n - 1;
 138                 return Math.sqrt(1 - Math.pow(n, 2));
 139         },
 140
 141         circInOut: function(/* Decimal? */n){
 142                 n = n * 2;
 143                 if(n < 1){ return -1 / 2 * (Math.sqrt(1 - Math.pow(n, 2)) - 1); }
 144                 n -= 2;
 145                 return 1 / 2 * (Math.sqrt(1 - Math.pow(n, 2)) + 1);
 146         },
 147
 148         backIn: function(/* Decimal? */n){
 149                 // summary:
 150                 //              An easing function that starts away from the target,
 151                 //              and quickly accelerates towards the end value.
 152                 //
 153                 //              Use caution when the easing will cause values to become
 154                 //              negative as some properties cannot be set to negative values.
 155                 var s = 1.70158;
 156                 return Math.pow(n, 2) * ((s + 1) * n - s);
 157         },
 158
 159         backOut: function(/* Decimal? */n){
 160                 // summary:
 161                 //              An easing function that pops past the range briefly, and slowly comes back.
 162                 //
 163                 // description:
 164                 //              An easing function that pops past the range briefly, and slowly comes back.
 165                 //
 166                 //              Use caution when the easing will cause values to become negative as some
 167                 //              properties cannot be set to negative values.
 168
 169                 n = n - 1;
 170                 var s = 1.70158;
 171                 return Math.pow(n, 2) * ((s + 1) * n + s) + 1;
 172         },
 173
 174         backInOut: function(/* Decimal? */n){
 175                 // summary:
 176                 //              An easing function combining the effects of `backIn` and `backOut`
 177                 //
 178                 // description:
 179                 //              An easing function combining the effects of `backIn` and `backOut`.
 180                 //              Use caution when the easing will cause values to become negative
 181                 //              as some properties cannot be set to negative values.
 182                 var s = 1.70158 * 1.525;
 183                 n = n * 2;
 184                 if(n < 1){ return (Math.pow(n, 2) * ((s + 1) * n - s)) / 2; }
 185                 n-=2;
 186                 return (Math.pow(n, 2) * ((s + 1) * n + s) + 2) / 2;
 187         },
 188
 189         elasticIn: function(/* Decimal? */n){
 190                 // summary:
 191                 //              An easing function the elastically snaps from the start value
 192                 //
 193                 // description:
 194                 //              An easing function the elastically snaps from the start value
 195                 //
 196                 //              Use caution when the elasticity will cause values to become negative
 197                 //              as some properties cannot be set to negative values.
 198                 if(n == 0 || n == 1){ return n; }
 199                 var p = .3;
 200                 var s = p / 4;
 201                 n = n - 1;
 202                 return -1 * Math.pow(2, 10 * n) * Math.sin((n - s) * (2 * Math.PI) / p);
 203         },
 204
 205         elasticOut: function(/* Decimal? */n){
 206                 // summary:
 207                 //              An easing function that elasticly snaps around the target value,
 208                 //              near the end of the Animation
 209                 //
 210                 // description:
 211                 //              An easing function that elasticly snaps around the target value,
 212                 //              near the end of the Animation
 213                 //
 214                 //              Use caution when the elasticity will cause values to become
 215                 //              negative as some properties cannot be set to negative values.
 216                 if(n==0 || n == 1){ return n; }
 217                 var p = .3;
 218                 var s = p / 4;
 219                 return Math.pow(2, -10 * n) * Math.sin((n - s) * (2 * Math.PI) / p) + 1;
 220         },
 221
 222         elasticInOut: function(/* Decimal? */n){
 223                 // summary:
 224                 //              An easing function that elasticly snaps around the value, near
 225                 //              the beginning and end of the Animation.
 226                 //
 227                 // description:
 228                 //              An easing function that elasticly snaps around the value, near
 229                 //              the beginning and end of the Animation.
 230                 //
 231                 //              Use caution when the elasticity will cause values to become
 232                 //              negative as some properties cannot be set to negative values.
 233                 if(n == 0) return 0;
 234                 n = n * 2;
 235                 if(n == 2) return 1;
 236                 var p = .3 * 1.5;
 237                 var s = p / 4;
 238                 if(n < 1){
 239                         n -= 1;
 240                         return -.5 * (Math.pow(2, 10 * n) * Math.sin((n - s) * (2 * Math.PI) / p));
 241                 }
 242                 n -= 1;
 243                 return .5 * (Math.pow(2, -10 * n) * Math.sin((n - s) * (2 * Math.PI) / p)) + 1;
 244         },
 245
 246         bounceIn: function(/* Decimal? */n){
 247                 // summary:
 248                 //              An easing function that 'bounces' near the beginning of an Animation
 249                 return (1 - easingFuncs.bounceOut(1 - n)); // Decimal
 250         },
 251
 252         bounceOut: function(/* Decimal? */n){
 253                 // summary:
 254                 //              An easing function that 'bounces' near the end of an Animation
 255                 var s = 7.5625;
 256                 var p = 2.75;
 257                 var l;
 258                 if(n < (1 / p)){
 259                         l = s * Math.pow(n, 2);
 260                 }else if(n < (2 / p)){
 261                         n -= (1.5 / p);
 262                         l = s * Math.pow(n, 2) + .75;
 263                 }else if(n < (2.5 / p)){
 264                         n -= (2.25 / p);
 265                         l = s * Math.pow(n, 2) + .9375;
 266                 }else{
 267                         n -= (2.625 / p);
 268                         l = s * Math.pow(n, 2) + .984375;
 269                 }
 270                 return l;
 271         },
 272
 273         bounceInOut: function(/* Decimal? */n){
 274                 // summary:
 275                 //              An easing function that 'bounces' at the beginning and end of the Animation
 276                 if(n < 0.5){ return easingFuncs.bounceIn(n * 2) / 2; }
 277                 return (easingFuncs.bounceOut(n * 2 - 1) / 2) + 0.5; // Decimal
 278         }
 279 };
 280
 281 lang.setObject("dojo.fx.easing", easingFuncs);
 282
 283 return easingFuncs;
 284 });