diff --git a/package.json b/package.json
index 6572d3489..506e48689 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "misskey",
- "version": "12.118.1-calc.3",
+ "version": "12.118.1-calc.4",
"codename": "aqua",
"repository": {
"type": "git",
diff --git a/packages/client/package.json b/packages/client/package.json
index b43b3c03d..5757f9407 100644
--- a/packages/client/package.json
+++ b/packages/client/package.json
@@ -60,6 +60,7 @@
"vanilla-tilt": "1.7.2",
"vite": "3.0.7",
"vue": "3.2.37",
+ "vue-plyr": "^7.0.0",
"vue-prism-editor": "2.0.0-alpha.2",
"vuedraggable": "4.0.1"
},
diff --git a/packages/client/src/components/media-video.vue b/packages/client/src/components/media-video.vue
index 5c38691e6..855062dd8 100644
--- a/packages/client/src/components/media-video.vue
+++ b/packages/client/src/components/media-video.vue
@@ -6,19 +6,21 @@
</div>
</div>
<div v-else class="kkjnbbplepmiyuadieoenjgutgcmtsvu">
- <video
- :poster="video.thumbnailUrl"
- :title="video.comment"
- :alt="video.comment"
- preload="none"
- controls
- @contextmenu.stop
- >
- <source
- :src="video.url"
- :type="video.type"
+ <vue-plyr>
+ <video
+ :poster="video.thumbnailUrl"
+ :title="video.comment"
+ :alt="video.comment"
+ preload="none"
+ controls
+ @contextmenu.stop
>
- </video>
+ <source
+ :src="video.url"
+ :type="video.type"
+ >
+ </video>
+ </vue-plyr>
<i class="fas fa-eye-slash" @click="hide = true"></i>
</div>
</template>
@@ -26,7 +28,9 @@
<script lang="ts" setup>
import { ref } from 'vue';
import * as misskey from 'misskey-js';
+import VuePlyr from 'vue-plyr';
import { defaultStore } from '@/store';
+import 'vue-plyr/dist/vue-plyr.css';
const props = defineProps<{
video: misskey.entities.DriveFile;
@@ -38,6 +42,7 @@ const hide = ref((defaultStore.state.nsfw === 'force') ? true : props.video.isSe
<style lang="scss" scoped>
.kkjnbbplepmiyuadieoenjgutgcmtsvu {
position: relative;
+ --plyr-color-main: var(--accent);
> i {
display: block;
diff --git a/yarn.lock b/yarn.lock
index 0615f1cb0..b79834ddc 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -33,7 +33,7 @@ __metadata:
languageName: node
linkType: hard
-"@babel/parser@npm:^7.16.4, @babel/parser@npm:^7.6.0, @babel/parser@npm:^7.9.6":
+"@babel/parser@npm:^7.16.4, @babel/parser@npm:^7.18.4, @babel/parser@npm:^7.6.0, @babel/parser@npm:^7.9.6":
version: 7.18.11
resolution: "@babel/parser@npm:7.18.11"
bin:
@@ -1974,6 +1974,17 @@ __metadata:
languageName: node
linkType: hard
+"@vue/compiler-sfc@npm:2.7.8":
+ version: 2.7.8
+ resolution: "@vue/compiler-sfc@npm:2.7.8"
+ dependencies:
+ "@babel/parser": ^7.18.4
+ postcss: ^8.4.14
+ source-map: ^0.6.1
+ checksum: da0b4b0866224fe2aee376a88c25914da4e73ba9e11e7aa2ed240b99897735b4a988e951dcae9c8f0843216c5a97050bf16e1bb04bf65541444a8bdfedc35b38
+ languageName: node
+ linkType: hard
+
"@vue/compiler-sfc@npm:3.2.37":
version: 3.2.37
resolution: "@vue/compiler-sfc@npm:3.2.37"
@@ -3914,6 +3925,7 @@ __metadata:
vanilla-tilt: 1.7.2
vite: 3.0.7
vue: 3.2.37
+ vue-plyr: ^7.0.0
vue-prism-editor: 2.0.0-alpha.2
vuedraggable: 4.0.1
languageName: unknown
@@ -4400,7 +4412,7 @@ __metadata:
languageName: node
linkType: hard
-"core-js@npm:3":
+"core-js@npm:3, core-js@npm:^3.22.0":
version: 3.24.1
resolution: "core-js@npm:3.24.1"
checksum: 6fb5bf0fd9e9f3e69d95616dd03332fea6758a715d2628c108b5faf17b48b0f580e90c4febb0a523c4665b0991a810de16289f86187fe79d70cc722dbd3edf0e
@@ -4599,6 +4611,20 @@ __metadata:
languageName: node
linkType: hard
+"csstype@npm:^3.1.0":
+ version: 3.1.0
+ resolution: "csstype@npm:3.1.0"
+ checksum: 644e986cefab86525f0b674a06889cfdbb1f117e5b7d1ce0fc55b0423ecc58807a1ea42ecc75c4f18999d14fc42d1d255f84662a45003a52bb5840e977eb2ffd
+ languageName: node
+ linkType: hard
+
+"custom-event-polyfill@npm:^1.0.7":
+ version: 1.0.7
+ resolution: "custom-event-polyfill@npm:1.0.7"
+ checksum: f9ff2cf13e482a75b3cf83dce9e2c6e3063c5ac1b9c23ac440e4f27e875b0873445b11811237f3f30aeb1216e9ad20f9f9d30ccf5b1b658a4e50dd0b3e67b629
+ languageName: node
+ linkType: hard
+
"cwise-compiler@npm:^1.0.0, cwise-compiler@npm:^1.1.2":
version: 1.1.3
resolution: "cwise-compiler@npm:1.1.3"
@@ -9410,6 +9436,13 @@ __metadata:
languageName: node
linkType: hard
+"loadjs@npm:^4.2.0":
+ version: 4.2.0
+ resolution: "loadjs@npm:4.2.0"
+ checksum: 2144723f55c75260ce6781b36009c40d098d96fe06e3ec5c85ba250cf96c3a0aa37169b829e818c40bcba7c5141a8e52736fec193333bb6260ab95f9a493a2ef
+ languageName: node
+ linkType: hard
+
"locate-path@npm:^5.0.0":
version: 5.0.0
resolution: "locate-path@npm:5.0.0"
@@ -11514,6 +11547,19 @@ __metadata:
languageName: node
linkType: hard
+"plyr@github:sampotts/plyr#develop":
+ version: 3.7.0
+ resolution: "plyr@https://github.com/sampotts/plyr.git#commit=d434c9af16e641400aaee93188594208d88f2658"
+ dependencies:
+ core-js: ^3.22.0
+ custom-event-polyfill: ^1.0.7
+ loadjs: ^4.2.0
+ rangetouch: ^2.0.1
+ url-polyfill: ^1.1.12
+ checksum: ee85815c1c992141af030d71f70e79532814b142b0057c1bedbf7c74000a79f647147bb1f03f3a9f725341afa43e848e7b54168361d95285dfed30d53be63607
+ languageName: node
+ linkType: hard
+
"pngjs-nozlib@npm:1.0.0":
version: 1.0.0
resolution: "pngjs-nozlib@npm:1.0.0"
@@ -11849,7 +11895,7 @@ __metadata:
languageName: node
linkType: hard
-"postcss@npm:^8.1.10, postcss@npm:^8.3.11, postcss@npm:^8.4.16":
+"postcss@npm:^8.1.10, postcss@npm:^8.3.11, postcss@npm:^8.4.14, postcss@npm:^8.4.16":
version: 8.4.16
resolution: "postcss@npm:8.4.16"
dependencies:
@@ -12390,6 +12436,13 @@ __metadata:
languageName: node
linkType: hard
+"rangetouch@npm:^2.0.1":
+ version: 2.0.1
+ resolution: "rangetouch@npm:2.0.1"
+ checksum: 2aa7c0901d28356ef0c02021656ed7d11fc6652f01ffe92806862fc4593e75f7a5d52d4455fa1b0ab2123d438e03dc091315949dbfad9562a680440ac0dfeb7d
+ languageName: node
+ linkType: hard
+
"ratelimiter@npm:3.4.1":
version: 3.4.1
resolution: "ratelimiter@npm:3.4.1"
@@ -14986,6 +15039,13 @@ __metadata:
languageName: node
linkType: hard
+"url-polyfill@npm:^1.1.12":
+ version: 1.1.12
+ resolution: "url-polyfill@npm:1.1.12"
+ checksum: 3214cc82424c215e921dacadac56b4b099f995d24e14078369bea9ff8aa74d1a4c803ab03021e61e0a275bee7979d212d046092dba3aab73cf232ee6739ddee4
+ languageName: node
+ linkType: hard
+
"url@npm:0.10.3":
version: 0.10.3
resolution: "url@npm:0.10.3"
@@ -15268,6 +15328,16 @@ __metadata:
languageName: node
linkType: hard
+"vue-plyr@npm:^7.0.0":
+ version: 7.0.0
+ resolution: "vue-plyr@npm:7.0.0"
+ dependencies:
+ plyr: "github:sampotts/plyr#develop"
+ vue: ^2.6.12
+ checksum: 004d830cfc9dbe0563cafafab6240379b7224362d3e60d8d441126f0eaafd2487c7416cb434482165b52e961b83f020dfbc2645536aa8ba991f101477d984206
+ languageName: node
+ linkType: hard
+
"vue-prism-editor@npm:2.0.0-alpha.2":
version: 2.0.0-alpha.2
resolution: "vue-prism-editor@npm:2.0.0-alpha.2"
@@ -15290,6 +15360,16 @@ __metadata:
languageName: node
linkType: hard
+"vue@npm:^2.6.12":
+ version: 2.7.8
+ resolution: "vue@npm:2.7.8"
+ dependencies:
+ "@vue/compiler-sfc": 2.7.8
+ csstype: ^3.1.0
+ checksum: 45fc85a13fc027798ad859fe4a5509b54217ae2f129240fc349a799bd4dbc6848ef8fa9968ab7ef7afcb954735882dbfdeb746673aa3f051e4d7ae555c213a1b
+ languageName: node
+ linkType: hard
+
"vuedraggable@npm:4.0.1":
version: 4.0.1
resolution: "vuedraggable@npm:4.0.1"