Skip to content

v0.13.6

Choose a tag to compare

@TBarregren TBarregren released this 14 May 09:41
· 40 commits to main since this release

Step 6 — Cursor with cross-block sync

The Elevation block grows a cursor on the curve plus an L-shape pair of guide lines pointing at the corresponding x and y axis ticks. The cursor on GPX Map and the cursor on GPX Elevation stay synchronised through the shared state[ mapId ].fraction slot — a scrub on either block moves both cursors.

Behaviour

  • Mouse hover updates the cursor continuously while the pointer is inside the chart's plot rectangle.
  • Mouse press-and-drag uses setPointerCapture so the gesture persists when the pointer drifts off the hit-rect; releasing the button leaves the cursor at its final position so the user can read the value.
  • Mouse pointerleave on the wrapper nulls the fraction, hiding the cursor — but the dismissal is suppressed during an active scrub and on touch pointers so finger-lift doesn't make the cursor flicker off.
  • Touch press-and-drag updates fraction; the cursor persists after finger-lift.
  • The cursor's CSS variable --kntnt-gpx-blocks-elevation-cursor is wired through the inspector's Cursor colour row; the SCSS default #d63638 matches Map's track cursor default for visual parity.

Map-side z-order fix (no-touch exception)

Map's track-cursor marker now uses the shared SVG renderer and is added after the waypoint markers in bootMount, so the cursor sits on top of any waypoint it passes over. Pre-fix, the cursor used the default canvas renderer and ended up in a separate <canvas> element under <overlayPane> — SVG paints on top of canvas, so every waypoint visually obscured the cursor whenever the cursor scrubbed through it.

Gates

  • npm run build
  • composer test — 549 / 549 passing
  • vendor/bin/phpstan — no errors
  • npm run test:js — 459 / 459 passing
  • npx wp-scripts lint-js src/blocks/ — clean