Chart tools: measure and route¶
| iOS | Android | |
|---|---|---|
| Status | ⏳ | ⏳ |
| Code | — | — |
Source: click dummies docs/companion_app/sailever-ios.html, docs/companion_app/sailever-android.html (Map tab, measure and route modes).
Verified against code: 2026-10-11 (no code yet; checked against the click dummies)
Purpose¶
Two quick tools on the chart. Measure gives the distance and bearing between two points and the time it takes at a chosen speed. Route plans a route through several route points and shows the distance and bearing of each route section and the total time.
Both are on-phone calculations: great-circle distance, initial great-circle bearing in degrees true (formats). Neither needs the server, except saving a route.
Layout / behaviour¶
The tools open from the Tools control on the Map tab (map.md). In a tool, the top bar, the map controls and the bottom panel change; the live track and the boat stay on the chart. Follow mode is off while a tool is open. On opening, the chart zooms to fit the tool's points.
Tool top bar and controls (both tools)¶
| Element | Content & format | Behaviour | iOS vs Android |
|---|---|---|---|
| Close | ✕ button. | Back to the live map, follow mode on. Measure points and the route are kept for the next time. | — |
| Tool switch | Segmented control "Measure" (ruler icon) / "Route" (route icon). | Switches tool. | iOS: glass segmented control. Android: Material segmented buttons. |
| Show all points | fit_screen button. |
Zooms to fit A and B, or all route points, above the panel. | iOS: glass stack. Android: small FAB. |
| Show the boat | Boat icon button. | Flies to the boat at zoom 12. | iOS: glass stack. Android: small FAB. |
Measure¶
| Element | Content & format | Behaviour | iOS vs Android |
|---|---|---|---|
| Point A | Round pin "A" in ink colour. Starts at the boat's position. | Drag to move. | — |
| Point B | Round pin "B" in the signal colour. Starts at a fixed offset from A on the first use. | Drag to move. | — |
| Line | Dotted ink line A → B. Label at the middle: "{distance} NM · {bearing}T". | Follows the pins while dragging. | — |
| Distance | Big number + "NM". Label "Distance". | Updates while dragging. | — |
| Bearing A → B | Big 047° + "T". Label "Bearing A → B". |
Updates while dragging. | — |
| Bearing B → A | 227° T, mono. |
Updates while dragging. | — |
| Time at speed | "At {speed} kn" → duration h h mm min. Speed is the planned speed of the route tool. |
— | — |
| Positions | "A · B": position of A and of B, one per line, mono. | — | — |
| Hint | "Drag A and B anywhere on the chart. The bearing is the initial great-circle course from A to B, in degrees true." | — | — |
| Swap A and B | Button. | Swaps the points. | iOS label "Swap". |
| A to boat | Button. | Moves A to the boat and refits. | — |
Route¶
| Element | Content & format | Behaviour | iOS vs Android |
|---|---|---|---|
| Route line | Signal-coloured line with a light halo through all route points. | — | — |
| Route point | Numbered round pin (1, 2, 3 …) in the signal colour. Selected: ink colour with a signal ring. | Tap the chart: adds a point at the end. Drag: moves it and selects it. Tap the pin: selects / deselects it. | — |
| Insert handle | Small "+" pin in the middle of each route section. | Tap: inserts a point there and selects it. | — |
| Total distance | Big number + "NM". Label "Total distance". | Sum of all route sections. | — |
| Planned speed | Label "{n} points · at", stepper − {speed} kn +. Default 5.0 kn, range 1–12 kn, step 0.5 kn. |
Changes the time below and the measure tool's time. | — |
| Time underway | "About {h h mm min} underway". With fewer than 2 points: "Add a second point to see the distance". | — | — |
| Route sections | One row per section: "{i} → {i+1}", distance "{x} NM", bearing "{047°} T". Shown from 2 points. | — | — |
| Hint | No selection: "Tap the chart to add a point. Drag a point to move it, tap + between points to insert one, tap a point to select it." Selection: "Point {n} selected. Drag it, or remove it below." | — | — |
| Remove point | Button, only while a point is selected. | Removes that point. | iOS label "Delete Point {n}", red. |
| Undo | Button. Disabled without points. | Removes the last point. | — |
| Clear | Button. | Removes all points. Toast/snackbar "Route cleared" with Undo. | — |
| Save | Button. | Saves the route. Toast/snackbar "Route saved: {n} points". | Android: pushed to the end of the button row. |
States and edge cases¶
- Distances below 10 NM show 2 decimals, from 10 NM 1 decimal.
- A route with one point shows no total time and no section list.
- Saved routes: ⏳ not designed. Where they are listed, whether they sync to the server or the website, and whether they go to the watch is open (README, Server API).
Known deviations¶
- The Android dummy shows the positions of A and B in the measure panel; the iOS dummy doesn't. This spec shows them on both.
- iOS uses "Delete Point {n}", Android "Remove point {n}". This spec uses "Remove point {n}" (a route point is removed from the route, nothing is deleted on the server).