Introduce updateVisibleParams()

Adds a function to wrap logic to update select boxes on history change
This commit is contained in:
Nikhil Tanwar 2022-06-22 13:46:30 +05:30 committed by Veloman Yunkan
parent b9e03d2772
commit 947744caea
1 changed files with 19 additions and 21 deletions

View File

@ -358,19 +358,13 @@
window.history.pushState({}, null, `${window.location.href.split('?')[0]}?${params.toString()}`); window.history.pushState({}, null, `${window.location.href.split('?')[0]}?${params.toString()}`);
setCookie(filterCookieName, params.toString()); setCookie(filterCookieName, params.toString());
} }
document.querySelectorAll('.filter').forEach(filter => { updateFilterColors();
if (filter.value) {
filter.style = 'background-color: #858585; color: #fff';
} else {
filter.style = 'background-color: #ffffff; color: black';
}
});
await loadAndDisplayBooks(true); await loadAndDisplayBooks(true);
} }
window.addEventListener('popstate', async () => { window.addEventListener('popstate', async () => {
await resetAndFilter(); await resetAndFilter();
document.querySelectorAll('.filter').forEach(filter => {filter.value = params.get(filter.name) || ''}); updateVisibleParams();
}); });
async function loadSubset() { async function loadSubset() {
@ -384,6 +378,21 @@
} }
} }
function updateFilterColors() {
document.querySelectorAll('.filter').forEach(filter => {
if (filter.value) {
filter.style = 'background-color: #858585; color: #fff';
} else {
filter.style = 'background-color: #ffffff; color: black';
}
});
}
function updateVisibleParams() {
document.querySelectorAll('.filter').forEach(filter => {filter.value = params.get(filter.name) || ''});
updateFilterColors();
}
window.addEventListener('resize', (event) => { window.addEventListener('resize', (event) => {
if (timer) {clearTimeout(timer)} if (timer) {clearTimeout(timer)}
timer = setTimeout(() => { timer = setTimeout(() => {
@ -422,12 +431,7 @@
if (filters) { if (filters) {
window.history.pushState({}, null, `${window.location.href.split('?')[0]}?${params.toString()}`); window.history.pushState({}, null, `${window.location.href.split('?')[0]}?${params.toString()}`);
} }
params.forEach((value, key) => { updateVisibleParams();
const selectBox = document.getElementsByName(key)[0];
if (selectBox) {
selectBox.value = value
}
});
document.getElementById('kiwixSearchForm').onsubmit = (event) => {event.preventDefault()}; document.getElementById('kiwixSearchForm').onsubmit = (event) => {event.preventDefault()};
if (!window.location.search) { if (!window.location.search) {
const browserLang = navigator.language.split('-')[0]; const browserLang = navigator.language.split('-')[0];
@ -438,13 +442,7 @@
langFilter.dispatchEvent(new Event('change')); langFilter.dispatchEvent(new Event('change'));
} }
} }
document.querySelectorAll('.filter').forEach(filter => {
if (filter.value) {
filter.style = 'background-color: #858585; color: #fff';
} else {
filter.style = 'background-color: #ffffff; color: black';
}
});
setCookie(filterCookieName, params.toString()); setCookie(filterCookieName, params.toString());
} }
})(); })();