Merge pull request #4165 from ZiuChen/preview-features

feat: 播放器置顶组件(playerOnTopNew) 功能增强
This commit is contained in:
Grant Howard 2023-04-30 16:05:15 +08:00 committed by GitHub
commit 9576cfc7df
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 41 additions and 8 deletions

View File

@ -1 +0,0 @@
!function(e,o){"object"==typeof exports&&"object"==typeof module?module.exports=o():"function"==typeof define&&define.amd?define([],o):"object"==typeof exports?exports["style/player-on-top-new"]=o():e["style/player-on-top-new"]=o()}(globalThis,(()=>(()=>{"use strict";var e={d:(o,t)=>{for(var n in t)e.o(t,n)&&!e.o(o,n)&&Object.defineProperty(o,n,{enumerable:!0,get:t[n]})},o:(e,o)=>Object.prototype.hasOwnProperty.call(e,o)},o={};e.d(o,{component:()=>p});const t=coreApis.componentApis.define,n=coreApis.utils;function r(e,o){const t=e.parentElement;t&&(t.removeChild(e),t.insertBefore(e,o.nextSibling))}const p=(0,t.defineComponentMetadata)({name:"playerOnTopNew",author:{name:"RieN7",link:"https://github.com/rien7"},tags:[componentsTags.style,componentsTags.video],displayName:"播放器置顶(新)",description:"原来的播放器置顶插件,现在已经不可用了,这是一个新的版本,可以在视频页面中将播放器放在页面最上方.",entry:async()=>{await(0,n.playerReady)();r(document.querySelector("#viewbox_report"),document.querySelector("#arc_toolbar_report"));r(document.querySelector("#v_upinfo").parentElement,document.querySelector("#danmukuBox"))},commitHash:"b08ebfbef7d0b5320ae67d8f0568d8bb0ed24635",coreVersion:"2.7.0"});return o=o.component})()));

View File

@ -1,6 +1,13 @@
import { defineComponentMetadata } from '@/components/define'
import { playerReady } from '@/core/utils'
import { getComponentSettings, addComponentListener } from '@/core/settings'
import { playerReady, getNumberValidator } from '@/core/utils'
import { videoUrls } from '@/core/utils/urls'
/**
* element after
* @param element
* @param after
*/
function moveElementAfter(element: Element, after: Element) {
const parent = element.parentElement
if (!parent) {
@ -10,7 +17,11 @@ function moveElementAfter(element: Element, after: Element) {
parent.insertBefore(element, after.nextSibling)
}
const playerOnTop = async () => {
/**
*
*
*/
const playerOnTop = async ({ settings: { options: opt }, metadata }) => {
await playerReady()
const title = document.querySelector('#viewbox_report')
const toolbar = document.querySelector('#arc_toolbar_report')
@ -19,18 +30,41 @@ const playerOnTop = async () => {
const author = document.querySelector('#v_upinfo').parentElement
const danmuku = document.querySelector('#danmukuBox')
moveElementAfter(author, danmuku)
const player = document.querySelector('#playerWrap') as HTMLDivElement
player.style.marginTop = `${opt.marginTop}px`
// 监听设置变化 实时更新到页面
addComponentListener(`${metadata.name}.marginTop`, (value: number) => {
player.style.marginTop = `${value}px`
})
}
export const component = defineComponentMetadata({
name: 'playerOnTopNew',
author: {
name: 'RieN7',
link: 'https://github.com/rien7',
},
author: [
{
name: 'RieN7',
link: 'https://github.com/rien7',
},
{
name: 'ZiuChen',
link: 'https://github.com/ZiuChen',
},
],
tags: [componentsTags.style, componentsTags.video],
options: {
marginTop: {
displayName: '顶部留白 (px)',
defaultValue: 20,
validator: getNumberValidator(0, Infinity),
},
},
urlInclude: videoUrls,
displayName: '播放器置顶(新)',
description:
'原来的播放器置顶插件,现在已经不可用了,这是一个新的版本,可以在视频页面中将播放器放在页面最上方.',
entry: playerOnTop,
reload: playerOnTop,
reload: () =>
playerOnTop({ settings: getComponentSettings('playerOnTopNew'), metadata: component }),
})