Chore: Switched Zoom-Keybinds & Moku-Full SVG (#53)

src/assets/moku-icon-full.svg

@@ -0,0 +1,22 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <rect width="512" height="512" fill="#091209"/>
+  <g transform="translate(256,265) rotate(7) scale(0.098,-0.098) translate(-5000,-4800)" fill="#2d7a5f" stroke="none">
+    <path d="M4908 6615 c-597 -629 -935 -1264 -934 -1755 0 -508 195 -778 790
+    -1098 l194 -104 22 -114 c33 -164 76 -271 140 -347 80 -94 106 -62 77 94 -47
+    255 43 443 294 613 797 539 714 1392 -250 2551 -230 278 -224 275 -333 160z
+    m52 -945 c0 -472 -8 -850 -17 -850 -36 0 -693 703 -692 740 2 48 167 321 309
+    509 175 233 359 451 380 451 13 0 20 -304 20 -850z m183 775 c120 -126 357
+    -447 356 -482 0 -18 -47 -83 -105 -144 -57 -61 -151 -163 -208 -225 -151 -166
+    -146 -180 -146 406 0 286 7 520 16 520 9 0 48 -34 87 -75z m541 -750 c86 -150
+    196 -391 196 -430 0 -8 -25 -42 -55 -75 -31 -33 -149 -163 -264 -290 -339
+    -374 -480 -520 -501 -520 -13 0 -20 167 -20 465 l1 465 151 170 c83 94 193
+    217 244 275 122 138 137 135 248 -60z m-1098 -633 l374 -378 0 -462 c0 -254
+    -5 -462 -11 -462 -6 0 -55 23 -110 50 l-99 51 0 208 c0 259 -11 288 -176 457
+    -196 200 -188 199 -326 62 l-117 -116 -35 79 c-71 161 -39 569 64 816 42 100
+    20 116 436 -305z m1349 23 c109 -390 -87 -848 -475 -1111 -207 -139 -305 -262
+    -338 -420 -7 -31 -21 -56 -32 -56 -36 -1 -46 86 -48 405 l-2 313 123 137 c68
+    75 214 236 325 357 454 493 421 466 447 375z m-1292 -785 c12 -29 15 -118 7
+    -215 l-14 -166 -73 44 c-174 104 -403 341 -403 416 0 15 47 70 105 123 l104
+    98 127 -125 c70 -69 136 -147 147 -175z"/>
+  </g>
+</svg>

src/features/reader/components/PageView.svelte

@@ -57,8 +57,22 @@
   let inspectPanStartX  = 0;
   let inspectPanStartY  = 0;
 
+  // Drag-to-scroll state for longstrip mode
+  let stripDragging    = false;
+  let stripDragMoved   = false;
+  let stripDragStartY  = 0;
+  let stripScrollStart = 0;
+
   export function onInspectMouseDown(e: MouseEvent) {
-    if (style === "longstrip" || readerState.inspectScale <= 1) return;
+    if (style === "longstrip") {
+      stripDragging    = true;
+      stripDragMoved   = false;
+      stripDragStartY  = e.clientY;
+      stripScrollStart = containerEl?.scrollTop ?? 0;
+      e.preventDefault();
+      return;
+    }
+    if (readerState.inspectScale <= 1) return;
     inspectDragging   = true;
     inspectDragMoved  = false;
     inspectDragStartX = e.clientX;
@@ -69,6 +83,12 @@
   }
 
   export function onInspectMouseMove(e: MouseEvent) {
+    if (stripDragging) {
+      const dy = e.clientY - stripDragStartY;
+      if (!stripDragMoved && Math.abs(dy) > 4) stripDragMoved = true;
+      if (containerEl) containerEl.scrollTop = stripScrollStart - dy;
+      return;
+    }
     if (!inspectDragging) return;
     if (!inspectDragMoved && Math.abs(e.clientX - inspectDragStartX) + Math.abs(e.clientY - inspectDragStartY) > 4) inspectDragMoved = true;
     const rawX = inspectPanStartX + (e.clientX - inspectDragStartX);
@@ -79,12 +99,18 @@
   }
 
   export function onInspectMouseUp() {
+    stripDragging   = false;
     inspectDragging = false;
   }
 
   export function handleWheel(e: WheelEvent) {
-    if (e.ctrlKey) { onWheel(e); return; }
-    if (style === "longstrip") return;
+    if (style === "longstrip") {
+      // In longstrip, Ctrl+scroll drives reader-level zoom; plain scroll scrolls naturally.
+      if (e.ctrlKey) { onWheel(e); }
+      return;
+    }
+    // In paged modes, Ctrl+scroll drives inspect-zoom (magnify); plain scroll pages forward/back.
+    if (!e.ctrlKey) { onWheel(e); return; }
     e.preventDefault();
     const delta = e.deltaY < 0 ? INSPECT_ZOOM_STEP : -INSPECT_ZOOM_STEP;
     const next  = Math.max(1, Math.min(INSPECT_ZOOM_MAX, readerState.inspectScale + delta));
@@ -107,6 +133,7 @@
   function handleTap(e: MouseEvent) {
     if (style === "longstrip") return;
     if (inspectDragMoved) { inspectDragMoved = false; return; }
+    if (stripDragMoved)   { stripDragMoved   = false; return; }
     onTap(e);
   }
 
@@ -128,6 +155,7 @@
   ondblclick={(e) => { if (tapToToggleBar) { const x = e.clientX / window.innerWidth; if (x >= 0.3 && x <= 0.7) onToggleUi(); } }}
   onmousedown={onInspectMouseDown}
   onwheel={(e) => { if (e.ctrlKey || style !== "longstrip") e.preventDefault(); }}
+  style:cursor={style === "longstrip" ? (stripDragging ? "grabbing" : "grab") : undefined}
   onkeydown={(e) => { if (e.key === " " && style === "longstrip") { e.preventDefault(); containerEl?.scrollBy({ top: containerEl.clientHeight * 0.85, behavior: "smooth" }); } }}
 >
 

src/features/reader/components/Reader.svelte

@@ -195,6 +195,8 @@
     if (x > 0.6) goNext(); else if (x < 0.4) goPrev();
   }
 
+  // onWheel is only invoked from PageView for longstrip Ctrl+scroll (reader-level zoom).
+  // In paged modes, Ctrl+scroll is handled inside PageView as inspect-zoom instead.
   function handleWheel(e: WheelEvent) {
     if (!e.ctrlKey) return;
     e.preventDefault();