diff --git a/src/components/player/PlayerBar.tsx b/src/components/player/PlayerBar.tsx index d1aa70d..2ad0977 100644 --- a/src/components/player/PlayerBar.tsx +++ b/src/components/player/PlayerBar.tsx @@ -7,6 +7,7 @@ import { useHistory } from 'react-router-dom'; import { LazyLoadImage } from 'react-lazy-load-image-component'; import format from 'format-duration'; import { useTranslation } from 'react-i18next'; +import { ipcRenderer } from 'electron'; import { PlayerContainer, PlayerColumn, @@ -198,6 +199,11 @@ const PlayerBar = () => { setCurrentTime ); + // Handle mpris volume change + useEffect(() => { + setLocalVolume(Number(playQueue.volume.toPrecision(2))); + }, [playQueue.volume]); + useEffect(() => { // Handle volume slider dragging const debounce = setTimeout(() => { @@ -214,6 +220,8 @@ const PlayerBar = () => { setIsDraggingVolume(false); }, 100); + ipcRenderer.send('volume', localVolume); + return () => clearTimeout(debounce); }, [dispatch, isDraggingVolume, localVolume, playQueue.currentPlayer, playQueue.fadeDuration]); diff --git a/src/hooks/usePlayerControls.ts b/src/hooks/usePlayerControls.ts index 31bc850..c4cb834 100644 --- a/src/hooks/usePlayerControls.ts +++ b/src/hooks/usePlayerControls.ts @@ -277,6 +277,7 @@ const usePlayerControls = ( } const vol = Number((e / 100).toFixed(2)); setLocalVolume(vol); + ipcRenderer.send('volume', vol); }; const handleVolumeKey = useCallback( @@ -285,10 +286,12 @@ const usePlayerControls = ( const vol = Number((playQueue.volume + 0.05 > 1 ? 1 : playQueue.volume + 0.05).toFixed(2)); setLocalVolume(vol); dispatch(setVolume(vol)); + ipcRenderer.send('volume', vol); } else if (e.key === 'ArrowDown' || e.key === 'ArrowLeft') { const vol = Number((playQueue.volume - 0.05 < 0 ? 0 : playQueue.volume - 0.05).toFixed(2)); setLocalVolume(vol); dispatch(setVolume(vol)); + ipcRenderer.send('volume', vol); } }, [dispatch, playQueue.volume, setLocalVolume] @@ -304,11 +307,13 @@ const usePlayerControls = ( vol = vol < 0 ? 0 : vol; setLocalVolume(vol); dispatch(setVolume(vol)); + ipcRenderer.send('volume', vol); } else { let vol = Number((playQueue.volume + 0.01).toFixed(2)); vol = vol > 1 ? 1 : vol; setLocalVolume(vol); dispatch(setVolume(vol)); + ipcRenderer.send('volume', vol); } }, [dispatch, isDraggingVolume, playQueue.volume, setIsDraggingVolume, setLocalVolume] diff --git a/src/main.dev.js b/src/main.dev.js index c63b240..4ddaea6 100644 --- a/src/main.dev.js +++ b/src/main.dev.js @@ -192,8 +192,9 @@ if (isLinux()) { }); mprisPlayer.on('volume', (event) => { - store.dispatch(setVolume(event)); - settings.setSync('volume', event); + const volume = Math.min(1, Math.max(0, event)); + store.dispatch(setVolume(volume)); + settings.setSync('volume', volume); }); mprisPlayer.on('loopStatus', () => { @@ -270,6 +271,10 @@ if (isLinux()) { ipcMain.on('current-position', (e, arg) => { mprisPlayer.getPosition = () => arg * 1e6; }); + + ipcMain.on('volume', (e, arg) => { + mprisPlayer.volume = Number(arg); + }); } if (isWindows() && isWindows10()) {