dev merge (#163)

Co-authored-by: soraefir
Co-authored-by: sora-ext
Reviewed-on: #163

src/client/helper/nav.ts

@@ -0,0 +1,49 @@
+import journey_wrapper from "../types/wrapper";
+
+var nav = {
+    scrollInterval: 0,
+    scrollDir: 'none',
+};
+
+
+const sideScroll = function (element: Element, direction: 'left' | 'right' | 'none', speed: number, step: number) {
+    nav.scrollDir = direction
+    if (direction == 'none') return;
+    nav.scrollInterval = setInterval(() => {
+        element.scrollLeft += (direction == 'left') ? -step : step;
+    }, speed);
+}
+
+export const focus_leg = function (journey: journey_wrapper, idx: number | null = null) {
+    const c = document.querySelector('.scroll-content.nav-leg')!!
+    console.log(idx, c, journey)
+    const item = c.children[(idx != null ? idx : journey.sel_leg) + 1];
+    c.scrollLeft = (item as any).offsetLeft + ((item as any).offsetWidth / 2) - (c as any).offsetWidth / 2
+}
+
+export const focus_day = function (journey: journey_wrapper, idx: number | null = null) {
+    const c = document.querySelector('.scroll-content.nav-day')!!
+    console.log(idx, c, journey)
+    const item = c.children[(idx != null ? idx : journey.sel_day) + 1];
+    c.scrollLeft = (item as any).offsetLeft + ((item as any).offsetWidth / 2) - (c as any).offsetWidth / 2;
+    //focus_leg(journey) // We dont render both navs anymore
+}
+
+export const nav_mousemove = function (e: PointerEvent) {
+    if (e.pointerType != 'mouse') return;
+    const c = (e.target as any).closest('.scroll-content') || (e.target as any).firstChild;
+    const left = e.pageX - c.getBoundingClientRect().left;
+    const newDir =
+        left < c.offsetWidth * 0.1 ? 'left' :
+            (left > c.offsetWidth * 0.9 ? 'right' : 'none')
+    if (!nav.scrollInterval || nav.scrollDir != newDir) {
+        if (nav.scrollInterval) clearInterval(nav.scrollInterval)
+        sideScroll(c, newDir, 25, 10);
+    }
+}
+export const nav_mouseleave = function (_e: PointerEvent) {
+    clearInterval(nav.scrollInterval);
+    nav.scrollDir = 'none'
+    nav.scrollInterval = 0
+}
+