iOS: CarPlay (#420)

A CarPlay scene beside the phone's: In Progress, Unread and Shows as
CPListTemplates from ipx's API, read with the player's credentials, and
a pick played through the same Playback, so it resumes from the saved
place, saves as it goes and marks read at 90%. Now Playing is the
system's template over Playback's now-playing info.

When the car starts a different episode the page is sent
{t:"replaced"} and closes its player bar. Left open, the bar would have
gone on as the old episode while the host's clock belonged to the new
one, saving that time and marking the wrong item read.

The badge's fetch moves into API.get, which CarPlay shares. Build 13.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

web/CHANGELOG.md

@@ -14,6 +14,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Added
 
 - In the iOS app, the page registers the phone with ipx for its icon's count, and signing out removes it (#433).
+- In the iOS app, the player bar closes when CarPlay starts a different episode, instead of going on as the old one (#420).
 - In the iOS app, the icon's unread count follows the page's: reading and new items change it at once, not the next time the app is opened (#421).
 - In the iOS app, presses are felt: play, pause, flag, pull to refresh, marking read and errors each give the phone's haptic for it (#430).
 - A sleep timer in the player: 5 minutes to an hour, then playback fades out and pauses. In the iOS app the phone keeps the time, so it works with the screen locked; the app and Safari also get an AirPlay button. On a phone the title has the player's top line to itself, with the controls either side of play below it (#429).

web/src/native.ts

@@ -200,6 +200,16 @@ function installNativePlayback(){
           fire('pause');
           fire('ended');
           break;
+        case 'replaced':
+          // The car chose another episode (#420). The bar would go on as this one, saving its
+          // place and marking it read by the other's clock, so it closes. No pause event: that
+          // saves, and N.on is off, so it would write the page's stale time to ipx itself.
+          N.on = false; N.paused = true;
+          player.guid = null;
+          $('#player').classList.remove('on');
+          renderEntries();
+          syncListening();
+          break;
         case 'error':
           N.paused = true;
           fire('pause');