diff --git a/src/App.tsx b/src/App.tsx index 7949bd8..41a09e4 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -5,11 +5,14 @@ import PatchSquare from "./PatchSquare.tsx"; import {WebMidi, Output} from "webmidi"; function App() { - const [bankNumber, setBankNumber] = useState(0) - const [patchNumber, setPatchNumber] = useState(0) + let initBankNumber = parseInt(localStorage.getItem("bank-number")??"0") + let initPatchNumber = parseInt(localStorage.getItem("patch-number")??"0") + let initMidiChannel = parseInt(localStorage.getItem("midi-channel")??"1") + const [bankNumber, setBankNumber] = useState(initBankNumber) + const [patchNumber, setPatchNumber] = useState(initPatchNumber) const [midiDeviceMap, setMidiDeviceMap] = useState>(new Map()) const [selectedMidiDevice, setSelectedMidiDevice] = useState() - const [selectedMidiChannel, setSelectedMidiChannel] = useState(1) + const [selectedMidiChannel, setSelectedMidiChannel] = useState(initMidiChannel) function connect() { WebMidi.enable() @@ -47,10 +50,12 @@ function App() { function handleBankSelect(selection: number) { setBankNumber(selection) + localStorage.setItem("bank-number", selection.toString()) } function handlePatchSelect(selection: number) { setPatchNumber(selection) + localStorage.setItem("patch-number", selection.toString()) } function sendPatchNumber() { @@ -112,6 +117,7 @@ function App() { function handleMidiChannelSelect(e: ChangeEvent) { setSelectedMidiChannel(parseInt(e.target.value)) + localStorage.setItem("midi-channel", e.target.value) } return ( @@ -123,7 +129,9 @@ function App() {
- +