How 6can/television-controller works
Television Controller is a local-network Android TV/Google TV remote. The browser UI discovers or accepts a TV address, pairs with its on-screen code (or reconnects using saved credentials), then sends remote, text, and app-launch commands while receiving live status. README capabilities also include editable app shortcuts, keyboard control, and responsive themes. The main UI, route, and manager relationships are supported by excerpts; some frontend-to-API and backend runtime wiring is documented but not directly shown, so those links are dashed.
Main entry points: App.tsx Controller UI · api.ts API client · remote.tsx Remote controls · index.js HTTP server
Components 24
Browser controller
- Controller UI
web/src/App.tsx - Connect and pair
web/src/components/connect/connect.tsx - Remote controls
web/src/components/remote/remote.tsx - Directional pad
web/src/components/remote/dpad.tsx - Remote button
web/src/components/remote/remote-button.tsx - Number and search
web/src/components/remote/keypad.tsx - App shortcuts
web/src/components/remote/app-launcher.tsx - Live volume
web/src/components/remote/volume-bar.tsx - Keyboard control
web/src/hooks/use-keyboard-remote.ts - Shortcut preferences
web/src/hooks/use-apps.ts - Status subscription
web/src/hooks/use-tv-status.ts - API client
web/src/lib/api.ts - Theme provider
web/src/components/theme-provider.tsx - Foreground app matching
web/src/lib/apps.ts
Local API
- HTTP server
server/index.js - TV routes
server/routes/tv.js - Shortcut routes
server/routes/apps.js - Health route
server/routes/health.js
TV connection
- Network discovery
server/tv/discovery.js - Pairing and commands
server/tv/manager.js - Shortcut catalog
server/tv/apps.js
Local state
- Persistent config
server/config.js
Other components
- Computer user
- Android TV
Connections 33
- Computer user → Controller UI: uses
README.md - Controller UI → Connect and pair: renders
web/src/App.tsx - Controller UI → Remote controls: renders
web/src/App.tsx - Controller UI → Number and search: renders
web/src/App.tsx - Controller UI → App shortcuts: renders
web/src/App.tsx - Controller UI → Live volume: renders
web/src/App.tsx - Controller UI → Keyboard control: registers
web/src/App.tsx - Remote controls → Directional pad: renders
web/src/components/remote/remote.tsx - Remote controls → Remote button: uses
web/src/components/remote/remote.tsx - Controller UI → Status subscription: reads status
web/src/App.tsx - Controller UI → Shortcut preferences: loads shortcuts
web/src/App.tsx - Controller UI → Foreground app matching: matches app
web/src/App.tsx - Connect and pair → API client: requests
- Remote controls → API client: sends commands
- Number and search → API client: sends text
- App shortcuts → API client: launches apps
- API client → HTTP server: calls API
- HTTP server → TV routes: mounts
server/index.js - HTTP server → Shortcut routes: mounts
server/index.js - HTTP server → Health route: mounts
server/index.js - TV routes → Network discovery: discovers via
server/routes/tv.js - TV routes → Pairing and commands: dispatches
server/routes/tv.js - Shortcut routes → Shortcut catalog: normalizes with
server/routes/apps.js - Shortcut routes → Persistent config: reads and writes
server/routes/apps.js - Health route → Persistent config: reads
server/routes/health.js - Pairing and commands → Persistent config: persists credentials
server/tv/manager.js - Pairing and commands → Android TV: pairs and controls
server/tv/manager.js - Network discovery → Android TV: finds devices
server/tv/discovery.js - Android TV → Pairing and commands: emits live state
- Status subscription → API client: subscribes
- Controller UI → Theme provider: reads theme
- Controller UI → Foreground app matching: labels foreground app
web/src/App.tsx - App shortcuts → Shortcut preferences: edits shortcuts