{ if (e.clientY < 60 || window.innerHeight - e.clientY < 60) showUi(); }}>
{ if (adjacent.prev) { maybeMarkCurrentRead(); openReader(adjacent.prev, store.activeChapterList); } }} disabled={!adjacent.prev}>
{store.activeManga?.title}
/
{displayChapter?.name}
{ if (adjacent.next) { maybeMarkCurrentRead(); openReader(adjacent.next, store.activeChapterList); } }} disabled={!adjacent.next}>
{store.pageNumber} / {visibleChunkLastPage || "…"}
{#if fit === "width"}
{:else if fit === "height"}
{:else if fit === "screen"}
{:else}
{/if}
{fitLabel}
adjustZoom(-ZOOM_STEP)} title="Zoom out" disabled={zoom <= ZOOM_MIN}>
zoomOpen = !zoomOpen} title="Click to adjust zoom"> {zoomPct}%
adjustZoom(ZOOM_STEP)} title="Zoom in" disabled={zoom >= ZOOM_MAX}>
{#if zoomOpen}
{ captureZoomAnchor(); updateSettings({ readerZoom: clampZoom(Number(e.currentTarget.value) / 100) }); restoreZoomAnchor(); }} />
Reset
{/if}
updateSettings({ readingDirection: rtl ? "ltr" : "rtl" })}>
{rtl ? "RTL" : "LTR"}
{#if style === "single"}
{:else if style === "fade"}
{:else if style === "double"}
{:else}
{/if}
{style}
{#if style === "double"}
updateSettings({ offsetDoubleSpreads: !store.settings.offsetDoubleSpreads })}>
Offset
{/if} {#if style === "longstrip"}
updateSettings({ pageGap: !store.settings.pageGap })}>
Gap
updateSettings({ autoNextChapter: !autoNext })}>
Auto
{/if} {#if !autoNext}
updateSettings({ markReadOnNext: !markOnNext })}>
Mk.Read
{/if}
dlOpen = true}>
{#if markerOpen}
e.stopPropagation()} onmouseenter={() => { uiVisible = true; if (hideTimer) { clearTimeout(hideTimer); hideTimer = null; } }} >
{markerEditId ? "Edit marker" : "New marker"} · p.{store.pageNumber}
{#if markerEditId}
{/if}
{#each MARKER_COLORS as c}
markerColor = c} title={c} >
{c}
{/each}
{ uiVisible = true; if (hideTimer) { clearTimeout(hideTimer); hideTimer = null; } }} onkeydown={(e) => { if (e.key === "Enter" && !e.shiftKey) { e.preventDefault(); commitMarker(); } if (e.key === "Escape") { markerOpen = false; } }} >
{markerEditId ? "Update" : "Save"}
markerOpen = false}>Cancel
{/if}
{#if showResumeBanner}
{ resumeVisible = false; resumeFading = false; }}>
Bookmark at page {resumePage}
{/if}
{ if (e.ctrlKey) e.preventDefault(); }} onkeydown={(e) => { if (e.key === " " && style === "longstrip") { e.preventDefault(); containerEl?.scrollBy({ top: containerEl.clientHeight * 0.85, behavior: "smooth" }); } }} > {#if loading}
{/if} {#if error}
{error}
{/if} {#if style === "longstrip"} {#each stripToRender as chunk} {#each chunk.urls as url, i} {#await resolveUrl(url, chunk.urls.length - i)}
{:then src}
{/await} {/each} {/each}
{:else if style === "fade" && pageReady} {#await resolveUrl(store.pageUrls[store.pageNumber - 1], 999)}
{:then src}
{/await} {:else if style === "double" && pageReady} {#if pageGroups.length}
{#each currentGroup as pg, i} {#await resolveUrl(store.pageUrls[pg - 1], 999)}
{:then src}
{/await} {/each}
{:else}
{/if} {:else if pageReady} {#await resolveUrl(store.pageUrls[store.pageNumber - 1], 999)}
{:then src}
{/await} {/if}
{#if sliderMax > 1}
sliderHover = true} onmouseleave={() => { sliderHover = false; }} role="presentation" >
{#if isBookmarked && currentBookmark} {@const bPct = sliderMax > 1 ? ((currentBookmark.pageNumber - 1) / (sliderMax - 1)) * 100 : 0}
{/if} {#each activeChapterMarkers as m (m.id)} {@const mPct = sliderMax > 1 ? ((m.pageNumber - 1) / (sliderMax - 1)) * 100 : 0}
{/each}
sliderDragging = true} onmouseup={() => sliderDragging = false} ontouchstart={() => sliderDragging = true} ontouchend={() => sliderDragging = false} aria-label="Page {sliderPage} of {sliderMax}" /> {#if sliderHover || sliderDragging}
{sliderPage} / {sliderMax}
{/if}
{/if}
{#if dlOpen && store.activeChapter} {@const queueable = adjacent.remaining.filter(c => !c.isDownloaded)}
dlOpen = false}>
e.stopPropagation()}>
Download
runDl(() => gql(ENQUEUE_DOWNLOAD, { chapterId: store.activeChapter!.id }))}> This chapter
{store.activeChapter.isDownloaded ? "Already downloaded" : store.activeChapter.name}
runDl(() => gql(ENQUEUE_CHAPTERS_DOWNLOAD, { chapterIds: queueable.slice(0, nextN).map(c => c.id) }))}> Next chapters
{Math.min(nextN, queueable.length)} not yet downloaded
e.stopPropagation()}>
nextN = Math.max(1, nextN - 1)} disabled={nextN <= 1}>−
{nextN}
nextN = Math.min(queueable.length || 1, nextN + 1)} disabled={nextN >= queueable.length}>+
runDl(() => gql(ENQUEUE_CHAPTERS_DOWNLOAD, { chapterIds: queueable.map(c => c.id) }))}> All remaining
{queueable.length} not yet downloaded
{/if}