/**
 * fix在ios中页面露底问题
 * @param {String or Dom} el touch时需要阻止露底的dom元素
 */
function stopScrollOver(el) {
  if (!(/(iPhone|iPad|iPod|iOS)/i.test(window.navigator.userAgent))) {
    return;
  }
  var content = typeof el == "string"
    ? document.querySelector(el)
    : el;
  var startY;
  if (!content) {
    return;
  }
  content
    .addEventListener("touchstart", function (e) {
      startY = e.touches[0].clientY;
    });
  content.addEventListener("touchmove", function (e) {
    // 高位表示向上滚动 底位表示向下滚动 1容许 0禁止
    var status = "11";
    var ele = this;
    var currentY = e.touches[0].clientY;
    if (ele.scrollTop === 0) {
      // 如果内容小于容器则同时禁止上下滚动
      status = ele.offsetHeight >= ele.scrollHeight
        ? "00"
        : "01";
    } else if (ele.scrollTop + ele.offsetHeight >= ele.scrollHeight) {
      // 已经滚到底部了只能向上滚动
      status = "10";
    }

    if (status != "11") {
      // 判断当前的滚动方向
      var direction = currentY - startY > 0
        ? "10"
        : "01";
      // 操作方向和当前允许状态求与运算，运算结果为0，就说明不允许该方向滚动，则禁止默认事件，阻止滚动
      if (!(parseInt(status, 2) & parseInt(direction, 2))) {
        e.preventDefault();
        e.stopPropagation();
        return;
      }
    }
  });
}
export default stopScrollOver;