diff --git a/GUI/index.html b/GUI/index.html index ac1f7c9..3266386 100644 --- a/GUI/index.html +++ b/GUI/index.html @@ -601,7 +601,11 @@ -
+
+
+ + +
diff --git a/GUI/js/mods.js b/GUI/js/mods.js index dfc77ba..115e05d 100644 --- a/GUI/js/mods.js +++ b/GUI/js/mods.js @@ -49,6 +49,18 @@ function setupModsEventListeners() { closeModalBtn.addEventListener('click', closeMyModsModal); } + const myModsSearchInput = document.getElementById('myModsSearch'); + if (myModsSearchInput) { + let myModsSearchTimeout; + myModsSearchInput.addEventListener('input', (e) => { + const query = e.target.value.toLowerCase().trim(); + clearTimeout(myModsSearchTimeout); + myModsSearchTimeout = setTimeout(() => { + filterInstalledMods(query); + }, 300); + }); + } + const modal = document.getElementById('myModsModal'); if (modal) { modal.addEventListener('click', (e) => { @@ -98,6 +110,10 @@ function openMyModsModal() { const modal = document.getElementById('myModsModal'); if (modal) { modal.classList.add('active'); + const searchInput = document.getElementById('myModsSearch'); + if (searchInput) { + searchInput.value = ''; + } loadInstalledMods(); } } @@ -106,6 +122,10 @@ function closeMyModsModal() { const modal = document.getElementById('myModsModal'); if (modal) { modal.classList.remove('active'); + const searchInput = document.getElementById('myModsSearch'); + if (searchInput) { + searchInput.value = ''; + } } } @@ -127,19 +147,39 @@ async function loadInstalledMods() { } } +function filterInstalledMods(query) { + if (!query || query === '') { + displayInstalledMods(installedMods); + return; + } + + const filtered = installedMods.filter(mod => { + const nameMatch = mod.name?.toLowerCase().includes(query); + const fileNameMatch = mod.fileName?.toLowerCase().includes(query); + const descriptionMatch = mod.description?.toLowerCase().includes(query); + const authorMatch = mod.author?.toLowerCase().includes(query); + return nameMatch || fileNameMatch || descriptionMatch || authorMatch; + }); + + displayInstalledMods(filtered); +} + function displayInstalledMods(mods) { const modsContainer = document.getElementById('installedModsList'); if (!modsContainer) return; if (mods.length === 0) { + const searchInput = document.getElementById('myModsSearch'); + const isSearching = searchInput && searchInput.value.trim() !== ''; + modsContainer.innerHTML = `
- -

No Mods Installed

-

Add mods from CurseForge or import local files

+ +

${isSearching ? 'No Mods Found' : 'No Mods Installed'}

+

${isSearching ? 'Try a different search term' : 'Add mods from CurseForge or import local files'}

`; - if (window.i18n) { + if (window.i18n && !isSearching) { const container = modsContainer.querySelector('.empty-installed-mods'); container.querySelector('h4').textContent = window.i18n.t('mods.noModsInstalled'); container.querySelector('p').textContent = window.i18n.t('mods.noModsInstalledDesc');