Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-04-21 07:32:02 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Merge pull request #826 from Stremio/feat/player-on-mute-show-0-volume-on-slider
Some checks are pending
Build / build (push) Waiting to run
Details

Browse source 
feat: Player - Volume slider - on muted show 0 volume
This commit is contained in:
Tim 2025-02-07 11:38:44 +01:00 committed by GitHub
commit 9cf8a39696
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 7 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/routes/Player/ControlBar/ControlBar.js
View file

@ -138,6 +138,7 @@ const ControlBar = ({
<VolumeSlider <VolumeSlider
className={styles['volume-slider']} className={styles['volume-slider']}
volume={volume} volume={volume}
muted={muted}
onVolumeChangeRequested={onVolumeChangeRequested} onVolumeChangeRequested={onVolumeChangeRequested}
/> />
<div className={styles['spacing']} /> <div className={styles['spacing']} />

9
src/routes/Player/ControlBar/VolumeSlider/VolumeSlider.js
View file

@ -8,7 +8,7 @@ const { useRouteFocused } = require('stremio-router');
const { Slider } = require('stremio/components'); const { Slider } = require('stremio/components');
const styles = require('./styles'); const styles = require('./styles');
const VolumeSlider = ({ className, volume, onVolumeChangeRequested }) => { const VolumeSlider = ({ className, volume, onVolumeChangeRequested, muted }) => {
const disabled = volume === null || isNaN(volume); const disabled = volume === null || isNaN(volume);
const routeFocused = useRouteFocused(); const routeFocused = useRouteFocused();
const [slidingVolume, setSlidingVolume] = React.useState(null); const [slidingVolume, setSlidingVolume] = React.useState(null);
@ -45,7 +45,9 @@ const VolumeSlider = ({ className, volume, onVolumeChangeRequested }) => {
className={classnames(className, styles['volume-slider'], { 'active': slidingVolume !== null })} className={classnames(className, styles['volume-slider'], { 'active': slidingVolume !== null })}
value={ value={
!disabled ? !disabled ?
slidingVolume !== null ? slidingVolume : volume !muted ?
slidingVolume !== null ? slidingVolume : volume
: 0
: :
100 100
} }
@ -61,7 +63,8 @@ const VolumeSlider = ({ className, volume, onVolumeChangeRequested }) => {
VolumeSlider.propTypes = { VolumeSlider.propTypes = {
className: PropTypes.string, className: PropTypes.string,
volume: PropTypes.number, volume: PropTypes.number,
onVolumeChangeRequested: PropTypes.func onVolumeChangeRequested: PropTypes.func,
muted: PropTypes.bool,
}; };
module.exports = VolumeSlider; module.exports = VolumeSlider;