# RCWeb v-c

The **RCWeb v-c App** (`app/v-c`) is a mobile-styled controller for the Viewer (`v`) app, built on **UIKit** to look and feel like a native mobile application. It implements the same **Asymmetric (Sender/Viewer) pattern** as the original `c` controller — converting user gestures into JavaScript payloads sent to viewer (`v`) apps in the same room.

![icon](pwa-512x512.png "v-c App Icon")

## Screenshot
![screenshot](screenshot-narrow.png "v-c App")

## What it does

- **Mobile UI on UIKit**: Sticky top app bar, off-canvas side menu, segmented section tabs, mobile-optimized cards, and touch-friendly buttons. Reset and other tools live in the off-canvas side menu.
- **Grouped functionality**: Controls are organized into five clear sections — *Display*, *Media*, *Web*, *Code*, and *Apps* — each shown one-at-a-time with smooth transitions.
- **Categorized App Launchpad**: All available RCWeb apps are surfaced as an icon grid grouped into *Games*, *Media & Broadcast*, *Collaboration*, and *Tools*. A pill filter bar lets the user narrow the list.
- **Same proven core**: Solid color, image (URL/upload), video (URL/upload), iframe embed, redirect, raw HTML, raw JavaScript, app launch, and reset — all behaving identically to the original `c` app.
- **Streaming uploads**: Reuses the chunked file streaming logic — small files become Base64 data URLs; files ≥ 1 MB stream peer-to-peer via the `/x-file/...` proxy route.

## How it works

The app shares its execution model with `c`:

- `loadControls()` sets default URLs, wires up segment-nav clicks, off-canvas menu items, app filter pills, and connects via `rc.connect()`.
- Action handlers (`showColor`, `showImage`, `showVideo`, `showHtml`, `showIFrame`, `redirect`, `showApp`, `reset`, `sendJavaScriptArea`) build a JavaScript payload and dispatch it to the room with `rc.send(js, "v")` — or, for app switches, `rc.send(js, "!c,*-c")`.

- `activateSection(name)` swaps the visible section, updates the URL hash, and keeps the segmented tab and side-menu link state in sync.
- `applyAppFilter(filter)` toggles `c2-hidden` on each launchpad group so users can quickly find what they want.
- The connection light in the top bar (a bolt icon) flips between online/offline tints based on `rc.onUpdateNetworkStatus`, and the off-canvas menu mirrors the same status text.

## Differences from `c`

- Uses UIKit components (navbar, off-canvas, dropdown, icon set, button/input/textarea classes) and adds a custom mobile-app stylesheet on top.
- Sections are shown one at a time via a segmented top tab bar with icon labels rather than the original tab strip.
- The app launcher is split into groups with a filter pill bar instead of a single horizontal scroller.
- A floating action button surfaces *Reset* permanently in the bottom-right corner.
- The PWA window opens taller (430×760) to better resemble a phone.
- The app's name (`v-c`) is matched by the `*-c` wildcard, so the exclusion list for app-switch / reset commands simplifies from `"!c,c2,*-c"` to `"!c,*-c"`.
