sorogon/StaticGalleryBuilder
1
0
Fork 0
mirror of https://github.com/greflm13/StaticGalleryBuilder.git synced 2026-04-17 11:30:08 +02:00
Code Issues Packages Projects Releases Wiki Activity

different prefetch

Browse Source
This commit is contained in:
Florian Greistorfer
2026-02-06 10:51:36 +01:00
committed by Florian Greistorfer
parent 104f0c18e9
commit ce6b5ebb39
3 changed files with 22 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
files/global.css
View File

@@ -353,6 +353,13 @@ input {
left: calc(50% + 1em - 1px); left: calc(50% + 1em - 1px);
} }
.imgprefetch {
position: absolute;
width: 0;
height: 0;
overflow: hidden;
}
@media screen and (max-width: 1000px) { @media screen and (max-width: 1000px) {
.column { .column {
-ms-flex: 25%; -ms-flex: 25%;

27
templates/functionality.js
View File

@@ -47,22 +47,21 @@ class PhotoGallery {
} }
prefetch(imgIndex) { prefetch(imgIndex) {
if (this.controllers[imgIndex]) { const prefetchDiv = document.getElementById("img-prefetch");
this.cancel(imgIndex); if (!prefetchDiv) return;
}
const controller = new AbortController(); const img = document.createElement("img");
const signal = controller.signal; img.src = this.shown[imgIndex]?.src || "";
this.controllers[imgIndex] = controller; prefetchDiv.appendChild(img);
const urlToFetch = this.shown[imgIndex]?.src;
if (urlToFetch) {
fetch(urlToFetch, { method: "GET", signal }).catch(() => {});
}
} }
cancel(imgIndex) { cancel(imgIndex) {
if (this.controllers[imgIndex]) { const prefetchDiv = document.getElementById("img-prefetch");
this.controllers[imgIndex].abort(); if (!prefetchDiv) return;
delete this.controllers[imgIndex];
const img = prefetchDiv.querySelector(`img[src="${this.shown[imgIndex]?.src || ""}"]`);
if (img) {
prefetchDiv.removeChild(img);
} }
} }
@@ -393,7 +392,7 @@ class PhotoGallery {
if (!isNaN(index)) this.openSwipe(index); if (!isNaN(index)) this.openSwipe(index);
}); });
imagelist.addEventListener("mouseover", (event) => { imagelist.addEventListener("mouseenter", (event) => {
const img = event.target.closest("img"); const img = event.target.closest("img");
if (!img || !img.dataset.index) return; if (!img || !img.dataset.index) return;
const index = parseInt(img.dataset.index); const index = parseInt(img.dataset.index);

3
templates/index.html.j2
View File

@@ -57,7 +57,7 @@
<script src="{{ root }}.static/functionality.min.js"></script> <script src="{{ root }}.static/functionality.min.js"></script>
</head> </head>
<body> <>
<div class="header"> <div class="header">
<ol class="navbar"> <ol class="navbar">
<div class="navleft"> <div class="navleft">
@@ -197,6 +197,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="imgprefetch" id="img-prefetch"></div>
</body> </body>
<script> <script>
new PhotoGallery(); new PhotoGallery();