forked from sent/waves
❕❕❕❕
This commit is contained in:
𓍼
parent
9479504cc9
commit
55b199ac03
|
|
@ -1,43 +1,43 @@
|
|||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const searchInput = document.getElementById('gameSearchInput');
|
||||
const grid = document.querySelector('.games-grid');
|
||||
let gamesData = [];
|
||||
|
||||
fetch('/assets/data/g.json')
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
gamesData = data;
|
||||
searchInput.placeholder = `Search through ${gamesData.length} Games…`;
|
||||
displayGames(gamesData);
|
||||
searchInput.addEventListener('input', function() {
|
||||
const query = searchInput.value.toLowerCase();
|
||||
const filteredGames = gamesData.filter(game => {
|
||||
const name = game.name ? game.name.toLowerCase() : '';
|
||||
return name.includes(query);
|
||||
});
|
||||
displayGames(filteredGames);
|
||||
});
|
||||
})
|
||||
.catch(err => console.error('Error loading games data:', err));
|
||||
|
||||
function displayGames(games) {
|
||||
grid.innerHTML = '';
|
||||
if (games.length === 0) {
|
||||
grid.innerHTML = '<p>Zero games were found matching your search :(</p>';
|
||||
return;
|
||||
}
|
||||
games.forEach(game => {
|
||||
const card = document.createElement('div');
|
||||
card.classList.add('game-card');
|
||||
card.innerHTML = `
|
||||
const searchInput = document.getElementById('gameSearchInput');
|
||||
const grid = document.querySelector('.games-grid');
|
||||
let gamesData = [];
|
||||
|
||||
fetch('/assets/data/g.json')
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
gamesData = data;
|
||||
searchInput.placeholder = `Search through ${gamesData.length} Games…`;
|
||||
displayGames(gamesData);
|
||||
searchInput.addEventListener('input', function() {
|
||||
const query = searchInput.value.toLowerCase();
|
||||
const filtered = gamesData.filter(game => {
|
||||
const name = (game.name || '').toLowerCase();
|
||||
return name.includes(query);
|
||||
});
|
||||
displayGames(filtered);
|
||||
});
|
||||
})
|
||||
.catch(err => console.error('Error loading games data:', err));
|
||||
|
||||
function displayGames(games) {
|
||||
grid.innerHTML = '';
|
||||
if (games.length === 0) {
|
||||
grid.innerHTML = '<p>Zero games were found matching your search :(</p>';
|
||||
return;
|
||||
}
|
||||
games.forEach(game => {
|
||||
const card = document.createElement('div');
|
||||
card.classList.add('game-card');
|
||||
card.innerHTML = `
|
||||
<img src="/assets/g/${game.directory}/${game.image}" alt="${game.name} Icon" />
|
||||
<h2>${game.name}</h2>
|
||||
`;
|
||||
card.addEventListener('click', function() {
|
||||
const url = `${location.origin}/assets/g/${game.directory}`;
|
||||
window.handleSearch(url);
|
||||
});
|
||||
grid.appendChild(card);
|
||||
});
|
||||
}
|
||||
});
|
||||
card.addEventListener('click', function() {
|
||||
const url = `/assets/g/${game.directory}`;
|
||||
window.handleSearch(url);
|
||||
});
|
||||
grid.appendChild(card);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
|
@ -10,12 +10,12 @@ document.head.appendChild(style);
|
|||
const historyStack = [];
|
||||
let currentIndex = -1;
|
||||
const elements = {
|
||||
refreshIcon: document.getElementById('refreshIcon'),
|
||||
fullscreenIcon: document.getElementById('fullscreenIcon'),
|
||||
backIcon: document.getElementById('backIcon'),
|
||||
forwardIcon: document.getElementById('forwardIcon'),
|
||||
searchInput2: document.getElementById('searchInputt'),
|
||||
iframe: document.getElementById('cool-iframe')
|
||||
refreshIcon: document.getElementById('refreshIcon'),
|
||||
fullscreenIcon: document.getElementById('fullscreenIcon'),
|
||||
backIcon: document.getElementById('backIcon'),
|
||||
forwardIcon: document.getElementById('forwardIcon'),
|
||||
searchInput2: document.getElementById('searchInputt'),
|
||||
iframe: document.getElementById('cool-iframe')
|
||||
};
|
||||
let loadingFallbackTimeout;
|
||||
|
||||
|
|
@ -25,112 +25,99 @@ elements.backIcon.addEventListener('click', handleBack);
|
|||
elements.forwardIcon.addEventListener('click', handleForward);
|
||||
|
||||
function showLoadingScreen() {
|
||||
const loadingScreen = document.querySelector('.loading-screen');
|
||||
if (!loadingScreen) return;
|
||||
if (typeof NProgress !== 'undefined') NProgress.start();
|
||||
loadingScreen.style.display = 'flex';
|
||||
setTimeout(() => loadingScreen.style.opacity = 1, 10);
|
||||
clearTimeout(loadingFallbackTimeout);
|
||||
loadingFallbackTimeout = setTimeout(hideLoadingScreen, 10000);
|
||||
if (typeof NProgress !== 'undefined') NProgress.start();
|
||||
}
|
||||
|
||||
function hideLoadingScreen() {
|
||||
const loadingScreen = document.querySelector('.loading-screen');
|
||||
if (!loadingScreen) return;
|
||||
loadingScreen.style.opacity = 0;
|
||||
setTimeout(() => {
|
||||
loadingScreen.style.display = 'none';
|
||||
if (typeof NProgress !== 'undefined') NProgress.done();
|
||||
}, 500);
|
||||
clearTimeout(loadingFallbackTimeout);
|
||||
}
|
||||
|
||||
function handleRefresh() {
|
||||
elements.refreshIcon.classList.add('spin');
|
||||
const iframe = elements.iframe;
|
||||
const currentUrl = iframe.contentWindow.location.href;
|
||||
if (normalizeUrl(currentUrl) !== normalizeUrl(historyStack[currentIndex] || '')) {
|
||||
addToHistory(currentUrl);
|
||||
}
|
||||
iframe.contentWindow.location.reload(true);
|
||||
setTimeout(() => elements.refreshIcon.classList.remove('spin'), 300);
|
||||
elements.refreshIcon.classList.add('spin');
|
||||
const iframe = elements.iframe;
|
||||
const currentUrl = iframe.contentWindow.location.href;
|
||||
if (normalizeUrl(currentUrl) !== normalizeUrl(historyStack[currentIndex] || '')) {
|
||||
addToHistory(currentUrl);
|
||||
}
|
||||
iframe.contentWindow.location.reload(true);
|
||||
setTimeout(() => elements.refreshIcon.classList.remove('spin'), 300);
|
||||
}
|
||||
|
||||
function handleFullscreen() {
|
||||
const iframe = elements.iframe;
|
||||
if (iframe && iframe.tagName === 'IFRAME') iframe.requestFullscreen();
|
||||
const iframe = elements.iframe;
|
||||
if (iframe && iframe.tagName === 'IFRAME') iframe.requestFullscreen();
|
||||
}
|
||||
|
||||
function handleBack() {
|
||||
toggleButtonAnimation(elements.backIcon, 'button-animate-back');
|
||||
if (currentIndex > 0) {
|
||||
currentIndex--;
|
||||
updateIframeSrc();
|
||||
}
|
||||
toggleButtonAnimation(elements.backIcon, 'button-animate-back');
|
||||
if (currentIndex > 0) {
|
||||
currentIndex--;
|
||||
updateIframeSrc();
|
||||
}
|
||||
}
|
||||
|
||||
function handleForward() {
|
||||
toggleButtonAnimation(elements.forwardIcon, 'button-animate-forward');
|
||||
if (currentIndex < historyStack.length - 1) {
|
||||
currentIndex++;
|
||||
updateIframeSrc();
|
||||
}
|
||||
toggleButtonAnimation(elements.forwardIcon, 'button-animate-forward');
|
||||
if (currentIndex < historyStack.length - 1) {
|
||||
currentIndex++;
|
||||
updateIframeSrc();
|
||||
}
|
||||
}
|
||||
|
||||
function toggleButtonAnimation(button, animationClass) {
|
||||
button.classList.add(animationClass);
|
||||
setTimeout(() => button.classList.remove(animationClass), 200);
|
||||
button.classList.add(animationClass);
|
||||
setTimeout(() => button.classList.remove(animationClass), 200);
|
||||
}
|
||||
|
||||
function normalizeUrl(urlStr) {
|
||||
try {
|
||||
const url = new URL(urlStr);
|
||||
url.searchParams.delete('ia');
|
||||
return url.toString();
|
||||
} catch (e) {
|
||||
return urlStr;
|
||||
}
|
||||
try {
|
||||
const url = new URL(urlStr);
|
||||
url.searchParams.delete('ia');
|
||||
return url.toString();
|
||||
} catch (e) {
|
||||
return urlStr;
|
||||
}
|
||||
}
|
||||
|
||||
function addToHistory(url) {
|
||||
const normalized = normalizeUrl(url);
|
||||
if (currentIndex >= 0 && normalizeUrl(historyStack[currentIndex]) === normalized) return;
|
||||
if (currentIndex < historyStack.length - 1) historyStack.splice(currentIndex + 1);
|
||||
historyStack.push(url);
|
||||
currentIndex++;
|
||||
updateNavButtons();
|
||||
updateDecodedSearchInput();
|
||||
const normalized = normalizeUrl(url);
|
||||
if (currentIndex >= 0 && normalizeUrl(historyStack[currentIndex]) === normalized) return;
|
||||
if (currentIndex < historyStack.length - 1) historyStack.splice(currentIndex + 1);
|
||||
historyStack.push(url);
|
||||
currentIndex++;
|
||||
updateNavButtons();
|
||||
updateDecodedSearchInput();
|
||||
}
|
||||
|
||||
function updateIframeSrc() {
|
||||
showLoadingScreen();
|
||||
elements.iframe.src = historyStack[currentIndex];
|
||||
updateNavButtons();
|
||||
updateDecodedSearchInput();
|
||||
showLoadingScreen();
|
||||
elements.iframe.src = historyStack[currentIndex];
|
||||
updateNavButtons();
|
||||
updateDecodedSearchInput();
|
||||
}
|
||||
|
||||
function updateNavButtons() {
|
||||
const isAtStart = currentIndex <= 0;
|
||||
const isAtEnd = currentIndex >= historyStack.length - 1;
|
||||
elements.backIcon.disabled = isAtStart;
|
||||
elements.forwardIcon.disabled = isAtEnd;
|
||||
elements.backIcon.classList.toggle('disabled', isAtStart);
|
||||
elements.forwardIcon.classList.toggle('disabled', isAtEnd);
|
||||
const isAtStart = currentIndex <= 0;
|
||||
const isAtEnd = currentIndex >= historyStack.length - 1;
|
||||
elements.backIcon.disabled = isAtStart;
|
||||
elements.forwardIcon.disabled = isAtEnd;
|
||||
elements.backIcon.classList.toggle('disabled', isAtStart);
|
||||
elements.forwardIcon.classList.toggle('disabled', isAtEnd);
|
||||
}
|
||||
|
||||
function updateDecodedSearchInput() {
|
||||
if (elements.searchInput2) {
|
||||
const url = historyStack[currentIndex] || elements.iframe.src;
|
||||
elements.searchInput2.value = decodeUrl(url);
|
||||
}
|
||||
if (elements.searchInput2) {
|
||||
const url = historyStack[currentIndex] || elements.iframe.src;
|
||||
elements.searchInput2.value = decodeUrl(url);
|
||||
}
|
||||
}
|
||||
|
||||
function decodeUrl(url) {
|
||||
try {
|
||||
return decodeURIComponent(url);
|
||||
} catch (e) {
|
||||
return url;
|
||||
}
|
||||
try {
|
||||
return decodeURIComponent(url);
|
||||
} catch (e) {
|
||||
return url;
|
||||
}
|
||||
}
|
||||
|
||||
window.addToHistory = addToHistory;
|
||||
|
|
@ -138,39 +125,43 @@ window.updateDecodedSearchInput = updateDecodedSearchInput;
|
|||
window.normalizeUrl = normalizeUrl;
|
||||
|
||||
function detectIframeNavigation() {
|
||||
try {
|
||||
const iframeWindow = elements.iframe.contentWindow;
|
||||
const pushState = iframeWindow.history.pushState;
|
||||
const replaceState = iframeWindow.history.replaceState;
|
||||
iframeWindow.history.pushState = function() {
|
||||
pushState.apply(this, arguments);
|
||||
handleIframeNavigation(iframeWindow.location.href);
|
||||
};
|
||||
iframeWindow.history.replaceState = function() {
|
||||
replaceState.apply(this, arguments);
|
||||
handleIframeNavigation(iframeWindow.location.href);
|
||||
};
|
||||
iframeWindow.addEventListener('popstate', () => handleIframeNavigation(iframeWindow.location.href));
|
||||
iframeWindow.addEventListener('hashchange', () => handleIframeNavigation(iframeWindow.location.href));
|
||||
} catch (error) {}
|
||||
try {
|
||||
const iframeWindow = elements.iframe.contentWindow;
|
||||
const pushState = iframeWindow.history.pushState;
|
||||
const replaceState = iframeWindow.history.replaceState;
|
||||
iframeWindow.history.pushState = function() {
|
||||
pushState.apply(this, arguments);
|
||||
handleIframeNavigation(iframeWindow.location.href);
|
||||
};
|
||||
iframeWindow.history.replaceState = function() {
|
||||
replaceState.apply(this, arguments);
|
||||
handleIframeNavigation(iframeWindow.location.href);
|
||||
};
|
||||
iframeWindow.addEventListener('popstate', () => handleIframeNavigation(iframeWindow.location.href));
|
||||
iframeWindow.addEventListener('hashchange', () => handleIframeNavigation(iframeWindow.location.href));
|
||||
} catch (error) {}
|
||||
}
|
||||
|
||||
function handleIframeNavigation(url) {
|
||||
if (url && normalizeUrl(url) !== normalizeUrl(historyStack[currentIndex] || '')) {
|
||||
showLoadingScreen();
|
||||
addToHistory(url);
|
||||
}
|
||||
if (url && normalizeUrl(url) !== normalizeUrl(historyStack[currentIndex] || '')) {
|
||||
showLoadingScreen();
|
||||
addToHistory(url);
|
||||
} else {
|
||||
hideLoadingScreen();
|
||||
}
|
||||
}
|
||||
|
||||
elements.iframe.addEventListener('load', () => {
|
||||
try {
|
||||
detectIframeNavigation();
|
||||
if (historyStack.length === 0) {
|
||||
addToHistory(elements.iframe.contentWindow.location.href);
|
||||
} else {
|
||||
handleIframeNavigation(elements.iframe.contentWindow.location.href);
|
||||
try {
|
||||
detectIframeNavigation();
|
||||
if (historyStack.length === 0) {
|
||||
addToHistory(elements.iframe.contentWindow.location.href);
|
||||
} else {
|
||||
handleIframeNavigation(elements.iframe.contentWindow.location.href);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error during iframe load handling:', error);
|
||||
} finally {
|
||||
hideLoadingScreen();
|
||||
}
|
||||
} catch (error) {} finally {
|
||||
hideLoadingScreen();
|
||||
}
|
||||
});
|
||||
Loading…
Reference in New Issue
Block a user