cvancau/alapatch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Actualiser src/features/menu/index.jsx
Deploy to home / deploy (push) Successful in 12s
Details

Browse Source
This commit is contained in:
cvancau
2026-08-10 21:21:14 +02:00
parent 5434d5b759
commit 21117736da
1 changed files with 38 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/features/menu/index.jsx
+38 -23
View File
@@ -37,6 +37,7 @@ export default function Menu(props) {
const dispatch = useDispatch(); const dispatch = useDispatch();
const reader = new FileReader(); const reader = new FileReader();
const [activeKeyboardId, setActiveKeyboardId] = useState(''); const [activeKeyboardId, setActiveKeyboardId] = useState('');
const [keyboardChannel, setKeyboardChannel] = useState(1);
useEffect(() => { useEffect(() => {
// 1. Initialisation des ports MIDI physiques au démarrage // 1. Initialisation des ports MIDI physiques au démarrage
@@ -123,7 +124,7 @@ export default function Menu(props) {
return ( return (
<div className="h-screen col-span-1 flex flex-col justify-between border-solid border-r border-gray-300 bg-white px-2 py-2 text-xs"> <div className="h-screen col-span-1 flex flex-col justify-between border-solid border-r border-gray-300 bg-white px-2 py-2 text-xs">
<div className="menu-patch-container"> <div className="menu-patch-container">
{/* 2 boutons Editor / Memory */} {/* 2 boutons Editor / Memory */}
@@ -144,9 +145,8 @@ export default function Menu(props) {
</div> </div>
</div> </div>
{/* BLOC SÉLECTEURS MIDI */} {/* BLOC SÉLECTEURS MIDI */}
<div className="my-1 flex flex-col space-y-3 bg-gray-100 p-2 rounded border border-gray-300">
<div className="my-1 flex flex-col space-y-3 bg-gray-100 p-2 rounded border border-gray-300">
<div className="flex flex-col space-y-1"> <div className="flex flex-col space-y-1">
<label htmlFor="midi-out-select" className="text-xs font-bold text-gray-500 uppercase">Out :</label> <label htmlFor="midi-out-select" className="text-xs font-bold text-gray-500 uppercase">Out :</label>
@@ -184,26 +184,41 @@ export default function Menu(props) {
</select> </select>
</div> </div>
<div className="flex flex-col space-y-1"> <div className="grid grid-cols-3 gap-1">
<label className="text-xs font-bold text-gray-500 uppercase">Keyboard In :</label> <div className="col-span-2 flex flex-col space-y-1">
<select <label className="text-xs font-bold text-gray-500 uppercase">Keyboard In :</label>
value={activeKeyboardId} <select
onChange={(e) => { value={activeKeyboardId}
setActiveKeyboardId(e.target.value); onChange={(e) => {
changeKeyboardInputPort(e.target.value); setActiveKeyboardId(e.target.value);
}} changeKeyboardInputPort(e.target.value, keyboardChannel);
className="w-full bg-white text-xs text-gray-800 px-1 py-1 rounded border border-gray-400" }}
> className="w-full bg-white text-xs px-1 py-1 rounded border border-gray-400"
<option value="">Aucun clavier</option> >
<option value="">Aucun clavier</option>
{midiInputs.map(device => ( {midiInputs.map(device => (
<option key={device.id} value={device.id}> <option key={device.id} value={device.id}>{device.name}</option>
{device.name} ))}
</option> </select>
))} </div>
</select> <div className="flex flex-col space-y-1">
<label className="text-xs font-bold text-gray-500 uppercase">Channel</label>
<select
value={keyboardChannel}
onChange={(e) => {
const channel = Number(e.target.value);
setKeyboardChannel(channel);
changeKeyboardInputPort(activeKeyboardId, channel);
}}
className="w-full bg-white text-xs px-1 py-1 rounded border border-gray-400"
>
{Array.from({ length: 16 }, (_, i) => (
<option key={i + 1} value={i + 1}>{i + 1}</option>
))}
</select>
</div>
</div> </div>
</div> </div>
{/* BLOC Patch Name */} {/* BLOC Patch Name */}