tarun-dugar

smoothScroll({
  scrollElement: window,
  scrollAmount: 300,
  cubicBezierPoints: {
    x1: 0.2,
    x2: 0.5,
    y1: 0.5,
    y2: 0.9
  },
  onRefUpdateCallback: (animationInstance) => {

tarun-dugar

function smoothScroll(scrollParams) {
  const elementToScroll = scrollParams.element;
  const isWindow = elementToScroll === window;
  const scrollDirectionProp = isWindow ? 'scrollX' : 'scrollLeft';
  const elementWidthProp = isWindow ? 'innerWidth' : 'clientWidth';
  const scrollLengthProp = 'scrollWidth';
  const initialScrollPosition = elementToScroll[scrollDirectionProp];
  let totalScroll = getTotalScroll({
    isWindow,
    elementToScroll,

tarun-dugar

import EASINGS from './easings';
import getScrollTo from './bezier';

const getProgress = ({
  easingPreset, 
  cubicBezierPoints,
  duration,
  runTime
}) => {
  const percentTimeElapsed = runTime / duration;

tarun-dugar

const B1 = (t) => {
  return Math.pow(t, 3);
};

const B2 = (t) => {
  return 3 * t * t * (1 - t);
};

const B3 = (t) => {
  return 3 * t * Math.pow((1 - t), 2);

tarun-dugar

tarun-dugar

export default {
  // no easing, no acceleration
  linear(t) { return t },
  // accelerating from zero velocity
  easeInQuad(t) { return t * t },
  // decelerating to zero velocity
  easeOutQuad(t) { return t * (2 - t) },
  // acceleration until halfway, then deceleration
  easeInOutQuad(t) { return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t },
  // accelerating from zero velocity 

tarun-dugar

function smoothScroll(scrollParams) {
  const elementToScroll = scrollParams.element;
  const isWindow = elementToScroll === window;
  const scrollDirectionProp = isWindow ? 'scrollX' : 'scrollLeft';
  const elementWidthProp = isWindow ? 'innerWidth' : 'clientWidth';
  const scrollLengthProp = 'scrollWidth';
  const initialScrollPosition = elementToScroll[scrollDirectionProp];
  ...
}

tarun-dugar

// returns the total scroll amount in pixels
const getTotalScroll = ({
  isWindow,
  elementToScroll,
  elementWidthProp,
  initialScrollPosition,
  scrollLengthProp
}) => {
  let totalScroll;