Repository navigation
feat(dashboard): fold groups, show frequently used links, and add a compact view - #231
Merged
Merged
Conversation
Group labels become buttons that fold a group to its label and tile count. The front matter options collapsed and limit set which groups start folded and how many tiles a group shows before a Show more button. The filter still searches every tile, and the reader's choices stay in the browser per page.
…ript An inline script after the groups enables folding and applies the reader's saved choices before the page is painted; without JavaScript every tile stays visible. Group tiles are counted up front, notes past the limit fold with their tiles, footnote references in group headings keep their links, folded labels announce expanded while the filter shows their matches, typing on a group button continues in the filter, and the buttons use the standard focus offset.
… per page A fragment that targets a folded group or anything inside it opens the group in full, on load and when the fragment changes. A folder's start page keeps one fold state for its folder and index.html addresses. Group labels stay disabled until the fold script runs, and tiles are counted without rendering them.
With frequent in the dashboard options, the page counts the links a reader opens in browser storage and shows the most used ones, weighted toward recent use, in a row above the groups. The row is filled before the first paint, steps aside while filtering, and Clear forgets the counts.
…ct view Every tile now has two lines, its description or else its host, so tiles line up across groups. status accepts group headings, and a group label counts its unreachable sites, also while folded. A switch in the toolbar changes to a compact view with the names alone; compact sets the start view and the reader's choice is kept per page.
Subheadings, paragraphs, and lists without links after the last shown tile now fold with the tiles past the limit, and notes there no longer keep their subheading in view. Frequently used links include tiles outside groups, ignore invalid stored entries, and a group counts each unreachable site once. Both dashboard scripts share the fold and scoring helpers.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
Dashboard groups can now be folded, a row of the most used links can lead the page, status checks can be limited to some groups, and readers can switch to a compact view. Together they let a start page hold many links without showing them all at once.
Fold groups
collapsed:true, one heading, or a list of headings that start folded (matched case-insensitively).limit: each group shows its first tiles and a Show N more button for the rest. A group with only one tile past the limit shows it instead of a button.localStorageper page (a folder's/andindex.htmlshare one entry).collapsedandlimitonly set the start.Frequently used
frequent: a number, ortruefor 6. It adds a row of the links this reader opens most above the groups.localStorageper page; nothing leaves the browser. A link shows after two uses, ranked by uses with a 30-day half-life, so the row follows current habits. At most 50 links are kept, and links that are no longer on the page are skipped.Tiles, status, and compact view
statusnow also takes one heading or a list of headings; only the tiles of those groups are checked. A group label shows N offline for its unreachable sites, counting each address once, so a folded group still shows that something is down.compact: truestarts the page in a view with names only and narrower tiles. A toolbar button (shown only with JavaScript) switches between the views, and the reader's choice stays per page.Why
Large dashboards (dozens of links in a dozen groups) were hard to scan because everything had the same weight. Folding keeps everything one click or keystroke away, the frequently used row brings the daily links to the top without curating them by hand, and the compact view and per-group status reduce visual noise further.
Notes for reviewers
Res/Js/dashboard-folds.jsis inlined right after the groups. It enables folding, applies saved choices, and fills the frequently used row before the first paint, so there is no layout jump. Without JavaScript nothing folds, the labels stay disabled buttons, every tile is visible, and the frequently used row stays hidden.dashboard.jsleaves them out of the filter, the folds, and the rows it hides. Withstatus: true, each address is requested once, so a tile and its copy share the answer.IsTile, without rendering), so notes past the limit fold with their tiles.dashboard-folds.jsshares its fold, scoring, and storage helpers withdashboard.jsthrough the dashboard element, so both scripts follow one rule. Stored entries without a valid count or time are ignored and pruned.Docs/Features/Dashboard.md; the example dashboard useslimit: 2,collapsed: [Icons], andfrequent: 4; the options example showsstatus: [Operations]andcompact.Testing
dotnet test Mdu.slnpasses; new tests cover option parsing, folding markup, limits, single-overflow, notes, footnotes, the inline script, the hidden frequently used row, status groups, the compact view, and content folded past the limit.mdu lint Docsreports no errors.mdu serveat desktop and phone widths, in light and dark mode: keyboard focus, filtering into folded groups, Show more, saved state across reloads, fragment links, behavior without the fold script, for the frequently used row its ranking, counting, filtering, and Clear, the offline count of status groups, and the compact view switch.