wuxu/DroneCan_WebTools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
wuxu
2026-05-24 19:52:13 +08:00
parent 43d8563b79
commit 4d9f5687dd
2 changed files with 644 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
CLAUDE.md Normal file
View File

@@ -0,0 +1,55 @@
# CLAUDE.md
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
## Commands
- `npm install` — install dependencies.
- `npm start` — start webpack dev server on `http://localhost:8080` with hot reload.
- `npm run build` — create a production build in `dist/`.
There are currently no lint, typecheck, or test scripts configured in `package.json`, and no Jest/Vitest/ESLint config files are present. Use `npm run build` as the available validation command after changes. There is no single-test command until a test runner is added.
## Application structure
This is a React 18 + Material UI browser application bundled by Webpack 5/Babel. `webpack.config.js` defines multiple entry points and HTML outputs:
- `src/index.js` -> `public/index.html` for the main application.
- `src/subscriber.js` -> `public/subscriber.html`.
- `src/bus_monitor.js` -> `public/bus_monitor.html`.
- `src/esc_panel.js` -> `public/esc_panel.html`.
- `src/actuator_panel.js` -> `public/actuator_panel.html`.
The main app is `src/App.js`. It creates global browser objects `window.mavlinkSession` and `window.localNode`, wires `localNode.sendFrame` into MAVLink CAN frame forwarding, and renders the primary node list, node logs, node properties, parameter editor, adapter settings, DNA server modal, and panel launch menus.
Standalone panel pages are opened by the main app with `window.open(...)`. Panels such as subscriber, bus monitor, ESC, and actuator use their own entry files/window wrapper components and access shared state through `window.opener.localNode` when they are child windows. Avoid changing these panels as if they were independent apps unless you also account for the opener relationship.
## Transport and protocol layers
`src/mavlink_session.js` is the bridge between browser transports and DroneCAN:
- WebSocket transport is implemented in `src/ws_client.js`.
- Web Serial transport is implemented in `src/web_serial.js`.
- MAVLink parsing/sending comes from `src/mavlink.js` globals and wraps CAN frames in MAVLink `CAN_FRAME` messages.
- Incoming extended CAN frames are emitted into `window.localNode` as `can-frame` events.
`src/ConnectionSettingsModal.js` owns connection setup UI for serial and WebSocket, local node ID selection, CAN bus selection, MAVLink signing, and the recurring `MAV_CMD_CAN_FORWARD` command that enables CAN forwarding on the selected bus.
`src/dronecan/` contains the generated/ported DroneCAN protocol implementation: DSDL message classes, type packing/unpacking, frame and transfer logic, and `node.js`. `src/dronecan/node.js` is the event-oriented high-level API for node monitoring, node info requests, parameter get/set, restarts, ESC/actuator commands, dynamic node ID allocation messages, and firmware file read responses.
To regenerate the DroneCAN DSDL JavaScript, the README documents using `dronecan_dsdljs.py` from `https://github.com/dronecan/dronecan_dsdljs` and writing output to `src/dronecan`.
## Feature-specific modules
- `src/FileServer.js` is a singleton (`window.FileServer`) used for firmware/file transfer. It loads `.bin` files directly, converts Intel HEX `.hex` files to binary, registers files by virtual path/key, and answers `uavcan.protocol.file.Read.Request` through `localNode.responseUavcanProtocolFileRead`.
- `src/services/DynamicNodeIdServer.js` implements a browser-side DroneCAN dynamic node ID allocation server and persists allocations in `localStorage` under `dna_server_allocations`.
- `src/NodeParam.js`, `src/EditParamModal.js`, and `src/ParamEditors/` implement parameter display/editing using DroneCAN `GetSet` responses stored on `localNode.nodeParams`.
- `src/BusMonitor.js`, `src/SubscriberWindow.js`, `src/EscPanel.js`, and `src/ActuatorPanel.js` consume `localNode` events to monitor transfers or send command messages.
## Styling and assets
Shared Material UI theme settings live in `src/theme.js`. Page-specific CSS is in `src/css/`. Webpack handles CSS and image assets via `style-loader`, `css-loader`, and `file-loader`.
## README details to preserve
The README states the official entry is `https://can.ardupilot.org` and the backup entry is `https://can.vimdrones.com`. The browser app provides bus monitoring, ESC control/configuration, actuator control/testing, message subscription, node configuration, dynamic node ID allocation, and firmware/file transfer workflows.