// 嗅探transform可支持的前缀
const elementStyle = document.createElement('div').style
const vendor = (function getVendor() {
  const vendors = ['t', 'webkitT', 'MozT', 'msT', 'OT']
  let transform
  let i = 0
  const l = vendors.length
  for (; i < l; i += 1) {
    transform = `${vendors[i]}ransform`
    if (transform in elementStyle)
      return vendors[i].substr(0, vendors[i].length - 1)
  }

  return false
})()

const prefixStyle = function prefixStyle(style) {
  if (vendor === false) return false
  if (vendor === '') return style
  return vendor + style.charAt(0).toUpperCase() + style.substr(1)
}

const transition = {
  prefixStyle,
  transform: prefixStyle('transform'),
  transformProperty: prefixStyle('transitionProperty'),
  transitionDuration: prefixStyle('transitionDuration'),
  transitionTimingFunction: prefixStyle('transitionTimingFunction'),
  /* eslint no-param-reassign: ["error", { "props": false }] */
  // 设置transition属性
  setProperty(obj, property) {
    obj.style[prefixStyle('transitionProperty')] = property
  },
  // 页面滑动到指定位置
  setTransform(obj, x, y) {
    obj.style[prefixStyle('transform')] = `translate3d(${x}px,${y}px, 0px)`
  },
  // 设置transition间隔时间
  setDuration(obj, time) {
    obj.style[prefixStyle('transitionDuration')] = `${time}ms`
  },
  // 设置scale
  setScale(obj, scale) {
    obj.style[prefixStyle('transform')] = `scale(${scale})`
  },
  // 设置transition的动画贝塞尔曲线
  setTimingFunction(obj, easing) {
    obj.style[prefixStyle('transitionTimingFunction')] = easing
  },
}
export default transition
