Dangoware/dango-music-player
1
0
Fork 0
mirror of https://github.com/Dangoware/dango-music-player.git synced 2025-06-22 22:52:59 -05:00
Code Issues Projects Releases Packages Wiki Activity

updated volumeslider to step up and down by 5

Browse source
This commit is contained in:
MrDulfin 2025-06-06 05:48:57 -04:00
parent f0d57de8b4
commit f79e9926f0
1 changed files with 7 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/App.tsx
View file

@ -6,9 +6,8 @@ import { Config, playbackInfo } from "./types";
// import { listen } from "@tauri-apps/api/event"; // import { listen } from "@tauri-apps/api/event";
// import { fetch } from "@tauri-apps/plugin-http"; // import { fetch } from "@tauri-apps/plugin-http";
import { getCurrentWebviewWindow } from "@tauri-apps/api/webviewWindow"; import { getCurrentWebviewWindow } from "@tauri-apps/api/webviewWindow";
import { cursorPosition, LogicalPosition, PhysicalPosition } from "@tauri-apps/api/window"; import { PhysicalPosition } from "@tauri-apps/api/window";
import { Menu, Submenu, SubmenuOptions } from "@tauri-apps/api/menu"; import { Menu, Submenu, SubmenuOptions } from "@tauri-apps/api/menu";
import { TauriEvent } from "@tauri-apps/api/event";
const appWindow = getCurrentWebviewWindow(); const appWindow = getCurrentWebviewWindow();
@ -393,6 +392,7 @@ function PlayBar({ playing, setPlaying }: PlayBarProps) {
const [duration, setDuration] = useState(0); const [duration, setDuration] = useState(0);
const [seekBarSize, setSeekBarSize] = useState(0); const [seekBarSize, setSeekBarSize] = useState(0);
const seekBarRef = React.createRef<HTMLDivElement>(); const seekBarRef = React.createRef<HTMLDivElement>();
const volumeSliderRef = React.createRef<HTMLInputElement>();
const [lastFmLoggedIn, setLastFmLoggedIn] = useState(false); const [lastFmLoggedIn, setLastFmLoggedIn] = useState(false);
@ -419,13 +419,13 @@ function PlayBar({ playing, setPlaying }: PlayBarProps) {
}; };
const wheelVolume = (event: React.WheelEvent<HTMLDivElement>) => { const wheelVolume = (event: React.WheelEvent<HTMLDivElement>) => {
let x = volumeSlider.value; const n = 5;
if (event.deltaY < 0) { if (event.deltaY < 0) {
volumeSlider.value++; volumeSliderRef.current!.stepUp(n);
} else { } else {
volumeSlider.value--; volumeSliderRef.current!.stepDown(n);
} }
invoke('set_volume', { volume: volumeSlider.value }).then(() => {}) invoke('set_volume', { volume: volumeSliderRef.current?.valueAsNumber!.toString() }).then(() => {})
}; };
return ( return (
@ -446,7 +446,7 @@ function PlayBar({ playing, setPlaying }: PlayBarProps) {
<div className="bottomRight"> <div className="bottomRight">
<button>🔀</button> <button>🔀</button>
<button>🔁</button> <button>🔁</button>
<input onWheel={wheelVolume} type="range" name="volume" id="volumeSlider" onChange={ (volume) => { <input ref={ volumeSliderRef } onWheel={wheelVolume} type="range" name="volume" id="volumeSlider" onChange={ (volume) => {
invoke('set_volume', { volume: volume.target.value }).then(() => {}) invoke('set_volume', { volume: volume.target.value }).then(() => {})
}} /> }} />
<p id="timeDisplay"> <p id="timeDisplay">