feat(artplayer): support screenshot (#269 close AlistGo/alist#8319)

* chore(deps): update artplayer to ^5.2.2

* chore(deps): update artplayer-plugin-danmuku to ^5.1.5

* chore(deps): update hls.js to ^1.6.1

* fix: remove deprecated options in artplayerPluginDanmuku

* feat(video): support screenshot

* fix(video): support cross-origin sceenshot

* style(video): theme follow main color
This commit is contained in:
MadDogOwner
2025-04-12 17:19:26 +08:00
committed by GitHub
parent 18d05235ff
commit 97141d89ca
4 changed files with 26 additions and 26 deletions

View File

@@ -66,8 +66,8 @@
"@stitches/core": "^1.2.8",
"@viselect/vanilla": "^3.5.0",
"aplayer": "^1.10.1",
"artplayer": "^5.0.9",
"artplayer-plugin-danmuku": "^5.0.1",
"artplayer": "^5.2.2",
"artplayer-plugin-danmuku": "^5.1.5",
"asciinema-player": "^3.6.3",
"axios": "^1.0.0",
"bencode": "^4.0.0",
@@ -76,7 +76,7 @@
"copy-to-clipboard": "^3.3.2",
"crypto-js": "^4.2.0",
"hash-wasm": "^4.12.0",
"hls.js": "^1.2.1",
"hls.js": "^1.6.1",
"just-once": "^2.2.0",
"libass-wasm": "^4.1.0",
"lightgallery": "^2.5.0",

30
pnpm-lock.yaml generated
View File

@@ -42,11 +42,11 @@ importers:
specifier: ^1.10.1
version: 1.10.1
artplayer:
specifier: ^5.0.9
version: 5.0.9
specifier: ^5.2.2
version: 5.2.2
artplayer-plugin-danmuku:
specifier: ^5.0.1
version: 5.0.1
specifier: ^5.1.5
version: 5.1.5
asciinema-player:
specifier: ^3.6.3
version: 3.6.3
@@ -72,8 +72,8 @@ importers:
specifier: ^4.12.0
version: 4.12.0
hls.js:
specifier: ^1.2.1
version: 1.2.1
specifier: ^1.6.1
version: 1.6.1
just-once:
specifier: ^2.2.0
version: 2.2.0
@@ -740,11 +740,11 @@ packages:
resolution: {integrity: sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==}
engines: {node: '>=8'}
artplayer-plugin-danmuku@5.0.1:
resolution: {integrity: sha512-b6/Y4/+X0rNmnqS5+zzQgow+WW4iVT8eFv4LAUzJgIyORIcf5Gn00Dy0PZ+kwGb1VJy0CUCRK6gVVvh0tWsRAg==}
artplayer-plugin-danmuku@5.1.5:
resolution: {integrity: sha512-iFjdXVbkw5FbkB98SOwMPQEFJp7k6Io4nHfehpSdCc7Eo1gkmjNShOT6dAtAH1kLMHjh38vRnf/oYwCvTKkVOw==}
artplayer@5.0.9:
resolution: {integrity: sha512-IM/DShYdmKFEA9jl08LYbTK2Jfz9s7qIjEH0xWjnxvVArUKZZKcoqwr6i54U0c4grtc/Uvb4wtCd78kvtSVlgw==}
artplayer@5.2.2:
resolution: {integrity: sha512-JsPRA9e+7KyWTh5KBeKLTcCigzGhpZulRFXvOeiFMbxnpPz9kZ/1STp1LZONqQXHkxX9wHTO6JhGOvzrduH2Lw==}
asciinema-player@3.6.3:
resolution: {integrity: sha512-62aDgLpbuduhmpFfNgPOzf6fOluACLsftVnjpWJjUXX6dqhqTckFqWoJ+ayA0XjSlZ9l9wXTcJqRqvAAIpMblg==}
@@ -1163,8 +1163,8 @@ packages:
hey-listen@1.0.8:
resolution: {integrity: sha512-COpmrF2NOg4TBWUJ5UVyaCU2A88wEMkUPK4hNqyCkqHbxT92BbvfjoSozkAIIm6XhicGlJHhFdullInrdhwU8Q==}
hls.js@1.2.1:
resolution: {integrity: sha512-+m/5+ikSpmQQvb6FmVWZUZfzvTJMn/QVfiCGP1Oq9WW4RKrAvxlExkhhbcVGgGqLNPFk1kdFkVQur//wKu3JVw==}
hls.js@1.6.1:
resolution: {integrity: sha512-7GOkcqn0Y9EqU2OJZlzkwxj9Uynuln7URvr7dRjgqNJNZ5UbbjL/v1BjAvQogy57Psdd/ek1u2s6IDEFYlabrA==}
html-entities@2.3.2:
resolution: {integrity: sha512-c3Ab/url5ksaT0WyleslpBEthOzWhrjQbg75y7XUsfSzi3Dgzt0l8w5e7DylRn15MTlMMD58dTfzddNS2kcAjQ==}
@@ -2643,9 +2643,9 @@ snapshots:
array-union@2.1.0: {}
artplayer-plugin-danmuku@5.0.1: {}
artplayer-plugin-danmuku@5.1.5: {}
artplayer@5.0.9:
artplayer@5.2.2:
dependencies:
option-validator: 2.0.6
@@ -3112,7 +3112,7 @@ snapshots:
hey-listen@1.0.8: {}
hls.js@1.2.1: {}
hls.js@1.6.1: {}
html-entities@2.3.2: {}

View File

@@ -1,7 +1,7 @@
import { Box, Center } from "@hope-ui/solid"
import { Show, createSignal, onCleanup, onMount } from "solid-js"
import { useRouter, useLink, useFetch } from "~/hooks"
import { getSettingBool, objStore, password } from "~/store"
import { getMainColor, getSettingBool, objStore, password } from "~/store"
import { ObjType, PResp } from "~/types"
import { ext, handleResp, notify, r, pathDir, pathJoin } from "~/utils"
import Artplayer from "artplayer"
@@ -117,14 +117,17 @@ const Preview = () => {
subtitleOffset: true,
miniProgressBar: false,
playsInline: true,
theme: getMainColor(),
quality: [],
plugins: [AutoHeightPlugin],
whitelist: [],
screenshot: true,
settings: [],
moreVideoAttr: {
// @ts-ignore
"webkit-playsinline": true,
playsInline: true,
crossOrigin: "anonymous",
},
type: "m3u8",
customType: {
@@ -291,12 +294,9 @@ const Preview = () => {
mode: 0,
margin: [0, "0%"],
antiOverlap: false,
useWorker: true,
synchronousPlayback: false,
lockTime: 5,
maxLength: 100,
minWidth: 200,
maxWidth: 400,
theme: "dark",
}),
)

View File

@@ -1,7 +1,7 @@
import { Box } from "@hope-ui/solid"
import { createSignal, onCleanup, onMount } from "solid-js"
import { useRouter, useLink } from "~/hooks"
import { getSettingBool, objStore } from "~/store"
import { getMainColor, getSettingBool, objStore } from "~/store"
import { ObjType } from "~/types"
import { ext, pathDir, pathJoin } from "~/utils"
import Artplayer from "artplayer"
@@ -61,6 +61,7 @@ const Preview = () => {
flip: true,
playbackRate: true,
aspectRatio: true,
screenshot: true,
setting: true,
hotkey: true,
pip: true,
@@ -70,6 +71,7 @@ const Preview = () => {
subtitleOffset: true,
miniProgressBar: false,
playsInline: true,
theme: getMainColor(),
// layers: [],
// settings: [],
// contextmenu: [],
@@ -105,6 +107,7 @@ const Preview = () => {
// @ts-ignore
"webkit-playsinline": true,
playsInline: true,
crossOrigin: "anonymous",
},
type: ext(objStore.obj.name),
customType: {
@@ -282,12 +285,9 @@ const Preview = () => {
mode: 0,
margin: [0, "0%"],
antiOverlap: false,
useWorker: true,
synchronousPlayback: false,
lockTime: 5,
maxLength: 100,
minWidth: 200,
maxWidth: 400,
theme: "dark",
heatmap: true,
}),