Class CardVideoDisplay

CardVideoDisplay component displays a video stream with options for full display, mirroring, and background color customization.

Selector

app-card-video-display

Standalone

true

Imports

CommonModule

Inputs

remoteProducerId (string): Identifier for the remote producer.
eventType (EventType): Type of event, such as 'webinar'. Default is 'webinar'.
forceFullDisplay (boolean): Forces full video display if true. Default is false.
videoStream (MediaStream | null): The media stream to display in the video element.
backgroundColor (string): Background color for the video container. Default is 'transparent'.
doMirror (boolean): Mirrors the video if true. Default is false.

Methods

ngOnInit(): Initializes the video stream and sets the container style on component load.
ngOnChanges(changes: SimpleChanges): Updates the video stream or container style when inputs change.
updateVideoStream(): Assigns the video stream to the video element if it differs from the current stream.
setVideoContainerStyle(): Sets the style of the video container based on the provided background color.
getBaseVideoContainerStyle(): Returns base styles for the video container.
getVideoStyle(): Returns styles for the video element, including optional mirroring and sizing.

Example

<app-card-video-display
 [remoteProducerId]="producerId"
[eventType]="'conference'"
[forceFullDisplay]="true"
[videoStream]="stream"
[backgroundColor]="'black'"
[doMirror]="true">
</app-card-video-display>

Implements

OnInit
OnChanges

Index

Constructors

constructor

new CardVideoDisplay(): CardVideoDisplay
Returns CardVideoDisplay

Methods

ngOnInit

ngOnInit(): void
A callback method that is invoked immediately after the default change detector has checked the directive's data-bound properties for the first time, and before any of the view or content children have been checked. It is invoked only once when the directive is instantiated.

Returns void
Implementation of OnInit.ngOnInit
- Defined in src/lib/components/display-components/card-video-display/card-video-display.component.ts:79

ngOnChanges

ngOnChanges(changes): void
A callback method that is invoked immediately after the default change detector has checked data-bound properties if at least one has changed, and before the view and content children are checked.
Parameters
- changes: SimpleChanges
  The changed properties.
Returns void
Implementation of OnChanges.ngOnChanges
- Defined in src/lib/components/display-components/card-video-display/card-video-display.component.ts:84

updateVideoStream

updateVideoStream(): void
Returns void
- Defined in src/lib/components/display-components/card-video-display/card-video-display.component.ts:106

setVideoContainerStyle

setVideoContainerStyle(): void
Returns void
- Defined in src/lib/components/display-components/card-video-display/card-video-display.component.ts:117

getBaseVideoContainerStyle

getBaseVideoContainerStyle(): {
    display: string;
    justifyContent: string;
    alignItems: string;
    width: string;
    height: string;
    backgroundColor: string;
}
Returns {
    display: string;
    justifyContent: string;
    alignItems: string;
    width: string;
    height: string;
    backgroundColor: string;
}
- display: string
- justifyContent: string
- alignItems: string
- width: string
- height: string
- backgroundColor: string
- Defined in src/lib/components/display-components/card-video-display/card-video-display.component.ts:124

getVideoStyle

getVideoStyle(): any
Returns any
- Defined in src/lib/components/display-components/card-video-display/card-video-display.component.ts:135

Properties

remoteProducerId

remoteProducerId: string = ''

eventType

eventType: EventType = 'webinar'

forceFullDisplay

forceFullDisplay: boolean = false

videoStream

videoStream: null | MediaStream = null

backgroundColor

backgroundColor: string = 'transparent'

doMirror

doMirror: boolean = false

videoElement

videoElement: ElementRef<HTMLVideoElement>

videoContainerStyle

videoContainerStyle: any

Class CardVideoDisplay

Selector

Standalone

Imports

Inputs

Methods

Example

Implements

Index

Constructors

Methods

Properties

Constructors

constructor

Returns CardVideoDisplay

Methods

ngOnInit

Returns void

ngOnChanges

Parameters

Returns void

updateVideoStream

Returns void

setVideoContainerStyle

Returns void

getBaseVideoContainerStyle

Returns { display: string; justifyContent: string; alignItems: string; width: string; height: string; backgroundColor: string; }

display: string

justifyContent: string

alignItems: string

width: string

height: string

backgroundColor: string

getVideoStyle

Returns any

Properties

remoteProducerId

eventType

forceFullDisplay

videoStream

backgroundColor

doMirror

videoElement

videoContainerStyle

Settings

On This Page

Returns {
display: string;
justifyContent: string;
alignItems: string;
width: string;
height: string;
backgroundColor: string;
}