bug of video player is fixed

projects/ucap-webmessenger-ui/src/lib/components/file-viewer/video-viewer.component.html

@@ -86,14 +86,22 @@
   </div>
   <div class="ucap-video-viewer-body">
     <div
+      #videoContainer
       class="ucap-video-viewer-video-icon"
       fxLayout="row"
       fxLayout.xs="column"
       fxLayoutAlign="center center"
     >
       <video
-        [src]="fileDownloadUrl"
         #audioPlayer
+        [src]="fileDownloadUrl"
+        [style.width]="'auto'"
+        [style.height]="
+          videoHeight > videoContainer.clientHeight
+            ? ((videoContainer.clientHeight - 20) / videoHeight) * videoHeight +
+              'px'
+            : videoHeight + 'px'
+        "
         (playing)="onPlayingVideo()"
         (pause)="onPauseVideo()"
         (timeupdate)="onTimeUpdateVideo()"
@@ -124,7 +132,7 @@
         fxLayout.xs="column"
       >
         <div class="ucap-video-viewer-video-time-current">
-          {{ currentTime | ucapSecondsToMinutes }}
+          {{ Math.floor(currentTime) | ucapSecondsToMinutes }}
         </div>
         <span class="ucap-video-viewer-spacer"></span>
         <button
@@ -148,7 +156,7 @@
         </button>
         <span class="ucap-video-viewer-spacer"></span>
         <div class="ucap-video-viewer-video-time-total">
-          {{ duration | ucapSecondsToMinutes }}
+          {{ Math.floor(duration) | ucapSecondsToMinutes }}
         </div>
       </div>
     </div>

projects/ucap-webmessenger-ui/src/lib/components/file-viewer/video-viewer.component.ts

@@ -5,12 +5,14 @@ import {
   Output,
   EventEmitter,
   ViewChild,
-  ElementRef
+  ElementRef,
+  ChangeDetectorRef
 } from '@angular/core';
 import { ucapAnimations } from '../../animations';
 import { FileEventJson } from '@ucap-webmessenger/protocol-event';
 import { MatSlider, MatSliderChange } from '@angular/material';
 import { FileDownloadItem } from '@ucap-webmessenger/api';
+import { NGXLogger } from 'ngx-logger';
 
 @Component({
   selector: 'ucap-video-viewer',
@@ -38,13 +40,21 @@ export class VideoViewerComponent implements OnInit {
   timeSlider: MatSlider;
 
   playing = false;
-  duration = 0.01;
-  currentTime = 0;
+  duration = 0.0;
+  currentTime = 0.0;
   volume = 0.1;
   loading = false;
   fileDownloadItem: FileDownloadItem;
 
-  constructor() {}
+  videoWidth = 0;
+  videoHeight = 0;
+
+  Math = Math;
+
+  constructor(
+    private changeDetectorRef: ChangeDetectorRef,
+    private logger: NGXLogger
+  ) {}
 
   ngOnInit() {}
 
@@ -74,11 +84,11 @@ export class VideoViewerComponent implements OnInit {
   }
 
   onTimeUpdateVideo(): void {
-    this.currentTime = Math.floor(this.audioPlayer.nativeElement.currentTime);
+    this.currentTime = this.audioPlayer.nativeElement.currentTime;
   }
 
   onVolumeChangeVideo(): void {
-    this.volume = Math.floor(this.audioPlayer.nativeElement.volume);
+    this.volume = this.audioPlayer.nativeElement.volume;
   }
 
   onLoadStartVideo(): void {
@@ -87,7 +97,10 @@ export class VideoViewerComponent implements OnInit {
 
   onLoadedDataVideo(): void {
     this.loading = false;
-    this.duration = Math.floor(this.audioPlayer.nativeElement.duration);
+    this.duration = this.audioPlayer.nativeElement.duration;
+
+    this.videoWidth = this.audioPlayer.nativeElement.videoWidth;
+    this.videoHeight = this.audioPlayer.nativeElement.videoHeight;
   }
 
   onClickDownload(): void {