# RCWeb Weather Control

**Weather Control** is the phone-friendly companion to the **weather** viewer. It lets one or more phones in a room change the location, choose units, decide which dashboard pages cycle (and how long each one stays on screen), and step through pages by hand.

![icon](pwa-512x512.png "Weather Control App Icon")

## What it does

A single scrolling page with five sections:

1. **Live preview** — a small pill at the top showing the current temperature, condition icon and which page is on screen, updated whenever the viewer pushes a snapshot.
2. **Location** — a search box backed by Open-Meteo's geocoding API; tap a result to send it to the viewer. Plus a quick-pick list of the curated random cities and a *Surprise me* button that asks the viewer to pick a fresh random location.
3. **Units** — segmented controls for temperature (°C / °F), wind speed (km/h, mph, m/s, kn) and precipitation (mm / inch). Changing a unit triggers a fresh fetch on the viewer.
4. **Pages to cycle** — checkboxes for each dashboard page (Now, Hourly, 7-day, Conditions, Sun & sky), plus a slider for the time spent on each page (5–60 seconds).
5. **Now playing** — Prev / Next buttons and a Refresh data button.

## RCWeb communication

The viewer is authoritative; the control is a thin client.

Outbound (control → viewer):

```javascript
rc.sendFunctionCall("weather", "weather.setLocation", { name, country, latitude, longitude, timezone });
rc.sendFunctionCall("weather", "weather.setOptions",  { tempUnit, windUnit, precipUnit, pageMs, pages });
rc.sendFunctionCall("weather", "weather.next");
rc.sendFunctionCall("weather", "weather.prev");
rc.sendFunctionCall("weather", "weather.refresh");
rc.sendFunctionCall("weather", "weather.randomize");
rc.sendFunctionCall("weather", "weather.requestState", rc.client);
```

Inbound (viewer → control):

```javascript
weatherControl.receiveState({
    location: { name, country, latitude, longitude, timezone },
    options:  { tempUnit, windUnit, precipUnit, pageMs, pages },
    pageIdx:  2,
    pages:    ["now", "hourly", "forecast", "details", "sun"],
    randomLocations: [ ... ],
    current:  { temperature: 21, weatherCode: 2, isDay: 1, conditionLabel: "Partly cloudy" },
    updated:  1730000000000
});
```

The viewer broadcasts a fresh snapshot to every `weather-c` client whenever the location, options, page or weather data change. New controllers explicitly request a snapshot on connect via `weather.requestState(rc.client)`, so they catch up even if they joined mid-cycle.

## Browser support

Written in ES5 with `XMLHttpRequest`-style code, simple Flexbox layout, vendor-prefixed transitions, and no CSS Grid or custom properties — works comfortably on older mobile browsers.

## URL

`/weather-c/?r=<room>`