You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
105 lines
2.6 KiB
105 lines
2.6 KiB
import { useReducer } from 'react'; |
|
import { defaultVolume } from '@/core/config'; |
|
export interface controlsVariableType<T = number, K = boolean> { |
|
/** |
|
* @description 音量键的值 |
|
*/ |
|
volume: T; |
|
/** |
|
* @description 音量键的按钮切换 |
|
*/ |
|
isMuted: K; |
|
/** |
|
* @description 是否可以滑动音量键 |
|
*/ |
|
isSlideVolume: K; |
|
/** |
|
* @description 是否全屏 |
|
*/ |
|
isScreentFull: K; |
|
/** |
|
* @description 倍数 |
|
*/ |
|
multiple: T; |
|
/** |
|
* @description 是否网页全屏 |
|
*/ |
|
isWebPageFullScreen: K; |
|
/** |
|
* @description 是否静音 |
|
*/ |
|
isMute: K; |
|
} |
|
|
|
export interface volumeActionType { |
|
type: 'volume'; |
|
data: controlsVariableType['volume']; |
|
} |
|
export interface isMutedActionType { |
|
type: 'isMuted'; |
|
data: controlsVariableType['isMuted']; |
|
} |
|
export interface isSlideVolumeActionType { |
|
type: 'isSlideVolume'; |
|
data: controlsVariableType['isSlideVolume']; |
|
} |
|
export interface isScreentFullActionType { |
|
type: 'isScreentFull'; |
|
data: controlsVariableType['isScreentFull']; |
|
} |
|
export interface multipleActionType { |
|
type: 'multiple'; |
|
data: controlsVariableType['multiple']; |
|
} |
|
export interface isWebPageFullScreenActionType { |
|
type: 'isWebPageFullScreen'; |
|
data: controlsVariableType['isWebPageFullScreen']; |
|
} |
|
export interface isMuteActionType { |
|
type: 'isMute'; |
|
data: controlsVariableType['isMute']; |
|
} |
|
export type mergeAction = |
|
| volumeActionType |
|
| isMutedActionType |
|
| isSlideVolumeActionType |
|
| isScreentFullActionType |
|
| multipleActionType |
|
| isWebPageFullScreenActionType |
|
| isMuteActionType; |
|
|
|
export const useControls = () => { |
|
const initialState = { |
|
volume: defaultVolume, |
|
isMuted: false, |
|
isSlideVolume: false, |
|
isScreentFull: false, |
|
multiple: 1.0, |
|
isWebPageFullScreen: false, |
|
isMute: false, |
|
}; |
|
|
|
const reducer = (state: controlsVariableType, action: mergeAction) => { |
|
switch (action.type) { |
|
case 'volume': |
|
return { ...state, volume: action.data }; |
|
case 'isMuted': |
|
return { ...state, isMuted: action.data }; |
|
case 'isSlideVolume': |
|
return { ...state, isSlideVolume: action.data }; |
|
case 'isScreentFull': |
|
return { ...state, isScreentFull: action.data }; |
|
case 'multiple': |
|
return { ...state, multiple: action.data }; |
|
case 'isWebPageFullScreen': |
|
return { ...state, isWebPageFullScreen: action.data }; |
|
case 'isMute': |
|
return { ...state, isMute: action.data }; |
|
default: |
|
return state; |
|
} |
|
}; |
|
const [controlsState, dispatch] = useReducer(reducer, initialState); |
|
|
|
return { controlsState, dispatch }; |
|
};
|
|
|