<![CDATA[<script>
document.addEventListener('zkl:chapterchange', event => {
document.querySelectorAll('[data-zkl-current]').forEach(el => { el.textContent = String(event.detail.index + 1).padStart(2, '0') + ' / ' + String(event.detail.total).padStart(2, '0') + ' · ' + event.detail.name; });
});
document.querySelectorAll('[data-zkl-copy]').forEach(button => button.addEventListener('click', async () => {
const code = button.closest('details').querySelector('code');
try { await navigator.clipboard.writeText(code.textContent); button.textContent = 'הועתק ✓'; }
catch (_) { const range = document.createRange(); range.selectNodeContents(code); const selection = getSelection(); selection.removeAllRanges(); selection.addRange(range); button.textContent = 'הקוד סומן להעתקה'; }
}));
document.querySelectorAll('[data-zkl-close]').forEach(button => button.addEventListener('click', () => { button.closest('details').open = false; }));
(() => {
'use strict';
// Safe to paste once in a global footer, or below the HTML widget.
window.ZakaiChapterRail?.destroy();
const cleanups = [];
let destroyed = false;
function init() {
if (destroyed) return;
document.querySelectorAll('.zkl-chapter-rail').forEach(rail => {
if (rail.dataset.ready) return;
const rootId = rail.getAttribute('data-scroll-container');
const scroller = rootId ? document.getElementById(rootId) : null;
if (rootId && !scroller) return;
// Elementor demo wrappers may have backdrop-filter/transform/overflow.
// A page-level fixed rail must live outside those containing blocks.
if (!scroller && rail.parentElement !== document.body) {
document.body.appendChild(rail);
}
const root = scroller || window;
const path = rail.querySelector('.zkl-chapter-path');
const fill = rail.querySelector('.zkl-chapter-fill');
const trail = rail.querySelector('.zkl-chapter-trail');
const head = rail.querySelector('.zkl-chapter-head');
if (!path || !fill || !trail || !head) return;
const allLinks = [...rail.querySelectorAll('.zkl-chapter-stop')];
const items = allLinks.map(link => {
const href = link.getAttribute('href') || '';
let section = null;
try { section = href.startsWith('#') ? document.getElementById(decodeURIComponent(href.slice(1))) : null; } catch (_) {}
link.hidden = !section || !!(scroller && !scroller.contains(section));
return {link, section, top: 0};
}).filter(item => !item.link.hidden);
if (!items.length) { rail.hidden = true; return; }
rail.hidden = false;
rail.dataset.ready = 'true';
const motion = matchMedia('(prefers-reduced-motion: reduce)');
let length = path.getTotalLength(), dirty = true, raf = 0, current = -1;
let offset = 0, pending = null;
const y = () => scroller ? scroller.scrollTop : (document.scrollingElement || document.documentElement).scrollTop;
const maxY = () => Math.max(0, scroller ? scroller.scrollHeight - scroller.clientHeight : (document.scrollingElement || document.documentElement).scrollHeight - innerHeight);
function measure() {
offset = Math.max(0, parseFloat(getComputedStyle(rail).getPropertyValue('--zkl-scroll-offset')) || 0);
const origin = scroller ? scroller.getBoundingClientRect().top + scroller.clientTop : 0;
const scroll = y(), max = maxY();
items.forEach(item => { item.top = Math.min(max, Math.max(0, item.section.getBoundingClientRect().top - origin + scroll - offset)); });
// Links should follow the visual order of the chapters.
items.sort((a, b) => a.top - b.top);
length = path.getTotalLength();
items.forEach((item, i) => {
const point = path.getPointAtLength(items.length === 1 ? 0 : length * i / (items.length - 1));
item.link.style.left = `${point.x / 28 * 100}%`;
item.link.style.top = `${point.y / 1000 * 100}%`;
});
dirty = false;
}
function finishFocus(item) {
const heading = item.section.querySelector('[data-zkl-chapter-heading], h1, h2, h3') || item.section;
if (!heading.hasAttribute('tabindex')) heading.setAttribute('tabindex', '-1');
heading.focus({preventScroll: true});
}
function render() {
raf = 0;
if (dirty) measure();
const scroll = y();
let index = 0;
for (let i = 1; i < items.length; i++) if (scroll >= items[i].top - 2) index = i;
const next = items[index + 1];
const span = next ? next.top - items[index].top : 0;
const t = next && span > 0 ? Math.max(0, Math.min(1, (scroll - items[index].top) / span)) : 0;
const p = items.length > 1 ? (index + t) / (items.length - 1) : 0;
const point = path.getPointAtLength(length * p);
head.setAttribute('cx', point.x); head.setAttribute('cy', point.y);
fill.style.strokeDasharray = `${length} ${length}`;
fill.style.strokeDashoffset = String(length * (1 - p));
const tail = Math.min(75, length * p);
trail.style.strokeDasharray = `${tail} ${length}`;
trail.style.strokeDashoffset = String(-Math.max(0, length * p - tail));
rail.dataset.progress = p.toFixed(4);
if (index !== current) {
current = index;
items.forEach((item, i) => {
if (i === index) item.link.setAttribute('aria-current', 'location');
else item.link.removeAttribute('aria-current');
item.link.classList.toggle('is-past', i < index);
});
rail.dataset.chapter = String(index + 1);
const name = items[index].link.querySelector('.zkl-chapter-label')?.textContent || items[index].section.id;
rail.dispatchEvent(new CustomEvent('zkl:chapterchange', {bubbles: true, detail: {index, total: items.length, name, id: items[index].section.id}}));
}
if (pending && Math.abs(scroll - pending.top) < 3) {
finishFocus(pending); pending = null;
}
}
function schedule() { if (!raf) raf = requestAnimationFrame(render); }
function resize() { dirty = true; schedule(); }
function cancelPending() { pending = null; }
const clicks = items.map(item => {
function click(event) {
if (event.button !== 0 || event.ctrlKey || event.metaKey || event.shiftKey || event.altKey) return;
event.preventDefault(); measure(); pending = item;
root.scrollTo({top: item.top, behavior: motion.matches ? 'instant' : 'smooth'});
if (!scroller) { try { history.replaceState(null, '', '#' + encodeURIComponent(item.section.id)); } catch (_) {} }
schedule();
}
item.link.addEventListener('click', click);
return () => item.link.removeEventListener('click', click);
});
root.addEventListener('scroll', schedule, {passive: true});
root.addEventListener('wheel', cancelPending, {passive: true});
root.addEventListener('touchstart', cancelPending, {passive: true});
addEventListener('resize', resize);
addEventListener('pageshow', resize);
motion.addEventListener('change', resize);
const observer = typeof ResizeObserver !== 'undefined' ? new ResizeObserver(resize) : null;
observer?.observe(scroller || document.body);
items.forEach(item => observer?.observe(item.section));
document.fonts?.ready.then(() => { if (!destroyed) resize(); });
render();
cleanups.push(() => {
cancelAnimationFrame(raf); observer?.disconnect(); clicks.forEach(fn => fn());
root.removeEventListener('scroll', schedule);
root.removeEventListener('wheel', cancelPending);
root.removeEventListener('touchstart', cancelPending);
removeEventListener('resize', resize); removeEventListener('pageshow', resize);
motion.removeEventListener('change', resize); delete rail.dataset.ready;
});
});
}
window.ZakaiChapterRail = {
init,
refresh() { dispatchEvent(new Event('resize')); },
destroy() { destroyed = true; document.removeEventListener('DOMContentLoaded', init); cleanups.splice(0).forEach(fn => fn()); }
};
if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', init, {once: true});
else init();
})();
</script>]]>