Add Compress to multiple selection action in Videos Table

languages/en_CA.json

@@ -495,11 +495,13 @@
    "Delete Filter": "Delete Filter",
    "confirmDeleteFilter": "Do you want to delete this filter? You cannot recover it.",
    "Fix Video": "Fix Video",
+   "Compress Videos": "Compress Videos",
    "FixVideoMsg": "Do you want to fix this video? This will create a new file and overwrite the old one. You cannot undo this action.",
    "DeleteVideoMsg": "Do you want to delete this video? You cannot recover it.",
    "CompressVideoMsg": "Do you want to compress this video? The original will be moved to your FileBin.",
    "DeleteThisMsg": "Do you want to delete this? You cannot recover it.",
    "DeleteTheseMsg": "Do you want to delete these? You cannot recover them.",
+   "CompressTheseMsg": "Do you want to compress these? The originals will be moved to your FileBin. Videos that are already WebM will be skipped.",
    "dropBoxSuccess": "Success! Files saved to your Dropbox.",
    "API Key Deleted": "API Key Deleted",
    "APIKeyDeletedText": "Key has been deleted. It will no longer work.",

web/assets/js/bs5.videos.js

@@ -523,6 +523,31 @@ async function downloadVideos(videos){
         await downloadVideo(video)
     }
 }
+function compressVideo(video,callback){
+    if(video.filename.includes('.webm')){
+        console.log('Already Compressed')
+        if(callback)callback('Already Compressed')
+        return
+    }
+    return new Promise((resolve) => {
+        var videoEndpoint = getApiPrefix(`videos`) + '/' + video.mid + '/' + video.filename
+        $.getJSON(videoEndpoint + '/compress',function(data){
+            if(data.ok){
+                console.log('Video Compressing')
+            }else{
+                console.log('Video Not Compressing',data,videoEndpoint)
+            }
+            if(callback)callback()
+            resolve()
+        })
+    })
+}
+async function compressVideos(videos){
+    for (let i = 0; i < videos.length; i++) {
+        var video = videos[i];
+        await compressVideo(video)
+    }
+}
 onWebSocketEvent(function(d){
     switch(d.f){
         case'video_delete':
@@ -611,13 +636,7 @@ $(document).ready(function(){
                 class: 'btn-primary btn-sm'
             },
             clickCallback: function(){
-                $.getJSON(videoEndpoint + '/compress',function(data){
+                compressVideo(video)
-                    if(data.ok){
-                        console.log('Video Compressing')
-                    }else{
-                        console.log('Video Not Compressing',data,videoEndpoint)
-                    }
-                })
             }
         });
         return false;

web/assets/js/bs5.videosTable.js

@@ -170,7 +170,7 @@ $(document).ready(function(e){
                         <a class="btn btn-sm btn-primary preview-video" href="${href}" title="${lang.Play}"><i class="fa fa-play"></i></a>
                         <a class="btn btn-sm btn-default open-video" href="${href}" title="${lang.Play}"><i class="fa fa-play"></i></a>
                         ${permissionCheck('video_delete',file.mid) ? `<a class="btn btn-sm btn-danger delete-video" href="${href}" title="${lang.Delete}"><i class="fa fa-trash-o"></i></a>` : ''}
-                        ${permissionCheck('video_delete',file.mid) ? `<a class="btn btn-sm btn-danger compress-video" href="${href}" title="${lang.Compress}"><i class="fa fa-compress"></i></a>` : ''}
+                        ${permissionCheck('video_delete',file.mid) ? `<a class="btn btn-sm btn-warning compress-video" href="${href}" title="${lang.Compress}"><i class="fa fa-compress"></i></a>` : ''}
                     </div>
                     `,
                 }
@@ -271,6 +271,25 @@ $(document).ready(function(e){
         });
         return false;
     })
+    .on('click','.compress-selected-videos',function(e){
+        e.preventDefault()
+        var videos = getSelectedRows()
+        if(videos.length === 0)return;
+        $.confirm.create({
+            title: lang["Compress Videos"],
+            body: `${lang.CompressTheseMsg}`,
+            clickOptions: {
+                title: '<i class="fa fa-compress"></i> ' + lang.Compress,
+                class: 'btn-primary btn-sm'
+            },
+            clickCallback: function(){
+                compressVideos(videos).then(() => {
+                    console.log(`Done Deleting Rows!`)
+                })
+            }
+        });
+        return false;
+    })
     .on('click','.download-selected-videos',function(e){
         e.preventDefault()
         var videos = getSelectedRows()

web/pages/blocks/home/videosTable.ejs

@@ -21,6 +21,7 @@
                 <i class="fa fa-bars"></i>
               </button>
               <ul class="dropdown-menu <%- `${define.Theme.isDark ? 'dropdown-menu-dark bg-dark text-white' : 'bg-light text-dark'}` %> shadow-lg" aria-labelledby="monitorsListOptions">
+                <li><a class="dropdown-item compress-selected-videos cursor-pointer"><%- lang.Compress %></a></li>
                 <li><a class="dropdown-item download-selected-videos cursor-pointer"><%- lang.Download %></a></li>
                 <!-- <li><a class="dropdown-item merge-selected-videos cursor-pointer"><%- lang.Merge %></a></li> -->
                 <li><hr class="dropdown-divider"></li>