How nersus15/kamscode-meet-web works
This is a Vue-based browser video-meeting app. Users authenticate, browse or create rooms, join a room, and then use live video, screen sharing, participant controls, and encrypted chat. The excerpts show the app’s authentication and room-view routing, while the source index documents the room composable’s media and signaling dependencies. The README is only a Vue starter-template description, so product capabilities are inferred from the source tree and comments; unsampled implementation details and backend behavior are not verified.
Main entry points: useRoom.ts Room state · RoomView.vue Meeting view · chat.ts Chat state · App.vue App router
Components 27
Account and navigation
- App router
src/App.vue - Sign-in screen
src/components/AuthScreen.vue - Session state
src/composables/useAuth.ts - Room navigation
src/composables/useNav.ts
Room experience
- Room directory
src/components/HomeScreen.vue - Room lobby
src/components/LobbyScreen.vue - Meeting view
src/views/RoomView.vue - Room state
src/composables/useRoom.ts - Meeting controls
src/components/ControlBar.vue - Video tile
src/components/VideoTile.vue - Participant strip
src/components/FilmStrip.vue - Safety dialog
src/components/SafetyDialog.vue - Connection debug
src/components/DebugPanel.vue
Realtime media
- REST client
src/lib/api.ts - WebSocket signaling
src/lib/signaling.ts - Media publisher
src/lib/publisher.ts - Media subscriber
src/lib/subscriber.ts - Speaker detection
src/lib/speaker.ts - Device identity
src/lib/device.ts - Message protocol
src/types/protocol.ts
Encrypted chat
- Chat panel
src/components/ChatPanel.vue - Chat state
src/composables/chat.ts - Message encryption
src/lib/e2ee.ts - Key trust
src/lib/trust.ts
Other components
- Meeting user
- Meeting API
- SFU service
Connections 39
- Meeting user → App router: opens
src/App.vue - App router → Session state: loads session
src/App.vue - App router → Sign-in screen: shows signed out
src/App.vue - App router → Room directory: shows home
src/App.vue - App router → Meeting view: opens room
src/App.vue - Sign-in screen → Session state: submits credentials
src/components/AuthScreen.vue - Session state → REST client: requests session
src/composables/useAuth.ts - REST client → Meeting API: calls REST
src/lib/api.ts - Room directory → REST client: lists rooms
src/components/HomeScreen.vue - Room directory → Room navigation: navigates rooms
src/components/HomeScreen.vue - Room lobby → REST client: joins room
src/components/LobbyScreen.vue - Room lobby → Room navigation: navigates rooms
src/components/LobbyScreen.vue - Room lobby → Room state: reads room state
src/components/LobbyScreen.vue - Meeting view → Room state: creates room state
src/views/RoomView.vue - Meeting view → Room lobby: shows before joining
src/views/RoomView.vue - Meeting view → Video tile: renders video
src/views/RoomView.vue - Meeting view → Participant strip: renders participants
src/views/RoomView.vue - Meeting view → Meeting controls: renders controls
src/views/RoomView.vue - Meeting view → Chat panel: renders chat
src/views/RoomView.vue - Meeting view → Safety dialog: opens safety dialog
src/views/RoomView.vue - Meeting view → Connection debug: renders debug panel
src/views/RoomView.vue - Meeting controls → Room state: changes room state
src/components/ControlBar.vue - Video tile → Room state: reads tile data
src/components/VideoTile.vue - Room state → REST client: requests join ticket
src/composables/useRoom.ts - Room state → Device identity: gets device ID
src/composables/useRoom.ts - Room state → WebSocket signaling: connects and dispatches
src/composables/useRoom.ts - Room state → Media publisher: publishes media
src/composables/useRoom.ts - Room state → Media subscriber: receives media
src/composables/useRoom.ts - Room state → Speaker detection: detects speakers
src/composables/useRoom.ts - Room state → Chat state: manages chat
src/composables/useRoom.ts - WebSocket signaling → SFU service: exchanges messages
src/lib/signaling.ts - Media publisher → WebSocket signaling: sends offers
src/lib/publisher.ts - Media subscriber → WebSocket signaling: negotiates streams
src/lib/subscriber.ts - WebSocket signaling → Message protocol: uses message types
src/lib/signaling.ts - Chat panel → Chat state: manages messages
src/components/ChatPanel.vue - Chat state → Message encryption: encrypts and decrypts
src/composables/chat.ts - Chat state → Key trust: checks key trust
src/composables/chat.ts - Chat state → Message protocol: uses chat messages
src/composables/chat.ts - Chat state → SFU service: relays encrypted envelopes
src/composables/chat.ts