Bilibili-Evolved/registry/lib/components/video/player/video-scaling/scale-service.ts
weedy233 894eb2823e
refactor: 重构视频缩放组件并添加新功能
- 重构代码结构,将功能拆分为多个模块
- 实现自定义缩放范围的配置
- 改进提示显示功能,增加持续时间设置
- 添加错误处理机制和清理函数
2025-09-02 23:26:58 +08:00

52 lines
1.3 KiB
TypeScript

import { playerAgent } from '@/components/video/player-agent'
import { SCALE_MAPPING, CUSTOM_SCALE_CONFIG } from './constants'
import { ScalePreset } from './types'
// 缩放状态管理
export class ScaleState {
private currentScale = 1.0
get(): number {
return this.currentScale
}
set(value: number): void {
this.currentScale = value
}
}
// 应用缩放效果
export async function applyScale(scale: number): Promise<void> {
try {
// 使用playerAgent API获取视频元素
const videoElement = await playerAgent.query.video.element()
if (videoElement) {
// 应用transform: scale()样式
videoElement.style.transform = `scale(${scale})`
videoElement.style.transformOrigin = 'center'
}
} catch (error) {
console.error('视频缩放: 无法获取视频元素', error)
}
}
// 从设置更新缩放值
export function updateScaleFromSettings(
preset: ScalePreset,
customScale: number,
scaleState: ScaleState,
): number {
// 确保值在有效范围内
if (preset === '自定义') {
const clampedValue = Math.max(
CUSTOM_SCALE_CONFIG.min,
Math.min(CUSTOM_SCALE_CONFIG.max, customScale),
)
scaleState.set(clampedValue / 100) // 转换为小数
} else {
scaleState.set(SCALE_MAPPING[preset])
}
return scaleState.get()
}