UNPKG

2.38 kBJavaScriptView Raw
1import generateCubicBezier from './cubic-bezier';
2import generateSpringRK4 from './spring';
3
4let cubicBezier = function( t1, p1, t2, p2 ){
5 let bezier = generateCubicBezier( t1, p1, t2, p2 );
6
7 return function( start, end, percent ){
8 return start + ( end - start ) * bezier( percent );
9 };
10};
11
12let easings = {
13 'linear': function( start, end, percent ){
14 return start + (end - start) * percent;
15 },
16
17 // default easings
18 'ease': cubicBezier( 0.25, 0.1, 0.25, 1 ),
19 'ease-in': cubicBezier( 0.42, 0, 1, 1 ),
20 'ease-out': cubicBezier( 0, 0, 0.58, 1 ),
21 'ease-in-out': cubicBezier( 0.42, 0, 0.58, 1 ),
22
23 // sine
24 'ease-in-sine': cubicBezier( 0.47, 0, 0.745, 0.715 ),
25 'ease-out-sine': cubicBezier( 0.39, 0.575, 0.565, 1 ),
26 'ease-in-out-sine': cubicBezier( 0.445, 0.05, 0.55, 0.95 ),
27
28 // quad
29 'ease-in-quad': cubicBezier( 0.55, 0.085, 0.68, 0.53 ),
30 'ease-out-quad': cubicBezier( 0.25, 0.46, 0.45, 0.94 ),
31 'ease-in-out-quad': cubicBezier( 0.455, 0.03, 0.515, 0.955 ),
32
33 // cubic
34 'ease-in-cubic': cubicBezier( 0.55, 0.055, 0.675, 0.19 ),
35 'ease-out-cubic': cubicBezier( 0.215, 0.61, 0.355, 1 ),
36 'ease-in-out-cubic': cubicBezier( 0.645, 0.045, 0.355, 1 ),
37
38 // quart
39 'ease-in-quart': cubicBezier( 0.895, 0.03, 0.685, 0.22 ),
40 'ease-out-quart': cubicBezier( 0.165, 0.84, 0.44, 1 ),
41 'ease-in-out-quart': cubicBezier( 0.77, 0, 0.175, 1 ),
42
43 // quint
44 'ease-in-quint': cubicBezier( 0.755, 0.05, 0.855, 0.06 ),
45 'ease-out-quint': cubicBezier( 0.23, 1, 0.32, 1 ),
46 'ease-in-out-quint': cubicBezier( 0.86, 0, 0.07, 1 ),
47
48 // expo
49 'ease-in-expo': cubicBezier( 0.95, 0.05, 0.795, 0.035 ),
50 'ease-out-expo': cubicBezier( 0.19, 1, 0.22, 1 ),
51 'ease-in-out-expo': cubicBezier( 1, 0, 0, 1 ),
52
53 // circ
54 'ease-in-circ': cubicBezier( 0.6, 0.04, 0.98, 0.335 ),
55 'ease-out-circ': cubicBezier( 0.075, 0.82, 0.165, 1 ),
56 'ease-in-out-circ': cubicBezier( 0.785, 0.135, 0.15, 0.86 ),
57
58
59 // user param easings...
60
61 'spring': function( tension, friction, duration ){
62 if( duration === 0 ){ // can't get a spring w/ duration 0
63 return easings.linear; // duration 0 => jump to end so impl doesn't matter
64 }
65
66 let spring = generateSpringRK4( tension, friction, duration );
67
68 return function( start, end, percent ){
69 return start + (end - start) * spring( percent );
70 };
71 },
72
73 'cubic-bezier': cubicBezier
74};
75
76export default easings;