mirror of
https://github.com/Dangoware/dango-music-player.git
synced 2025-06-22 22:52:59 -05:00
updated volumeslider to step up and down by 5
This commit is contained in:
parent
f0d57de8b4
commit
f79e9926f0
1 changed files with 7 additions and 7 deletions
14
src/App.tsx
14
src/App.tsx
|
@ -6,9 +6,8 @@ import { Config, playbackInfo } from "./types";
|
|||
// import { listen } from "@tauri-apps/api/event";
|
||||
// import { fetch } from "@tauri-apps/plugin-http";
|
||||
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 { TauriEvent } from "@tauri-apps/api/event";
|
||||
|
||||
|
||||
const appWindow = getCurrentWebviewWindow();
|
||||
|
@ -393,6 +392,7 @@ function PlayBar({ playing, setPlaying }: PlayBarProps) {
|
|||
const [duration, setDuration] = useState(0);
|
||||
const [seekBarSize, setSeekBarSize] = useState(0);
|
||||
const seekBarRef = React.createRef<HTMLDivElement>();
|
||||
const volumeSliderRef = React.createRef<HTMLInputElement>();
|
||||
|
||||
const [lastFmLoggedIn, setLastFmLoggedIn] = useState(false);
|
||||
|
||||
|
@ -419,13 +419,13 @@ function PlayBar({ playing, setPlaying }: PlayBarProps) {
|
|||
};
|
||||
|
||||
const wheelVolume = (event: React.WheelEvent<HTMLDivElement>) => {
|
||||
let x = volumeSlider.value;
|
||||
const n = 5;
|
||||
if (event.deltaY < 0) {
|
||||
volumeSlider.value++;
|
||||
volumeSliderRef.current!.stepUp(n);
|
||||
} else {
|
||||
volumeSlider.value--;
|
||||
volumeSliderRef.current!.stepDown(n);
|
||||
}
|
||||
invoke('set_volume', { volume: volumeSlider.value }).then(() => {})
|
||||
invoke('set_volume', { volume: volumeSliderRef.current?.valueAsNumber!.toString() }).then(() => {})
|
||||
};
|
||||
|
||||
return (
|
||||
|
@ -446,7 +446,7 @@ function PlayBar({ playing, setPlaying }: PlayBarProps) {
|
|||
<div className="bottomRight">
|
||||
<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(() => {})
|
||||
}} />
|
||||
<p id="timeDisplay">
|
||||
|
|
Loading…
Reference in a new issue