// 无限循环左右滚动插件
const vhInfiniteLoop = {
  init: function (dom, k = true, time = 1) {
    const _this = this;
    // 设置唯一标识符并初始化
    const numStr = `${dom.classList.value}-num`;
    const widthStr = `${dom.classList.value}-width`;
    const funStr = `${dom.classList.value}-fun`;
    _this[numStr] = 0;
    _this[funStr] = null;
    // Copy一遍子元素DOM并添加到父元素DOM尾部
    Array.from(dom.children)
      .map(i => i.cloneNode(true))
      .forEach(i => dom.appendChild(i));
    // 取宽度，设置初始位置，绑定事件
    // 每个子元素给悬浮事件
    Array.from(dom.children).forEach(i => {
      // 悬浮事件
      i.addEventListener("mouseenter", function () {
        _this[funStr] = function () {
          requestAnimationFrame(() => {
            _this[funStr](dom, numStr, widthStr, k);
          });
        };
      });
      // 取消悬浮事件
      i.addEventListener("mouseleave", function () {
        _this[funStr] = function (dom, numStr, widthStr, k) {
          _this[widthStr] = dom.offsetWidth;
          !k && (dom.style.transform = `translateX(-${_this[widthStr] / 2}px)`);
          _this[numStr] += time;
          dom.style.marginLeft = `${k ? "-" : ""}${_this[numStr]}px`;
          _this[numStr] >= _this[widthStr] / 2 && (_this[numStr] = 0);
          requestAnimationFrame(() => {
            _this[funStr](dom, numStr, widthStr, k);
          });
        };
      });
    });
    // 设置循环函数
    _this[funStr] = function (dom, numStr, widthStr, k) {
      _this[widthStr] = dom.offsetWidth;
      !k && (dom.style.transform = `translateX(-${_this[widthStr] / 2}px)`);
      _this[numStr] += time;
      dom.style.marginLeft = `${k ? "-" : ""}${_this[numStr]}px`;
      _this[numStr] >= _this[widthStr] / 2 && (_this[numStr] = 0);
      requestAnimationFrame(() => {
        _this[funStr](dom, numStr, widthStr, k);
      });
    };
    // 启动
    requestAnimationFrame(() => {
      _this[funStr](dom, numStr, widthStr, k);
    });
  }
};
