Spitfire/Search
Spitfire/Search
1
0
Fork 0
Code Issues 8 Pull requests Projects Releases Packages Wiki Activity Actions

added dynamic lloading for images

Browse source
This commit is contained in:
partisan 2024-06-19 14:33:00 +02:00
parent 8f3f1e2d3e
commit 78c8fdbb4a
3 changed files with 211 additions and 133 deletions
Download patch file Download diff file Expand all files Collapse all files

15
templates/text.html
View file

@ -73,6 +73,9 @@
<div class="no-more-results">Looks like this is the end of results.</div>
{{end}}
</div>
<div class="message-bottom-left" id="message-bottom-left">
<span>Searching for new results...</span>
</div>
<div class="prev-next prev-img" id="prev-next">
<form action="/search" method="get">
<input type="hidden" name="q" value="{{ .Query }}">
@ -94,13 +97,23 @@
const query = "{{ .Query }}";
let loading = false;
let hasMoreResults = true;
const loadingIndicator = document.getElementById('message-bottom-left');
let loadingTimeout;
function loadResults(newPage) {
if (loading || !hasMoreResults) return;
loading = true;
// Show loading indicator if taking more than 100ms
loadingTimeout = setTimeout(() => {
loadingIndicator.style.display = 'flex';
}, 100);
fetch(`/search?q=${encodeURIComponent(query)}&t=text&p=${newPage}`)
.then(response => response.text())
.then(data => {
clearTimeout(loadingTimeout);
loadingIndicator.style.display = 'none';
const parser = new DOMParser();
const doc = parser.parseFromString(data, 'text/html');
const newResults = doc.getElementById('results').innerHTML;
@ -116,6 +129,8 @@
loading = false;
})
.catch(error => {
clearTimeout(loadingTimeout);
loadingIndicator.style.display = 'none';
console.error('Error loading results:', error);
loading = false;
});