/**
 * ldesign v0.2.14
 * (c) 2022/11/2 16:16 built by swimly
 * @license MIT
 */

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var components_message_const = require('./const.js');

const ANIMATION_OPTION = {
  duration: 200,
  easing: "linear"
};
function fadeIn(dom, placement) {
  if (!dom) return;
  const offsetWidth = (dom === null || dom === void 0 ? void 0 : dom.offsetWidth) || 0;
  const offsetHeight = (dom === null || dom === void 0 ? void 0 : dom.offsetHeight) || 0;
  const fadeInKeyframes = getFadeInKeyframes(placement, offsetWidth, offsetHeight);
  if (!fadeInKeyframes) return;
  const styleAfterFadeIn = fadeInKeyframes[fadeInKeyframes.length - 1];
  setDomStyleAfterAnimation(dom, styleAfterFadeIn);
  dom.animate && dom.animate(fadeInKeyframes, ANIMATION_OPTION);
}
function fadeOut(dom, placement, onFinish) {
  if (!dom) return;
  const offsetHeight = (dom === null || dom === void 0 ? void 0 : dom.offsetHeight) || 0;
  const fadeOutKeyframes = getFadeOutKeyframes(placement, offsetHeight);
  if (!fadeOutKeyframes) return onFinish();
  const styleAfterFadeOut = fadeOutKeyframes[fadeOutKeyframes.length - 1];
  setDomStyleAfterAnimation(dom, styleAfterFadeOut);
  const animation = dom.animate && dom.animate(fadeOutKeyframes, ANIMATION_OPTION);
  if (animation) {
    animation.onfinish = () => {
      dom.style.display = "none";
      onFinish();
    };
  } else {
    dom.style.display = "none";
    onFinish();
  }
}
function setDomStyleAfterAnimation(dom, styleAfterAnimation) {
  const keys = Object.keys(styleAfterAnimation);
  for (let i = 0; i < keys.length; i += 1) {
    const key = keys[i];
    dom.style[key] = styleAfterAnimation[key];
  }
}
function getFadeInKeyframes(placement, offsetWidth, offsetHeight) {
  if (!components_message_const.PLACEMENT_LIST.includes(placement)) return null;
  if (["top-left", "left", "bottom-left"].includes(placement)) {
    return [{
      opacity: 0,
      marginLeft: `-${offsetWidth}px`
    }, {
      opacity: 1,
      marginLeft: "0"
    }];
  }
  if (["top-right", "right", "bottom-right"].includes(placement)) {
    return [{
      opacity: 0,
      marginRight: `-${offsetWidth}px`
    }, {
      opacity: 1,
      marginRight: "0"
    }];
  }
  if (["top", "center"].includes(placement)) {
    return [{
      opacity: 0,
      marginTop: `-${offsetHeight}px`
    }, {
      opacity: 1,
      marginTop: "0"
    }];
  }
  if (["bottom"].includes(placement)) {
    return [{
      opacity: 0,
      transform: `translate3d(0, ${offsetHeight}px, 0)`
    }, {
      opacity: 1,
      transform: "translate3d(0, 0, 0)"
    }];
  }
}
function getFadeOutKeyframes(placement, offsetHeight) {
  if (!components_message_const.PLACEMENT_LIST.includes(placement)) return null;
  if (["bottom-left", "bottom", "bottom-right"].includes(placement)) {
    const marginOffset2 = `${offsetHeight}px`;
    return [{
      opacity: 1,
      marginTop: "0px"
    }, {
      opacity: 0,
      marginTop: marginOffset2
    }];
  }
  const marginOffset = `-${offsetHeight}px`;
  return [{
    opacity: 1,
    marginTop: "0px"
  }, {
    opacity: 0,
    marginTop: marginOffset
  }];
}

exports.fadeIn = fadeIn;
exports.fadeOut = fadeOut;
//# sourceMappingURL=animation.js.map
