feat(shell): global back and forward in the top bar
The history stack has been global since the Android back gesture landed -- every navigation is an entry and `popstate` restores any of them in either direction. What the report describes as "back is tab-scoped" is that the only way back was a detail view's own button, which leaves the screen with the view it belongs to: click over to Tracks and the album you were reading is still one entry away with nothing on screen saying so. `<nav-history>` is that affordance, plus `nav.back` / `nav.forward` on Alt+Left / Alt+Right -- the browser's own combination, and clear of the bare arrows that seek, since a binding matches on its full canonical string. Forward is not back negated, which is why the old `pushedEntries` counter is gone rather than extended: `popstate` carries no direction and fires identically both ways, so one counter decremented on every pop reads a forward as a second back. Each entry carries its index and the shell keeps the current one and a high-water mark, which also survives a jump of more than one. The buttons dispatch the events the rest of the app already dispatches rather than calling `history` themselves -- the shell owns the guard that stops a press at the root leaving the app, and a second caller reaching for history is how the old `navStack` came to disagree with the platform. Below 900px the control stands down: the top bar is what runs out of room first below that, and nothing becomes unreachable -- the shortcuts are global at every width and the phone has the platform's gesture. Closes #6
This commit is contained in:
+33
-1
@@ -104,6 +104,15 @@ p {
|
||||
flex: 0 1 320px;
|
||||
}
|
||||
|
||||
/* The bar is `justify-content: space-between`, which with four children
|
||||
spreads them evenly and left back/forward floating in the middle of
|
||||
nothing. Collecting the free space *after* this one puts the pair
|
||||
beside the brand, where a browser keeps them, and leaves the
|
||||
right-hand group exactly as it was. */
|
||||
.top-bar nav-history {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style-type: none;
|
||||
}
|
||||
@@ -133,6 +142,23 @@ ul {
|
||||
.subtitle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Back/forward is Desktop-band chrome (#6), and 900 is the same
|
||||
line the sidebar's labels and the subtitle are already given up
|
||||
at -- below it the shell is narrow enough that the header is
|
||||
what runs out of room first. Measured at 600, the bottom of the
|
||||
Compact band: the bar is 611px inside a 600px viewport *before*
|
||||
this component exists (filed separately), and 695px with it, so
|
||||
keeping it here would be widening a violation of the promise
|
||||
that nothing scrolls sideways at a supported size.
|
||||
|
||||
Nothing is unreachable as a result, which is the rule that
|
||||
decides it: Alt+Left / Alt+Right are global and every width has
|
||||
them, the detail views keep their own back buttons, and the
|
||||
phone additionally has the platform's gesture. */
|
||||
.top-bar nav-history {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
body div.sidebar {
|
||||
@@ -346,7 +372,13 @@ body div.sidebar {
|
||||
|
||||
/* The search box is the one header control worth its width; the
|
||||
library filter is a rarely-changed setting and reachable from
|
||||
the drawer's Settings. */
|
||||
the drawer's Settings.
|
||||
|
||||
`nav-history` is already gone from 899 down. It would belong
|
||||
here anyway and for a stronger reason than width: the phone has
|
||||
Back as a gesture or a button the OS owns, and this app hooks it
|
||||
(`popstate`), so a second Back in the chrome duplicates a
|
||||
control the platform provides. */
|
||||
.top-bar library-filter {
|
||||
display: none;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user