56 lines
2.6 KiB
Markdown
56 lines
2.6 KiB
Markdown
|
# Web UART Terminal
|
||
|
|
|
||
|
|
A sleek, premium, self-contained web application that enables serial port communication directly from your browser using the **Web Serial API**. It supports standard UART configuration controls (Baud rate, data bits, stop bits, parity), ASCII/Hex display, Hex data sending, log exporting, and a responsive dark/light themed user interface.
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
## Prerequisites & Compatibility
|
||
|
|
|
||
|
|
1. **Browser Support**: The Web Serial API is supported in modern Chromium-based browsers, including:
|
||
|
|
- Google Chrome (version 89+)
|
||
|
|
- Microsoft Edge (version 89+)
|
||
|
|
- Opera (version 75+)
|
||
|
|
- *(Note: Firefox, Safari, and iOS browsers are not supported at this time.)*
|
||
|
|
2. **Secure Context**: The browser only permits Web Serial API calls in a secure context (`https://`) or from `localhost` (which Vite handles automatically).
|
||
|
|
|
||
|
|
## Quick Start
|
||
|
|
|
||
|
|
To launch the development server locally:
|
||
|
|
|
||
|
|
1. **Install dependencies**:
|
||
|
|
```bash
|
||
|
|
npm install
|
||
|
|
```
|
||
|
|
|
||
|
|
2. **Start the local server**:
|
||
|
|
```bash
|
||
|
|
cd ui/uart_terminal
|
||
|
|
# If not create the virtual environment
|
||
|
|
python3 -m venv .venv
|
||
|
|
# Activate it
|
||
|
|
source .venv/bin/activate
|
||
|
|
# start server
|
||
|
|
npm run dev
|
||
|
|
```
|
||
|
|
|
||
|
|
3. **Open the browser**:
|
||
|
|
Navigate to the URL printed in the terminal (usually `http://localhost:3000`).
|
||
|
|
|
||
|
|
## Features & Usage
|
||
|
|
|
||
|
|
- **Connect / Disconnect**: Click the circular green play icon in the top left to request a COM/USB serial port and open connection. The button changes to a red stop icon when connected.
|
||
|
|
- **Save Logs**: Click the blue download button next to the connection status to export the accumulated console output log as a `.txt` file.
|
||
|
|
- **Scroll Modes**: Switch between "Auto-scroll" and "No scroll" to control terminal navigation.
|
||
|
|
- **Display Formats**:
|
||
|
|
- `Auto`: Prints incoming data as decoded UTF-8 text string (default).
|
||
|
|
- `Hex`: Displays incoming bytes as space-separated hexadecimal numbers (e.g., `55 AA 01 02`).
|
||
|
|
- **Data Transmission**:
|
||
|
|
- Enter text in the send input at the bottom and click the Send button or press `Enter` to transmit.
|
||
|
|
- Switch the send format select dropdown between `ASCII` and `Hex` to format data packages.
|
||
|
|
- **Hex Parsing Rules**: When in Hex mode, you can input hex characters with or without spaces (e.g., `55 AA FF` or `55aaff`). The string must contain an even number of characters and valid hexadecimal characters only.
|
||
|
|
|
||
|
|
### Keyboard Shortcuts
|
||
|
|
|
||
|
|
- **Send Data**: Press `Enter` (or `Ctrl+Enter`) inside the input bar to send.
|
||
|
|
- **Insert Tabs**: Press `Ctrl+Tab` in the input bar to insert a literal tab character (`\t`) instead of losing input focus.
|