Map tab
|
iOS |
Android |
| Status |
⏳ |
⏳ |
| Code |
— |
— |
Source: click dummies docs/companion_app/sailever-ios.html, docs/companion_app/sailever-android.html (Map tab, live mode).
Verified against code: 2026-10-11 (no code yet; checked against the click dummies)
Purpose
While a paired device records, the Map tab shows where the boat is, the track so far, and the numbers the skipper cares about. Anyone on board can follow the boat without looking at the watch. The Map tab is the start screen.
Data source
Live values come from the recording watch over Bluetooth, not from the server. The server has no live tracking by design (api.md § Endpoints). ⏳ No WatchApp sends live values to a phone yet:
- Garmin: Connect IQ phone messaging (
Communications.transmit) to the SailEver phone app.
- Wear OS: Wearable Data Layer (
MessageClient).
- Apple Watch: WatchConnectivity.
Earlier tracks of the same trip (the faint line) and the trip title come from the server (README, Server API).
Layout / behaviour
Full-screen chart. Over it: a top bar, map controls on the right, the scale bar at the bottom left and the live panel at the bottom. The tab bar sits below the live panel.
Chart
| Element |
Content & format |
Behaviour |
iOS vs Android |
| Base map |
OpenStreetMap tiles with the OpenSeaMap seamark overlay, as on the website. Attribution "© OpenStreetMap contributors" bottom right, above the live panel. |
Pan, pinch zoom, double-tap zoom. |
— |
| Grid |
Latitude and longitude lines every 5′, labels DD°MM′N DD°MM′E (mono, muted). |
Toggled in the layers sheet. On by default. |
— |
| Place names |
Harbours (dot + name), islands (spaced uppercase). |
Toggled in the layers sheet. On by default. |
— |
| Earlier tracks of this trip |
Previous tracks of the live trip, coloured by vessel state, 2.5 px, 35 % opacity. |
Toggled in the layers sheet. On by default. |
— |
| Live track |
The recording track so far, coloured by vessel state (colours), 4 px. |
Grows with every live value. |
— |
| Boat |
Arrow in the signal colour with a white outline, rotated to the heading, with a pulsing ring. |
Moves with every live value. |
— |
| Scale bar |
Bar with a round value: 20, 10, 5, 2, 1, 0.5, 0.25, 0.2, 0.1 or 0.05 NM, at most 110 px wide. |
Updates on zoom and pan. Sits just above the live panel. |
— |
Follow mode
| Element |
Content & format |
Behaviour |
iOS vs Android |
| Follow mode |
On when the tab opens. |
The chart keeps the boat in view, centred in the space above the live panel. Dragging the chart turns it off. The follow button turns it back on and flies to the boat (zoom at least the start zoom). |
— |
Top bar
| Element |
Content & format |
Behaviour |
iOS vs Android |
| Trip chip |
SailEver logo, trip title (bold, one line), "From {departure} · Track {n}". |
Opens the trip detail. |
iOS: glass capsule, tappable. Android: search-bar-style surface; the title area isn't a button. |
| Layers |
Layers icon. |
Opens the layers sheet. |
iOS: in the right-hand button stack (map icon). Android: inside the top bar. |
| Avatar |
Initials. |
Opens Account. |
iOS: separate round glass button next to the chip. Android: inside the top bar. |
Map controls
| Element |
Content & format |
Behaviour |
iOS vs Android |
| Follow button |
Arrow icon, filled and tinted while following. |
Turns follow mode on. |
iOS: in the glass stack under the layers button (near_me). Android: small FAB; icon navigation while following, near_me otherwise. |
| Tools |
Ruler / drafting icon. |
Offers Measure distance and Plan a route; picking one opens that tool (chart-tools.md). |
iOS: round glass button, pull-down menu titled "Tools". Android: primary FAB (architecture), turns into ✕ and expands a FAB menu above it. |
Live panel
A bottom sheet over the chart. Collapsed it shows the header and four instruments. Tapping the handle expands it.
| Element |
Content & format |
Behaviour |
iOS vs Android |
| Handle |
Grabber bar. |
Tap: expand / collapse. |
Android adds an expand/collapse chevron button at the end of the header. |
| Vessel state badge |
Icon + label in the state's colour, using the -ing labels of vessel-state.md: "Sailing", "Motoring" or "Motorsailing". While stationary: the stay ("At anchor", "On a buoy", "In port", "Lines to shore", "Adrift"). |
Changes when the watch reports a new state. |
— |
| Header title |
"Recording on {device name}". |
— |
— |
| Sync line |
Pulsing signal dot + "Live · synced via Bluetooth just now", then "Live · synced via Bluetooth {n} s ago". |
Updates with each live value. |
— |
| SOG |
Big number, 1 decimal. Label "SOG kn". |
Live. |
— |
| COG |
047°. Label "COG T". |
Live. |
— |
| Track distance |
1 decimal. Label "Track NM". |
Distance of the recording track so far. |
— |
| Time |
h:mm. Label "Time h". |
Time since the track started. |
— |
| Split bar (expanded) |
Split bar of the track so far, with engine hours. |
Refreshes every few seconds. |
— |
| Position (expanded) |
DD°MM.mmm′N DDD°MM.mmm′E, mono. |
Live. |
— |
| Pressure (expanded) |
"{hPa} hPa · {trend}", trend one of "rising", "steady", "falling". |
From the watch barometer. Hidden if the watch has none. |
— |
| Started (expanded) |
"{HH:MM} in {departure}". |
— |
— |
| Device (expanded) |
"{device name} · {battery} %". |
Battery of the recording watch. |
— |
| Open trip (expanded) |
Button. |
Opens the trip detail. |
iOS: tinted capsule. Android: tonal button. |
| Share position (expanded) |
Button. |
Opens the system share sheet with the boat name, the position text and a map link (maps.apple.com/?ll=… on iOS, geo: URI on Android). |
iOS: plain capsule. Android: outlined button. |
Layers sheet
| Element |
Content & format |
Behaviour |
iOS vs Android |
| Title |
"Map layers". |
Close (✕) or tap outside. |
iOS: glass half sheet. Android: modal bottom sheet with leading icons per row. |
| Grid |
"Grid", hint "Latitude and longitude every 5 minutes". Switch. |
Shows / hides the grid at once. |
— |
| Place names |
"Place names", hint "Harbours, bays and islands". Switch. |
Shows / hides names. |
— |
| Earlier tracks |
"Earlier tracks of this trip", hint lists them, e.g. "Track 1, Hvar → Vis". Switch. |
Shows / hides earlier tracks. |
— |
States and edge cases
- No track recording: ⏳ not designed. The dummies always show a live track.
- Watch out of Bluetooth range: ⏳ not designed. Proposed: the sync line shows the age of the last value, and the boat marker greys out after 60 s.
- No fix yet: ⏳ not designed.
- Only one live trip can exist at a time (one track records per watch).
Known deviations
- Both dummies show only "Sailing" and "Engine" (this spec: "Motoring", the WatchApp's
-ing label). The WatchApp also has Motorsail and stationary states (vessel-state.md), and the website has a motorsail colour. This spec adds them.
- Share position: the iOS dummy opens the share sheet titled "Position of Luna" with an Apple Maps link; the Android dummy only copies the coordinates. This spec uses the share sheet on both.
- The dummies label the layer "Earlier Tracks" (iOS) and "Earlier tracks of this trip" (Android), and the sheet "Map" (iOS) and "Map layers" (Android). This spec uses the Android wording on both.
- The dummies draw a coastline from OSM data instead of tiles. The real app uses tiles, like the website.