/**
 * 计算二次函数参数
 * @param depart
 * @param targetX
 * @returns {[number, *, *]}
 */
const quadraticCurve = (depart, targetX) => {
  const k = depart.x - window.innerWidth / 8
  const x2 = targetX + 2 * (k - targetX)
  const a = depart.y / ((depart.x - targetX) * (depart.x - x2))

  return [a, targetX, x2]
}

/**
 * 执行动画
 * @param departEle
 * @param targetX
 * @param className
 * @param frame
 */
export const quadratic = (
  departEle,
  targetX = 0,
  className = 'float-icon',
  frame = 25
) => {
  const { right, bottom } = departEle.getBoundingClientRect()
  const [a, x1, x2] = quadraticCurve(
    { x: right, y: window.innerHeight - bottom },
    targetX
  )

  let currentFrame = 0
  const interval = right / frame
  const childNode = document.createElement('div')
  childNode.classList.add(className)
  document.getElementsByTagName('body')[0].appendChild(childNode)
  setTimeout(() => {
    childNode.remove()
  }, 1000)

  const animation = () => {
    if (currentFrame >= frame) return
    currentFrame += 1
    const x = right - interval * currentFrame
    childNode.style.left = `${x}px`
    childNode.style.bottom = `${Math.min(
      a * (x - x1) * (x - x2) - window.pageYOffset,
      window.innerHeight
    )}px`
    window.requestAnimationFrame(() => animation())
  }
  animation()
}