legop3/MultiRoombaRover
1
0
Fork 0
mirror of https://github.com/legop3/MultiRoombaRover.git synced 2026-09-15 17:12:59 -04:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

guhguh

Browse Source
This commit is contained in:
legop3
2025-11-18 04:10:55 -05:00
parent 189eb4c309
commit 519d2e2836
9 changed files with 93 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files
webui/src/components/AdvancedSettings.jsx
-2
View File
@@ -3,7 +3,6 @@ import { useControlSystem } from '../controls/index.js';
import AuthPanel from './AuthPanel.jsx';
import AdminPanel from './AdminPanel.jsx';
import KeymapSettings from './KeymapSettings.jsx';
import InputSettings from './InputSettings.jsx';
import GamepadMappingSettings from './GamepadMappingSettings.jsx';
const manualTabs = [
@@ -36,7 +35,6 @@ export default function AdvancedSettings() {
return (
<div className="space-y-1">
<KeymapSettings />
{/* <InputSettings /> */}
<GamepadMappingSettings />
<section className="rounded-sm bg-[#242a32] p-1 text-sm text-slate-100">
<p className="text-xs text-slate-400">Manual OI commands</p>
webui/src/components/GamepadMappingSettings.jsx
+74 -1
View File
@@ -1,6 +1,6 @@
import { useEffect, useMemo, useRef, useState } from 'react';
import { useSettingsNamespace } from '../settings/index.js';
import { GAMEPAD_MAPPING_DEFAULT } from '../settings/namespaces.js';
import { GAMEPAD_MAPPING_DEFAULT, INPUT_SETTINGS_DEFAULTS } from '../settings/namespaces.js';
function useGamepad() {
const [connected, setConnected] = useState(false);
@@ -24,6 +24,8 @@ function useGamepad() {
return connected;
}
const NUMBER_FORMAT = new Intl.NumberFormat(undefined, { maximumFractionDigits: 2 });
const ACTIONS = [
{ id: 'driveHorizontal', label: 'Drive horizontal', type: 'axis', section: 'Drive joystick', path: ['drive', 'horizontal'] },
{ id: 'driveVertical', label: 'Drive vertical', type: 'axis', section: 'Drive joystick', path: ['drive', 'vertical'] },
@@ -38,6 +40,27 @@ const ACTIONS = [
{ id: 'dock', label: 'Dock macro button', type: 'button', section: 'Mode buttons', path: ['buttons', 'dock'] },
];
function SliderField({ label, description, min, max, step, value, onChange }) {
return (
<label className="block rounded border border-white/5 p-1">
<div className="flex items-center justify-between text-xs text-slate-300">
<span className="font-semibold text-slate-100">{label}</span>
<span className="font-mono text-slate-400">{NUMBER_FORMAT.format(value)}</span>
</div>
{description && <p className="text-[0.65rem] text-slate-500">{description}</p>}
<input
type="range"
min={min}
max={max}
step={step}
value={value}
onChange={(event) => onChange(Number(event.target.value))}
className="mt-1 w-full accent-emerald-400"
/>
</label>
);
}
function formatAxis(value) {
if (!value) return 'Unassigned';
return `Axis ${value.index}${value.invert ? ' (invert)' : ''}`;
@@ -59,9 +82,18 @@ function updatePath(mapping, path, updater) {
export default function GamepadMappingSettings() {
const gamepadConnected = useGamepad();
const { value: mapping, save, reset } = useSettingsNamespace('gamepadMapping', GAMEPAD_MAPPING_DEFAULT);
const { value: inputSettings, save: saveInputSettings } = useSettingsNamespace('inputs', INPUT_SETTINGS_DEFAULTS);
const gamepadTuning = inputSettings.gamepad ?? INPUT_SETTINGS_DEFAULTS.gamepad;
const [capture, setCapture] = useState(null);
const axisBaselineRef = useRef(null);
const updateTuning = (patch) => {
saveInputSettings((prev) => ({
...prev,
gamepad: { ...(prev.gamepad ?? INPUT_SETTINGS_DEFAULTS.gamepad), ...patch },
}));
};
useEffect(() => {
axisBaselineRef.current = null;
}, [capture]);
@@ -152,6 +184,47 @@ export default function GamepadMappingSettings() {
</button>
</div>
<div className="mt-2 space-y-2">
<div className="rounded border border-white/5 p-1">
<p className="text-[0.7rem] uppercase tracking-wide text-slate-500">Sensitivity &amp; feel</p>
<div className="mt-1 space-y-1">
<SliderField
label="Drive deadzone"
description="Ignore small drive stick movement"
min={0}
max={0.6}
step={0.01}
value={gamepadTuning.driveDeadzone ?? 0.2}
onChange={(driveDeadzone) => updateTuning({ driveDeadzone })}
/>
<SliderField
label="Camera deadzone"
description="Tilt stick sensitivity"
min={0}
max={0.6}
step={0.01}
value={gamepadTuning.cameraDeadzone ?? 0.25}
onChange={(cameraDeadzone) => updateTuning({ cameraDeadzone })}
/>
<SliderField
label="Servo step (deg)"
description="Degrees per camera tick"
min={0.5}
max={6}
step={0.25}
value={gamepadTuning.servoStep ?? 2}
onChange={(servoStep) => updateTuning({ servoStep })}
/>
<SliderField
label="Side reverse multiplier"
description="Scale when reversing the side brush"
min={0.3}
max={1}
step={0.05}
value={gamepadTuning.auxReverseScale ?? 0.55}
onChange={(auxReverseScale) => updateTuning({ auxReverseScale })}
/>
</div>
</div>
{Object.entries(grouped).map(([section, actions]) => (
<div key={section} className="rounded border border-white/5 p-1">
<p className="text-[0.7rem] uppercase tracking-wide text-slate-500">{section}</p>
webui/src/components/InputSettings.jsx
-108
View File
@@ -1,108 +0,0 @@
import { useSettingsNamespace } from '../settings/index.js';
import { INPUT_SETTINGS_DEFAULTS } from '../settings/namespaces.js';
const NUMBER_FORMAT = new Intl.NumberFormat(undefined, { maximumFractionDigits: 2 });
function SliderField({ label, description, min, max, step, value, onChange }) {
return (
<label className="block rounded border border-white/5 p-1">
<div className="flex items-center justify-between text-xs text-slate-300">
<span className="font-semibold text-slate-100">{label}</span>
<span className="font-mono text-slate-400">{NUMBER_FORMAT.format(value)}</span>
</div>
{description && <p className="text-[0.65rem] text-slate-500">{description}</p>}
<input
type="range"
min={min}
max={max}
step={step}
value={value}
onChange={(event) => onChange(Number(event.target.value))}
className="mt-1 w-full accent-emerald-400"
/>
</label>
);
}
export default function InputSettings() {
const { value, save } = useSettingsNamespace('inputs', INPUT_SETTINGS_DEFAULTS);
const gamepad = value.gamepad ?? INPUT_SETTINGS_DEFAULTS.gamepad;
const mobile = value.mobile ?? INPUT_SETTINGS_DEFAULTS.mobile;
const updateGamepad = (patch) => {
save((prev) => ({
...prev,
gamepad: { ...(prev.gamepad ?? INPUT_SETTINGS_DEFAULTS.gamepad), ...patch },
}));
};
const updateMobile = (patch) => {
save((prev) => ({
...prev,
mobile: { ...(prev.mobile ?? INPUT_SETTINGS_DEFAULTS.mobile), ...patch },
}));
};
return (
<section className="rounded-sm bg-[#1d232b] p-1 text-sm text-slate-100">
<p className="text-xs font-semibold uppercase tracking-wide text-slate-400">Input tuning</p>
<div className="mt-2 space-y-2">
<div>
<p className="text-[0.7rem] uppercase tracking-wide text-slate-500">Gamepad</p>
<div className="mt-1 space-y-1">
<SliderField
label="Drive deadzone"
description="Ignore small stick movements"
min={0}
max={0.5}
step={0.01}
value={gamepad.driveDeadzone}
onChange={(driveDeadzone) => updateGamepad({ driveDeadzone })}
/>
<SliderField
label="Camera deadzone"
description="Tilt stick sensitivity"
min={0}
max={0.5}
step={0.01}
value={gamepad.cameraDeadzone}
onChange={(cameraDeadzone) => updateGamepad({ cameraDeadzone })}
/>
<SliderField
label="Servo step"
description="Degrees per camera tick"
min={0.5}
max={6}
step={0.25}
value={gamepad.servoStep}
onChange={(servoStep) => updateGamepad({ servoStep })}
/>
</div>
</div>
<div>
<p className="text-[0.7rem] uppercase tracking-wide text-slate-500">Mobile joystick</p>
<div className="mt-1 space-y-1">
<SliderField
label="Joystick radius"
description="Drag distance needed for full speed"
min={50}
max={140}
step={5}
value={mobile.joystickRadius}
onChange={(joystickRadius) => updateMobile({ joystickRadius })}
/>
<SliderField
label="Smoothing"
description="Lower values feel more direct"
min={0}
max={0.6}
step={0.02}
value={mobile.joystickSmoothing}
onChange={(joystickSmoothing) => updateMobile({ joystickSmoothing })}
/>
</div>
</div>
</div>
</section>
);
}
webui/src/components/MobileControls.jsx
+7 -9
View File
@@ -1,11 +1,11 @@
import { useCallback, useEffect, useRef, useState } from 'react';
import { useControlSystem } from '../controls/index.js';
import { clampUnit } from '../controls/controlMath.js';
import { useSettingsNamespace } from '../settings/index.js';
import { INPUT_SETTINGS_DEFAULTS } from '../settings/namespaces.js';
import DriveModeToggle from './controls/DriveModeToggle.jsx';
const SOURCE = 'mobile-joystick';
const JOYSTICK_RADIUS = 80;
const JOYSTICK_SMOOTHING = 0.15;
const AUX_BUTTONS = [
{ id: 'main-forward', label: 'Main +', values: { main: 127 }, hold: true, color: 'bg-emerald-600' },
{ id: 'main-reverse', label: 'Main -', values: { main: -127 }, hold: true, color: 'bg-emerald-800' },
@@ -135,8 +135,6 @@ function MobileJoystickPanel({ layout }) {
state: { roverId, camera },
actions: { setDriveVector, registerInputState, stopAllMotion, setServoAngle },
} = useControlSystem();
const { value: inputSettings } = useSettingsNamespace('inputs', INPUT_SETTINGS_DEFAULTS);
const mobileSettings = inputSettings.mobile ?? INPUT_SETTINGS_DEFAULTS.mobile;
const disabled = !roverId;
const cameraConfig = camera?.config;
const cameraEnabled = Boolean(roverId && camera?.enabled && cameraConfig);
@@ -145,11 +143,11 @@ function MobileJoystickPanel({ layout }) {
const cameraValue =
typeof camera?.angle === 'number'
? camera.angle
: typeof cameraConfig?.homeAngle === 'number'
? cameraConfig.homeAngle
: (cameraMin + cameraMax) / 2;
const joystickRadius = Math.max(40, mobileSettings.joystickRadius ?? INPUT_SETTINGS_DEFAULTS.mobile.joystickRadius);
const smoothing = Math.min(Math.max(mobileSettings.joystickSmoothing ?? 0, 0), 0.85);
: typeof cameraConfig?.homeAngle === 'number'
? cameraConfig.homeAngle
: (cameraMin + cameraMax) / 2;
const joystickRadius = JOYSTICK_RADIUS;
const smoothing = JOYSTICK_SMOOTHING;
const smoothedVectorRef = useRef({ x: 0, y: 0, boost: false });
useEffect(() => {
webui/src/controls/inputs/GamepadInputManager.jsx
-8
View File
@@ -10,14 +10,6 @@ function applyDeadzone(value, amount) {
return Math.abs(value) < amount ? 0 : value;
}
function computeTriggerSpeed(button, reverseButton, max = 127, reverseScale = 1) {
if (!button) return 0;
const value = typeof button.value === 'number' ? button.value : button.pressed ? 1 : 0;
if (value < 0.05) return 0;
const direction = reverseButton?.pressed ? -1 : 1;
return Math.round(value * max * direction * reverseScale);
}
function vectorsEqual(a, b) {
return (
a &&
webui/src/settings/namespaces.js
-4
View File
@@ -5,10 +5,6 @@ export const INPUT_SETTINGS_DEFAULTS = {
servoStep: 2,
auxReverseScale: 0.55,
},
mobile: {
joystickRadius: 80,
joystickSmoothing: 0.15,
},
};
export const GAMEPAD_MAPPING_DEFAULT = {