replace plyr with Vime

components/media/video-player.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
-import 'vue-plyr/dist/vue-plyr.css';
+import '@vime/core/themes/default.css';
-// @ts-ignore
+import { Player, DefaultUi, Video } from '@vime/vue-next';
-import VuePlyr from 'vue-plyr';
+
 import mime from 'mime';
 
 interface Props {
@@ -12,10 +12,14 @@ let { src } = defineProps<Props>();
 let selectedPath = useSelectedPath();
 
 let videoType = mime.getType(selectedPath.value);
+
 </script>
 <template>
-    <VuePlyr>
+    <Player playsinline style="width: 100%">
-        <video controls playsinline :src="src" :type="videoType!" style="height: 84vh;">
+        <Video>
-        </video>
+            <source :data-src="src" :type="videoType!" />
-    </VuePlyr>
+        </Video>
+        <DefaultUi>
+        </DefaultUi>
+    </Player>
 </template>

composables/worker/7zip-manager.ts

@@ -33,8 +33,6 @@ export class SevenZipManager {
                     text = text.substring(text.lastIndexOf("\b") + 1);
                 }
                 this.consoleOutputBuffer.push(text);
-
-                console.log(text);
             },
         });
     }

nuxt.config.ts

@@ -2,8 +2,8 @@
 export default defineNuxtConfig({
     app: {
         head: {
-            title: 'Extractify - Extract and Explore compressed files online and securely',
+            title: 'Extract and Explore compressed files online and securely',
-            titleTemplate: '%s - Extractify',
+            titleTemplate: 'Extractify - %s',
         }
     },
     css: [

package-lock.json

@@ -10,6 +10,8 @@
       "dependencies": {
         "@mdi/font": "^7.2.96",
         "@types/mime": "^3.0.1",
+        "@vime/core": "^5.4.1",
+        "@vime/vue-next": "^5.4.1",
         "7z-wasm": "^1.0.2",
         "comlink": "^4.4.1",
         "mime": "^3.0.0",
@@ -1714,6 +1716,18 @@
         "@daybrush/utils": "^1.4.0"
       }
     },
+    "node_modules/@stencil/core": {
+      "version": "2.5.2",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.5.2.tgz",
+      "integrity": "sha512-bgjPXkSzzg1WnTgVUm6m5ZzpKt602WmA/QljODAW1xVN40OHJdbGblzF/F6MFzqv2c5Cy30CB41arc8qADIdcQ==",
+      "bin": {
+        "stencil": "bin/stencil"
+      },
+      "engines": {
+        "node": ">=12.10.0",
+        "npm": ">=6.0.0"
+      }
+    },
     "node_modules/@trysound/sax": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/@trysound/sax/-/sax-0.2.0.tgz",
@@ -1729,6 +1743,11 @@
       "integrity": "sha512-LG4opVs2ANWZ1TJoKc937iMmNstM/d0ae1vNbnBvBhqCSezgVUOzcLCqbI5elV8Vy6WKwKjaqR+zO9VKirBBCA==",
       "dev": true
     },
+    "node_modules/@types/fscreen": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@types/fscreen/-/fscreen-1.0.1.tgz",
+      "integrity": "sha512-hV2d0BreihMGtrg+EdAFOIl/O2EL5vhAheHJUztGE/lPFZIN8ZCpGFL8hCbtyi1CfhKjDRCf47sHjP+FwJ4q0Q=="
+    },
     "node_modules/@types/libarchive.js": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/@types/libarchive.js/-/libarchive.js-1.3.1.tgz",
@@ -1871,6 +1890,28 @@
       "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
       "dev": true
     },
+    "node_modules/@vime/core": {
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/@vime/core/-/core-5.4.1.tgz",
+      "integrity": "sha512-ZFpV3xqZJ5tvh5rZOYKRh8zFzNIKr2ZcK6L75nJjFjbWt/ZmFF2nMBxtD9/hC4Xjk9v7hp1+P9cmctL674VFgA==",
+      "dependencies": {
+        "@stencil/core": "2.5.2",
+        "@types/fscreen": "^1.0.1",
+        "fscreen": "^1.2.0",
+        "mitt": "^3.0.0",
+        "stencil-wormhole": "^3.4.1"
+      }
+    },
+    "node_modules/@vime/vue-next": {
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/@vime/vue-next/-/vue-next-5.4.1.tgz",
+      "integrity": "sha512-2zy2FfSSPmX7AwnZAoOoYx8CdU6NT9hTZD1lYwr6n5+4gKanaPCK5+5ab0GHlv3+8SuAaO5jLUJG3G12lf6LYw==",
+      "hasInstallScript": true,
+      "peerDependencies": {
+        "@vime/core": "5.4.1",
+        "vue": "^3.0.0"
+      }
+    },
     "node_modules/@vitejs/plugin-vue": {
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-4.2.3.tgz",
@@ -3873,6 +3914,11 @@
       "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==",
       "dev": true
     },
+    "node_modules/fscreen": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/fscreen/-/fscreen-1.2.0.tgz",
+      "integrity": "sha512-hlq4+BU0hlPmwsFjwGGzZ+OZ9N/wq9Ljg/sq3pX+2CD7hrJsX9tJgWWK/wiNTFM212CLHWhicOoqwXyZGGetJg=="
+    },
     "node_modules/fsevents": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
@@ -5117,6 +5163,11 @@
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
       "dev": true
     },
+    "node_modules/mitt": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.1.tgz",
+      "integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw=="
+    },
     "node_modules/mkdirp": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz",
@@ -7413,6 +7464,11 @@
       "integrity": "sha512-Rz6yejtVyWnVjC1RFvNmYL10kgjC49EOghxWn0RFqlCHGFpQx+Xe7yW3I4ceK1SGrWIGMjD5Kbue8W/udkbMJg==",
       "dev": true
     },
+    "node_modules/stencil-wormhole": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/stencil-wormhole/-/stencil-wormhole-3.4.1.tgz",
+      "integrity": "sha512-ppYTcWTJnIl4ZAKwF39LTA9f/ypHfbVefsHdN2hpMQGrR57wt1TieZo9tlCM/r1Y4SFiZ5yz/cjho564C921Xw=="
+    },
     "node_modules/streamsearch": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/streamsearch/-/streamsearch-1.1.0.tgz",

package.json

@@ -20,6 +20,8 @@
   "dependencies": {
     "@mdi/font": "^7.2.96",
     "@types/mime": "^3.0.1",
+    "@vime/core": "^5.4.1",
+    "@vime/vue-next": "^5.4.1",
     "7z-wasm": "^1.0.2",
     "comlink": "^4.4.1",
     "mime": "^3.0.0",