sequenceDiagram
participant App as Application
participant Client as Hiyve Client
participant Signaling as Signaling Server
participant MediaServer as Media Server
Note over App,MediaServer: Step 1: Initialize the client
App->>App: Generate room token via server API
App->>Client: new Client({roomToken})
Note over App,MediaServer: Step 2: Configure devices
App->>Client: listVideoDevices()
Client->>App: Return video devices array
App->>Client: listAudioInputDevices()
Client->>App: Return audio input devices array
App->>Client: listAudioOutputDevices()
Client->>App: Return audio output devices array
App->>Client: setLocalVideoDevice({videoDeviceId})
App->>Client: setLocalAudioInputDevice({audioInputDeviceId, constraints})
App->>Client: setAudioOutputDevice({audioOutputDeviceId})
Note over App,MediaServer: Step 3: Create room
App->>Client: createRoom({roomName, userId})
Client->>Client: Create Signaling instance
Client->>Signaling: init({roomName, userId, roomToken})
Signaling->>Signaling: Connect to server
Client->>Client: Set up event listeners
Client->>Signaling: createRoom({roomName})
Signaling->>MediaServer: Create room request
MediaServer->>Signaling: Room created response
Signaling->>Client: Return room object
Client->>Signaling: getRtpCapabilities()
Signaling->>MediaServer: Get RTP capabilities
MediaServer->>Signaling: Return capabilities
Signaling->>Client: Return capabilities
Client->>Client: device.load({routerRtpCapabilities})
Client->>App: Return room object
Note over App,MediaServer: Step 4: Connect media transports
App->>Client: connectTransports({localVideoElementId})
Client->>Signaling: createTransport()
Signaling->>MediaServer: Create WebRTC transport
MediaServer->>Signaling: Transport parameters
Signaling->>Client: Return transport details
Client->>Client: Create send transport
Client->>Client: Set up send transport event handlers
Client->>Client: getUserMedia() for audio/video
Client->>Client: Attach local stream to video element
Client->>Client: sendTransport.produce(videoTrack)
Client->>Signaling: produce({transportId, kind: "video", rtpParameters})
Signaling->>MediaServer: Produce video
MediaServer->>Signaling: Producer ID
Signaling->>Client: Return producer ID
Client->>Client: sendTransport.produce(audioTrack)
Client->>Signaling: produce({transportId, kind: "audio", rtpParameters})
Signaling->>MediaServer: Produce audio
MediaServer->>Signaling: Producer ID
Signaling->>Client: Return producer ID
Client->>Signaling: createTransport() for receiving
Signaling->>MediaServer: Create WebRTC receive transport
MediaServer->>Signaling: Transport parameters
Signaling->>Client: Return transport details
Client->>Client: Create receive transport
Client->>Client: Set up receive transport event handlers
Note over App,MediaServer: Step 5: Room is ready for communication
Client->>App: Emit CONNECTED event
Note over App,MediaServer: Step 6: Participants can now communicate
Client->>App: Emit events (MEDIA_TRACK_ADDED, etc.)
Tutorial