From d544252e3e54e61012d0f9e3b4c2a539f79db773 Mon Sep 17 00:00:00 2001
From: Leeingnyo <dyd1928@naver.com>
Date: Wed, 18 Aug 2021 22:00:39 +0900
Subject: [PATCH] Add preload lookahead controller

---
 public/js/reader.js       | 6 +++++-
 src/views/reader.html.ecr | 7 +++++++
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/public/js/reader.js b/public/js/reader.js
index a2a422a..79943af 100644
--- a/public/js/reader.js
+++ b/public/js/reader.js
@@ -55,7 +55,7 @@ const readerComponent = () => {
 					}
 
 					// Preload Images
-					this.preloadLookahead = 3;
+					this.preloadLookahead = +localStorage.getItem('preloadLookahead') ?? 3;
 					const limit = Math.min(page + this.preloadLookahead, this.items.length + 1);
 					for (let idx = page + 1; idx <= limit; idx++) {
 						this.preloadImage(this.items[idx - 1].url);
@@ -305,6 +305,10 @@ const readerComponent = () => {
 		marginChanged() {
 			localStorage.setItem('margin', this.margin);
 			this.toPage(this.selectedIndex);
+		},
+
+		preloadLookaheadChanged() {
+			localStorage.setItem('preloadLookahead', this.preloadLookahead);
 		}
 	};
 }
diff --git a/src/views/reader.html.ecr b/src/views/reader.html.ecr
index 6b7bb11..9b4e693 100644
--- a/src/views/reader.html.ecr
+++ b/src/views/reader.html.ecr
@@ -98,6 +98,13 @@
             </div>
           </div>
 
+          <div class="uk-margin" x-show="mode !== 'continuous'">
+            <label class="uk-form-label" for="preload-lookahead" x-text="`Preload Image: ${preloadLookahead} page(s)`"></label>
+            <div class="uk-form-controls">
+              <input id="preload-lookahead" class="uk-range" type="range" min="0" max="5" step="1" x-model.number="preloadLookahead" @change="preloadLookaheadChanged()">
+            </div>
+          </div>
+
           <hr class="uk-divider-icon">
 
           <div class="uk-margin">