Marown/heissepreise
1
0
Fork 0
mirror of https://github.com/badlogic/heissepreise.git synced 2024-06-24 09:25:53 +02:00
Code Issues Packages Projects Releases Wiki Activity

Allow searches to be shared, fixes badlogic/heissepreise#33

Browse Source
This commit is contained in:
Christian Tschugg 2023-05-30 11:52:35 +02:00
parent fe7c79e314
commit a9c37acb59
2 changed files with 29 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
site/main.js
View File

@ -18,14 +18,17 @@ async function load() {
showHideAll.showAll = !showHideAll.showAll;
})
return header;
}, (item, itemDom, items) => {
}, (item, itemDom, items, setQuery) => {
const chartCheckbox = dom("input");
const checked = (getQueryParameter("c") ?? []).includes(`${item.store}:${item.id}`);
chartCheckbox.setAttribute("type", "checkbox");
chartCheckbox.checked = checked;
item.chart = checked;
chartCheckbox.setAttribute("data-id", `${item.store}:${item.id}`);
const cell = dom("td", "");
cell.appendChild(chartCheckbox);
itemDom.appendChild(cell);
chartCheckbox.addEventListener("click", () => {
const handleClick = (eventShouldSetQuery = false) =>{
item.chart = chartCheckbox.checked;
const data = [];
items.forEach(i => { if (i.chart) data.push(i) });
@ -35,8 +38,10 @@ async function load() {
chartDom.style.display = "block";
showChart(chartDom, data);
}
});
!!eventShouldSetQuery && setQuery();
}
chartCheckbox.addEventListener("click", handleClick);
checked && handleClick();
return itemDom;
});
const query = getQueryParameter("q");

27
site/utils.js
View File

@ -56,7 +56,8 @@ function currentDate() {
*/
function getQueryParameter(name) {
const url = new URL(window.location.href);
return url.searchParams.get(name);
const params = url.searchParams.getAll(name);
return params.length > 1 ? params : params?.[0];
}
/**
@ -79,9 +80,9 @@ function toNumber(value, defaultValue) {
* @param {string} html Inner html
* @returns {HTMLElement} DOM element
*/
function dom(el, html) {
function dom(el, html = null) {
const element = document.createElement(el);
element.innerHTML = html;
if (html != null) element.innerHTML = html;
return element;
}
@ -383,6 +384,18 @@ function newSearchComponent(parentElement, items, searched, filter, headerModifi
const maxPrice = parentElement.querySelector(`#maxprice-${id}`);
const numResults = parentElement.querySelector(`#numresults-${id}`);
const setQuery = () => {
const query = searchInput.value.trim();
if (query.length === 0) {
queryLink.classList.add("hide");
return;
}
queryLink.classList.remove("hide");
const inputs = [...table.querySelectorAll("input:checked")];
const checked = inputs.length ? inputs.map(item => item.dataset.id) : getQueryParameter("c");
queryLink.setAttribute("href", `/?q=${encodeURIComponent(query)}${checked?.length ? `&c=${checked.join("&c=")}`: "" }`)
};
let search = (query) => {
let hits = [];
let now = performance.now();
@ -414,7 +427,7 @@ function newSearchComponent(parentElement, items, searched, filter, headerModifi
let num = 0;
hits.every(hit => {
let itemDom = itemToDOM(hit);
if (itemDomModifier) itemDom = itemDomModifier(hit, itemDom, hits);
if (itemDomModifier) itemDom = itemDomModifier(hit, itemDom, hits, setQuery);
table.appendChild(itemDom);
num++;
return num < 500;
@ -429,14 +442,12 @@ function newSearchComponent(parentElement, items, searched, filter, headerModifi
minPrice.value = 0;
maxPrice.value = 100;
}
if (query.length > 0 && query.charAt(0) == "!") {
if (query?.charAt(0) == "!") {
parentElement.querySelectorAll(".filters").forEach(f => f.style.display = "none");
queryLink.classList.remove("hide");
queryLink.setAttribute("href", "/?q=" + encodeURIComponent(query));
} else {
parentElement.querySelectorAll(".filters").forEach(f => f.style.display = "block");
queryLink.classList.add("hide");
}
setQuery();
search(searchInput.value);
});
budgetBrands.addEventListener("change", () => search(searchInput.value));