KeenKnot Studio

Your project basket

Cart

Continue browsing
`; const footerHTML = ``; document.querySelector("header").innerHTML = headerHTML; document.querySelector("footer").innerHTML = footerHTML; let products = []; const read = () => JSON.parse(localStorage.getItem("keenKnotCart") || "[]"); function draw() { let a = read(), sum = 0; document.getElementById("cart").innerHTML = a.length ? a.map(i => { let x = products.find(p => p.id === i.id); if (!x) return ""; sum += x.price * i.quantity; return `

${x.title}

$${x.price} each

`; }).join("") : `

Your cart is empty. Choose a course when you are ready.

`; document.getElementById("total").textContent = `Total: $${sum.toFixed(2)}`; } fetch("./catalog.json").then(r => r.json()).then(d => { products = d; draw(); }); document.addEventListener("change", e => { if (e.target.dataset.qty) { let a = read(), x = a.find(i => i.id === e.target.dataset.qty); x.quantity = Math.max(1, +e.target.value || 1); localStorage.setItem("keenKnotCart", JSON.stringify(a)); draw(); } }); document.addEventListener("click", e => { if (e.target.dataset.delete) { let a = read().filter(i => i.id !== e.target.dataset.delete); localStorage.setItem("keenKnotCart", JSON.stringify(a)); draw(); } if (e.target.id === "checkout") { document.getElementById("checkoutModal").classList.remove("hidden"); document.getElementById("checkoutModal").classList.add("flex"); } if (e.target.id === "checkoutClose") { document.getElementById("checkoutModal").classList.add("hidden"); document.getElementById("checkoutModal").classList.remove("flex"); } }); if (localStorage.getItem("keenKnotTheme") === "dark") document.documentElement.classList.add("dark");