├── HISTORY.md ├── package.json ├── README.md ├── LICENSE.txt └── index.js /HISTORY.md: -------------------------------------------------------------------------------- 1 | Legend: 2 | 3 | - [B]: Breaking 4 | - [F]: Fix 5 | - [I]: Improvement 6 | 7 | ### 1.2.0 (November 20th 2015) 8 | - [F] Fix return value of `easeInOutExpo`, `easeInElastic`, `easeOutElastic` and `easeInOutElastic`. 20b7790 9 | 10 | ### 1.1.0 (October 16th 2015) 11 | - [F] Fix `easeInExpo` and `easeOutExpo`. #2 12 | 13 | ### 1.0.2 (May 25th 2015) 14 | - Initial release. 15 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "tween-functions", 3 | "version": "1.2.0", 4 | "description": "Robert Penner's easing functions, slightly modified", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "repository": { 10 | "type": "git", 11 | "url": "https://github.com/chenglou/tween-functions" 12 | }, 13 | "keywords": [ 14 | "tween", 15 | "ease", 16 | "react", 17 | "animation", 18 | "easing", 19 | "penner", 20 | "bezier", 21 | "interpolation" 22 | ], 23 | "author": "chenglou", 24 | "license": "BSD", 25 | "bugs": { 26 | "url": "https://github.com/chenglou/tween-functions/issues" 27 | }, 28 | "homepage": "https://github.com/chenglou/tween-functions" 29 | } 30 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Tween-functions 2 | 3 | Robert Penner's tweening functions as used in [React-tween-state](https://github.com/chenglou/react-tween-state) and [React-state-stream](https://github.com/chenglou/react-state-stream). 4 | 5 | Penner's original functions uses the change in value rather than final value as parameter. I much prefer the latter, so this is what this library will use. 6 | 7 | ## API 8 | 9 | `tweenFunction.tweenName(currentTime, beginValue, endValue, totalDuration)` 10 | 11 | ## Example 12 | 13 | ```js 14 | var tweenFunctions = require('tween-functions'); 15 | tweenFunctions.easeInQuad(1, 0, 50, 5); // => 4 16 | ``` 17 | 18 | List of available functions: 19 | 20 | - linear 21 | - easeInQuad 22 | - easeOutQuad 23 | - easeInOutQuad 24 | - easeInCubic 25 | - easeOutCubic 26 | - easeInOutCubic 27 | - easeInQuart 28 | - easeOutQuart 29 | - easeInOutQuart 30 | - easeInQuint 31 | - easeOutQuint 32 | - easeInOutQuint 33 | - easeInSine 34 | - easeOutSine 35 | - easeInOutSine 36 | - easeInExpo 37 | - easeOutExpo 38 | - easeInOutExpo 39 | - easeInCirc 40 | - easeOutCirc 41 | - easeInOutCirc 42 | - easeInElastic 43 | - easeOutElastic 44 | - easeInOutElastic 45 | - easeInBack 46 | - easeOutBack 47 | - easeInOutBack 48 | - easeInBounce 49 | - easeOutBounce 50 | - easeInOutBounce 51 | -------------------------------------------------------------------------------- /LICENSE.txt: -------------------------------------------------------------------------------- 1 | TERMS OF USE - EASING EQUATIONS 2 | 3 | Open source under the BSD License. 4 | 5 | Copyright © 2001 Robert Penner 6 | All rights reserved. 7 | 8 | Redistribution and use in source and binary forms, with or without modification, 9 | are permitted provided that the following conditions are met: 10 | 11 | Redistributions of source code must retain the above copyright notice, this list of 12 | conditions and the following disclaimer. 13 | Redistributions in binary form must reproduce the above copyright notice, this list 14 | of conditions and the following disclaimer in the documentation and/or other materials 15 | provided with the distribution. 16 | 17 | Neither the name of the author nor the names of contributors may be used to endorse 18 | or promote products derived from this software without specific prior written permission. 19 | 20 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY 21 | EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF 22 | MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE 23 | COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, 24 | EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE 25 | GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED 26 | AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING 27 | NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED 28 | OF THE POSSIBILITY OF SUCH DAMAGE. 29 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | // t: current time, b: beginning value, _c: final value, d: total duration 4 | var tweenFunctions = { 5 | linear: function(t, b, _c, d) { 6 | var c = _c - b; 7 | return c * t / d + b; 8 | }, 9 | easeInQuad: function(t, b, _c, d) { 10 | var c = _c - b; 11 | return c * (t /= d) * t + b; 12 | }, 13 | easeOutQuad: function(t, b, _c, d) { 14 | var c = _c - b; 15 | return -c * (t /= d) * (t - 2) + b; 16 | }, 17 | easeInOutQuad: function(t, b, _c, d) { 18 | var c = _c - b; 19 | if ((t /= d / 2) < 1) { 20 | return c / 2 * t * t + b; 21 | } else { 22 | return -c / 2 * ((--t) * (t - 2) - 1) + b; 23 | } 24 | }, 25 | easeInCubic: function(t, b, _c, d) { 26 | var c = _c - b; 27 | return c * (t /= d) * t * t + b; 28 | }, 29 | easeOutCubic: function(t, b, _c, d) { 30 | var c = _c - b; 31 | return c * ((t = t / d - 1) * t * t + 1) + b; 32 | }, 33 | easeInOutCubic: function(t, b, _c, d) { 34 | var c = _c - b; 35 | if ((t /= d / 2) < 1) { 36 | return c / 2 * t * t * t + b; 37 | } else { 38 | return c / 2 * ((t -= 2) * t * t + 2) + b; 39 | } 40 | }, 41 | easeInQuart: function(t, b, _c, d) { 42 | var c = _c - b; 43 | return c * (t /= d) * t * t * t + b; 44 | }, 45 | easeOutQuart: function(t, b, _c, d) { 46 | var c = _c - b; 47 | return -c * ((t = t / d - 1) * t * t * t - 1) + b; 48 | }, 49 | easeInOutQuart: function(t, b, _c, d) { 50 | var c = _c - b; 51 | if ((t /= d / 2) < 1) { 52 | return c / 2 * t * t * t * t + b; 53 | } else { 54 | return -c / 2 * ((t -= 2) * t * t * t - 2) + b; 55 | } 56 | }, 57 | easeInQuint: function(t, b, _c, d) { 58 | var c = _c - b; 59 | return c * (t /= d) * t * t * t * t + b; 60 | }, 61 | easeOutQuint: function(t, b, _c, d) { 62 | var c = _c - b; 63 | return c * ((t = t / d - 1) * t * t * t * t + 1) + b; 64 | }, 65 | easeInOutQuint: function(t, b, _c, d) { 66 | var c = _c - b; 67 | if ((t /= d / 2) < 1) { 68 | return c / 2 * t * t * t * t * t + b; 69 | } else { 70 | return c / 2 * ((t -= 2) * t * t * t * t + 2) + b; 71 | } 72 | }, 73 | easeInSine: function(t, b, _c, d) { 74 | var c = _c - b; 75 | return -c * Math.cos(t / d * (Math.PI / 2)) + c + b; 76 | }, 77 | easeOutSine: function(t, b, _c, d) { 78 | var c = _c - b; 79 | return c * Math.sin(t / d * (Math.PI / 2)) + b; 80 | }, 81 | easeInOutSine: function(t, b, _c, d) { 82 | var c = _c - b; 83 | return -c / 2 * (Math.cos(Math.PI * t / d) - 1) + b; 84 | }, 85 | easeInExpo: function(t, b, _c, d) { 86 | var c = _c - b; 87 | return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b; 88 | }, 89 | easeOutExpo: function(t, b, _c, d) { 90 | var c = _c - b; 91 | return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b; 92 | }, 93 | easeInOutExpo: function(t, b, _c, d) { 94 | var c = _c - b; 95 | if (t === 0) { 96 | return b; 97 | } 98 | if (t === d) { 99 | return b + c; 100 | } 101 | if ((t /= d / 2) < 1) { 102 | return c / 2 * Math.pow(2, 10 * (t - 1)) + b; 103 | } else { 104 | return c / 2 * (-Math.pow(2, -10 * --t) + 2) + b; 105 | } 106 | }, 107 | easeInCirc: function(t, b, _c, d) { 108 | var c = _c - b; 109 | return -c * (Math.sqrt(1 - (t /= d) * t) - 1) + b; 110 | }, 111 | easeOutCirc: function(t, b, _c, d) { 112 | var c = _c - b; 113 | return c * Math.sqrt(1 - (t = t / d - 1) * t) + b; 114 | }, 115 | easeInOutCirc: function(t, b, _c, d) { 116 | var c = _c - b; 117 | if ((t /= d / 2) < 1) { 118 | return -c / 2 * (Math.sqrt(1 - t * t) - 1) + b; 119 | } else { 120 | return c / 2 * (Math.sqrt(1 - (t -= 2) * t) + 1) + b; 121 | } 122 | }, 123 | easeInElastic: function(t, b, _c, d) { 124 | var c = _c - b; 125 | var a, p, s; 126 | s = 1.70158; 127 | p = 0; 128 | a = c; 129 | if (t === 0) { 130 | return b; 131 | } else if ((t /= d) === 1) { 132 | return b + c; 133 | } 134 | if (!p) { 135 | p = d * 0.3; 136 | } 137 | if (a < Math.abs(c)) { 138 | a = c; 139 | s = p / 4; 140 | } else { 141 | s = p / (2 * Math.PI) * Math.asin(c / a); 142 | } 143 | return -(a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p)) + b; 144 | }, 145 | easeOutElastic: function(t, b, _c, d) { 146 | var c = _c - b; 147 | var a, p, s; 148 | s = 1.70158; 149 | p = 0; 150 | a = c; 151 | if (t === 0) { 152 | return b; 153 | } else if ((t /= d) === 1) { 154 | return b + c; 155 | } 156 | if (!p) { 157 | p = d * 0.3; 158 | } 159 | if (a < Math.abs(c)) { 160 | a = c; 161 | s = p / 4; 162 | } else { 163 | s = p / (2 * Math.PI) * Math.asin(c / a); 164 | } 165 | return a * Math.pow(2, -10 * t) * Math.sin((t * d - s) * (2 * Math.PI) / p) + c + b; 166 | }, 167 | easeInOutElastic: function(t, b, _c, d) { 168 | var c = _c - b; 169 | var a, p, s; 170 | s = 1.70158; 171 | p = 0; 172 | a = c; 173 | if (t === 0) { 174 | return b; 175 | } else if ((t /= d / 2) === 2) { 176 | return b + c; 177 | } 178 | if (!p) { 179 | p = d * (0.3 * 1.5); 180 | } 181 | if (a < Math.abs(c)) { 182 | a = c; 183 | s = p / 4; 184 | } else { 185 | s = p / (2 * Math.PI) * Math.asin(c / a); 186 | } 187 | if (t < 1) { 188 | return -0.5 * (a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p)) + b; 189 | } else { 190 | return a * Math.pow(2, -10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p) * 0.5 + c + b; 191 | } 192 | }, 193 | easeInBack: function(t, b, _c, d, s) { 194 | var c = _c - b; 195 | if (s === void 0) { 196 | s = 1.70158; 197 | } 198 | return c * (t /= d) * t * ((s + 1) * t - s) + b; 199 | }, 200 | easeOutBack: function(t, b, _c, d, s) { 201 | var c = _c - b; 202 | if (s === void 0) { 203 | s = 1.70158; 204 | } 205 | return c * ((t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b; 206 | }, 207 | easeInOutBack: function(t, b, _c, d, s) { 208 | var c = _c - b; 209 | if (s === void 0) { 210 | s = 1.70158; 211 | } 212 | if ((t /= d / 2) < 1) { 213 | return c / 2 * (t * t * (((s *= 1.525) + 1) * t - s)) + b; 214 | } else { 215 | return c / 2 * ((t -= 2) * t * (((s *= 1.525) + 1) * t + s) + 2) + b; 216 | } 217 | }, 218 | easeInBounce: function(t, b, _c, d) { 219 | var c = _c - b; 220 | var v; 221 | v = tweenFunctions.easeOutBounce(d - t, 0, c, d); 222 | return c - v + b; 223 | }, 224 | easeOutBounce: function(t, b, _c, d) { 225 | var c = _c - b; 226 | if ((t /= d) < 1 / 2.75) { 227 | return c * (7.5625 * t * t) + b; 228 | } else if (t < 2 / 2.75) { 229 | return c * (7.5625 * (t -= 1.5 / 2.75) * t + 0.75) + b; 230 | } else if (t < 2.5 / 2.75) { 231 | return c * (7.5625 * (t -= 2.25 / 2.75) * t + 0.9375) + b; 232 | } else { 233 | return c * (7.5625 * (t -= 2.625 / 2.75) * t + 0.984375) + b; 234 | } 235 | }, 236 | easeInOutBounce: function(t, b, _c, d) { 237 | var c = _c - b; 238 | var v; 239 | if (t < d / 2) { 240 | v = tweenFunctions.easeInBounce(t * 2, 0, c, d); 241 | return v * 0.5 + b; 242 | } else { 243 | v = tweenFunctions.easeOutBounce(t * 2 - d, 0, c, d); 244 | return v * 0.5 + c * 0.5 + b; 245 | } 246 | } 247 | }; 248 | 249 | module.exports = tweenFunctions; 250 | --------------------------------------------------------------------------------