Skip to content

Add quote-aware price label with reload and realtime multi-chart cards#13

Open
Bobagi wants to merge 1 commit intomainfrom
feat/fix-price-label-and-add-charts
Open

Add quote-aware price label with reload and realtime multi-chart cards#13
Bobagi wants to merge 1 commit intomainfrom
feat/fix-price-label-and-add-charts

Conversation

@Bobagi
Copy link
Owner

@Bobagi Bobagi commented Mar 1, 2026

Motivation

  • Make every displayed monetary value explicitly show the quote currency, improve the visibility of the "Current price" label, and allow manual refresh without changing existing layout or fetch logic.
  • Provide real-time, independent chart cards (multiple at once) so users can add/remove charts and observe sliding-window live updates with proper axis behavior and tooltips.
  • Supply a minimal backend endpoint to initialize charts with historical klines by period while keeping polling isolated per card and avoiding duplicate intervals.

Description

  • UI: updated templates/index.html to strengthen the current-price label styling, add a reload button next to the label in all symbol dropdowns, and replace the plain-muted price text with formatted, quote-aware price text.
  • UI: added a new full-width "Real-time crypto charts" section with an Add (+) modal and autocomplete flow, plus chartDashboard() and chartCard() Alpine components implementing per-card state, a period selector (1Y/3M/1M/1W/1D), a fixed-size sliding window (N=80), 5s polling, dynamic y-axis init/expansion, highlighted current point, line history, non-flickering tooltip, always-visible Y min/max indicators, floating price indicator line/label, and improved X-axis tick formatting dependent on period.
  • JS utilities: added detectQuoteCurrency(), formatPriceByQuote() and formatTimestampByPeriod() helpers and updated symbolDropdown() to add reloadPrice() and to format prices with explicit quote currency (including BRL locale formatting) while reusing the existing /binance/price endpoint (force-reload via timestamp query param).
  • Backend: extended internal/service/binance_price_service.go with BinanceKlinePoint and GetKlineClosePrices(...) to fetch and parse close prices from Binance klines; added a new /binance/klines route and handleBinanceKlines in internal/httpserver/server.go and a BinanceKlinesResponse struct to return historical points by the selected period/interval mapping.
  • Safety/cleanup: per-card polling uses setInterval and is cleared on card removal to avoid duplicate polling or leaks, and chart initialization reuses the existing price fetch for updates.

Testing

  • Ran code formatting with gofmt -w internal/service/binance_price_service.go internal/httpserver/server.go successfully.
  • Built the project with go build ./... which completed successfully in the CI-like environment used here.
  • Attempted to run the server with go run ./cmd/server but the process exited early due to an unreachable database host in this environment (DNS for db not resolvable), so end-to-end UI runtime verification (browser smoke) could not be executed here.

Codex Task

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant