> video file upload thumbnail image resize.

> extention tolowercase
> video type message-box layout modify

projects/ucap-webmessenger-api-common/src/lib/services/common-api.service.ts

@@ -185,7 +185,7 @@ export class CommonApiService {
   public acceptableExtensionForFileTalk(extensions: string[]): boolean {
     for (const extension of extensions) {
       if (
-        -1 === this.moduleConfig.acceptableFileExtensions.indexOf(extension)
+        -1 === this.moduleConfig.acceptableFileExtensions.indexOf(extension.toLowerCase())
       ) {
         return false;
       }

projects/ucap-webmessenger-core/src/lib/utils/file.util.ts

@@ -80,8 +80,32 @@ export class FileUtil {
         const snapImage = () =>
           new Promise<Blob>((imgResolve, imgReject) => {
             const canvas = document.createElement('canvas');
-            canvas.width = video.videoWidth;
+
-            canvas.height = video.videoHeight;
+            // thumbnail image resize
+            const width = video.videoWidth;
+            const height = video.videoHeight;
+            let resizeWidth = 0;
+            let resizeHeight = 0;
+
+            // max size
+            const maxWidth = 320;
+            const maxHeight = 320;
+
+            if (width > maxWidth || height > maxHeight) {
+              if (width > height) {
+                resizeWidth = maxWidth;
+                resizeHeight = Math.round((height * resizeWidth) / width);
+              } else {
+                resizeHeight = maxHeight;
+                resizeWidth = Math.round((width * resizeHeight) / height);
+              }
+            } else {
+              resizeWidth = width;
+              resizeHeight = height;
+            }
+
+            canvas.width = resizeWidth;
+            canvas.height = resizeHeight;
             canvas
               .getContext('2d')
               .drawImage(video, 0, 0, canvas.width, canvas.height);

projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video.component.html

@@ -1,7 +1,9 @@
 <div class="bubble-main">
   <!--파일명에 따라 doc exe hwp ppt xls zip 으로 추가되고 나머지 파일 명은 file로 기간이 만료된 파일은 그뒤에 disable도 추가-->
   <!-- <div class="file-img" [ngClass]="fileInfo.FileExt"></div> -->
-  <img *ngIf="!!fileInfo.thumbUrl" [src]="fileInfo.thumbUrl" />
+  <div>
+    <img *ngIf="!!fileInfo.thumbUrl" [src]="fileInfo.thumbUrl" />
+  </div>
   <div
     *ngIf="!fileInfo.thumbUrl"
     [ngClass]="['mime-icon', 'light', 'ico-' + fileInfo.fileExt]"