動画にサムネイルを追加した。

public_new/icon/icon_disable_movie.svg

+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 128 128"><defs><style>.cls-1{opacity:0.9;}.cls-2{opacity:0.5;}.cls-3{fill:#fefefe;}.cls-4{fill:#707070;}.cls-5{fill:#fff;}</style></defs><g id="レイヤー_2" data-name="レイヤー 2"><g id="オフライン時の動画再生ボタン"><g class="cls-1"><image class="cls-2" width="128" height="128" xlink:href="data:image/png;base64,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"/><circle class="cls-3" cx="61" cy="61" r="54.75"/></g><path class="cls-4" d="M90.78,58.57,48,33.89a2.81,2.81,0,0,0-4.21,2.43V85.68A2.81,2.81,0,0,0,48,88.11L90.78,63.43A2.81,2.81,0,0,0,90.78,58.57Z"/><g class="cls-1"><image class="cls-2" width="128" height="128" xlink:href="data:image/png;base64,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"/><rect class="cls-5" x="58.08" y="-14.66" width="5.84" height="151.32" rx="2.92" transform="translate(-25.27 61) rotate(-45)"/></g></g></g></svg>
\ No newline at end of file

public_new/js/utils/chat-media-handler.js

@@ -64,14 +64,6 @@ $("#video-form").on("submit", function (e) {
     var fd = new FormData($(this)[0]);
 
     if (!file.type.includes("image")) {
-      // video 保存
-      // ChatMediaHandler.createVideoThumbnailAndUpload(file, function(resizeFile, thumbnailCreated) {
-      //     if(resizeFile && thumbnailCreated) {
-      //         //ただ、画像の大きさが500pixel以下の場合はthumbnailは生成されない
-      //         fd.append('thumb', resizeFile)
-      //     }
-      //     ChatMediaHandler.uploadImage(fd);
-      // })
       ChatMediaHandler.uploadImage(fd);
       return;
     }
@@ -119,12 +111,10 @@ ChatMediaHandler.videoEncodeEnd = function (encodedUri) {
           res.fileName +
           "&roomId=" +
           roomInfo.roomID;
-        var imageName = res.fileName;
+        var imageName = new String(res.fileName);
 
         // uploadFileの判断
-        var extension = imageName
-          .substr(imageName.lastIndexOf(".") + 1)
-          .toLowerCase();
+        var extension = imageName.substr(imageName.lastIndexOf(".") + 1).toLowerCase();
 
         if (res.thumbnailPath && res.thumbnailPath.length > 0) {
           imgPath =
@@ -151,6 +141,7 @@ ChatMediaHandler.videoEncodeEnd = function (encodedUri) {
           controls: "true",
           width: "auto",
           style: "max-width:100%",
+          poster: "./img/bg_movie.jpg",
         });
         const source = $("<source/>", { src: videoSrc });
         const downloadIcon = $("<a/>", {
@@ -350,6 +341,7 @@ ChatMediaHandler.uploadImage = function (formData) {
           controls: "true",
           width: "auto",
           style: "max-width:100%",
+          poster: "./img/bg_movie.jpg",
         });
         const source = $("<source/>", { src: videoSrc });
         const downloadIcon = $("<a/>", {