Welcome back
Sign-in is presented as a private preview for this static learning studio.
Create your studio profile
Save your learning trail and return to your selected modules.
Studio folio
A considered selection.
Folio prepared
Your selection is ready for review. A real order would require a secure server checkout, which is not connected in this static experience.
`;
const footerHTML = ``;
document.getElementById('site-header').innerHTML = headerHTML;
document.getElementById('site-footer').innerHTML = footerHTML;
let data = [];
let cart = JSON.parse(localStorage.getItem('clearSceneCart') || '{}');
const itemsEl = document.getElementById('cart-items');
function applyTheme() {
const theme = localStorage.getItem('clearSceneTheme') || 'dark';
if (theme === 'light') {
document.documentElement.style.setProperty('--tw-bg-opacity', '1');
document.body.className = 'bg-slate-100 text-slate-950';
} else {
document.body.className = 'bg-slate-950 text-slate-100';
}
}
function initThemeToggle() {
const btn = document.getElementById('theme-toggle');
if (!btn) return;
btn.addEventListener('click', () => {
const current = localStorage.getItem('clearSceneTheme') || 'dark';
const next = current === 'dark' ? 'light' : 'dark';
localStorage.setItem('clearSceneTheme', next);
applyTheme();
});
}
function initMobileNav() {
const toggle = document.getElementById('mobile-menu-toggle');
const mobile = document.getElementById('mobile-navigation');
if (toggle && mobile) {
toggle.addEventListener('click', () => mobile.classList.toggle('hidden'));
}
}
function initModals() {
document.querySelectorAll('[data-modal-open]').forEach(b => {
b.addEventListener('click', () => {
const m = document.getElementById(b.dataset.modalOpen);
if (m) m.classList.replace('hidden', 'flex');
});
});
document.querySelectorAll('[data-modal-close]').forEach(b => {
b.addEventListener('click', () => {
const m = document.getElementById(b.dataset.modalClose);
if (m) m.classList.replace('flex', 'hidden');
});
});
}
function initCookieBanner() {
const banner = document.getElementById('cookie-banner');
if (!banner) return;
if (localStorage.getItem('clearSceneCookies') === 'accepted') {
banner.remove();
} else {
const close = document.getElementById('cookie-close');
if (close) {
close.addEventListener('click', () => {
localStorage.setItem('clearSceneCookies', 'accepted');
banner.remove();
});
}
}
}
function render() {
let total = 0;
const chosen = data.filter(p => cart[p.id] && cart[p.id] > 0);
if (chosen.length === 0) {
itemsEl.innerHTML = `Your folio is empty.
Select a resource from the catalog to begin.
Browse catalog `;
} else {
itemsEl.innerHTML = chosen.map(p => {
const qty = cart[p.id];
total += p.price * qty;
return `${p.category}
${p.title}
$${p.price.toFixed(2)} each
${qty}
`;
}).join('');
}
document.getElementById('cart-total').textContent = `$${total.toFixed(2)}`;
localStorage.setItem('clearSceneCart', JSON.stringify(cart));
}
function initCartListeners() {
itemsEl.addEventListener('click', e => {
const id = e.target.dataset.plus || e.target.dataset.minus || e.target.dataset.delete;
if (!id) return;
if (e.target.dataset.plus) cart[id] = (cart[id] || 0) + 1;
if (e.target.dataset.minus) cart[id] = Math.max(0, (cart[id] || 1) - 1);
if (e.target.dataset.delete) delete cart[id];
if (cart[id] === 0) delete cart[id];
render();
});
}
function initCheckout() {
const btn = document.getElementById('checkout');
const modal = document.getElementById('checkout-modal');
const closeBtn = document.getElementById('close-checkout');
if (btn && modal) {
btn.addEventListener('click', () => modal.classList.replace('hidden', 'flex'));
}
if (closeBtn && modal) {
closeBtn.addEventListener('click', () => modal.classList.replace('flex', 'hidden'));
}
}
fetch('./catalog.json')
.then(r => r.json())
.then(x => {
data = x;
render();
})
.catch(() => {
itemsEl.innerHTML = `Unable to load catalog.
Please try again later.
`;
});
applyTheme();
initThemeToggle();
initMobileNav();
initModals();
initCookieBanner();
initCartListeners();
initCheckout();