From 17d739a1cd6b552cf55627714f20035cfae23fe8 Mon Sep 17 00:00:00 2001
From: Youwes09 <yuvi.shen@outlook.com>
Date: Thu, 14 May 2026 08:07:14 -0500
Subject: [PATCH] Fix: Drag-Region for Reader Bar (#74)

---
 src/features/reader/components/PageView.svelte      | 13 +++++++------
 .../reader/components/ReaderControls.svelte         |  2 ++
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/features/reader/components/PageView.svelte b/src/features/reader/components/PageView.svelte
index e8acb0c..97c574f 100644
--- a/src/features/reader/components/PageView.svelte
+++ b/src/features/reader/components/PageView.svelte
@@ -394,6 +394,7 @@
               class="{imgCls}{store.settings.pageGap ? ' strip-gap' : ''}"
               loading="eager"
               decoding="async"
+              draggable="false"
               onload={(e) => {
                 const img = e.currentTarget as HTMLImageElement;
                 const slot = img.closest<HTMLElement>(".strip-slot");
@@ -412,9 +413,9 @@
     {:else if style === "fade" && pageReady}
       <div class="inspect-wrap" style="transform:scale({readerState.inspectScale}) translate({readerState.inspectPanX / readerState.inspectScale}px,{readerState.inspectPanY / readerState.inspectScale}px)">
         {#await resolveUrl(store.pageUrls[store.pageNumber - 1], 999)}
-          <img src="" alt="Page {store.pageNumber}" class={imgCls} decoding="async" style="opacity:0" />
+          <img src="" alt="Page {store.pageNumber}" class={imgCls} decoding="async" style="opacity:0" draggable="false" />
         {:then src}
-          <img {src} alt="Page {store.pageNumber}" class={imgCls} decoding="async" style="opacity: {fadingOut ? 0 : 1}; transition: opacity 0.1s ease;" />
+          <img {src} alt="Page {store.pageNumber}" class={imgCls} decoding="async" style="opacity: {fadingOut ? 0 : 1}; transition: opacity 0.1s ease;" draggable="false" />
         {/await}
       </div>
 
@@ -424,9 +425,9 @@
           <div class="double-wrap">
             {#each currentGroup as pg, i}
               {#await resolveUrl(store.pageUrls[pg - 1], 999)}
-                <img src="" alt="Page {pg}" class="{imgCls} page-half {i === 0 ? 'gap-left' : 'gap-right'}" decoding="async" />
+                <img src="" alt="Page {pg}" class="{imgCls} page-half {i === 0 ? 'gap-left' : 'gap-right'}" decoding="async" draggable="false" />
               {:then src}
-                <img {src} alt="Page {pg}" class="{imgCls} page-half {i === 0 ? 'gap-left' : 'gap-right'}" decoding="async" />
+                <img {src} alt="Page {pg}" class="{imgCls} page-half {i === 0 ? 'gap-left' : 'gap-right'}" decoding="async" draggable="false" />
               {/await}
             {/each}
           </div>
@@ -438,9 +439,9 @@
     {:else if pageReady}
       <div class="inspect-wrap" style="transform:scale({readerState.inspectScale}) translate({readerState.inspectPanX / readerState.inspectScale}px,{readerState.inspectPanY / readerState.inspectScale}px)">
         {#await resolveUrl(store.pageUrls[store.pageNumber - 1], 999)}
-          <img src="" alt="Page {store.pageNumber}" class={imgCls} decoding="async" />
+          <img src="" alt="Page {store.pageNumber}" class={imgCls} decoding="async" draggable="false" />
         {:then src}
-          <img {src} alt="Page {store.pageNumber}" class={imgCls} decoding="async" />
+          <img {src} alt="Page {store.pageNumber}" class={imgCls} decoding="async" draggable="false" />
         {/await}
       </div>
     {/if}
diff --git a/src/features/reader/components/ReaderControls.svelte b/src/features/reader/components/ReaderControls.svelte
index b1240d9..8625643 100644
--- a/src/features/reader/components/ReaderControls.svelte
+++ b/src/features/reader/components/ReaderControls.svelte
@@ -118,6 +118,7 @@
   class:bar-left={barPosition === "left"}
   class:bar-right={barPosition === "right"}
   class:hidden={!uiVisible}
+  data-tauri-drag-region={barPosition === "top" ? true : undefined}
 >
   <div class="bar-start">
     <button class="icon-btn" onclick={closeReader} title="Close reader"><X size={15} weight="light" /></button>
@@ -366,6 +367,7 @@
     z-index: 2;
     transition: opacity 0.25s ease;
     overflow: visible;
+    user-select: none;
   }
   .bar.hidden { opacity: 0; pointer-events: none; }