53 lines
2.0 KiB
JavaScript
53 lines
2.0 KiB
JavaScript
// CDJ-900NXS Mods — small helpers: theme toggle, before/after slider, docs TOC highlight.
|
|
(function () {
|
|
var root = document.documentElement;
|
|
|
|
function storedTheme() {
|
|
try { return localStorage.getItem('theme'); } catch (e) { return null; }
|
|
}
|
|
var t = storedTheme();
|
|
if (t === 'light' || t === 'dark') root.setAttribute('data-theme', t);
|
|
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
var btn = document.querySelector('.theme-btn');
|
|
function label() {
|
|
if (btn) btn.textContent = root.getAttribute('data-theme') === 'light' ? '☾' : '☀';
|
|
}
|
|
label();
|
|
if (btn) btn.addEventListener('click', function () {
|
|
var next = root.getAttribute('data-theme') === 'light' ? 'dark' : 'light';
|
|
root.setAttribute('data-theme', next);
|
|
try { localStorage.setItem('theme', next); } catch (e) { /* private mode */ }
|
|
label();
|
|
});
|
|
|
|
// before / after
|
|
document.querySelectorAll('.compare').forEach(function (box) {
|
|
var range = box.querySelector('input[type="range"]');
|
|
if (!range) return;
|
|
function set() { box.style.setProperty('--pos', range.value + '%'); }
|
|
range.addEventListener('input', set);
|
|
set();
|
|
});
|
|
|
|
// docs: highlight the section in view
|
|
var links = Array.prototype.slice.call(document.querySelectorAll('.toc a[href^="#"]'));
|
|
if (links.length && 'IntersectionObserver' in window) {
|
|
var byId = {};
|
|
links.forEach(function (a) { byId[a.getAttribute('href').slice(1)] = a; });
|
|
var obs = new IntersectionObserver(function (entries) {
|
|
entries.forEach(function (e) {
|
|
if (e.isIntersecting && byId[e.target.id]) {
|
|
links.forEach(function (a) { a.classList.remove('active'); });
|
|
byId[e.target.id].classList.add('active');
|
|
}
|
|
});
|
|
}, { rootMargin: '-80px 0px -70% 0px' });
|
|
Object.keys(byId).forEach(function (id) {
|
|
var el = document.getElementById(id);
|
|
if (el) obs.observe(el);
|
|
});
|
|
}
|
|
});
|
|
})();
|