Stop tab switches jumping the page to the top

Switching tabs scrolled back to the top, on the theory that arriving halfway
down a different tab is disorienting. In practice it is the wrong way round:
the tab row is sticky, so you switch tabs *from* wherever you have scrolled to,
and being thrown back past the log buttons you had deliberately scrolled off is
more disruptive than landing part-way down the new tab.

So it simply does not scroll now. If the new tab is shorter than the old scroll
position the browser clamps on its own and needs no help.

The `scroll` option goes with it rather than being defaulted off — nothing
passes it any more, and a parameter no caller uses is a worse thing to leave
behind than the behaviour it guarded.
This commit is contained in:
Alexander Heldt
2026-09-07 20:13:55 +00:00
parent e7b54b82fd
commit de1e18e394
2 changed files with 10 additions and 5 deletions
+9 -5
View File
@@ -4734,7 +4734,7 @@
showTab(DEFAULT_TAB, { manageBack: false }); showTab(DEFAULT_TAB, { manageBack: false });
}); });
function showTab(id, { scroll = true, manageBack = true } = {}) { function showTab(id, { manageBack = true } = {}) {
if (!tabButtons.some(b => b.dataset.tab === id)) id = DEFAULT_TAB; if (!tabButtons.some(b => b.dataset.tab === id)) id = DEFAULT_TAB;
activeTab = id; activeTab = id;
for (const b of tabButtons) { for (const b of tabButtons) {
@@ -4746,8 +4746,12 @@
} }
for (const p of tabPanels) p.hidden = p.dataset.tab !== id; for (const p of tabPanels) p.hidden = p.dataset.tab !== id;
document.querySelector(".chart-window").hidden = TABS_WITHOUT_CHARTS.has(id); document.querySelector(".chart-window").hidden = TABS_WITHOUT_CHARTS.has(id);
// Arriving halfway down a different tab is disorienting. // Deliberately no scrolling. Switching used to jump to the top, on the
if (scroll) window.scrollTo({ top: 0 }); // theory that arriving halfway down a tab is disorienting — but the tab bar
// is sticky, so you switch tabs *from* wherever you have scrolled to, and
// being thrown back past the log buttons you had just scrolled off is worse.
// If the new tab is shorter than the old scroll position the browser clamps
// on its own, which needs no help from us.
try { localStorage.setItem(TAB_KEY, id); } catch { /* ignore */ } try { localStorage.setItem(TAB_KEY, id); } catch { /* ignore */ }
if (manageBack) { if (manageBack) {
if (id !== DEFAULT_TAB) { if (id !== DEFAULT_TAB) {
@@ -4773,7 +4777,7 @@
if (!step) return; if (!step) return;
e.preventDefault(); e.preventDefault();
const next = tabButtons[(i + step + tabButtons.length) % tabButtons.length]; const next = tabButtons[(i + step + tabButtons.length) % tabButtons.length];
showTab(next.dataset.tab, { scroll: false }); showTab(next.dataset.tab);
next.focus(); next.focus();
}); });
} }
@@ -4797,7 +4801,7 @@
} }
measureDayBar(); measureDayBar();
showTab(loadTab(), { scroll: false }); showTab(loadTab());
// ---------- wiring ---------- // ---------- wiring ----------
document.querySelectorAll("button.action").forEach(btn => { document.querySelectorAll("button.action").forEach(btn => {
+1
View File
@@ -1,4 +1,5 @@
[ [
{ "date": "2026-09-07", "text": "Switching tabs no longer jumps the page back to the top. The tab row is frozen to the top of the screen, so you change tabs from wherever you have scrolled to, and being thrown back past the log buttons you had just scrolled off was more disruptive than landing part-way down the new tab" },
{ "date": "2026-09-07", "text": "The page is split into five tabs — Today, Sleep, Walks, Habits and Growth — instead of one long column of fourteen panels. Today has the overview, sleep & wake and the day's history; Sleep and Walks each have their day-by-day chart, their when-it-happens grid and their trend; Habits has the pee, poo and meal timing and counts; Growth has weight, training and notes. Getting to the weight curve no longer means scrolling past everything else. The day bar and the log buttons sit above the tabs and stay there whichever one you're on, so logging is still one tap from anywhere. Folding a panel by tapping its heading works exactly as before, inside its tab, and the app reopens on the tab you left it on. The back button (or the back gesture) returns you to Today from wherever you are, and pressing it again leaves the app — always two presses to get out, however much you'd been flicking between tabs beforehand" }, { "date": "2026-09-07", "text": "The page is split into five tabs — Today, Sleep, Walks, Habits and Growth — instead of one long column of fourteen panels. Today has the overview, sleep & wake and the day's history; Sleep and Walks each have their day-by-day chart, their when-it-happens grid and their trend; Habits has the pee, poo and meal timing and counts; Growth has weight, training and notes. Getting to the weight curve no longer means scrolling past everything else. The day bar and the log buttons sit above the tabs and stay there whichever one you're on, so logging is still one tap from anywhere. Folding a panel by tapping its heading works exactly as before, inside its tab, and the app reopens on the tab you left it on. The back button (or the back gesture) returns you to Today from wherever you are, and pressing it again leaves the app — always two presses to get out, however much you'd been flicking between tabs beforehand" },
{ "date": "2026-09-07", "text": "Guest links can be copied whenever you want. Settings → Guest access now shows each live link's URL next to it with a Copy button, instead of showing it once when you created it and never again. If you lose the message you sent, or want to pass the same link to someone else, you can just take it again rather than making a new one and leaving whoever already had the old one locked out. Links you made before this change can't be shown — only a scrambled form of those was kept — so revoke one and create a fresh one if you need its URL back" }, { "date": "2026-09-07", "text": "Guest links can be copied whenever you want. Settings → Guest access now shows each live link's URL next to it with a Copy button, instead of showing it once when you created it and never again. If you lose the message you sent, or want to pass the same link to someone else, you can just take it again rather than making a new one and leaving whoever already had the old one locked out. Links you made before this change can't be shown — only a scrambled form of those was kept — so revoke one and create a fresh one if you need its URL back" },
{ "date": "2026-09-07", "text": "Fixed buttons that were meant to be hidden but showed anyway. A guest opening an entry the owner logged saw Delete and Save on it — they never worked (the server refuses the change) but they had no business being there. The same fault had been quietly affecting three other things for a while: the 🌳 pedigree button appeared before you had set a pedigree ID, “Send a test notification” appeared when reminders weren't available, and the exercise dialog offered Delete while you were adding a new exercise rather than editing one. One styling rule was overriding every one of them" }, { "date": "2026-09-07", "text": "Fixed buttons that were meant to be hidden but showed anyway. A guest opening an entry the owner logged saw Delete and Save on it — they never worked (the server refuses the change) but they had no business being there. The same fault had been quietly affecting three other things for a while: the 🌳 pedigree button appeared before you had set a pedigree ID, “Send a test notification” appeared when reminders weren't available, and the exercise dialog offered Delete while you were adding a new exercise rather than editing one. One styling rule was overriding every one of them" },