summaryrefslogtreecommitdiffstatshomepage
diff options
context:
space:
mode:
authorWolfgang Müller2024-07-21 15:35:43 +0200
committerWolfgang Müller2024-07-22 14:08:40 +0200
commit4d710514f5d7931bfd0673c6d44c5a1d725a5cd3 (patch)
tree1e80b2ee32109ac0be49f5e2c5077957bdea29b8
parentd297c6310a6a4db8dd7cc3efe6ff59620deadcc0 (diff)
downloadhircine-4d710514f5d7931bfd0673c6d44c5a1d725a5cd3.tar.gz
frontend/reader: Preload the next set of images
-rw-r--r--frontend/src/lib/reader/PageView.svelte22
1 files changed, 22 insertions, 0 deletions
diff --git a/frontend/src/lib/reader/PageView.svelte b/frontend/src/lib/reader/PageView.svelte
index cc4d10e..59136b4 100644
--- a/frontend/src/lib/reader/PageView.svelte
+++ b/frontend/src/lib/reader/PageView.svelte
@@ -2,6 +2,7 @@
import { Direction, Layout, type PageFragment } from '$gql/graphql';
import { getReaderContext, partition, type Chunk } from '$lib/Reader';
import { binds } from '$lib/Shortcuts';
+ import { src } from '$lib/Utils';
import ReaderPage from './ReaderPage.svelte';
const reader = getReaderContext();
@@ -21,6 +22,22 @@
$reader.page = chunks[to].index;
}
+ function pagesAround(around: number) {
+ const peek = (at: number) => {
+ if (at < 0 || at >= chunks.length) return [];
+
+ const pages = [chunks[at].main];
+
+ if (chunks[at].secondary) {
+ pages.push(chunks[at].secondary);
+ }
+
+ return pages;
+ };
+
+ return [...peek(lookup[around] + 1), ...peek(lookup[around] - 1)];
+ }
+
const next = () => gotoChunk(lookup[$reader.page] + 1);
const prev = () => gotoChunk(lookup[$reader.page] - 1);
@@ -65,3 +82,8 @@
<ReaderPage page={secondary} on:click={next} --justify="flex-end" />
<ReaderPage page={main} on:click={prev} --justify="flex-start" />
{/if}
+<div class="invisible absolute">
+ {#each pagesAround($reader.page) as page}
+ <img src={src(page.image, 'full')} alt="" />
+ {/each}
+</div>