function updateCharts(canvasDom, items) { const now = performance.now(); const sum = document.querySelector("#sum").checked; const sumStores = document.querySelector("#sumstores").checked; const todayOnly = document.querySelector("#todayonly").checked; let startDate = document.querySelector("#start").value; let endDate = document.querySelector("#end").value; if (start > endDate) { let tmp = start; start = endDate; endDate = tmp; } showCharts(canvasDom, items, sum, sumStores, todayOnly, startDate, endDate); console.log("Updating charts took: " + (performance.now() - now) / 1000 + " seconds"); } async function load() { const items = await loadItems(); const chartDom = document.querySelector("#chart"); const canvasDom = chartDom.querySelector("canvas"); let lastHits = null; document.querySelector("#sum").addEventListener("change", () => updateCharts(canvasDom, lastHits)); document.querySelector("#sumstores").addEventListener("change", () => updateCharts(canvasDom, lastHits)); document.querySelector("#todayonly").addEventListener("change", () => updateCharts(canvasDom, lastHits)); document.querySelector("#start").addEventListener("change", () => updateCharts(canvasDom, lastHits)); document.querySelector("#end").addEventListener("change", () => updateCharts(canvasDom, lastHits)); document.querySelector("#start").value = getOldestDate(items); document.querySelector("#end").value = currentDate(); let chartEnabled = false; let search = newSearchComponent( document.querySelector("#search"), items, (hits) => { items.forEach((item) => (item.chart = false)); if (!chartEnabled) { chartDom.classList.add("hide"); } else { if (hits.length > 0) { chartDom.classList.remove("hide"); } else { chartDom.classList.add("hide"); } updateCharts(canvasDom, hits); } lastHits = hits; return hits; }, null, (header) => { header.innerHTML += "