Skip to content

Flight plan pin-to-map + PNG export#338

Draft
msupino wants to merge 18 commits into
devfrom
dev-planPin-v2
Draft

Flight plan pin-to-map + PNG export#338
msupino wants to merge 18 commits into
devfrom
dev-planPin-v2

Conversation

@msupino

@msupino msupino commented May 26, 2026

Copy link
Copy Markdown
Owner

Summary

Flight plan pin-to-map + PNG export. A pin button on the flight plan modal pins the table to the map as a draggable, four-corner resizable box.

Pinned mode

  • Pin button (📌/📍) toggles pinned state; state persisted in navaid.planPin
  • Only the table is shown — title, aircraft info, close X, action buttons hidden
  • Draggable anywhere on the box (mousedown/touchstart on the box starts drag, clamped to viewport; inputs/resize handles excluded)
  • Four-corner resize handles; min size 360×150; position/width/height persisted to localStorage
  • Font auto-shrinks to fit the box (formula: scrH / (legs+2) * 0.85, cap 24px, floor 2px)
  • ResizeObserver recalculates font on any size change
  • Default box size dynamically chosen: max(150, min(500, legs+2 * 24 + 6)) × 400px, centered
  • Column headers shorten when pinned: Dist (NM)Dist, Speed (kt)Spd, Alt (ft)Alt
  • table-layout: fixed with explicit percentage widths (# 3%, From/To 15%, Hdg/Spd/Time 10%, Dist/Alt 11%, Fuel 15%)
  • Padding reduced to 2px 4px when pinned; max-width/max-height removed to respect explicit size

PNG export

  • Pinned plan renders at screen position in the exported PNG
  • Canvas drawFlightPlanTable() uses short headers when pinned

CI / tooling

  • Lighthouse CI blocks GA (--blocked-url-patterns="googletagmanager|google-analytics|doubleclick")

Closes #336

@msupino msupino closed this May 26, 2026
@msupino msupino reopened this May 26, 2026
@github-actions github-actions Bot temporarily deployed to pr-preview-338 May 26, 2026 13:23 Inactive
@github-actions github-actions Bot temporarily deployed to pr-preview-338 May 26, 2026 13:35 Inactive
@github-actions github-actions Bot temporarily deployed to pr-preview-338 May 26, 2026 14:20 Inactive
@github-actions github-actions Bot temporarily deployed to pr-preview-338 May 26, 2026 14:31 Inactive
@github-actions github-actions Bot temporarily deployed to pr-preview-338 May 26, 2026 14:45 Inactive
@msupino msupino closed this May 26, 2026
@msupino msupino reopened this May 26, 2026
@msupino msupino closed this May 26, 2026
@msupino msupino reopened this May 26, 2026
@github-actions github-actions Bot temporarily deployed to pr-preview-338 May 26, 2026 17:01 Inactive
@github-actions github-actions Bot temporarily deployed to pr-preview-338 May 26, 2026 17:56 Inactive
@msupino msupino marked this pull request as draft May 26, 2026 18:46
@msupino

msupino commented May 26, 2026

Copy link
Copy Markdown
Owner Author

Refactor: replaced pin-to-map with placement picker

The pin-button + drag/resize flow was awkward — user had to commit to a position before seeing the print frame, in a separate flow from Export. Rebuilt as a single 6-button row inside the Export PNG modal:

Flight plan placement:  [ None ] [↖ TL] [↗ TR] [↙ BL] [↘ BR] [Custom…]
  • None — no plan on export
  • TL/TR/BL/BR — wireframe snaps to that corner of the current page frame (A3/A4) or the viewport when no frame is set
  • Custom — centred placeholder, fully draggable and resizable
  • Selected option highlights yellow; user can re-pick freely without leaving the export dialog

Removed:

  • .modal-pin button + planPinned state
  • Pin-modal drag handlers
  • Four-corner resize handles on the flight-plan modal
  • Font auto-shrink + ResizeObserver hooks
  • navaid.planPin / planW / planH localStorage (auto-cleared on first open so old installs migrate silently)
  • modal.pinned CSS — replaced with plan-placeholder rules

Canvas drawFlightPlanTable always uses S.fpHeadersShort now.

Branch was force-pushed to resolve the conflict with dev (28 superseded pin-era commits collapsed into one coherent refactor on top of current dev).

Tests:

  • Pin tests dropped (feature gone)
  • New tests: pin button is gone, stale-storage cleanup, corner placement creates placeholder, None removes it, export with placement still produces PNG
  • Full suite: 241 / 241 pass

@github-actions github-actions Bot temporarily deployed to pr-preview-338 May 26, 2026 19:27 Inactive
auto-merge was automatically disabled May 27, 2026 06:41

Pull request was converted to draft

msupino added 2 commits May 27, 2026 09:49
Change page.goto('/?lang=en') to page.goto('?lang=en') in all test
files so they resolve relative to the baseURL path instead of the
domain root. Fixes e2e-deployed tests hitting the production site
instead of the PR preview.
When EXPECTED_SHA env var is set (e2e-deployed workflow), each test
verifies the deployed core.js SHA matches after the test runs.
Catches cases where page.goto resolves to a different deployment
than the intended preview.
tintFill only accepts one argument (hex). The second argument was an
unused alpha override that should be removed. Notes always use the
global yellowAlpha opacity.
@github-actions

github-actions Bot commented May 27, 2026

Copy link
Copy Markdown
Contributor

🚀 Preview deployed

Open PR preview →

https://msupino.github.io/NavigationApp/branch/dev-planPin-v2/

Commit: 1505cb7

msupino added 2 commits May 30, 2026 04:19
# Conflicts:
#	docs/core.js
#	docs/he/strings.js
#	docs/index.html
#	docs/io.js
#	docs/style.css
#	tests/flight-plan.spec.js
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.

2 participants