Hoppa till innehåll
(function () {
// Helpers
const $ = (sel, root = document) => root.querySelector(sel);
const $$ = (sel, root = document) => Array.from(root.querySelectorAll(sel));
// === DEBUG (ta bort senare om du vill)
console.log("SNÄLL JS LADDAT");
// =========================
// Smooth scroll
// =========================
$$('[data-scroll]').forEach(link => {
link.addEventListener('click', e => {
const href = link.getAttribute('href');
if (!href || !href.startsWith('#')) return;
const target = $(href);
if (!target) return;
e.preventDefault();
target.scrollIntoView({ behavior: 'smooth', block: 'start' });
});
});
// =========================
// FAQ accordion
// =========================
$$('.snall-faq-q').forEach(btn => {
btn.addEventListener('click', () => {
const item = btn.closest('.snall-faq-item');
if (!item) return;
const isOpen = item.classList.contains('is-open');
$$('.snall-faq-item.is-open').forEach(i =>
i.classList.remove('is-open')
);
if (!isOpen) item.classList.add('is-open');
});
});
// =========================
// Subscription toggle
// =========================
const pricing = $('[data-pricing]');
if (pricing) {
const btnSub = $('[data-plan="sub"]');
const btnOne = $('[data-plan="one"]');
const priceEl = $('[data-price]');
const compareEl = $('[data-compare]');
const stickyPriceEl = $('[data-sticky-price]');
const hiddenPlan = $('[name="snall_plan"]');
const priceSub = Number(pricing.dataset.priceSub);
const priceOne = Number(pricing.dataset.priceOne);
const compare = Number(pricing.dataset.compare);
let plan = 'sub';
const render = () => {
const price = plan === 'sub' ? priceSub : priceOne;
if (priceEl) priceEl.textContent = price + ' kr';
if (compareEl && compare) compareEl.textContent = compare + ' kr';
if (stickyPriceEl) stickyPriceEl.textContent = price + ' kr';
if (hiddenPlan) hiddenPlan.value = plan;
btnSub?.classList.toggle('is-active', plan === 'sub');
btnOne?.classList.toggle('is-active', plan === 'one');
};
btnSub?.addEventListener('click', () => {
plan = 'sub';
render();
});
btnOne?.addEventListener('click', () => {
plan = 'one';
render();
});
render();
}
// =========================
// Sticky bar → main CTA
// =========================
const stickyBtn = $('[data-sticky-cta]');
const mainBtn = $('[data-main-cta]');
if (stickyBtn && mainBtn) {
stickyBtn.addEventListener('click', () => {
mainBtn.click();
});
}
})();