Skip to content

feat(demo): rebuild the demo site around what the library actually does - #107

Merged
phmatray merged 1 commit into
devfrom
feat/demo-site-redesign
Jul 27, 2026
Merged

feat(demo): rebuild the demo site around what the library actually does#107
phmatray merged 1 commit into
devfrom
feat/demo-site-redesign

Conversation

@phmatray

Copy link
Copy Markdown
Owner

The site at phmatray.github.io/TaLibStandard was a stock MudBlazor admin template — hamburger drawer, four identical icon cards, checkmark bullets. For a technical analysis library, the landing view contained no chart, no price series and no indicator; the inner pages opened on empty forms that rendered nothing until submitted.

Two of the problems weren't cosmetic

  • MarketDataService fetched Yahoo Finance through corsproxy.io, a third-party CORS proxy. Whenever that was rate-limited or blocked, the demo showed nothing.
  • The theme toggle carried the comment // In a real app, you'd update the theme provider here. It flipped a private field and did nothing.

The thesis: the hero is the API contract, drawn

An indicator has no value for its first lookback bars, and output element k describes bar BegIdx + k. Getting that wrong silently shifts every signal in time — it's what this repo's own guides are about, and what the abandoned auto-claude/001 fluent-API branch got catastrophically wrong.

So the warm-up gap is shaded, bracketed and measured, with RetCode, BegIdx, NBElement and the latest value printed underneath and recomputed live as you change the period. On the default view: 49 bars of warm-up, BegIdx 49, NBElement 131.

Colour carries the same distinction. Anything the market hands us is drawn in market colours; anything the library computes is drawn in instrument amber — input and output told apart by hue rather than by a legend.

The surface is cool paper, not the dark terminal every trading dashboard reaches for. This is a reference implementation, not a trading desk. Archivo at expanded widths for display, IBM Plex Mono for every number — in a numerics library the mono face carries the content rather than captioning it.

Also fixed

  • Price history is generated in-browser from a seed, so the page always renders and the charted numbers are identical on every visit. The instruments are openly fictional and labelled as such — presenting generated numbers under a real ticker is a lie the reader has no way to detect, and the old page put synthetic-or-missing data under AAPL.
  • The theme toggle works, via a shared ThemeState that both the shell and MudThemeProvider read. MudBlazor's palette is mapped onto the same tokens, so inner pages stop shipping Material defaults beside the new shell.
  • The indicators page computes on load instead of opening on an empty panel.
  • Chart components use palette tokens instead of hardcoded #ff0000 / #00ff00.
  • Blazor's FocusOnNavigate targets the h1; that target is tabindex="-1", so it no longer draws a focus ring around the headline for mouse users. The indicators page also had no h1 at all for it to target — now it does.
  • The drawer and its NavMenu are gone, replaced by a top rail.

Verification

dotnet build TaLibStandard.sln -c Release --no-incremental
  ->  0 errors, 159 warnings

baseline (origin/dev, identical flags)
  ->  0 errors, 163 warnings

Four fewer, and zero warnings originate in the new files. Checked in both themes and at 390 px.

Scope

The shell, the overview and the indicators page are rebuilt. Patterns, Analysis, Math and About now inherit the shell, container and palette, but their internals are still Material-flavoured — worth a follow-up rather than stretching this PR further.

Unrelated but worth knowing: global.json pins SDK 10.0.302, and rollForward: latestFeature cannot roll down. Any contributor without that exact SDK cannot build at all — I hit it on this machine and had to install 10.0.302 to verify. A lower floor would spare people that.

🤖 Generated with Claude Code

The site was a stock MudBlazor admin template: hamburger drawer, four
identical icon cards, checkmark bullets. For a technical analysis library the
landing view contained no chart, no price series and no indicator, and the
inner pages opened on empty forms that rendered nothing until submitted.

Two of the problems were not cosmetic. MarketDataService fetched Yahoo Finance
through corsproxy.io, a third-party CORS proxy, so the demo showed nothing
whenever that proxy was rate-limited or blocked. And the theme toggle carried
the comment "In a real app, you'd update the theme provider here" - it flipped
a private field and did nothing.

The hero is now the API contract, drawn. An indicator has no value for its
first `lookback` bars, and output element k describes bar BegIdx + k; getting
that mapping wrong silently shifts every signal in time. So the warm-up gap is
shaded, bracketed and measured, with RetCode, BegIdx, NBElement and the latest
value printed underneath and recomputed live as the period changes.

Colour carries that same distinction: anything the market hands us is drawn in
market colours, anything the LIBRARY computes is drawn in instrument amber, so
input and output are told apart by hue. The surface is cool paper rather than
the dark terminal every trading dashboard reaches for - this is a reference
implementation, not a trading desk. Archivo at expanded widths for display,
IBM Plex Mono for every number, since in a numerics library the mono face is
carrying the content rather than captioning it.

Also here:
- Price history now comes from a seeded in-browser generator, so the page
  always renders and the charted numbers are identical on every visit. The
  instruments are openly fictional and labelled as such, because presenting
  generated numbers under a real ticker is a lie the reader cannot detect.
- The theme toggle works, via a shared ThemeState the shell and MudThemeProvider
  both read, and MudBlazor's palette is mapped onto the same tokens so the inner
  pages stop shipping Material defaults next to the new shell.
- The indicators page computes on load instead of opening on an empty panel.
- Chart components use palette tokens rather than hardcoded #ff0000/#00ff00.
- Blazor's FocusOnNavigate targets the h1; that target is tabindex="-1" and no
  longer draws a focus ring around the headline for mouse users.
- The drawer and its NavMenu are gone, replaced by a top rail.

159 warnings against a 163 baseline, 0 errors. Verified in both themes and at
390px.
@phmatray
phmatray merged commit cde1b54 into dev Jul 27, 2026
9 of 10 checks passed
@phmatray
phmatray deleted the feat/demo-site-redesign branch July 27, 2026 15:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant