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