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

clean up

Browse source
This commit is contained in:
partisan 2024-10-22 21:58:06 +02:00
parent 81a1add837
commit 5a4be6dad6
5 changed files with 133 additions and 177 deletions
Download patch file Download diff file Expand all files Collapse all files

13
static/js/dynamicscrolling.js
View file

@ -32,16 +32,21 @@ document.addEventListener("DOMContentLoaded", function() {
loadingIndicator.style.display = 'none';
const parser = new DOMParser();
const doc = parser.parseFromString(data, 'text/html');
const newResults = doc.getElementById('results').innerHTML;
const newResultsHTML = doc.getElementById('results').innerHTML;
const noResultsMessage = `No results found for '${query}'. Try different keywords.`;
const endOfResultsMessage = "Looks like this is the end of results.";
const serverError = "Internal Server Error";
if (newResults.includes(noResultsMessage) || newResults.includes(endOfResultsMessage) || newResults.includes(serverError)) {
document.getElementById('results').innerHTML += newResults;
const resultsContainer = document.getElementById('results');
const tempDiv = document.createElement('div');
tempDiv.innerHTML = newResultsHTML;
while (tempDiv.firstChild) {
resultsContainer.appendChild(tempDiv.firstChild);
}
if (newResultsHTML.includes(noResultsMessage) || newResultsHTML.includes(endOfResultsMessage) || newResultsHTML.includes(serverError)) {
hasMoreResults = false;
} else {
document.getElementById('results').innerHTML += newResults;
page = newPage;
// Automatically load more results if content height is less than window height
checkIfMoreResultsNeeded();

101
static/js/imageviewer.js Normal file
View file

@ -0,0 +1,101 @@
document.addEventListener('DOMContentLoaded', function() {
let viewerOpen = false;
const viewerOverlay = document.getElementById('image-viewer-overlay');
viewerOverlay.innerHTML = `
<div id="image-viewer" class="image_view image_hide">
<div class="image-view-close">
<!-- <button class="btn-nostyle">
<div id="viewer-prev-button" class="material-icons-round icon_visibility clickable image-before">navigate_before</div>
</button>
<button class="btn-nostyle">
<div id="viewer-next-button" class="material-icons-round icon_visibility clickable image-next">navigate_next</div>
</button> FIX THIS LATER! --!>
<button class="btn-nostyle">
<div id="viewer-close-button" class="material-icons-round icon_visibility clickable image-close">close</div>
</button>
</div>
<a class="image-viewer-link">
<div class="view-image" id="viewer-image-container">
<img id="viewer-image" class="view-image-img" src="" alt="">
</div>
</a>
<p class="image-alt" id="viewer-title"></p>
<p>View source: <a id="viewer-source-button" class="image-source" href="" target="_blank"></a></p>
<p>
<a class="full-size" href="#">Show source website</a>
<a class="proxy-size" href="#">Show in fullscreen</a>
</p>
</div>
`;
const imageView = document.getElementById('image-viewer');
function openImageViewer(element) {
const parentImageDiv = element.closest('.image');
if (!parentImageDiv) return;
const imgElement = parentImageDiv.querySelector('img.clickable');
const fullImageUrl = imgElement.dataset.proxyFull; // Use data-proxy-full for ProxyFull
const thumbnailUrl = imgElement.src; // Use ProxyThumb for the thumbnail
const title = imgElement.alt;
const sourceUrl = parentImageDiv.querySelector('.img_source').href; // Source webpage URL
if (!fullImageUrl || viewerOpen) {
return; // Don't open if data is missing or viewer is already open
}
viewerOpen = true;
const viewerImage = document.getElementById('viewer-image');
const viewerTitle = document.getElementById('viewer-title');
const viewerSourceButton = document.getElementById('viewer-source-button');
const fullSizeLink = imageView.querySelector('.full-size');
const proxySizeLink = imageView.querySelector('.proxy-size');
// Set the viewer image to ProxyFull
viewerImage.src = fullImageUrl;
viewerTitle.textContent = title;
viewerSourceButton.href = sourceUrl;
fullSizeLink.href = sourceUrl; // Link to the source website
proxySizeLink.href = fullImageUrl; // Link to the proxied full-size image
viewerOverlay.style.display = 'flex';
imageView.classList.remove('image_hide');
imageView.classList.add('image_show');
}
// Attach event listener to the document body
document.body.addEventListener('click', function(e) {
let target = e.target;
let clickableElement = target.closest('img.clickable, .img_title.clickable');
if (clickableElement) {
e.preventDefault();
openImageViewer(clickableElement);
}
});
function closeImageViewer() {
imageView.classList.remove('image_show');
imageView.classList.add('image_hide');
viewerOverlay.style.display = 'none';
viewerOpen = false;
}
// Close viewer on overlay or button click
document.getElementById('viewer-close-button').addEventListener('click', closeImageViewer);
viewerOverlay.addEventListener('click', function(e) {
if (e.target === viewerOverlay) {
closeImageViewer();
}
});
// Handle keyboard events for closing and navigation
document.addEventListener('keydown', function(e) {
if (viewerOverlay.style.display === 'flex') {
if (e.key === 'Escape') {
closeImageViewer();
}
}
});
});