Files
palette/internal/web/static/jump.js
T
fen 3460d54fce
CI / test (pull_request) Successful in 25s
CI / docker (pull_request) Skipped
Fix #282: re-evaluate jumpnav visibility after layout settles on load
The initial refresh() ran before the mobile layout settled (media queries,
fonts, async highlighting) and under-measured the content, leaving #jumpnav
hidden on long pastes at 375x812 until a resize event. Re-check after a
double rAF, on window load, after 300ms, and via a ResizeObserver on
document.body for late content growth. Editor textarea scroller unchanged.
2026-09-17 20:30:04 -05:00

52 lines
1.9 KiB
JavaScript

/* #267: jump to top / bottom controls for long content.
Paste view scrolls the window; the /new editor scrolls its textarea.
The active scroller is chosen via data-jump-scroll on the script tag. */
(function () {
var nav = document.getElementById('jumpnav');
if (!nav) return;
var scroller = window;
var sel = nav.dataset.jumpScroll;
if (sel) scroller = document.querySelector(sel);
function el() {
return scroller === window ? document.scrollingElement : scroller;
}
function isLarge() {
var e = el();
if (!e) return false;
var visible = scroller === window ? window.innerHeight : e.clientHeight;
return e.scrollHeight > visible * 2;
}
function refresh() {
nav.classList.toggle('hidden', !isLarge());
}
function jump(toTop) {
var e = el();
if (!e) return;
if (scroller === window) {
window.scrollTo({ top: toTop ? 0 : e.scrollHeight });
} else {
e.scrollTop = toTop ? 0 : e.scrollHeight;
}
}
nav.addEventListener('click', function (ev) {
var b = ev.target.closest('[data-jump]');
if (!b) return;
ev.preventDefault();
jump(b.dataset.jump === 'top');
});
window.addEventListener('resize', refresh);
if (scroller !== window && scroller) scroller.addEventListener('input', refresh);
refresh();
/* #282: the first evaluation can run before the layout settles (media
queries, web fonts, async highlighting) and under-measure the content,
leaving the nav hidden on long pages. Re-check once a real layout exists
and after load; the ResizeObserver also catches late content growth. */
requestAnimationFrame(function () { requestAnimationFrame(refresh); });
window.addEventListener('load', refresh);
window.setTimeout(refresh, 300);
if (window.ResizeObserver && scroller === window && document.body) {
new ResizeObserver(refresh).observe(document.body);
}
})();