Skip to content

Add WebUSB file manager for browsing and editing device files #95

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
Copilot wants to merge 4 commits into
base: main
Choose a base branch
from
Draft

Add WebUSB file manager for browsing and editing device files #95

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
3131b07
Initial plan
Copilot Oct 27, 2025
011ad22
Add WebUSB file manager with file browsing and editing capabilities
Copilot Oct 27, 2025
090f184
Add demo mode to USB file manager for testing without device
Copilot Oct 27, 2025
98546cd
Address code review feedback: improve demo button styling and error h…
Copilot Oct 27, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 24 additions & 0 deletions usb-file-manager.docs.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
A WebUSB-based file manager that allows you to browse, view, and edit files on USB devices directly from your web browser. Connect a compatible USB device, navigate through directories, edit text files, and manage content without installing any software.

The tool uses the WebUSB API to communicate with USB devices that expose a file system interface. This includes devices with Mass Storage Class (MSC) implementations or custom vendor-specific protocols. You can upload files from your computer to the device, download files from the device, and edit text files in-place with a built-in code editor.

**Browser Requirements:** This tool requires a Chromium-based browser (Chrome, Edge, Opera, or Brave) with WebUSB support enabled.

**Device Compatibility:** The device must support WebUSB and expose a file system interface. The current implementation includes mock data for demonstration purposes. To connect a real device, the USB communication protocol needs to be adapted to match your device's specific protocol (MTP, MSC, or vendor-specific).

**Features:**
- Browse files and directories on USB devices
- View and edit text files with syntax highlighting
- Upload files from your computer to the device
- Download files from the device to your computer
- Navigate through directory structures with breadcrumb navigation
- Drag-and-drop file upload support

**Implementation Note:** The actual USB communication protocol varies by device. Common protocols include:
- **MTP (Media Transfer Protocol)** - Used by Android devices and many modern storage devices
- **MSC (Mass Storage Class)** - Standard USB storage protocol
- **Vendor-specific protocols** - Custom protocols for specialized devices like MicroPython boards

To adapt this tool for a specific device, you'll need to implement the appropriate USB communication protocol in the `readFile()`, `writeFile()`, and `listFiles()` functions.

<!-- Generated from commit: placeholder -->
Loading