Fix: Drag-Region for Reader Bar (#74)

This commit is contained in:
Youwes09
2026-05-14 08:07:14 -05:00
parent 2867dc9612
commit 17d739a1cd
2 changed files with 9 additions and 6 deletions
@@ -394,6 +394,7 @@
class="{imgCls}{store.settings.pageGap ? ' strip-gap' : ''}" class="{imgCls}{store.settings.pageGap ? ' strip-gap' : ''}"
loading="eager" loading="eager"
decoding="async" decoding="async"
draggable="false"
onload={(e) => { onload={(e) => {
const img = e.currentTarget as HTMLImageElement; const img = e.currentTarget as HTMLImageElement;
const slot = img.closest<HTMLElement>(".strip-slot"); const slot = img.closest<HTMLElement>(".strip-slot");
@@ -412,9 +413,9 @@
{:else if style === "fade" && pageReady} {: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)"> <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)} {#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} {: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} {/await}
</div> </div>
@@ -424,9 +425,9 @@
<div class="double-wrap"> <div class="double-wrap">
{#each currentGroup as pg, i} {#each currentGroup as pg, i}
{#await resolveUrl(store.pageUrls[pg - 1], 999)} {#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} {: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} {/await}
{/each} {/each}
</div> </div>
@@ -438,9 +439,9 @@
{:else if pageReady} {:else if pageReady}
<div class="inspect-wrap" style="transform:scale({readerState.inspectScale}) translate({readerState.inspectPanX / readerState.inspectScale}px,{readerState.inspectPanY / readerState.inspectScale}px)"> <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)} {#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} {: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} {/await}
</div> </div>
{/if} {/if}
@@ -118,6 +118,7 @@
class:bar-left={barPosition === "left"} class:bar-left={barPosition === "left"}
class:bar-right={barPosition === "right"} class:bar-right={barPosition === "right"}
class:hidden={!uiVisible} class:hidden={!uiVisible}
data-tauri-drag-region={barPosition === "top" ? true : undefined}
> >
<div class="bar-start"> <div class="bar-start">
<button class="icon-btn" onclick={closeReader} title="Close reader"><X size={15} weight="light" /></button> <button class="icon-btn" onclick={closeReader} title="Close reader"><X size={15} weight="light" /></button>
@@ -366,6 +367,7 @@
z-index: 2; z-index: 2;
transition: opacity 0.25s ease; transition: opacity 0.25s ease;
overflow: visible; overflow: visible;
user-select: none;
} }
.bar.hidden { opacity: 0; pointer-events: none; } .bar.hidden { opacity: 0; pointer-events: none; }