horn pass

webui/src/components/CameraServoPanel.jsx

@@ -2,6 +2,7 @@ import { useEffect, useRef, useState } from 'react';
 import { useControlSystem } from '../controls/index.js';
 import { formatKeyLabel } from '../controls/keymapUtils.js';
 import NightVisionControl from './NightVisionControl.jsx';
+import HornControl from './HornControl.jsx';
 
 const SLIDER_THROTTLE_MS = 150;
 
@@ -14,13 +15,15 @@ export default function CameraServoPanel() {
   const {
     state: { roverId, camera, keymap },
     pipeline,
-    actions: { setServoAngle, nudgeServo, goServoHome, setNightVision },
+    actions: { setServoAngle, nudgeServo, goServoHome, setNightVision, startHorn, stopHorn },
   } = useControlSystem();
   const config = camera?.config;
   const enabled = Boolean(roverId && camera?.enabled && config);
   const nightVisionAvailable = Boolean(roverId && pipeline?.nightVision);
   const nightVisionState = pipeline?.nightVisionState;
+  const hornAvailable = Boolean(roverId && pipeline?.horn);
   const nightVisionKey = formatKeyLabel(keymap?.nightVisionToggle?.[0]);
+  const hornKey = formatKeyLabel(keymap?.hornHonk?.[0]);
   const min = typeof config?.minAngle === 'number' ? config.minAngle : -30;
   const max = typeof config?.maxAngle === 'number' ? config.maxAngle : 30;
   const value =
@@ -30,7 +33,7 @@ export default function CameraServoPanel() {
         ? config.homeAngle
         : (min + max) / 2;
 
-  if (!enabled && !nightVisionAvailable) return null;
+  if (!enabled && !nightVisionAvailable && !hornAvailable) return null;
 
   const [pendingAngle, setPendingAngle] = useState(value);
   const throttleRef = useRef(null);
@@ -101,6 +104,14 @@ export default function CameraServoPanel() {
           keyLabel={nightVisionKey}
         />
       )}
+      {hornAvailable && (
+        <HornControl
+          disabled={!roverId}
+          onStart={startHorn}
+          onStop={stopHorn}
+          keyLabel={hornKey}
+        />
+      )}
       {enabled && (
         <>
           <div className="flex items-center justify-between text-sm text-slate-300">

webui/src/components/ControlSummary.jsx

@@ -7,6 +7,7 @@ import TopDownMap from './TopDownMap.jsx';
 import RoverRoster from './RoverRoster.jsx';
 import DriveDockAction, { useDriveDockState } from './DriveDockAction.jsx';
 import NightVisionControl from './NightVisionControl.jsx';
+import HornControl from './HornControl.jsx';
 
 export function RoverRosterPanel({ title = 'Rovers' }) {
   const { session, requestControl } = useSession();
@@ -76,13 +77,14 @@ export function InlineCameraTilt({ keymap }) {
   const {
     state: { roverId, camera },
     pipeline,
-    actions: { setServoAngle, setNightVision },
+    actions: { setServoAngle, setNightVision, startHorn, stopHorn },
   } = useControlSystem();
 
   const config = camera?.config;
   const enabled = Boolean(roverId && camera?.enabled && config);
   const nightVisionAvailable = Boolean(roverId && pipeline?.nightVision);
   const nightVisionState = pipeline?.nightVisionState;
+  const hornAvailable = Boolean(roverId && pipeline?.horn);
   const min = typeof config?.minAngle === 'number' ? config.minAngle : -30;
   const max = typeof config?.maxAngle === 'number' ? config.maxAngle : 30;
   const value =
@@ -113,10 +115,11 @@ export function InlineCameraTilt({ keymap }) {
     draggingRef.current = false;
   };
 
-  if (!enabled && !nightVisionAvailable) return null;
+  if (!enabled && !nightVisionAvailable && !hornAvailable) return null;
   const upLabel = formatKeyLabel(keymap?.cameraUp?.[0]);
   const downLabel = formatKeyLabel(keymap?.cameraDown?.[0]);
   const nightVisionLabel = formatKeyLabel(keymap?.nightVisionToggle?.[0]);
+  const hornLabel = formatKeyLabel(keymap?.hornHonk?.[0]);
 
   return (
     <div className="surface space-y-0.5 p-0 text-sm text-slate-200">
@@ -128,6 +131,9 @@ export function InlineCameraTilt({ keymap }) {
           keyLabel={nightVisionLabel}
         />
       )}
+      {hornAvailable && (
+        <HornControl disabled={!roverId} onStart={startHorn} onStop={stopHorn} keyLabel={hornLabel} />
+      )}
       {enabled && (
         <div className="space-y-0.5 px-1 py-1">
           <div className="flex items-center justify-between text-xs text-slate-300">

webui/src/components/HornControl.jsx

@@ -0,0 +1,72 @@
+import { useMemo, useState } from 'react';
+
+export default function HornControl({
+  disabled,
+  onStart,
+  onStop,
+  keyLabel,
+  className = '',
+}) {
+  const [pressed, setPressed] = useState(false);
+
+  const buttonClasses = useMemo(() => {
+    const base =
+      'group flex w-full items-center justify-between rounded-xl border-2 px-1 py-0.75 text-xs font-semibold';
+    const active = 'border-rose-300/70 bg-rose-800 text-rose-50 hover:bg-rose-700';
+    const inactive = 'border-amber-300/70 bg-amber-900 text-amber-50 hover:bg-amber-800';
+    return [base, pressed ? active : inactive, 'disabled:opacity-50', className]
+      .filter(Boolean)
+      .join(' ');
+  }, [className, pressed]);
+
+  const start = () => {
+    if (disabled) return;
+    if (!pressed) {
+      setPressed(true);
+      onStart?.();
+    }
+  };
+
+  const stop = () => {
+    if (pressed) {
+      setPressed(false);
+      onStop?.();
+    }
+  };
+
+  return (
+    <button
+      type="button"
+      onPointerDown={(event) => {
+        event.preventDefault();
+        start();
+      }}
+      onPointerUp={(event) => {
+        event.preventDefault();
+        stop();
+      }}
+      onPointerLeave={stop}
+      onPointerCancel={stop}
+      onBlur={stop}
+      disabled={disabled}
+      aria-pressed={pressed}
+      className={buttonClasses}
+    >
+      <span className="flex items-center gap-0.5">
+        <span>Horn</span>
+        {keyLabel ? (
+          <span className="rounded bg-slate-800 px-1 py-0.5 text-[0.6rem] font-semibold text-slate-200">
+            {keyLabel}
+          </span>
+        ) : null}
+      </span>
+      <span
+        className={`rounded px-1 py-0.5 text-[0.65rem] font-semibold ${
+          pressed ? 'bg-rose-400 text-rose-950' : 'bg-slate-700 text-slate-200'
+        }`}
+      >
+        {pressed ? 'HONK' : 'Hold'}
+      </span>
+    </button>
+  );
+}

webui/src/components/HornSettings.jsx

@@ -0,0 +1,85 @@
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useSettingsNamespace } from '../settings/index.js';
+import { HORN_SETTINGS_DEFAULTS } from '../settings/namespaces.js';
+
+function clampFreq(value) {
+  const num = Number(value);
+  if (!Number.isFinite(num)) return 0;
+  if (num <= 0) return 0;
+  return Math.min(5000, Math.round(num));
+}
+
+export default function HornSettings() {
+  const { value: hornSettings, save: saveHornSettings } = useSettingsNamespace(
+    'horn',
+    HORN_SETTINGS_DEFAULTS,
+  );
+  const [waveform, setWaveform] = useState(hornSettings?.waveform || HORN_SETTINGS_DEFAULTS.waveform);
+  const [freqs, setFreqs] = useState(() => {
+    const base = Array.isArray(hornSettings?.freqs) ? hornSettings.freqs : HORN_SETTINGS_DEFAULTS.freqs;
+    return [...base, 0, 0, 0, 0].slice(0, 4).map((f) => clampFreq(f));
+  });
+
+  useEffect(() => {
+    setWaveform(hornSettings?.waveform || HORN_SETTINGS_DEFAULTS.waveform);
+    if (Array.isArray(hornSettings?.freqs)) {
+      setFreqs([...hornSettings.freqs, 0, 0, 0, 0].slice(0, 4).map((f) => clampFreq(f)));
+    }
+  }, [hornSettings?.freqs, hornSettings?.waveform]);
+
+  const formattedWaveform = useMemo(
+    () => (waveform === 'sine' ? 'sine' : 'saw'),
+    [waveform],
+  );
+
+  const updateWaveform = useCallback(
+    (event) => {
+      const next = event.target.value === 'sine' ? 'sine' : 'saw';
+      setWaveform(next);
+      saveHornSettings((current) => ({ ...(current ?? {}), waveform: next }));
+    },
+    [saveHornSettings],
+  );
+
+  const updateFreq = useCallback(
+    (index, value) => {
+      setFreqs((prev) => {
+        const next = [...prev];
+        next[index] = clampFreq(value);
+        saveHornSettings((current) => ({ ...(current ?? {}), freqs: next }));
+        return next;
+      });
+    },
+    [saveHornSettings],
+  );
+
+  return (
+    <section className="panel-section space-y-0.5 text-sm">
+      <p className="text-slate-400">Horn</p>
+      <label className="flex items-center justify-between gap-0.5 text-slate-200">
+        <span>Waveform</span>
+        <select value={formattedWaveform} onChange={updateWaveform} className="field-input text-sm">
+          <option value="saw">Saw</option>
+          <option value="sine">Sine</option>
+        </select>
+      </label>
+      <div className="grid grid-cols-2 gap-0.5">
+        {freqs.map((freq, idx) => (
+          <label key={`horn-freq-${idx}`} className="surface-muted flex items-center justify-between gap-0.5">
+            <span className="text-[0.7rem] text-slate-300">Freq {idx + 1}</span>
+            <input
+              type="number"
+              min={0}
+              max={5000}
+              step={1}
+              value={freq}
+              onChange={(event) => updateFreq(idx, event.target.value)}
+              className="w-20 rounded border border-slate-700 bg-slate-900 px-1 py-[2px] text-right text-[0.75rem] font-mono text-slate-100"
+            />
+          </label>
+        ))}
+      </div>
+      <p className="text-xs text-slate-500">Set a frequency to 0 to disable that oscillator.</p>
+    </section>
+  );
+}

webui/src/components/KeymapSettings.jsx

@@ -22,6 +22,7 @@ const KEY_ACTIONS = [
   { id: 'cameraUp', label: 'Camera Up', group: 'Camera' },
   { id: 'cameraDown', label: 'Camera Down', group: 'Camera' },
   { id: 'nightVisionToggle', label: 'Toggle Night Vision', group: 'Camera' },
+  { id: 'hornHonk', label: 'Horn (Hold)', group: 'Audio' },
   { id: 'driveMacro', label: 'Drive Macro', group: 'Macros' },
   { id: 'dockMacro', label: 'Dock Macro', group: 'Macros' },
   { id: 'chatFocus', label: 'Toggle Chat', group: 'Chat' },

webui/src/components/MobileControls.jsx

@@ -3,6 +3,7 @@ import { useControlSystem } from '../controls/index.js';
 import { clampUnit } from '../controls/controlMath.js';
 import DriveDockAction, { useDriveDockState } from './DriveDockAction.jsx';
 import NightVisionControl from './NightVisionControl.jsx';
+import HornControl from './HornControl.jsx';
 
 const SOURCE = 'mobile-joystick';
 const JOYSTICK_RADIUS = 80;
@@ -135,7 +136,7 @@ function MobileJoystickPanel({ layout }) {
   const {
     state: { roverId, camera },
     pipeline,
-    actions: { setDriveVector, registerInputState, setServoAngle, setNightVision },
+    actions: { setDriveVector, registerInputState, setServoAngle, setNightVision, startHorn, stopHorn },
   } = useControlSystem();
   const driveDockState = useDriveDockState(roverId);
   const dockedNotDriving = driveDockState.docked && !driveDockState.driving;
@@ -144,6 +145,7 @@ function MobileJoystickPanel({ layout }) {
   const cameraEnabled = Boolean(roverId && camera?.enabled && cameraConfig);
   const nightVisionAvailable = Boolean(roverId && pipeline?.nightVision);
   const nightVisionState = pipeline?.nightVisionState;
+  const hornAvailable = Boolean(roverId && pipeline?.horn);
   const cameraMin = typeof cameraConfig?.minAngle === 'number' ? cameraConfig.minAngle : -45;
   const cameraMax = typeof cameraConfig?.maxAngle === 'number' ? cameraConfig.maxAngle : 45;
   const cameraValue =
@@ -223,6 +225,9 @@ function MobileJoystickPanel({ layout }) {
               onToggle={handleNightVisionToggle}
             />
           )}
+          {hornAvailable && (
+            <HornControl disabled={disabled} onStart={startHorn} onStop={stopHorn} />
+          )}
           {cameraEnabled && (
             <div className="bg-zinc-950 p-0.5 text-xs">
               <div className="flex items-center justify-between text-[0.75rem] text-slate-400">

webui/src/components/SettingsPanel.jsx

@@ -8,6 +8,7 @@ import OvercurrentLimiterPanel from './OvercurrentLimiterPanel.jsx';
 import Tabs, { Tab, TabList, TabPanel, TabPanels } from './Tabs.jsx';
 import SessionSnapshot from './SessionSnapshot.jsx';
 import SocketLogPanel from './SocketLogPanel.jsx';
+import HornSettings from './HornSettings.jsx';
 import { useHudMapSetting } from '../hooks/useHudMapSetting.js';
 import { useSettingsNamespace } from '../settings/index.js';
 import { useSocket } from '../context/SocketContext.jsx';
@@ -67,6 +68,7 @@ export default function SettingsPanel() {
         <TabPanel id="keybindings">
           <div className="space-y-0.5">
             <KeymapSettings />
+            <HornSettings />
           </div>
         </TabPanel>
         <TabPanel id="controller">

webui/src/controls/ControlContext.jsx

@@ -6,6 +6,7 @@ import { DEFAULT_KEYMAP, DEFAULT_MACROS, SONG_DEFAULT_NOTE } from './constants.j
 import { canonicalizeKeyInput } from './keymapUtils.js';
 import { useSettingsNamespace } from '../settings/index.js';
 import { useSession } from '../context/SessionContext.jsx';
+import { HORN_SETTINGS_DEFAULTS } from '../settings/namespaces.js';
 import {
   applyAuxOvercurrentScale,
   applyDriveOvercurrentScale,
@@ -36,6 +37,7 @@ export function ControlSystemProvider({ children }) {
     value: controlSettings,
     save: saveControlSettings,
   } = useSettingsNamespace('controls', { keymap: DEFAULT_KEYMAP, macros: DEFAULT_MACROS });
+  const { value: hornSettings } = useSettingsNamespace('horn', HORN_SETTINGS_DEFAULTS);
   const { session, homeAssistantSetState } = useSession();
   const roverId = session?.assignment?.roverId ?? null;
   const overcurrentLimiter = useOvercurrentLimiter(roverId);
@@ -346,6 +348,31 @@ export function ControlSystemProvider({ children }) {
     [pipeline],
   );
 
+  const normalizedHornSettings = useMemo(() => {
+    const base = hornSettings ?? HORN_SETTINGS_DEFAULTS;
+    const waveform = base.waveform === 'sine' ? 'sine' : 'saw';
+    const freqs = Array.isArray(base.freqs) ? base.freqs : HORN_SETTINGS_DEFAULTS.freqs;
+    const normalized = [...freqs, 0, 0, 0, 0]
+      .slice(0, 4)
+      .map((value) => {
+        const num = Number(value);
+        if (!Number.isFinite(num)) return 0;
+        return num <= 0 ? 0 : Math.min(5000, Math.round(num));
+      });
+    return { waveform, freqs: normalized };
+  }, [hornSettings]);
+
+  const startHorn = useCallback(() => {
+    if (!pipeline.horn) return;
+    pipeline.sendHorn({ action: 'start', ...normalizedHornSettings });
+    recordControlIntent();
+  }, [normalizedHornSettings, pipeline, recordControlIntent]);
+
+  const stopHorn = useCallback(() => {
+    if (!pipeline.horn) return;
+    pipeline.sendHorn({ action: 'stop' });
+  }, [pipeline]);
+
   const registerInputState = useCallback((source, data) => {
     dispatch({ type: 'control/register-input-state', payload: { source, state: data } });
   }, []);
@@ -374,6 +401,8 @@ export function ControlSystemProvider({ children }) {
         registerInputState,
         setSongNote,
         sendSong,
+        startHorn,
+        stopHorn,
       },
     }),
     [
@@ -397,6 +426,8 @@ export function ControlSystemProvider({ children }) {
       registerInputState,
       setSongNote,
       sendSong,
+      startHorn,
+      stopHorn,
     ],
   );
 

webui/src/controls/commandPipeline.js

@@ -32,6 +32,11 @@ export function useCommandPipeline(options = {}) {
     return rosterEntry.nightVision;
   }, [rosterEntry]);
 
+  const horn = useMemo(() => {
+    if (!rosterEntry?.horn || !rosterEntry.horn.enabled) return null;
+    return rosterEntry.horn;
+  }, [rosterEntry]);
+
   const nightVisionState = useMemo(() => rosterEntry?.nightVision?.state ?? null, [rosterEntry]);
 
   const emitCommand = useCallback(
@@ -172,6 +177,18 @@ export function useCommandPipeline(options = {}) {
     [emitCommand, nightVision, roverId],
   );
 
+  const sendHorn = useCallback(
+    (payload) => {
+      if (!roverId) return null;
+      emitCommand({
+        type: 'horn',
+        data: { horn: payload },
+      });
+      return payload;
+    },
+    [emitCommand, roverId],
+  );
+
   const sendSong = useCallback(
     (notes = [], options = {}) => {
       if (!roverId) return null;
@@ -205,6 +222,7 @@ export function useCommandPipeline(options = {}) {
       servoConfig,
       nightVision,
       nightVisionState,
+      horn,
       emitCommand,
       enableSensorStream,
       sendDriveDirect,
@@ -212,6 +230,7 @@ export function useCommandPipeline(options = {}) {
       sendServoAngle,
       sendOiCommand,
       sendNightVision,
+      sendHorn,
       sendSong,
       runMacroSteps,
     }),
@@ -221,6 +240,7 @@ export function useCommandPipeline(options = {}) {
       servoConfig,
       nightVision,
       nightVisionState,
+      horn,
       emitCommand,
       enableSensorStream,
       sendDriveDirect,
@@ -228,6 +248,7 @@ export function useCommandPipeline(options = {}) {
       sendServoAngle,
       sendOiCommand,
       sendNightVision,
+      sendHorn,
       runMacroSteps,
     ],
   );

webui/src/controls/constants.js

@@ -42,6 +42,7 @@ export const DEFAULT_KEYMAP = {
   cameraUp: ['u'],
   cameraDown: ['j'],
   nightVisionToggle: ['e'],
+  hornHonk: ['h'],
   driveMacro: ['f'],
   dockMacro: ['g'],
   chatFocus: ['enter'],

webui/src/controls/inputs/KeyboardInputManager.jsx

@@ -126,6 +126,8 @@ export default function KeyboardInputManager() {
       stopAllMotion,
       registerInputState,
       toggleNightVision,
+      startHorn,
+      stopHorn,
       setSongNote,
       sendSong,
     },
@@ -174,6 +176,7 @@ export default function KeyboardInputManager() {
   const lastAuxRef = useRef(ZERO_AUX);
   const servoIntervalRef = useRef(null);
   const songIntervalRef = useRef(null);
+  const hornActiveRef = useRef(false);
 
   const driveFromKeys = useCallback(() => {
     const tokensSnapshot = new Set(activeTokensRef.current);
@@ -299,9 +302,13 @@ export default function KeyboardInputManager() {
     lastAuxRef.current = ZERO_AUX;
     stopServoLoop();
     stopSongLoop();
+    if (hornActiveRef.current) {
+      hornActiveRef.current = false;
+      stopHorn();
+    }
     stopAllMotion();
     registerInputState(SOURCE, { keys: [], vector: ZERO_VECTOR, aux: ZERO_AUX });
-  }, [registerInputState, stopAllMotion, stopServoLoop, stopSongLoop]);
+  }, [registerInputState, stopAllMotion, stopHorn, stopServoLoop, stopSongLoop]);
 
   const triggerHomeAssistantCycle = useCallback(
     (targetState) => {
@@ -364,6 +371,11 @@ export default function KeyboardInputManager() {
           runMacro('seek-dock');
         } else if (newlyPressed.some((token) => keymap.nightVisionToggle?.has(token))) {
           toggleNightVision();
+        } else if (newlyPressed.some((token) => keymap.hornHonk?.has(token))) {
+          if (!hornActiveRef.current) {
+            hornActiveRef.current = true;
+            startHorn();
+          }
         } else if (newlyPressed.some((token) => keymap.homeAssistantOn?.has(token))) {
           triggerHomeAssistantCycle('on');
         } else if (newlyPressed.some((token) => keymap.homeAssistantOff?.has(token))) {
@@ -379,6 +391,10 @@ export default function KeyboardInputManager() {
     function handleKeyUp(event) {
       const tokens = tokensForEvent(event);
       tokens.forEach((token) => activeTokensRef.current.delete(token));
+      if (hornActiveRef.current && !bindingActive(keymap.hornHonk, activeTokensRef.current)) {
+        hornActiveRef.current = false;
+        stopHorn();
+      }
       ensureServoLoop();
       ensureSongLoop();
       driveFromKeys();
@@ -407,11 +423,14 @@ export default function KeyboardInputManager() {
     keymap.chatFocus,
     keymap.dockMacro,
     keymap.driveMacro,
+    keymap.hornHonk,
     resetAll,
     runMacro,
     setMode,
     stopAllMotion,
     stopSongLoop,
+    startHorn,
+    stopHorn,
     triggerHomeAssistantCycle,
   ]);
 

webui/src/settings/namespaces.js

@@ -85,3 +85,8 @@ export const GAMEPAD_SETTINGS_DEFAULTS = {
     profile: GAMEPAD_PROFILE_DEFAULT,
   },
 };
+
+export const HORN_SETTINGS_DEFAULTS = {
+  waveform: 'saw',
+  freqs: [440, 550, 660, 0],
+};