sveltekit-ui 1.1.74 → 1.1.76

package/src/lib/actions/swipe_handler.js

@@ -1,295 +0,0 @@
-export default function swipe_handler(node) {
-  let dy_inner = 0
-  let dy_outer = 0
-  let left_swipe = false
-  let right_swipe = false
-  let up_swipe = false
-  let down_swipe = false
-  let left_overflow_swipe = false
-  let right_overflow_swipe = false
-  let up_overflow_swipe = false
-  let down_overflow_swipe = false
-  const threshhold = 120
-  function set_dy(inner_val, outer_val) {
-    if (typeof inner_val === "number") {
-      dy_inner = inner_val
-    }
-    if (typeof outer_val === "number") {
-      dy_outer = outer_val
-    }
-    node.dispatchEvent(
-      new CustomEvent("dyChange", {
-        detail: {
-          dy_inner: dy_inner,
-          dy_outer: dy_outer,
-          dy: dy_inner + dy_outer,
-          is_at_top: is_at_top,
-          is_at_bottom: is_at_bottom,
-        },
-      })
-    )
-    if (!up_swipe && dy_inner + dy_outer > threshhold) {
-      up_swipe = true
-      node.dispatchEvent(new CustomEvent("up_swipe"))
-    }
-    if (!down_swipe && dy_inner + dy_outer < -threshhold) {
-      down_swipe = true
-      node.dispatchEvent(new CustomEvent("down_swipe"))
-    }
-    if (!up_overflow_swipe && dy_outer > threshhold) {
-      up_overflow_swipe = true
-      node.dispatchEvent(new CustomEvent("up_overflow_swipe"))
-    }
-    if (!down_overflow_swipe && dy_outer < -threshhold) {
-      down_overflow_swipe = true
-      node.dispatchEvent(new CustomEvent("down_overflow_swipe"))
-    }
-    if (dy_outer !== 0 || dy_inner !== 0) {
-      reset_timer()
-    }
-  }
-
-  let dx_inner = 0
-  let dx_outer = 0
-  function set_dx(inner_val, outer_val) {
-    if (typeof inner_val === "number") {
-      dx_inner = inner_val
-    }
-    if (typeof outer_val === "number") {
-      dx_outer = outer_val
-    }
-    node.dispatchEvent(
-      new CustomEvent("dx_change", {
-        detail: {
-          dx_inner: dx_inner,
-          dx_outer: dx_outer,
-          dx: dx_inner + dx_outer,
-          is_at_left: is_at_left,
-          is_at_right: is_at_right,
-        },
-      })
-    )
-    if (!left_swipe && dx_inner + dx_outer > threshhold) {
-      left_swipe = true
-      node.dispatchEvent(new CustomEvent("left_swipe"))
-    }
-    if (!right_swipe && dx_inner + dx_outer < -threshhold) {
-      right_swipe = true
-      node.dispatchEvent(new CustomEvent("right_swipe"))
-    }
-    if (!left_overflow_swipe && dx_outer > threshhold) {
-      left_overflow_swipe = true
-      node.dispatchEvent(new CustomEvent("left_overflow_swipe"))
-    }
-    if (!right_overflow_swipe && dx_outer < -threshhold) {
-      right_overflow_swipe = true
-      node.dispatchEvent(new CustomEvent("right_overflow_swipe"))
-    }
-    if (dx_outer !== 0 || dx_inner !== 0) {
-      reset_timer()
-    }
-  }
-
-  let timer_y
-  function reset_timer() {
-    timer_y && clearTimeout(timer_y)
-    timer_y = setTimeout(() => {
-      // set_dy(0, 0)
-      smooth_dy_to_zero()
-      smooth_dx_to_zero()
-      is_reference_scroll_top_set = false
-      touch_reference_y = null
-      is_reference_scroll_left_set = false
-      touch_reference_x = null
-    }, 200)
-  }
-
-  function smooth_dy_to_zero() {
-    // set_dy(0)
-    // smoothdy_outerToZero()
-    set_dy(0, 0)
-    up_swipe = false
-    down_swipe = false
-    up_overflow_swipe = false
-    down_overflow_swipe = false
-  }
-
-  function smooth_dx_to_zero() {
-    // set_dx(0)
-    // smoothdx_outerToZero()
-    set_dx(0, 0)
-    left_swipe = false
-    right_swipe = false
-    left_overflow_swipe = false
-    right_overflow_swipe = false
-  }
-
-  // function smoothdy_outerToZero(){
-  //   const dy_outerInc = Math.floor(Math.abs(dy_outer / 10)) + 1
-  //   const newdy_outer = dy_outer < 0 ? dy_outer + dy_outerInc : dy_outer > 0 ? dy_outer - dy_outerInc : 0
-  //   const dy_outerDur = Math.abs(newdy_outer) < 50 ? 50 - Math.abs(newdy_outer) : 1
-  //   if(newdy_outer < threshhold && newdy_outer > -threshhold && (down_swipe || up_swipe)){
-  //     down_swipe = false
-  //     up_swipe = false
-  //   }
-  //   setTimeout(() => {
-  //     set_dy(null, newdy_outer)
-  //     if(Math.abs(newdy_outer) !== 0){ smoothdy_outerToZero() }
-  //   }, dy_outerDur)
-  // }
-
-  // function smoothdx_outerToZero(){
-  //   const dx_outerInc = Math.floor(Math.abs(dx_outer / 10)) + 1
-  //   const newdx_outer = dx_outer < 0 ? dx_outer + dx_outerInc : dx_outer > 0 ? dx_outer - dx_outerInc : 0
-  //   const dx_outerDur = Math.abs(newdx_outer) < 50 ? 50 - Math.abs(newdx_outer) : 1
-  //   if(newdx_outer < threshhold && newdx_outer > -threshhold && (right_swipe || left_swipe)){
-  //     right_swipe = false
-  //     left_swipe = false
-  //   }
-  //   setTimeout(() => {
-  //     set_dx(null, newdx_outer)
-  //     if(Math.abs(newdx_outer) !== 0){ smoothdx_outerToZero() }
-  //   }, dx_outerDur)
-  // }
-
-  let is_at_top = true
-  let is_at_bottom = true
-  let reference_scroll_top = 0
-  let is_reference_scroll_top_set = false
-
-  let is_at_left = true
-  let is_at_right = true
-  let reference_scroll_left = 0
-  let is_reference_scroll_left_set = false
-  const handle_scroll = (e) => {
-    const was_at_top = is_at_top
-    const was_at_bottom = is_at_bottom
-    is_at_top = e.target.scrollTop === 0
-    is_at_bottom =
-      e.target.scrollHeight - e.target.offsetHeight - e.target.scrollTop === 0
-    if (was_at_top !== is_at_top) {
-      node.dispatchEvent(
-        new CustomEvent("is_at_top", { detail: { is_at_top: is_at_top } })
-      )
-    }
-    if (was_at_bottom !== is_at_bottom) {
-      node.dispatchEvent(
-        new CustomEvent("is_at_bottom", {
-          detail: { is_at_bottom: is_at_bottom },
-        })
-      )
-    }
-    if (!is_at_bottom && !is_at_top) {
-      if (!is_reference_scroll_top_set) {
-        is_reference_scroll_top_set = true
-        reference_scroll_top = e.target.scrollTop
-      }
-      set_dy(e.target.scrollTop - reference_scroll_top)
-      touch_reference_y = null
-    }
-    is_at_left = e.target.scrollLeft === 0
-    is_at_right =
-      e.target.scrollWidth - e.target.offsetWidth - e.target.scrollLeft === 0
-    if (!is_at_left && !is_at_right) {
-      if (!is_reference_scroll_left_set) {
-        is_reference_scroll_left_set = true
-        reference_scroll_left = e.target.scrollLeft
-      }
-      set_dx(e.target.scrollLeft - reference_scroll_left)
-      touch_reference_x = null
-    }
-  }
-
-  const handle_wheel = (e) => {
-    if (is_at_bottom || is_at_top) {
-      const stretched_dx = Math.round(e.deltaY / 2)
-      const adjusted_dy =
-        stretched_dx > 14 ? 14 : stretched_dx < -14 ? -14 : stretched_dx
-      set_dy(null, dy_outer + adjusted_dy)
-    }
-    if (is_at_left || is_at_right) {
-      const stretched_dx = Math.round(e.deltaX / 2)
-      const adjusted_dx =
-        stretched_dx > 14 ? 14 : stretched_dx < -14 ? -14 : stretched_dx
-      set_dx(null, dx_outer + adjusted_dx)
-    }
-    const is_moving_outer =
-      (is_at_left && dx_outer < -90) ||
-      (is_at_right && dx_outer > 90) ||
-      (is_at_top && dy_outer < -90) ||
-      (is_at_bottom && dy_outer > 90)
-    if (!is_moving_outer) {
-      // e.stopPropagation()
-    }
-  }
-
-  let touch_reference_y
-  let touch_reference_x
-  let dy_outer_at_start
-  let dx_outer_at_start
-  const handle_touchstart = (e) => {
-    touch_reference_y = e.changedTouches[0].clientY
-    dy_outer_at_start = dy_outer
-    touch_reference_x = e.changedTouches[0].clientX
-    dx_outer_at_start = dx_outer
-    // e.stopPropagation()
-  }
-
-  const handle_touchmove = (e) => {
-    if (is_at_bottom || is_at_top) {
-      if (!touch_reference_y) {
-        touch_reference_y = e.changedTouches[0].clientY
-        dy_outer_at_start = 0
-      }
-      set_dy(
-        null,
-        Math.round(
-          dy_outer_at_start + touch_reference_y - e.changedTouches[0].clientY
-        )
-      )
-    }
-    if (is_at_left || is_at_right) {
-      if (!touch_reference_x) {
-        touch_reference_x = e.changedTouches[0].clientX
-        dx_outer_at_start = 0
-      }
-      set_dx(
-        null,
-        Math.round(
-          dx_outer_at_start + touch_reference_x - e.changedTouches[0].clientX
-        )
-      )
-    }
-    const is_moving_outer =
-      (is_at_left && dx_outer < -90) ||
-      (is_at_right && dx_outer > 90) ||
-      (is_at_top && dy_outer < -90) ||
-      (is_at_bottom && dy_outer > 90)
-    if (!is_moving_outer) {
-      // e.stopPropagation()
-    }
-  }
-
-  const handleTouchend = () => {
-    smooth_dy_to_zero()
-    smooth_dx_to_zero()
-  }
-
-  node.addEventListener("scroll", handle_scroll)
-  node.addEventListener("wheel", handle_wheel, { passive: true })
-  node.addEventListener("touchstart", handle_touchstart, { passive: true })
-  node.addEventListener("touchmove", handle_touchmove, { passive: true })
-  node.addEventListener("touchend", handleTouchend, { passive: true })
-
-  return {
-    destroy() {
-      node.removeEventListener("scroll", handle_scroll)
-      node.removeEventListener("wheel", handle_wheel, { passive: true })
-      node.removeEventListener("touchstart", handle_touchstart, {
-        passive: true,
-      })
-      node.removeEventListener("touchmove", handle_touchmove, { passive: true })
-      node.removeEventListener("touchend", handleTouchend, { passive: true })
-    },
-  }
-}