Qortal/qapp-core
1
0
Fork 0
mirror of https://github.com/Qortal/qapp-core.git synced 2025-06-19 03:11:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix muted

Browse Source
This commit is contained in:
PhilReact 2025-06-16 02:24:31 +03:00
parent ad2b56d95a
commit 8295688b8a
4 changed files with 18 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/VideoPlayer/VideoControls.tsx
View File

@ -318,12 +318,12 @@ const VolumeSlider = ({ width, volume, onVolumeChange }: any) => {
);
};
export const VolumeControl = ({ sliderWidth, onVolumeChange, volume }: any) => {
export const VolumeControl = ({ sliderWidth, onVolumeChange, volume , isMuted, toggleMute}: any) => {
return (
<Box
sx={{ display: "flex", gap: "5px", alignItems: "center", width: "100%" }}
>
<VolumeButton />
<VolumeButton isMuted={isMuted} toggleMute={toggleMute} />
<VolumeSlider
width={sliderWidth}
onVolumeChange={onVolumeChange}

6
src/components/VideoPlayer/VideoControlsBar.tsx
View File

@ -38,9 +38,11 @@ interface VideoControlsBarProps {
openSubtitleManager: ()=> void
subtitleBtnRef: any
onSelectPlaybackRate: (rate: number)=> void;
isMuted: boolean
toggleMute: ()=> void
}
export const VideoControlsBar = ({subtitleBtnRef, showControls, playbackRate, increaseSpeed,decreaseSpeed, isFullScreen, showControlsFullScreen, reloadVideo, onVolumeChange, volume, isPlaying, canPlay, isScreenSmall, controlsHeight, playerRef, duration, progress, togglePlay, toggleFullscreen, extractFrames, openSubtitleManager, onSelectPlaybackRate}: VideoControlsBarProps) => {
export const VideoControlsBar = ({subtitleBtnRef, showControls, playbackRate, increaseSpeed,decreaseSpeed, isFullScreen, showControlsFullScreen, reloadVideo, onVolumeChange, volume, isPlaying, canPlay, isScreenSmall, controlsHeight, playerRef, duration, progress, togglePlay, toggleFullscreen, extractFrames, openSubtitleManager, onSelectPlaybackRate, isMuted, toggleMute}: VideoControlsBarProps) => {
const showMobileControls = isScreenSmall && canPlay;
@ -93,7 +95,7 @@ export const VideoControlsBar = ({subtitleBtnRef, showControls, playbackRate, in
<VolumeControl onVolumeChange={onVolumeChange} volume={volume} sliderWidth={"100px"} />
<VolumeControl onVolumeChange={onVolumeChange} volume={volume} sliderWidth={"100px"} isMuted={isMuted} toggleMute={toggleMute} />
<VideoTime progress={progress} duration={duration}/>
</Box>

5
src/components/VideoPlayer/VideoPlayer.tsx
View File

@ -206,13 +206,14 @@ export const VideoPlayer = ({
status,
percentLoaded,
showControlsFullScreen,
onSelectPlaybackRate
onSelectPlaybackRate,
} = useVideoPlayerController({
autoPlay,
playerRef,
qortalVideoResource,
retryAttempts,
isPlayerInitialized,
isMuted
});
console.log('isFullscreen', isFullscreen)
@ -753,6 +754,8 @@ export const VideoPlayer = ({
progress={localProgress}
openSubtitleManager={openSubtitleManager}
onSelectPlaybackRate={onSelectPlaybackRate}
isMuted={isMuted}
toggleMute={toggleMute}
/>
)}

11
src/components/VideoPlayer/useVideoPlayerController.tsx
View File

@ -24,10 +24,11 @@ interface UseVideoControls {
qortalVideoResource: QortalGetMetadata;
retryAttempts?: number;
isPlayerInitialized: boolean
isMuted: boolean
}
export const useVideoPlayerController = (props: UseVideoControls) => {
const { autoPlay, playerRef, qortalVideoResource, retryAttempts, isPlayerInitialized } = props;
const { autoPlay, playerRef, qortalVideoResource, retryAttempts, isPlayerInitialized, isMuted } = props;
const [isFullscreen, setIsFullscreen] = useState(false);
const [showControlsFullScreen, setShowControlsFullScreen] = useState(false)
@ -153,14 +154,16 @@ export const useVideoPlayerController = (props: UseVideoControls) => {
const toggleMute = useCallback(() => {
try {
console.log('toggleMute')
const ref = playerRef as any;
if (!ref.current?.muted) return;
if (!ref.current) return;
ref.current?.muted(!ref.current?.muted)
ref.current?.muted(!isMuted)
} catch (error) {
console.error('toggleMute', toggleMute)
}
}, []);
}, [isMuted]);
const changeVolume = useCallback(
(delta: number) => {