30-seconds-of-code/node_modules/gatsby-plugin-transition-link/AniLink/Swipe.js

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.default = SwipeOver;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));

var _react = _interopRequireDefault(require("react"));

var _ = _interopRequireDefault(require("../"));

var _gsap = require("gsap");

var _jsxFileName = "/Users/tylerbarnes/Documents/GitHub/transitionlink-workspace/gatsby-plugin-transition-link/src/AniLink/Swipe.js";
var boxShadow = "0 0 100px 10px rgba(0, 0, 0, 0.12941176470588237)";

var swipeTopDirection = function swipeTopDirection(direction, reverse) {
  var polarityPos = reverse ? "-" : "+";
  var polarityNeg = reverse ? "+" : "-";

  switch (direction) {
    case "down":
      return {
        y: polarityPos + "=100vh",
        ease: _gsap.Power1.easeIn
      };

    case "up":
      return {
        y: polarityNeg + "=100vh",
        ease: _gsap.Power1.easeIn
      };

    case "left":
      return {
        x: polarityNeg + "=100%",
        ease: _gsap.Power1.easeIn
      };

    default:
      return {
        x: polarityPos + "=100%",
        ease: _gsap.Power1.easeIn
      };
  }
};

var swipeBottomDirection = function swipeBottomDirection(direction, reverse, offset) {
  if (reverse === void 0) {
    reverse = false;
  }

  if (offset === void 0) {
    offset = 40;
  }

  var polarityPos = reverse ? "-" : "";
  var polarityNeg = reverse ? "" : "-";

  switch (direction) {
    case "down":
      return {
        y: "" + polarityNeg + offset + "vh",
        ease: _gsap.Power1.easeIn
      };

    case "up":
      return {
        y: "" + polarityPos + offset + "vh",
        ease: _gsap.Power1.easeIn
      };

    case "left":
      return {
        x: "" + polarityPos + offset + "%",
        ease: _gsap.Power1.easeIn
      };

    default:
      return {
        x: "" + polarityNeg + offset + "%",
        ease: _gsap.Power1.easeIn
      };
  }
};

var swipe = function swipe(_ref) {
  var node = _ref.node,
      exit = _ref.exit,
      direction = _ref.direction,
      top = _ref.top,
      triggerName = _ref.triggerName,
      entryOffset = _ref.entryOffset;
  var scrollTop = document.scrollingElement && document.scrollingElement.scrollTop || document.body.scrollTop || window.pageYOffset;

  if (triggerName === "entry" && top === "entry") {
    return new _gsap.TimelineMax().set(node, {
      boxShadow: boxShadow,
      overflowY: "hidden",
      height: "100vh",
      scrollTop: scrollTop
    }).from(node, exit.length, swipeTopDirection(direction, true)).set(node, {
      overflowY: "initial"
    });
  } else if (triggerName === "entry") {
    return new _gsap.TimelineMax().from(node, exit.length, swipeBottomDirection(direction, false, entryOffset));
  } else if (triggerName === "exit" && top === "exit") {
    return new _gsap.TimelineMax().set(node, {
      boxShadow: boxShadow,
      overflowY: "hidden",
      height: "100vh",
      scrollTop: scrollTop
    }).to(node, exit.length, swipeTopDirection(direction)).set(node, {
      overflowY: "initial"
    });
  } else {
    return new _gsap.TimelineMax().set(node, {
      boxShadow: boxShadow,
      overflowY: "hidden",
      height: "100vh",
      scrollTop: scrollTop
    }).to(node, exit.length, swipeBottomDirection(direction, true, entryOffset)).set(node, {
      overflowY: "initial"
    });
  }
};

function SwipeOver(_ref2) {
  var exit = _ref2.exit,
      entry = _ref2.entry,
      removedProp = _ref2.swipe,
      _ref2$entryOffset = _ref2.entryOffset,
      entryOffset = _ref2$entryOffset === void 0 ? 40 : _ref2$entryOffset,
      props = (0, _objectWithoutPropertiesLoose2.default)(_ref2, ["exit", "entry", "swipe", "entryOffset"]);
  var top = props.top || "exit";
  var exitLength = props.duration || 0.7;
  var entryLength = exitLength / 3.5;
  var entryZ = top === "entry" ? 1 : 0;
  var exitZ = top === "exit" ? 1 : 0;
  return _react.default.createElement(_.default, (0, _extends2.default)({
    exit: {
      length: exitLength,
      trigger: function trigger(_ref3) {
        var node = _ref3.node,
            exit = _ref3.exit;
        return swipe({
          node: node,
          exit: exit,
          direction: props.direction,
          top: top,
          entryOffset: entryOffset,
          triggerName: "exit"
        });
      },
      zIndex: exitZ
    },
    entry: {
      length: entryLength,
      trigger: function trigger(_ref4) {
        var node = _ref4.node,
            exit = _ref4.exit;
        return swipe({
          node: node,
          exit: exit,
          direction: props.direction,
          top: top,
          entryOffset: entryOffset,
          triggerName: "entry"
        });
      },
      zIndex: entryZ
    }
  }, props, {
    __source: {
      fileName: _jsxFileName,
      lineNumber: 98
    },
    __self: this
  }), props.children);
}