@@ -219,6 +219,66 @@ const Easing = {
219
219
} ,
220
220
}
221
221
} ,
222
+ generateExponential : function (
223
+ // A value of 300 is makes the curve very close to Exponential with its value of 1024.
224
+ base = 300 ,
225
+ ) : {
226
+ In ( amount : number ) : number
227
+ Out ( amount : number ) : number
228
+ InOut ( amount : number ) : number
229
+ } {
230
+ // https://www.desmos.com/calculator/pioplwo3zq
231
+
232
+ if ( base <= 0 ) {
233
+ console . warn (
234
+ 'base should be larger than 0. You might like to try between 20 and 400, maybe more. Setting a default value of 300.' ,
235
+ )
236
+ base = 300
237
+ }
238
+
239
+ function In ( amount : number ) : number {
240
+ // Start similar to Exponential
241
+ let expo = base ** ( amount - 1 )
242
+
243
+ // adjust so it hits 0 when amount is 0
244
+ expo = expo - expo * ( 1 - amount )
245
+
246
+ return expo
247
+ }
248
+
249
+ function Out ( amount : number ) : number {
250
+ // translate X by 1
251
+ amount = amount + 1
252
+
253
+ // Similar to In, but negate power to make the graph have a negative slope instead of positive.
254
+ let expo = base ** - ( amount - 1 )
255
+
256
+ // adjust so it hits 1 when amount is 1
257
+ expo = expo - expo * - ( 1 - amount )
258
+
259
+ // Flip it upside down, move it up by 1.
260
+ return - expo + 1
261
+ }
262
+
263
+ function InOut ( amount : number ) : number {
264
+ amount *= 2
265
+
266
+ if ( amount < 1 ) return In ( amount ) / 2
267
+
268
+ // Similar to In, but negate power to make the graph have a negative slope instead of positive.
269
+ let expo = base ** - ( amount - 1 )
270
+
271
+ // adjust so it hits 1 when amount is 1
272
+ expo = expo - expo * - ( 1 - amount )
273
+
274
+ // Flip it upside down, move it up by 2.
275
+ expo = - expo + 2
276
+
277
+ return expo / 2
278
+ }
279
+
280
+ return { In, Out, InOut}
281
+ } ,
222
282
}
223
283
224
284
export default Easing
0 commit comments