# RCWeb Random Photo

**Random Photo** turns any RCWeb display into a slow, cinematic slideshow of 30 random Unsplash photos. The viewer fetches a fresh batch from `GET /photos/random?count=30`, shows the photos sequentially, and cross-fades between them with a subtle Ken Burns zoom and pan.

## What it shows

- Full-bleed hotlinked Unsplash photo URLs
- Ken Burns animation with four rotating variants
- Photo title or alt description, location when supplied, and slide counter
- Required linked attribution in the form: Photo by Photographer Name on Unsplash
- QR code linking to the companion **random-photo-c** phone control

The viewer auto-advances every 16 seconds. Tap the display to pause or resume, swipe to move between photos, or use the phone control.

## How it talks to the controller

The viewer is authoritative. It owns the loaded photo list, the active index, and the play state, then exposes a small public API on `window.randomPhoto`:

```text
randomPhoto.next()
randomPhoto.prev()
randomPhoto.goto(index)
randomPhoto.play()
randomPhoto.pause()
randomPhoto.toggle()
randomPhoto.requestState(clientId)
```

Whenever the slide changes or play/pause toggles, the viewer pushes a snapshot to every `random-photo-c` client in the room with:

```javascript
rc.sendFunctionCall("random-photo-c", "randomPhotoControl.receiveState", snapshot);
```

## Browser support

Written in ES5 with `XMLHttpRequest`, vendor-prefixed CSS animations, and simple responsive CSS. The viewer includes a lean-paint path for older signage browsers that strips expensive effects.

## URL

`/random-photo/?r=<room>`