ambiser
/
openvidu
mirror of https://github.com/OpenVidu/openvidu.git
8
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

openvidu-components: Fixed video content style

pull/713/head
csantosm 2022-03-30 12:10:15 +02:00
parent af3c21742f
commit a39249eaaf
1 changed files with 14 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
openvidu-components-angular/projects/openvidu-angular/src/lib/components/video/video.component.ts
View File

@ -26,12 +26,13 @@ export class VideoComponent implements AfterViewInit {
ngAfterViewInit() { ngAfterViewInit() {
setTimeout(() => { setTimeout(() => {
if (this._streamManager && this._videoElement) { if (this._streamManager && this._videoElement) {
this.updateVideoStyles();
this._streamManager.addVideoElement(this._videoElement.nativeElement); this._streamManager.addVideoElement(this._videoElement.nativeElement);
} }
}); });
} }
@ViewChild('videoElement') @ViewChild('videoElement', {static:false})
set videoElement(element: ElementRef) { set videoElement(element: ElementRef) {
this._videoElement = element; this._videoElement = element;
} }
@ -41,15 +42,20 @@ export class VideoComponent implements AfterViewInit {
if (streamManager) { if (streamManager) {
this._streamManager = streamManager; this._streamManager = streamManager;
if (!!this._videoElement && this._streamManager) { if (!!this._videoElement && this._streamManager) {
this.type = <VideoType>this._streamManager?.stream?.typeOfVideo; this.updateVideoStyles();
if (this.type === VideoType.SCREEN) {
this._videoElement.nativeElement.style.objectFit = 'contain';
// this._videoElement.nativeElement.style.background = '#272727';
} else {
this._videoElement.nativeElement.style.objectFit = 'cover';
}
this._streamManager.addVideoElement(this._videoElement.nativeElement); this._streamManager.addVideoElement(this._videoElement.nativeElement);
} }
} }
} }
private updateVideoStyles() {
this.type = <VideoType>this._streamManager?.stream?.typeOfVideo;
if (this.type === VideoType.SCREEN) {
this._videoElement.nativeElement.style.objectFit = 'contain';
} else {
this._videoElement.nativeElement.style.objectFit = 'cover';
}
}
} }