projects/openvidu-components-angular/src/lib/components/videoconference/videoconference.component.ts
The VideoconferenceComponent is the parent of all OpenVidu components. It allow us to create a modern, useful and powerful videoconference apps with ease.
OnDestroy
AfterViewInit
| selector | ov-videoconference |
| styleUrls | ./videoconference.component.scss |
| templateUrl | ./videoconference.component.html |
| onActivitiesPanelStatusChanged |
Type : EventEmitter<ActivitiesPanelStatusEvent>
|
|
This event is fired when the activities panel status has been changed. It provides the new status of the activities panel as ActivitiesPanelStatusEvent payload. |
| onAudioDeviceChanged |
Type : EventEmitter<CustomDevice>
|
|
This event is emitted when the selected audio device changes, providing information about the new custom device that has been selected. |
| onAudioEnabledChanged |
Type : EventEmitter<boolean>
|
|
This event is emitted when the audio state changes, providing information about if the audio is enabled (true) or disabled (false). |
| onBroadcastingStartRequested |
Type : EventEmitter<BroadcastingStartRequestedEvent>
|
|
Provides event notifications that fire when start broadcasting button is clicked. It provides the BroadcastingStartRequestedEvent payload as event data. |
| onBroadcastingStopRequested |
Type : EventEmitter<BroadcastingStopRequestedEvent>
|
|
Provides event notifications that fire when stop broadcasting button is clicked. It provides the BroadcastingStopRequestedEvent payload as event data. |
| onChatPanelStatusChanged |
Type : EventEmitter<ChatPanelStatusEvent>
|
|
This event is fired when the chat panel status has been changed. It provides the new status of the chat panel as ChatPanelStatusEvent payload. |
| onFullscreenEnabledChanged |
Type : EventEmitter<boolean>
|
|
The event is emitted when the fullscreen state changes, providing information about if the fullscreen is enabled (true) or disabled (false). |
| onLangChanged |
Type : EventEmitter<LangOption>
|
|
This event is emitted when the language changes, providing information about the new language that has been selected. |
| onParticipantConnected |
Type : EventEmitter<ParticipantModel>
|
|
Provides event notifications that fire when local participant is connected to the Room. It provides the ParticipantModel payload as event data. |
| onParticipantCreated |
Type : EventEmitter<ParticipantModel>
|
|
Provides event notifications that fire when local participant is created and connected to the Room. |
| onParticipantLeft |
Type : EventEmitter<ParticipantLeftEvent>
|
|
This event is emitted when the local participant leaves the room. |
| onParticipantsPanelStatusChanged |
Type : EventEmitter<ParticipantsPanelStatusEvent>
|
|
This event is fired when the participants panel status has been changed. It provides the new status of the participants panel as ParticipantsPanelStatusEvent payload. |
| onRecordingDeleteRequested |
Type : EventEmitter<RecordingDeleteRequestedEvent>
|
|
Provides event notifications that fire when delete recording button has been clicked. It provides the RecordingDeleteRequestedEvent payload as event data. |
| onRecordingDownloadClicked |
Type : EventEmitter<RecordingDownloadClickedEvent>
|
|
Provides event notifications that fire when download recording button is clicked from ActivitiesPanelComponent. It provides the RecordingDownloadClickedEvent payload as event data. |
| onRecordingPlayClicked |
Type : EventEmitter<RecordingPlayClickedEvent>
|
|
Provides event notifications that fire when play recording button is clicked from ActivitiesPanelComponent. It provides the RecordingPlayClickedEvent payload as event data. |
| onRecordingStartRequested |
Type : EventEmitter<RecordingStartRequestedEvent>
|
|
This event is fired when the user clicks on the start recording button. It provides the RecordingStartRequestedEvent payload as event data. |
| onRecordingStopRequested |
Type : EventEmitter<RecordingStopRequestedEvent>
|
|
Provides event notifications that fire when stop recording button has been clicked. It provides the RecordingStopRequestedEvent payload as event data. |
| onRoomCreated |
Type : EventEmitter<Room>
|
|
Provides event notifications that fire when Room is created for the local participant. It provides the Room payload as event data. |
| onRoomDisconnected |
Type : EventEmitter<void>
|
|
Provides event notifications that fire when Room is disconnected for the local participant. |
| onRoomReconnected |
Type : EventEmitter<void>
|
|
Provides event notifications that fire when Room is reconnected for the local participant. |
| onRoomReconnecting |
Type : EventEmitter<void>
|
|
Provides event notifications that fire when Room is being reconnected for the local participant. |
| onSettingsPanelStatusChanged |
Type : EventEmitter<SettingsPanelStatusEvent>
|
|
This event is fired when the settings panel status has been changed. It provides the new status of the settings panel as SettingsPanelStatusEvent payload. |
| onTokenRequested |
Type : EventEmitter<string>
|
|
Provides event notifications that fire when the local participant is ready to join to the room. This event emits the participant name as data. |
| onVideoDeviceChanged |
Type : EventEmitter<CustomDevice>
|
|
This event is emitted when the selected video device changes, providing information about the new custom device that has been selected. |
| onVideoEnabledChanged |
Type : EventEmitter<boolean>
|
|
This event is emitted when the video state changes, providing information about if the video is enabled (true) or disabled (false). |
| externalToolbar |
getexternalToolbar()
|
| spinnerDiameter |
getspinnerDiameter()
|
The VideoconferenceComponent also offers the option to tailor the default templates to your preferences using a custom template.
| Directive | Reference |
|---|---|
| *ovToolbar | ToolbarDirective |
| *ovToolbarAdditionalButtons | ToolbarAdditionalButtonsDirective |
| *ovToolbarAdditionalPanelButtons | ToolbarAdditionalPanelButtonsDirective |
| *ovPanel | PanelDirective |
| *ovAdditionalPanels | AdditionalPanelsDirective |
| *ovChatPanel | ChatPanelDirective |
| *ovParticipantsPanel | ParticipantsPanelDirective |
| *ovParticipantPanelItem | ParticipantPanelItemDirective |
| *ovParticipantPanelItemElements | ParticipantPanelItemElementsDirective |
| *ovLayout | LayoutDirective |
| *ovStream | StreamDirective |
With the following directives you can modify the default User Interface with the aim of fully customizing your videoconference application.
| Parameter | Type | Reference |
|---|---|---|
| activitiesPanelBroadcastingActivity | boolean |
ActivitiesPanelBroadcastingActivityDirective |
| activitiesPanelRecordingActivity | boolean |
ActivitiesPanelRecordingActivityDirective |
| audioEnabled | boolean |
AudioEnabledDirective |
| lang | AvailableLangs |
LangDirective |
| langOptions | LangOption[] |
LangOptionsDirective |
| livekitUrl | string |
LivekitUrlDirective |
| minimal | boolean |
MinimalDirective |
| participantName | string |
ParticipantNameDirective |
| participantPanelItemMuteButton | boolean |
ParticipantPanelItemMuteButtonDirective |
| prejoin | boolean |
PrejoinDirective |
| recordingStreamBaseUrl | string |
RecordingStreamBaseUrlDirective |
| streamDisplayAudioDetection | boolean |
StreamDisplayAudioDetectionDirective |
| streamDisplayParticipantName | boolean |
StreamDisplayParticipantNameDirective |
| streamVideoControls | boolean |
StreamVideoControlsDirective |
| token | string |
TokenDirective |
| tokenError | any |
TokenErrorDirective |
| toolbarActivitiesPanelButton | boolean |
ToolbarActivitiesPanelButtonDirective |
| toolbarBackgroundEffectsButton | boolean |
ToolbarBackgroundEffectsButtonDirective |
| toolbarBroadcastingButton | boolean |
ToolbarBroadcastingButtonDirective |
| toolbarCameraButton | boolean |
ToolbarCameraButtonDirective |
| toolbarChatPanelButton | boolean |
ToolbarChatPanelButtonDirective |
| toolbarDisplayLogo | boolean |
ToolbarDisplayLogoDirective |
| toolbarDisplayRoomName | boolean |
ToolbarDisplayRoomNameDirective |
| toolbarFullscreenButton | boolean |
ToolbarFullscreenButtonDirective |
| toolbarLeaveButton | boolean |
ToolbarLeaveButtonDirective |
| toolbarMicrophoneButton | boolean |
ToolbarMicrophoneButtonDirective |
| toolbarParticipantsPanelButton | boolean |
ToolbarParticipantsPanelButtonDirective |
| toolbarRecordingButton | boolean |
ToolbarRecordingButtonDirective |
| toolbarScreenshareButton | boolean |
ToolbarScreenshareButtonDirective |
| toolbarSettingsButton | boolean |
ToolbarSettingsButtonDirective |
| videoEnabled | boolean |
VideoEnabledDirective |