Home Reference Source

src/ease/index.js

  1. import { PI } from '../constants';
  2.  
  3. /**
  4.  * The Ease class provides a collection of easing functions for use with System
  5.  */
  6. export const ease = {
  7.   easeLinear: function(value) {
  8.     return value;
  9.   },
  10.  
  11.   easeInQuad: function(value) {
  12.     return Math.pow(value, 2);
  13.   },
  14.  
  15.   easeOutQuad: function(value) {
  16.     return -(Math.pow(value - 1, 2) - 1);
  17.   },
  18.  
  19.   easeInOutQuad: function(value) {
  20.     if ((value /= 0.5) < 1) return 0.5 * Math.pow(value, 2);
  21.  
  22.     return -0.5 * ((value -= 2) * value - 2);
  23.   },
  24.  
  25.   easeInCubic: function(value) {
  26.     return Math.pow(value, 3);
  27.   },
  28.  
  29.   easeOutCubic: function(value) {
  30.     return Math.pow(value - 1, 3) + 1;
  31.   },
  32.  
  33.   easeInOutCubic: function(value) {
  34.     if ((value /= 0.5) < 1) return 0.5 * Math.pow(value, 3);
  35.  
  36.     return 0.5 * (Math.pow(value - 2, 3) + 2);
  37.   },
  38.  
  39.   easeInQuart: function(value) {
  40.     return Math.pow(value, 4);
  41.   },
  42.  
  43.   easeOutQuart: function(value) {
  44.     return -(Math.pow(value - 1, 4) - 1);
  45.   },
  46.  
  47.   easeInOutQuart: function(value) {
  48.     if ((value /= 0.5) < 1) return 0.5 * Math.pow(value, 4);
  49.  
  50.     return -0.5 * ((value -= 2) * Math.pow(value, 3) - 2);
  51.   },
  52.  
  53.   easeInSine: function(value) {
  54.     return -Math.cos(value * (PI / 2)) + 1;
  55.   },
  56.  
  57.   easeOutSine: function(value) {
  58.     return Math.sin(value * (PI / 2));
  59.   },
  60.  
  61.   easeInOutSine: function(value) {
  62.     return -0.5 * (Math.cos(PI * value) - 1);
  63.   },
  64.  
  65.   easeInExpo: function(value) {
  66.     return value === 0 ? 0 : Math.pow(2, 10 * (value - 1));
  67.   },
  68.  
  69.   easeOutExpo: function(value) {
  70.     return value === 1 ? 1 : -Math.pow(2, -10 * value) + 1;
  71.   },
  72.  
  73.   easeInOutExpo: function(value) {
  74.     if (value === 0) return 0;
  75.     if (value === 1) return 1;
  76.     if ((value /= 0.5) < 1) return 0.5 * Math.pow(2, 10 * (value - 1));
  77.  
  78.     return 0.5 * (-Math.pow(2, -10 * --value) + 2);
  79.   },
  80.  
  81.   easeInCirc: function(value) {
  82.     return -(Math.sqrt(1 - value * value) - 1);
  83.   },
  84.  
  85.   easeOutCirc: function(value) {
  86.     return Math.sqrt(1 - Math.pow(value - 1, 2));
  87.   },
  88.  
  89.   easeInOutCirc: function(value) {
  90.     if ((value /= 0.5) < 1) return -0.5 * (Math.sqrt(1 - value * value) - 1);
  91.  
  92.     return 0.5 * (Math.sqrt(1 - (value -= 2) * value) + 1);
  93.   },
  94.  
  95.   easeInBack: function(value) {
  96.     var s = 1.70158;
  97.  
  98.     return value * value * ((s + 1) * value - s);
  99.   },
  100.  
  101.   easeOutBack: function(value) {
  102.     var s = 1.70158;
  103.  
  104.     return (value = value - 1) * value * ((s + 1) * value + s) + 1;
  105.   },
  106.  
  107.   easeInOutBack: function(value) {
  108.     var s = 1.70158;
  109.  
  110.     if ((value /= 0.5) < 1)
  111.       return 0.5 * (value * value * (((s *= 1.525) + 1) * value - s));
  112.  
  113.     return 0.5 * ((value -= 2) * value * (((s *= 1.525) + 1) * value + s) + 2);
  114.   }
  115. };
  116.  
  117. export const {
  118.   easeLinear,
  119.   easeInQuad,
  120.   easeOutQuad,
  121.   easeInOutQuad,
  122.   easeInCubic,
  123.   easeOutCubic,
  124.   easeInOutCubic,
  125.   easeInQuart,
  126.   easeOutQuart,
  127.   easeInOutQuart,
  128.   easeInSine,
  129.   easeOutSine,
  130.   easeInOutSine,
  131.   easeInExpo,
  132.   easeOutExpo,
  133.   easeInOutExpo,
  134.   easeInCirc,
  135.   easeOutCirc,
  136.   easeInOutCirc,
  137.   easeInBack,
  138.   easeOutBack,
  139.   easeInOutBack
  140. } = ease;
  141.  
  142. export const setEasingByName = easeName => {
  143.   if (ease[easeName]) return ease[easeName];
  144.   else return ease.easeLinear;
  145. };
  146.  
  147. export const getEasingByName = name =>
  148.   ease[name] ? ease[name] : ease.easeLinear;