mirror of https://github.com/jetkvm/kvm.git
Merge c2219d1d15 into 63aa940f42
This commit is contained in:
Sevi
GitHub
commit
05a3613fc6
236
jsonrpc.go
236
jsonrpc.go
|
|
@ -772,6 +772,8 @@ func rpcSetActiveExtension(extensionId string) error {
|
||||||
_ = unmountATXControl()
|
_ = unmountATXControl()
|
||||||
case "dc-power":
|
case "dc-power":
|
||||||
_ = unmountDCControl()
|
_ = unmountDCControl()
|
||||||
|
case "serial-buttons":
|
||||||
|
_ = unmountSerialButtons()
|
||||||
}
|
}
|
||||||
config.ActiveExtension = extensionId
|
config.ActiveExtension = extensionId
|
||||||
if err := SaveConfig(); err != nil {
|
if err := SaveConfig(); err != nil {
|
||||||
|
|
@ -782,6 +784,8 @@ func rpcSetActiveExtension(extensionId string) error {
|
||||||
_ = mountATXControl()
|
_ = mountATXControl()
|
||||||
case "dc-power":
|
case "dc-power":
|
||||||
_ = mountDCControl()
|
_ = mountDCControl()
|
||||||
|
case "serial-buttons":
|
||||||
|
_ = mountSerialButtons()
|
||||||
}
|
}
|
||||||
return nil
|
return nil
|
||||||
}
|
}
|
||||||
|
|
@ -816,6 +820,15 @@ func rpcGetATXState() (ATXState, error) {
|
||||||
return state, nil
|
return state, nil
|
||||||
}
|
}
|
||||||
|
|
||||||
|
func rpcSendCustomCommand(command string, terminator string) error {
|
||||||
|
logger.Debug().Str("Command", command).Msg("JSONRPC: Sending custom serial command")
|
||||||
|
err := sendCustomCommand(command, terminator)
|
||||||
|
if err != nil {
|
||||||
|
return fmt.Errorf("failed to send custom command in jsonrpc: %w", err)
|
||||||
|
}
|
||||||
|
return nil
|
||||||
|
}
|
||||||
|
|
||||||
type SerialSettings struct {
|
type SerialSettings struct {
|
||||||
BaudRate string `json:"baudRate"`
|
BaudRate string `json:"baudRate"`
|
||||||
DataBits string `json:"dataBits"`
|
DataBits string `json:"dataBits"`
|
||||||
|
|
@ -907,6 +920,54 @@ func rpcSetSerialSettings(settings SerialSettings) error {
|
||||||
return nil
|
return nil
|
||||||
}
|
}
|
||||||
|
|
||||||
|
func rpcGetSerialButtonConfig() (CustomButtonSettings, error) {
|
||||||
|
return getSerialSettings()
|
||||||
|
}
|
||||||
|
|
||||||
|
func rpcSetSerialButtonConfig(config CustomButtonSettings) error {
|
||||||
|
return setSerialSettings(config)
|
||||||
|
}
|
||||||
|
|
||||||
|
const SerialCommandHistoryPath = "/userdata/serialCommandHistory.json"
|
||||||
|
|
||||||
|
func rpcGetSerialCommandHistory() ([]string, error) {
|
||||||
|
items := []string{}
|
||||||
|
|
||||||
|
file, err := os.Open(SerialCommandHistoryPath)
|
||||||
|
if err != nil {
|
||||||
|
logger.Debug().Msg("SerialCommandHistory file doesn't exist, using default")
|
||||||
|
return items, nil
|
||||||
|
}
|
||||||
|
defer file.Close()
|
||||||
|
|
||||||
|
// load and merge the default config with the user config
|
||||||
|
var loadedItems []string
|
||||||
|
if err := json.NewDecoder(file).Decode(&loadedItems); err != nil {
|
||||||
|
logger.Warn().Err(err).Msg("SerialCommandHistory file JSON parsing failed")
|
||||||
|
return items, nil
|
||||||
|
}
|
||||||
|
|
||||||
|
return loadedItems, nil
|
||||||
|
}
|
||||||
|
|
||||||
|
func rpcSetSerialCommandHistory(commandHistory []string) error {
|
||||||
|
logger.Trace().Str("path", SerialCommandHistoryPath).Msg("Saving serial command history")
|
||||||
|
|
||||||
|
file, err := os.Create(SerialCommandHistoryPath)
|
||||||
|
if err != nil {
|
||||||
|
return fmt.Errorf("failed to create SerialCommandHistory file: %w", err)
|
||||||
|
}
|
||||||
|
defer file.Close()
|
||||||
|
|
||||||
|
encoder := json.NewEncoder(file)
|
||||||
|
encoder.SetIndent("", " ")
|
||||||
|
if err := encoder.Encode(commandHistory); err != nil {
|
||||||
|
return fmt.Errorf("failed to encode SerialCommandHistory: %w", err)
|
||||||
|
}
|
||||||
|
|
||||||
|
return nil
|
||||||
|
}
|
||||||
|
|
||||||
func rpcGetUsbDevices() (usbgadget.Devices, error) {
|
func rpcGetUsbDevices() (usbgadget.Devices, error) {
|
||||||
return *config.UsbDevices, nil
|
return *config.UsbDevices, nil
|
||||||
}
|
}
|
||||||
|
|
@ -1182,89 +1243,94 @@ func rpcDoExecuteKeyboardMacro(ctx context.Context, macro []hidrpc.KeyboardMacro
|
||||||
}
|
}
|
||||||
|
|
||||||
var rpcHandlers = map[string]RPCHandler{
|
var rpcHandlers = map[string]RPCHandler{
|
||||||
"ping": {Func: rpcPing},
|
"ping": {Func: rpcPing},
|
||||||
"reboot": {Func: rpcReboot, Params: []string{"force"}},
|
"reboot": {Func: rpcReboot, Params: []string{"force"}},
|
||||||
"getDeviceID": {Func: rpcGetDeviceID},
|
"getDeviceID": {Func: rpcGetDeviceID},
|
||||||
"deregisterDevice": {Func: rpcDeregisterDevice},
|
"deregisterDevice": {Func: rpcDeregisterDevice},
|
||||||
"getCloudState": {Func: rpcGetCloudState},
|
"getCloudState": {Func: rpcGetCloudState},
|
||||||
"getNetworkState": {Func: rpcGetNetworkState},
|
"getNetworkState": {Func: rpcGetNetworkState},
|
||||||
"getNetworkSettings": {Func: rpcGetNetworkSettings},
|
"getNetworkSettings": {Func: rpcGetNetworkSettings},
|
||||||
"setNetworkSettings": {Func: rpcSetNetworkSettings, Params: []string{"settings"}},
|
"setNetworkSettings": {Func: rpcSetNetworkSettings, Params: []string{"settings"}},
|
||||||
"renewDHCPLease": {Func: rpcRenewDHCPLease},
|
"renewDHCPLease": {Func: rpcRenewDHCPLease},
|
||||||
"getKeyboardLedState": {Func: rpcGetKeyboardLedState},
|
"getKeyboardLedState": {Func: rpcGetKeyboardLedState},
|
||||||
"getKeyDownState": {Func: rpcGetKeysDownState},
|
"getKeyDownState": {Func: rpcGetKeysDownState},
|
||||||
"keyboardReport": {Func: rpcKeyboardReport, Params: []string{"modifier", "keys"}},
|
"keyboardReport": {Func: rpcKeyboardReport, Params: []string{"modifier", "keys"}},
|
||||||
"keypressReport": {Func: rpcKeypressReport, Params: []string{"key", "press"}},
|
"keypressReport": {Func: rpcKeypressReport, Params: []string{"key", "press"}},
|
||||||
"absMouseReport": {Func: rpcAbsMouseReport, Params: []string{"x", "y", "buttons"}},
|
"absMouseReport": {Func: rpcAbsMouseReport, Params: []string{"x", "y", "buttons"}},
|
||||||
"relMouseReport": {Func: rpcRelMouseReport, Params: []string{"dx", "dy", "buttons"}},
|
"relMouseReport": {Func: rpcRelMouseReport, Params: []string{"dx", "dy", "buttons"}},
|
||||||
"wheelReport": {Func: rpcWheelReport, Params: []string{"wheelY"}},
|
"wheelReport": {Func: rpcWheelReport, Params: []string{"wheelY"}},
|
||||||
"getVideoState": {Func: rpcGetVideoState},
|
"getVideoState": {Func: rpcGetVideoState},
|
||||||
"getUSBState": {Func: rpcGetUSBState},
|
"getUSBState": {Func: rpcGetUSBState},
|
||||||
"unmountImage": {Func: rpcUnmountImage},
|
"unmountImage": {Func: rpcUnmountImage},
|
||||||
"rpcMountBuiltInImage": {Func: rpcMountBuiltInImage, Params: []string{"filename"}},
|
"rpcMountBuiltInImage": {Func: rpcMountBuiltInImage, Params: []string{"filename"}},
|
||||||
"setJigglerState": {Func: rpcSetJigglerState, Params: []string{"enabled"}},
|
"setJigglerState": {Func: rpcSetJigglerState, Params: []string{"enabled"}},
|
||||||
"getJigglerState": {Func: rpcGetJigglerState},
|
"getJigglerState": {Func: rpcGetJigglerState},
|
||||||
"setJigglerConfig": {Func: rpcSetJigglerConfig, Params: []string{"jigglerConfig"}},
|
"setJigglerConfig": {Func: rpcSetJigglerConfig, Params: []string{"jigglerConfig"}},
|
||||||
"getJigglerConfig": {Func: rpcGetJigglerConfig},
|
"getJigglerConfig": {Func: rpcGetJigglerConfig},
|
||||||
"getTimezones": {Func: rpcGetTimezones},
|
"getTimezones": {Func: rpcGetTimezones},
|
||||||
"sendWOLMagicPacket": {Func: rpcSendWOLMagicPacket, Params: []string{"macAddress"}},
|
"sendWOLMagicPacket": {Func: rpcSendWOLMagicPacket, Params: []string{"macAddress"}},
|
||||||
"getStreamQualityFactor": {Func: rpcGetStreamQualityFactor},
|
"getStreamQualityFactor": {Func: rpcGetStreamQualityFactor},
|
||||||
"setStreamQualityFactor": {Func: rpcSetStreamQualityFactor, Params: []string{"factor"}},
|
"setStreamQualityFactor": {Func: rpcSetStreamQualityFactor, Params: []string{"factor"}},
|
||||||
"getAutoUpdateState": {Func: rpcGetAutoUpdateState},
|
"getAutoUpdateState": {Func: rpcGetAutoUpdateState},
|
||||||
"setAutoUpdateState": {Func: rpcSetAutoUpdateState, Params: []string{"enabled"}},
|
"setAutoUpdateState": {Func: rpcSetAutoUpdateState, Params: []string{"enabled"}},
|
||||||
"getEDID": {Func: rpcGetEDID},
|
"getEDID": {Func: rpcGetEDID},
|
||||||
"setEDID": {Func: rpcSetEDID, Params: []string{"edid"}},
|
"setEDID": {Func: rpcSetEDID, Params: []string{"edid"}},
|
||||||
"getVideoLogStatus": {Func: rpcGetVideoLogStatus},
|
"getVideoLogStatus": {Func: rpcGetVideoLogStatus},
|
||||||
"getDevChannelState": {Func: rpcGetDevChannelState},
|
"getDevChannelState": {Func: rpcGetDevChannelState},
|
||||||
"setDevChannelState": {Func: rpcSetDevChannelState, Params: []string{"enabled"}},
|
"setDevChannelState": {Func: rpcSetDevChannelState, Params: []string{"enabled"}},
|
||||||
"getLocalVersion": {Func: rpcGetLocalVersion},
|
"getLocalVersion": {Func: rpcGetLocalVersion},
|
||||||
"getUpdateStatus": {Func: rpcGetUpdateStatus},
|
"getUpdateStatus": {Func: rpcGetUpdateStatus},
|
||||||
"tryUpdate": {Func: rpcTryUpdate},
|
"tryUpdate": {Func: rpcTryUpdate},
|
||||||
"getDevModeState": {Func: rpcGetDevModeState},
|
"getDevModeState": {Func: rpcGetDevModeState},
|
||||||
"setDevModeState": {Func: rpcSetDevModeState, Params: []string{"enabled"}},
|
"setDevModeState": {Func: rpcSetDevModeState, Params: []string{"enabled"}},
|
||||||
"getSSHKeyState": {Func: rpcGetSSHKeyState},
|
"getSSHKeyState": {Func: rpcGetSSHKeyState},
|
||||||
"setSSHKeyState": {Func: rpcSetSSHKeyState, Params: []string{"sshKey"}},
|
"setSSHKeyState": {Func: rpcSetSSHKeyState, Params: []string{"sshKey"}},
|
||||||
"getTLSState": {Func: rpcGetTLSState},
|
"getTLSState": {Func: rpcGetTLSState},
|
||||||
"setTLSState": {Func: rpcSetTLSState, Params: []string{"state"}},
|
"setTLSState": {Func: rpcSetTLSState, Params: []string{"state"}},
|
||||||
"setMassStorageMode": {Func: rpcSetMassStorageMode, Params: []string{"mode"}},
|
"setMassStorageMode": {Func: rpcSetMassStorageMode, Params: []string{"mode"}},
|
||||||
"getMassStorageMode": {Func: rpcGetMassStorageMode},
|
"getMassStorageMode": {Func: rpcGetMassStorageMode},
|
||||||
"isUpdatePending": {Func: rpcIsUpdatePending},
|
"isUpdatePending": {Func: rpcIsUpdatePending},
|
||||||
"getUsbEmulationState": {Func: rpcGetUsbEmulationState},
|
"getUsbEmulationState": {Func: rpcGetUsbEmulationState},
|
||||||
"setUsbEmulationState": {Func: rpcSetUsbEmulationState, Params: []string{"enabled"}},
|
"setUsbEmulationState": {Func: rpcSetUsbEmulationState, Params: []string{"enabled"}},
|
||||||
"getUsbConfig": {Func: rpcGetUsbConfig},
|
"getUsbConfig": {Func: rpcGetUsbConfig},
|
||||||
"setUsbConfig": {Func: rpcSetUsbConfig, Params: []string{"usbConfig"}},
|
"setUsbConfig": {Func: rpcSetUsbConfig, Params: []string{"usbConfig"}},
|
||||||
"checkMountUrl": {Func: rpcCheckMountUrl, Params: []string{"url"}},
|
"checkMountUrl": {Func: rpcCheckMountUrl, Params: []string{"url"}},
|
||||||
"getVirtualMediaState": {Func: rpcGetVirtualMediaState},
|
"getVirtualMediaState": {Func: rpcGetVirtualMediaState},
|
||||||
"getStorageSpace": {Func: rpcGetStorageSpace},
|
"getStorageSpace": {Func: rpcGetStorageSpace},
|
||||||
"mountWithHTTP": {Func: rpcMountWithHTTP, Params: []string{"url", "mode"}},
|
"mountWithHTTP": {Func: rpcMountWithHTTP, Params: []string{"url", "mode"}},
|
||||||
"mountWithStorage": {Func: rpcMountWithStorage, Params: []string{"filename", "mode"}},
|
"mountWithStorage": {Func: rpcMountWithStorage, Params: []string{"filename", "mode"}},
|
||||||
"listStorageFiles": {Func: rpcListStorageFiles},
|
"listStorageFiles": {Func: rpcListStorageFiles},
|
||||||
"deleteStorageFile": {Func: rpcDeleteStorageFile, Params: []string{"filename"}},
|
"deleteStorageFile": {Func: rpcDeleteStorageFile, Params: []string{"filename"}},
|
||||||
"startStorageFileUpload": {Func: rpcStartStorageFileUpload, Params: []string{"filename", "size"}},
|
"startStorageFileUpload": {Func: rpcStartStorageFileUpload, Params: []string{"filename", "size"}},
|
||||||
"getWakeOnLanDevices": {Func: rpcGetWakeOnLanDevices},
|
"getWakeOnLanDevices": {Func: rpcGetWakeOnLanDevices},
|
||||||
"setWakeOnLanDevices": {Func: rpcSetWakeOnLanDevices, Params: []string{"params"}},
|
"setWakeOnLanDevices": {Func: rpcSetWakeOnLanDevices, Params: []string{"params"}},
|
||||||
"resetConfig": {Func: rpcResetConfig},
|
"resetConfig": {Func: rpcResetConfig},
|
||||||
"setDisplayRotation": {Func: rpcSetDisplayRotation, Params: []string{"params"}},
|
"setDisplayRotation": {Func: rpcSetDisplayRotation, Params: []string{"params"}},
|
||||||
"getDisplayRotation": {Func: rpcGetDisplayRotation},
|
"getDisplayRotation": {Func: rpcGetDisplayRotation},
|
||||||
"setBacklightSettings": {Func: rpcSetBacklightSettings, Params: []string{"params"}},
|
"setBacklightSettings": {Func: rpcSetBacklightSettings, Params: []string{"params"}},
|
||||||
"getBacklightSettings": {Func: rpcGetBacklightSettings},
|
"getBacklightSettings": {Func: rpcGetBacklightSettings},
|
||||||
"getDCPowerState": {Func: rpcGetDCPowerState},
|
"getDCPowerState": {Func: rpcGetDCPowerState},
|
||||||
"setDCPowerState": {Func: rpcSetDCPowerState, Params: []string{"enabled"}},
|
"setDCPowerState": {Func: rpcSetDCPowerState, Params: []string{"enabled"}},
|
||||||
"setDCRestoreState": {Func: rpcSetDCRestoreState, Params: []string{"state"}},
|
"setDCRestoreState": {Func: rpcSetDCRestoreState, Params: []string{"state"}},
|
||||||
"getActiveExtension": {Func: rpcGetActiveExtension},
|
"getActiveExtension": {Func: rpcGetActiveExtension},
|
||||||
"setActiveExtension": {Func: rpcSetActiveExtension, Params: []string{"extensionId"}},
|
"setActiveExtension": {Func: rpcSetActiveExtension, Params: []string{"extensionId"}},
|
||||||
"getATXState": {Func: rpcGetATXState},
|
"getATXState": {Func: rpcGetATXState},
|
||||||
"setATXPowerAction": {Func: rpcSetATXPowerAction, Params: []string{"action"}},
|
"setATXPowerAction": {Func: rpcSetATXPowerAction, Params: []string{"action"}},
|
||||||
"getSerialSettings": {Func: rpcGetSerialSettings},
|
"sendCustomCommand": {Func: rpcSendCustomCommand, Params: []string{"command", "terminator"}},
|
||||||
"setSerialSettings": {Func: rpcSetSerialSettings, Params: []string{"settings"}},
|
"getSerialSettings": {Func: rpcGetSerialSettings},
|
||||||
"getUsbDevices": {Func: rpcGetUsbDevices},
|
"setSerialSettings": {Func: rpcSetSerialSettings, Params: []string{"settings"}},
|
||||||
"setUsbDevices": {Func: rpcSetUsbDevices, Params: []string{"devices"}},
|
"getSerialButtonConfig": {Func: rpcGetSerialButtonConfig},
|
||||||
"setUsbDeviceState": {Func: rpcSetUsbDeviceState, Params: []string{"device", "enabled"}},
|
"setSerialButtonConfig": {Func: rpcSetSerialButtonConfig, Params: []string{"config"}},
|
||||||
"setCloudUrl": {Func: rpcSetCloudUrl, Params: []string{"apiUrl", "appUrl"}},
|
"getSerialCommandHistory": {Func: rpcGetSerialCommandHistory},
|
||||||
"getKeyboardLayout": {Func: rpcGetKeyboardLayout},
|
"setSerialCommandHistory": {Func: rpcSetSerialCommandHistory, Params: []string{"commandHistory"}},
|
||||||
"setKeyboardLayout": {Func: rpcSetKeyboardLayout, Params: []string{"layout"}},
|
"getUsbDevices": {Func: rpcGetUsbDevices},
|
||||||
"getKeyboardMacros": {Func: getKeyboardMacros},
|
"setUsbDevices": {Func: rpcSetUsbDevices, Params: []string{"devices"}},
|
||||||
"setKeyboardMacros": {Func: setKeyboardMacros, Params: []string{"params"}},
|
"setUsbDeviceState": {Func: rpcSetUsbDeviceState, Params: []string{"device", "enabled"}},
|
||||||
"getLocalLoopbackOnly": {Func: rpcGetLocalLoopbackOnly},
|
"setCloudUrl": {Func: rpcSetCloudUrl, Params: []string{"apiUrl", "appUrl"}},
|
||||||
"setLocalLoopbackOnly": {Func: rpcSetLocalLoopbackOnly, Params: []string{"enabled"}},
|
"getKeyboardLayout": {Func: rpcGetKeyboardLayout},
|
||||||
|
"setKeyboardLayout": {Func: rpcSetKeyboardLayout, Params: []string{"layout"}},
|
||||||
|
"getKeyboardMacros": {Func: getKeyboardMacros},
|
||||||
|
"setKeyboardMacros": {Func: setKeyboardMacros, Params: []string{"params"}},
|
||||||
|
"getLocalLoopbackOnly": {Func: rpcGetLocalLoopbackOnly},
|
||||||
|
"setLocalLoopbackOnly": {Func: rpcSetLocalLoopbackOnly, Params: []string{"enabled"}},
|
||||||
}
|
}
|
||||||
|
|
|
||||||
230
serial.go
230
serial.go
|
|
@ -2,7 +2,11 @@ package kvm
|
||||||
|
|
||||||
import (
|
import (
|
||||||
"bufio"
|
"bufio"
|
||||||
|
"encoding/base64"
|
||||||
|
"encoding/json"
|
||||||
|
"fmt"
|
||||||
"io"
|
"io"
|
||||||
|
"os"
|
||||||
"strconv"
|
"strconv"
|
||||||
"strings"
|
"strings"
|
||||||
"time"
|
"time"
|
||||||
|
|
@ -251,6 +255,89 @@ func setDCRestoreState(state int) error {
|
||||||
return nil
|
return nil
|
||||||
}
|
}
|
||||||
|
|
||||||
|
func mountSerialButtons() error {
|
||||||
|
_ = port.SetMode(defaultMode)
|
||||||
|
startSerialButtonsRxLoop(currentSession)
|
||||||
|
return nil
|
||||||
|
}
|
||||||
|
|
||||||
|
func unmountSerialButtons() error {
|
||||||
|
stopSerialButtonsRxLoop()
|
||||||
|
_ = reopenSerialPort()
|
||||||
|
return nil
|
||||||
|
}
|
||||||
|
|
||||||
|
// ---- Serial Buttons RX fan-out (JSON-RPC events) ----
|
||||||
|
var serialButtonsRXStopCh chan struct{}
|
||||||
|
|
||||||
|
func startSerialButtonsRxLoop(session *Session) {
|
||||||
|
scopedLogger := serialLogger.With().Str("service", "custom_buttons_rx").Logger()
|
||||||
|
scopedLogger.Debug().Msg("Attempting to start RX reader.")
|
||||||
|
// Stop previous loop if running
|
||||||
|
if serialButtonsRXStopCh != nil {
|
||||||
|
stopSerialButtonsRxLoop()
|
||||||
|
}
|
||||||
|
serialButtonsRXStopCh = make(chan struct{})
|
||||||
|
|
||||||
|
go func() {
|
||||||
|
buf := make([]byte, 4096)
|
||||||
|
scopedLogger.Debug().Msg("Starting loop")
|
||||||
|
|
||||||
|
for {
|
||||||
|
select {
|
||||||
|
case <-serialButtonsRXStopCh:
|
||||||
|
return
|
||||||
|
default:
|
||||||
|
if currentSession == nil {
|
||||||
|
time.Sleep(500 * time.Millisecond)
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
n, err := port.Read(buf)
|
||||||
|
if err != nil {
|
||||||
|
if err != io.EOF {
|
||||||
|
scopedLogger.Debug().Err(err).Msg("serial RX read error")
|
||||||
|
}
|
||||||
|
time.Sleep(50 * time.Millisecond)
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
if n == 0 {
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
// Safe for any bytes: wrap in Base64
|
||||||
|
b64 := base64.StdEncoding.EncodeToString(buf[:n])
|
||||||
|
writeJSONRPCEvent("serial.rx", map[string]any{
|
||||||
|
"base64": b64,
|
||||||
|
}, currentSession)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}()
|
||||||
|
}
|
||||||
|
|
||||||
|
func stopSerialButtonsRxLoop() {
|
||||||
|
scopedLogger := serialLogger.With().Str("service", "custom_buttons_rx").Logger()
|
||||||
|
scopedLogger.Debug().Msg("Stopping RX reader.")
|
||||||
|
if serialButtonsRXStopCh != nil {
|
||||||
|
close(serialButtonsRXStopCh)
|
||||||
|
serialButtonsRXStopCh = nil
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
func sendCustomCommand(command string, terminator string) error {
|
||||||
|
scopedLogger := serialLogger.With().Str("service", "custom_buttons_tx").Logger()
|
||||||
|
scopedLogger.Info().Str("Command", command).Msg("Sending custom command.")
|
||||||
|
_, err := port.Write([]byte(terminator))
|
||||||
|
if err != nil {
|
||||||
|
scopedLogger.Warn().Err(err).Msg("Failed to send terminator")
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
_, err = port.Write([]byte(command))
|
||||||
|
if err != nil {
|
||||||
|
scopedLogger.Warn().Err(err).Str("Command", command).Msg("Failed to send serial command")
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
return nil
|
||||||
|
}
|
||||||
|
|
||||||
var defaultMode = &serial.Mode{
|
var defaultMode = &serial.Mode{
|
||||||
BaudRate: 115200,
|
BaudRate: 115200,
|
||||||
DataBits: 8,
|
DataBits: 8,
|
||||||
|
|
@ -258,6 +345,149 @@ var defaultMode = &serial.Mode{
|
||||||
StopBits: serial.OneStopBit,
|
StopBits: serial.OneStopBit,
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const serialSettingsPath = "/userdata/serialSettings.json"
|
||||||
|
|
||||||
|
type Terminator struct {
|
||||||
|
Label string `json:"label"` // Terminator label
|
||||||
|
Value string `json:"value"` // Terminator value
|
||||||
|
}
|
||||||
|
|
||||||
|
type QuickButton struct {
|
||||||
|
Id string `json:"id"` // Unique identifier
|
||||||
|
Label string `json:"label"` // Button label
|
||||||
|
Command string `json:"command"` // Command to send, raw command to send (without auto-terminator)
|
||||||
|
Terminator Terminator `json:"terminator"` // Terminator to use: None/CR/LF/CRLF/LFCR
|
||||||
|
Sort int `json:"sort"` // Sort order
|
||||||
|
}
|
||||||
|
|
||||||
|
// Mode describes a serial port configuration.
|
||||||
|
type CustomButtonSettings struct {
|
||||||
|
BaudRate string `json:"baudRate"` // The serial port bitrate (aka Baudrate)
|
||||||
|
DataBits string `json:"dataBits"` // Size of the character (must be 5, 6, 7 or 8)
|
||||||
|
Parity string `json:"parity"` // Parity (see Parity type for more info)
|
||||||
|
StopBits string `json:"stopBits"` // Stop bits (see StopBits type for more info)
|
||||||
|
Terminator Terminator `json:"terminator"` // Terminator to send after each command
|
||||||
|
LineMode bool `json:"lineMode"` // Whether to send each line when Enter is pressed, or each character immediately
|
||||||
|
HideSerialSettings bool `json:"hideSerialSettings"` // Whether to hide the serial settings in the UI
|
||||||
|
EnableEcho bool `json:"enableEcho"` // Whether to echo received characters back to the sender
|
||||||
|
Buttons []QuickButton `json:"buttons"` // Custom quick buttons
|
||||||
|
}
|
||||||
|
|
||||||
|
func getSerialSettings() (CustomButtonSettings, error) {
|
||||||
|
config := CustomButtonSettings{
|
||||||
|
BaudRate: strconv.Itoa(defaultMode.BaudRate),
|
||||||
|
DataBits: strconv.Itoa(defaultMode.DataBits),
|
||||||
|
Parity: "none",
|
||||||
|
StopBits: "1",
|
||||||
|
Terminator: Terminator{Label: "CR (\\r)", Value: "\r"},
|
||||||
|
LineMode: true,
|
||||||
|
HideSerialSettings: false,
|
||||||
|
EnableEcho: false,
|
||||||
|
Buttons: []QuickButton{},
|
||||||
|
}
|
||||||
|
|
||||||
|
switch defaultMode.StopBits {
|
||||||
|
case serial.OneStopBit:
|
||||||
|
config.StopBits = "1"
|
||||||
|
case serial.OnePointFiveStopBits:
|
||||||
|
config.StopBits = "1.5"
|
||||||
|
case serial.TwoStopBits:
|
||||||
|
config.StopBits = "2"
|
||||||
|
}
|
||||||
|
|
||||||
|
switch defaultMode.Parity {
|
||||||
|
case serial.NoParity:
|
||||||
|
config.Parity = "none"
|
||||||
|
case serial.OddParity:
|
||||||
|
config.Parity = "odd"
|
||||||
|
case serial.EvenParity:
|
||||||
|
config.Parity = "even"
|
||||||
|
case serial.MarkParity:
|
||||||
|
config.Parity = "mark"
|
||||||
|
case serial.SpaceParity:
|
||||||
|
config.Parity = "space"
|
||||||
|
}
|
||||||
|
|
||||||
|
file, err := os.Open(serialSettingsPath)
|
||||||
|
if err != nil {
|
||||||
|
logger.Debug().Msg("SerialButtons config file doesn't exist, using default")
|
||||||
|
return config, err
|
||||||
|
}
|
||||||
|
defer file.Close()
|
||||||
|
|
||||||
|
// load and merge the default config with the user config
|
||||||
|
var loadedConfig CustomButtonSettings
|
||||||
|
if err := json.NewDecoder(file).Decode(&loadedConfig); err != nil {
|
||||||
|
logger.Warn().Err(err).Msg("SerialButtons config file JSON parsing failed")
|
||||||
|
return config, nil
|
||||||
|
}
|
||||||
|
|
||||||
|
return loadedConfig, nil
|
||||||
|
}
|
||||||
|
|
||||||
|
func setSerialSettings(newSettings CustomButtonSettings) error {
|
||||||
|
logger.Trace().Str("path", serialSettingsPath).Msg("Saving config")
|
||||||
|
|
||||||
|
file, err := os.Create(serialSettingsPath)
|
||||||
|
if err != nil {
|
||||||
|
return fmt.Errorf("failed to create SerialButtons config file: %w", err)
|
||||||
|
}
|
||||||
|
defer file.Close()
|
||||||
|
|
||||||
|
encoder := json.NewEncoder(file)
|
||||||
|
encoder.SetIndent("", " ")
|
||||||
|
if err := encoder.Encode(newSettings); err != nil {
|
||||||
|
return fmt.Errorf("failed to encode SerialButtons config: %w", err)
|
||||||
|
}
|
||||||
|
|
||||||
|
baudRate, err := strconv.Atoi(newSettings.BaudRate)
|
||||||
|
if err != nil {
|
||||||
|
return fmt.Errorf("invalid baud rate: %v", err)
|
||||||
|
}
|
||||||
|
dataBits, err := strconv.Atoi(newSettings.DataBits)
|
||||||
|
if err != nil {
|
||||||
|
return fmt.Errorf("invalid data bits: %v", err)
|
||||||
|
}
|
||||||
|
|
||||||
|
var stopBits serial.StopBits
|
||||||
|
switch newSettings.StopBits {
|
||||||
|
case "1":
|
||||||
|
stopBits = serial.OneStopBit
|
||||||
|
case "1.5":
|
||||||
|
stopBits = serial.OnePointFiveStopBits
|
||||||
|
case "2":
|
||||||
|
stopBits = serial.TwoStopBits
|
||||||
|
default:
|
||||||
|
return fmt.Errorf("invalid stop bits: %s", newSettings.StopBits)
|
||||||
|
}
|
||||||
|
|
||||||
|
var parity serial.Parity
|
||||||
|
switch newSettings.Parity {
|
||||||
|
case "none":
|
||||||
|
parity = serial.NoParity
|
||||||
|
case "odd":
|
||||||
|
parity = serial.OddParity
|
||||||
|
case "even":
|
||||||
|
parity = serial.EvenParity
|
||||||
|
case "mark":
|
||||||
|
parity = serial.MarkParity
|
||||||
|
case "space":
|
||||||
|
parity = serial.SpaceParity
|
||||||
|
default:
|
||||||
|
return fmt.Errorf("invalid parity: %s", newSettings.Parity)
|
||||||
|
}
|
||||||
|
serialPortMode = &serial.Mode{
|
||||||
|
BaudRate: baudRate,
|
||||||
|
DataBits: dataBits,
|
||||||
|
StopBits: stopBits,
|
||||||
|
Parity: parity,
|
||||||
|
}
|
||||||
|
|
||||||
|
_ = port.SetMode(serialPortMode)
|
||||||
|
|
||||||
|
return nil
|
||||||
|
}
|
||||||
|
|
||||||
func initSerialPort() {
|
func initSerialPort() {
|
||||||
_ = reopenSerialPort()
|
_ = reopenSerialPort()
|
||||||
switch config.ActiveExtension {
|
switch config.ActiveExtension {
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,290 @@
|
||||||
|
import React, { useCallback, useEffect, useMemo, useState } from "react";
|
||||||
|
import { createPortal } from "react-dom";
|
||||||
|
import clsx from "clsx";
|
||||||
|
|
||||||
|
import InputField from "@/components/InputField"; // your existing input component
|
||||||
|
import { JsonRpcResponse, useJsonRpc } from "@/hooks/useJsonRpc";
|
||||||
|
import notifications from "@/notifications";
|
||||||
|
|
||||||
|
interface Hit { value: string; index: number }
|
||||||
|
|
||||||
|
// ---------- history hook ----------
|
||||||
|
function useCommandHistory(max = 300) {
|
||||||
|
const { send } = useJsonRpc();
|
||||||
|
const [items, setItems] = useState<string[]>([]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
send("getSerialCommandHistory", {}, (resp: JsonRpcResponse) => {
|
||||||
|
if ("error" in resp) {
|
||||||
|
notifications.error(
|
||||||
|
`Failed to get command history: ${resp.error.data || "Unknown error"}`,
|
||||||
|
);
|
||||||
|
} else if ("result" in resp) {
|
||||||
|
setItems(resp.result as string[]);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}, [send]);
|
||||||
|
|
||||||
|
const [pointer, setPointer] = useState<number>(-1); // -1 = fresh line
|
||||||
|
const [anchorPrefix, setAnchorPrefix] = useState<string | null>(null);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (items.length > 1) {
|
||||||
|
send("setSerialCommandHistory", { commandHistory: items }, (resp: JsonRpcResponse) => {
|
||||||
|
if ("error" in resp) {
|
||||||
|
notifications.error(`Failed to update command history: ${resp.error.data || "Unknown error"}`);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}, [items, send]);
|
||||||
|
|
||||||
|
const push = useCallback((cmd: string) => {
|
||||||
|
if (!cmd.trim()) return;
|
||||||
|
setItems((prev) => {
|
||||||
|
const next = prev[prev.length - 1] === cmd ? prev : [...prev, cmd];
|
||||||
|
return next.slice(-max);
|
||||||
|
});
|
||||||
|
setPointer(-1);
|
||||||
|
setAnchorPrefix(null);
|
||||||
|
}, [max]);
|
||||||
|
|
||||||
|
const resetTraversal = useCallback(() => {
|
||||||
|
setPointer(-1);
|
||||||
|
setAnchorPrefix(null);
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
const up = useCallback((draft: string) => {
|
||||||
|
const pref = anchorPrefix ?? draft;
|
||||||
|
if (anchorPrefix == null) setAnchorPrefix(pref);
|
||||||
|
let i = pointer < 0 ? items.length - 1 : pointer - 1;
|
||||||
|
for (; i >= 0; i--) {
|
||||||
|
if (items[i].startsWith(pref)) {
|
||||||
|
setPointer(i);
|
||||||
|
return items[i];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return draft;
|
||||||
|
}, [items, pointer, anchorPrefix]);
|
||||||
|
|
||||||
|
const down = useCallback((draft: string) => {
|
||||||
|
const pref = anchorPrefix ?? draft;
|
||||||
|
if (anchorPrefix == null) setAnchorPrefix(pref);
|
||||||
|
let i = pointer < 0 ? 0 : pointer + 1;
|
||||||
|
for (; i < items.length; i++) {
|
||||||
|
if (items[i].startsWith(pref)) {
|
||||||
|
setPointer(i);
|
||||||
|
return items[i];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
setPointer(-1);
|
||||||
|
return draft;
|
||||||
|
}, [items, pointer, anchorPrefix]);
|
||||||
|
|
||||||
|
const search = useCallback((query: string): Hit[] => {
|
||||||
|
if (!query) return [];
|
||||||
|
const q = query.toLowerCase();
|
||||||
|
return [...items]
|
||||||
|
.map((value, index) => ({ value, index }))
|
||||||
|
.filter((x) => x.value.toLowerCase().includes(q))
|
||||||
|
.reverse(); // newest first
|
||||||
|
}, [items]);
|
||||||
|
|
||||||
|
return { push, up, down, resetTraversal, search };
|
||||||
|
}
|
||||||
|
|
||||||
|
function Portal({ children }: { children: React.ReactNode }) {
|
||||||
|
const [mounted, setMounted] = useState(false);
|
||||||
|
useEffect(() => setMounted(true), []);
|
||||||
|
if (!mounted) return null;
|
||||||
|
return createPortal(children, document.body);
|
||||||
|
}
|
||||||
|
|
||||||
|
// ---------- reverse search popup ----------
|
||||||
|
function ReverseSearch({
|
||||||
|
open, results, sel, setSel, onPick, onClose,
|
||||||
|
}: {
|
||||||
|
open: boolean;
|
||||||
|
results: Hit[];
|
||||||
|
sel: number;
|
||||||
|
setSel: (i: number) => void;
|
||||||
|
onPick: (val: string) => void;
|
||||||
|
onClose: () => void;
|
||||||
|
}) {
|
||||||
|
const listRef = React.useRef<HTMLDivElement>(null);
|
||||||
|
|
||||||
|
// keep selected item in view when sel changes
|
||||||
|
useEffect(() => {
|
||||||
|
if (!listRef.current) return;
|
||||||
|
const el = listRef.current.querySelector<HTMLDivElement>(`[data-idx="${sel}"]`);
|
||||||
|
el?.scrollIntoView({ block: "nearest" });
|
||||||
|
}, [sel, results]);
|
||||||
|
|
||||||
|
if (!open) return null;
|
||||||
|
return (
|
||||||
|
<Portal>
|
||||||
|
<div
|
||||||
|
className="absolute bottom-12 left-0 right-0 ml-17 mr-8 mb-5 rounded-md border border-slate-600 bg-slate-900/95 p-2 shadow-lg"
|
||||||
|
role="listbox"
|
||||||
|
aria-activedescendant={`rev-opt-${sel}`}
|
||||||
|
>
|
||||||
|
<div ref={listRef} className="max-h-48 overflow-auto">
|
||||||
|
{results.length === 0 ? (
|
||||||
|
<div className="px-2 py-1 text-sm text-slate-400">No matches</div>
|
||||||
|
) : results.map((r, i) => (
|
||||||
|
<div
|
||||||
|
id={`rev-opt-${i}`}
|
||||||
|
data-idx={i}
|
||||||
|
key={`${r.index}-${i}`}
|
||||||
|
role="option"
|
||||||
|
aria-selected={i === sel}
|
||||||
|
className={clsx(
|
||||||
|
"px-2 py-1 font-mono text-sm cursor-pointer",
|
||||||
|
i === sel ? "bg-slate-700 text-white rounded" : "text-slate-200",
|
||||||
|
)}
|
||||||
|
onMouseEnter={() => setSel(i)}
|
||||||
|
onClick={() => onPick(r.value)}
|
||||||
|
>
|
||||||
|
{r.value}
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
<div className="mt-1 flex justify-between text-s text-slate-400">
|
||||||
|
<span>↑/↓ select • Enter accept • Esc close</span>
|
||||||
|
<button className="underline" onClick={onClose}>Close</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Portal>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
// ---------- main component ----------
|
||||||
|
interface CommandInputProps {
|
||||||
|
onSend: (line: string) => void; // called on Enter
|
||||||
|
storageKey?: string; // localStorage key for history
|
||||||
|
placeholder?: string; // input placeholder
|
||||||
|
className?: string; // container className
|
||||||
|
disabled?: boolean; // disable input (optional)
|
||||||
|
}
|
||||||
|
|
||||||
|
export function CommandInput({
|
||||||
|
onSend,
|
||||||
|
placeholder = "Type serial command… (Enter to send • ↑/↓ history • Ctrl+R search)",
|
||||||
|
className,
|
||||||
|
disabled,
|
||||||
|
}: CommandInputProps) {
|
||||||
|
const [cmd, setCmd] = useState("");
|
||||||
|
const [revOpen, setRevOpen] = useState(false);
|
||||||
|
const [revQuery, setRevQuery] = useState("");
|
||||||
|
const [sel, setSel] = useState(0);
|
||||||
|
const { push, up, down, resetTraversal, search } = useCommandHistory();
|
||||||
|
|
||||||
|
const results = useMemo(() => search(revQuery), [revQuery, search]);
|
||||||
|
|
||||||
|
useEffect(() => { setSel(0); }, [results]);
|
||||||
|
|
||||||
|
const cmdInputRef = React.useRef<HTMLInputElement>(null);
|
||||||
|
|
||||||
|
const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
|
||||||
|
const isMeta = e.ctrlKey || e.metaKey;
|
||||||
|
|
||||||
|
if (e.key === "Enter" && !e.shiftKey && !isMeta) {
|
||||||
|
e.preventDefault();
|
||||||
|
if (!cmd) return;
|
||||||
|
onSend(cmd);
|
||||||
|
push(cmd);
|
||||||
|
setCmd("");
|
||||||
|
resetTraversal();
|
||||||
|
setRevOpen(false);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (e.key === "ArrowUp") {
|
||||||
|
e.preventDefault();
|
||||||
|
setCmd((prev) => up(prev));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (e.key === "ArrowDown") {
|
||||||
|
e.preventDefault();
|
||||||
|
setCmd((prev) => down(prev));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (isMeta && e.key.toLowerCase() === "r") {
|
||||||
|
e.preventDefault();
|
||||||
|
setRevOpen(true);
|
||||||
|
setRevQuery(cmd);
|
||||||
|
setSel(0);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (e.key === "Escape" && revOpen) {
|
||||||
|
e.preventDefault();
|
||||||
|
setRevOpen(false);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className={clsx("relative", className)}>
|
||||||
|
<div className="flex items-center gap-2" style={{visibility: revOpen ? "hidden" : "unset"} }>
|
||||||
|
<span className="text-xs text-slate-400 select-none">CMD</span>
|
||||||
|
<InputField
|
||||||
|
ref={cmdInputRef}
|
||||||
|
size="MD"
|
||||||
|
disabled={disabled}
|
||||||
|
value={cmd}
|
||||||
|
onChange={(e) => { setCmd(e.target.value); resetTraversal(); }}
|
||||||
|
onKeyDown={handleKeyDown}
|
||||||
|
placeholder={placeholder}
|
||||||
|
className="font-mono"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Reverse search controls */}
|
||||||
|
{revOpen && (
|
||||||
|
<div className="mt-[-40px]">
|
||||||
|
<div className="flex items-center gap-2 bg-[#0f172a]">
|
||||||
|
<span className="text-s text-slate-400 select-none">Search</span>
|
||||||
|
<InputField
|
||||||
|
size="MD"
|
||||||
|
autoFocus
|
||||||
|
value={revQuery}
|
||||||
|
onChange={(e) => setRevQuery(e.target.value)}
|
||||||
|
onKeyDown={(e) => {
|
||||||
|
if (e.key === "ArrowDown") {
|
||||||
|
e.preventDefault();
|
||||||
|
setSel((i) => (i + 1) % Math.max(1, results.length));
|
||||||
|
} else if (e.key === "ArrowUp") {
|
||||||
|
e.preventDefault();
|
||||||
|
setSel((i) => (i - 1 + results.length) % Math.max(1, results.length));
|
||||||
|
} else if (e.key === "Enter") {
|
||||||
|
e.preventDefault();
|
||||||
|
const pick = results[sel]?.value ?? results[0]?.value;
|
||||||
|
if (pick) {
|
||||||
|
setCmd(pick);
|
||||||
|
setRevOpen(false);
|
||||||
|
requestAnimationFrame(() => cmdInputRef.current?.focus());
|
||||||
|
}
|
||||||
|
} else if (e.key === "Escape") {
|
||||||
|
e.preventDefault();
|
||||||
|
setRevOpen(false);
|
||||||
|
requestAnimationFrame(() => cmdInputRef.current?.focus());
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
placeholder="Type to filter history…"
|
||||||
|
className="font-mono"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<ReverseSearch
|
||||||
|
open={revOpen}
|
||||||
|
results={results}
|
||||||
|
sel={sel}
|
||||||
|
setSel={setSel}
|
||||||
|
onPick={(v) => { setCmd(v); setRevOpen(false); requestAnimationFrame(() => cmdInputRef.current?.focus()); }}
|
||||||
|
onClose={() => {setRevOpen(false); requestAnimationFrame(() => cmdInputRef.current?.focus());}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default CommandInput;
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
import "react-simple-keyboard/build/css/index.css";
|
import "react-simple-keyboard/build/css/index.css";
|
||||||
import { ChevronDownIcon } from "@heroicons/react/16/solid";
|
import { ChevronDownIcon } from "@heroicons/react/16/solid";
|
||||||
import { useEffect, useMemo } from "react";
|
import { useEffect, useMemo, useCallback } from "react";
|
||||||
import { useXTerm } from "react-xtermjs";
|
import { useXTerm } from "react-xtermjs";
|
||||||
import { FitAddon } from "@xterm/addon-fit";
|
import { FitAddon } from "@xterm/addon-fit";
|
||||||
import { WebLinksAddon } from "@xterm/addon-web-links";
|
import { WebLinksAddon } from "@xterm/addon-web-links";
|
||||||
|
|
@ -10,9 +10,11 @@ import { ClipboardAddon } from "@xterm/addon-clipboard";
|
||||||
|
|
||||||
import { cx } from "@/cva.config";
|
import { cx } from "@/cva.config";
|
||||||
import { AvailableTerminalTypes, useUiStore } from "@/hooks/stores";
|
import { AvailableTerminalTypes, useUiStore } from "@/hooks/stores";
|
||||||
|
import { CommandInput } from "@/components/CommandInput";
|
||||||
|
|
||||||
import { Button } from "./Button";
|
import { Button } from "./Button";
|
||||||
|
|
||||||
|
|
||||||
const isWebGl2Supported = !!document.createElement("canvas").getContext("webgl2");
|
const isWebGl2Supported = !!document.createElement("canvas").getContext("webgl2");
|
||||||
|
|
||||||
// Terminal theme configuration
|
// Terminal theme configuration
|
||||||
|
|
@ -65,13 +67,20 @@ function Terminal({
|
||||||
readonly dataChannel: RTCDataChannel;
|
readonly dataChannel: RTCDataChannel;
|
||||||
readonly type: AvailableTerminalTypes;
|
readonly type: AvailableTerminalTypes;
|
||||||
}) {
|
}) {
|
||||||
const { terminalType, setTerminalType, setDisableVideoFocusTrap } = useUiStore();
|
const { terminalLineMode, terminalType, setTerminalType, setDisableVideoFocusTrap } = useUiStore();
|
||||||
const { instance, ref } = useXTerm({ options: TERMINAL_CONFIG });
|
const { instance, ref } = useXTerm({ options: TERMINAL_CONFIG });
|
||||||
|
|
||||||
const isTerminalTypeEnabled = useMemo(() => {
|
const isTerminalTypeEnabled = useMemo(() => {
|
||||||
|
console.log("Terminal type:", terminalType, "Checking against:", type);
|
||||||
return terminalType == type;
|
return terminalType == type;
|
||||||
}, [terminalType, type]);
|
}, [terminalType, type]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!instance) return;
|
||||||
|
instance.options.disableStdin = !terminalLineMode;
|
||||||
|
instance.options.cursorStyle = terminalLineMode ? "bar" : "block";
|
||||||
|
}, [instance, terminalLineMode]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
setDisableVideoFocusTrap(isTerminalTypeEnabled);
|
setDisableVideoFocusTrap(isTerminalTypeEnabled);
|
||||||
|
|
@ -161,6 +170,11 @@ function Terminal({
|
||||||
};
|
};
|
||||||
}, [instance]);
|
}, [instance]);
|
||||||
|
|
||||||
|
const sendLine = useCallback((line: string) => {
|
||||||
|
// Just send; echo/normalization handled elsewhere as you planned
|
||||||
|
dataChannel.send(line + "\r\n"); // adjust CR/LF to taste
|
||||||
|
}, [dataChannel]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
onKeyDown={e => e.stopPropagation()}
|
onKeyDown={e => e.stopPropagation()}
|
||||||
|
|
@ -199,7 +213,14 @@ function Terminal({
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="h-[calc(100%-36px)] p-3">
|
<div className="h-[calc(100%-36px)] p-3">
|
||||||
<div ref={ref} style={{ height: "100%", width: "100%" }} />
|
<div key="serial" ref={ref} style={{height: (terminalType === "serial" && terminalLineMode) ? "90%" : "100%", width: "100%" }} />
|
||||||
|
{terminalType == "serial" && terminalLineMode && (
|
||||||
|
<CommandInput
|
||||||
|
placeholder="Type serial command… (Enter to send • ↑/↓ history • Ctrl+R search)"
|
||||||
|
onSend={sendLine}
|
||||||
|
className="mt-2"
|
||||||
|
/>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,500 @@
|
||||||
|
import { LuPlus, LuTrash2, LuPencil, LuSettings2, LuEye, LuEyeOff, LuSave, LuArrowBigUp, LuArrowBigDown, LuCircleX, LuTerminal } from "react-icons/lu";
|
||||||
|
import { useEffect, useMemo, useState } from "react";
|
||||||
|
|
||||||
|
import { Button } from "@components/Button";
|
||||||
|
import Card from "@components/Card";
|
||||||
|
import { SettingsPageHeader } from "@components/SettingsPageheader";
|
||||||
|
import { JsonRpcResponse, useJsonRpc } from "@/hooks/useJsonRpc";
|
||||||
|
import notifications from "@/notifications";
|
||||||
|
import { SelectMenuBasic } from "@components/SelectMenuBasic";
|
||||||
|
import { InputFieldWithLabel } from "@components/InputField";
|
||||||
|
import { useUiStore } from "@/hooks/stores";
|
||||||
|
|
||||||
|
import Checkbox from "../../components/Checkbox";
|
||||||
|
import { SettingsItem } from "../../routes/devices.$id.settings";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/** ============== Types ============== */
|
||||||
|
interface QuickButton {
|
||||||
|
id: string; // uuid-ish
|
||||||
|
label: string; // shown on the button
|
||||||
|
command: string; // raw command to send (without auto-terminator)
|
||||||
|
terminator: {label: string, value: string}; // None/CR/LF/CRLF/LFCR
|
||||||
|
sort: number; // for stable ordering
|
||||||
|
}
|
||||||
|
|
||||||
|
interface CustomButtonSettings {
|
||||||
|
baudRate: string;
|
||||||
|
dataBits: string;
|
||||||
|
stopBits: string;
|
||||||
|
parity: string;
|
||||||
|
terminator: {label: string, value: string}; // None/CR/LF/CRLF/LFCR
|
||||||
|
lineMode: boolean;
|
||||||
|
hideSerialSettings: boolean;
|
||||||
|
enableEcho: boolean; // future use
|
||||||
|
buttons: QuickButton[];
|
||||||
|
}
|
||||||
|
|
||||||
|
/** ============== Component ============== */
|
||||||
|
|
||||||
|
export function SerialButtons() {
|
||||||
|
const { setTerminalType, setTerminalLineMode } = useUiStore();
|
||||||
|
|
||||||
|
// This will receive all JSON-RPC notifications (method + no id)
|
||||||
|
const { send } = useJsonRpc((payload) => {
|
||||||
|
if (payload.method !== "serial.rx") return;
|
||||||
|
// if (paused) return;
|
||||||
|
|
||||||
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||||
|
const p = payload.params as any;
|
||||||
|
let chunk = "";
|
||||||
|
|
||||||
|
if (typeof p?.base64 === "string") {
|
||||||
|
try {
|
||||||
|
chunk = atob(p.base64);
|
||||||
|
} catch {
|
||||||
|
// ignore malformed base64
|
||||||
|
}
|
||||||
|
} else if (typeof p?.data === "string") {
|
||||||
|
// fallback if you ever send plain text
|
||||||
|
chunk = p.data;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!chunk) return;
|
||||||
|
|
||||||
|
// Normalize CRLF for display
|
||||||
|
chunk = chunk.replace(/\r\n/g, "\n");
|
||||||
|
|
||||||
|
// setSerialResponse(prev => (prev + chunk).slice(-MAX_CHARS));
|
||||||
|
});
|
||||||
|
|
||||||
|
// extension config (buttons + prefs)
|
||||||
|
const [buttonConfig, setButtonConfig] = useState<CustomButtonSettings>({
|
||||||
|
baudRate: "9600",
|
||||||
|
dataBits: "8",
|
||||||
|
stopBits: "1",
|
||||||
|
parity: "none",
|
||||||
|
terminator: {label: "CR (\\r)", value: "\r"},
|
||||||
|
lineMode: true,
|
||||||
|
hideSerialSettings: false,
|
||||||
|
enableEcho: false,
|
||||||
|
buttons: [],
|
||||||
|
});
|
||||||
|
|
||||||
|
// editor modal state
|
||||||
|
const [editorOpen, setEditorOpen] = useState<null | { id?: string }>(null);
|
||||||
|
const [draftLabel, setDraftLabel] = useState("");
|
||||||
|
const [draftCmd, setDraftCmd] = useState("");
|
||||||
|
const [draftTerminator, setDraftTerminator] = useState({label: "CR (\\r)", value: "\r"});
|
||||||
|
|
||||||
|
// load serial settings like SerialConsole
|
||||||
|
useEffect(() => {
|
||||||
|
send("getSerialButtonConfig", {}, (resp: JsonRpcResponse) => {
|
||||||
|
if ("error" in resp) {
|
||||||
|
notifications.error(
|
||||||
|
`Failed to get button config: ${resp.error.data || "Unknown error"}`,
|
||||||
|
);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
setButtonConfig(resp.result as CustomButtonSettings);
|
||||||
|
setTerminalLineMode((resp.result as CustomButtonSettings).lineMode);
|
||||||
|
});
|
||||||
|
|
||||||
|
}, [send, setTerminalLineMode]);
|
||||||
|
|
||||||
|
const handleSerialButtonConfigChange = (config: keyof CustomButtonSettings, value: unknown) => {
|
||||||
|
const newButtonConfig = { ...buttonConfig, [config]: value };
|
||||||
|
send("setSerialButtonConfig", { config: newButtonConfig }, (resp: JsonRpcResponse) => {
|
||||||
|
if ("error" in resp) {
|
||||||
|
notifications.error(`Failed to update button config: ${resp.error.data || "Unknown error"}`);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
setButtonConfig(newButtonConfig);
|
||||||
|
};
|
||||||
|
|
||||||
|
const onClickButton = (btn: QuickButton) => {
|
||||||
|
|
||||||
|
const command = btn.command + btn.terminator.value;
|
||||||
|
const terminator = btn.terminator.value;
|
||||||
|
|
||||||
|
send("sendCustomCommand", { command, terminator }, (resp: JsonRpcResponse) => {
|
||||||
|
if ("error" in resp) {
|
||||||
|
notifications.error(
|
||||||
|
`Failed to send custom command: ${resp.error.data || "Unknown error"}`,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
/** CRUD helpers */
|
||||||
|
const addNew = () => {
|
||||||
|
setEditorOpen({ id: undefined });
|
||||||
|
setDraftLabel("");
|
||||||
|
setDraftCmd("");
|
||||||
|
setDraftTerminator({label: "CR (\\r)", value: "\r"});
|
||||||
|
};
|
||||||
|
|
||||||
|
const editBtn = (btn: QuickButton) => {
|
||||||
|
setEditorOpen({ id: btn.id });
|
||||||
|
setDraftLabel(btn.label);
|
||||||
|
setDraftCmd(btn.command);
|
||||||
|
setDraftTerminator(btn.terminator);
|
||||||
|
};
|
||||||
|
|
||||||
|
const removeBtn = (id: string) => {
|
||||||
|
const nextButtons = buttonConfig.buttons.filter(b => b.id !== id).map((b, i) => ({ ...b, sort: i })) ;
|
||||||
|
handleSerialButtonConfigChange("buttons", stableSort(nextButtons) );
|
||||||
|
setEditorOpen(null);
|
||||||
|
};
|
||||||
|
|
||||||
|
const moveUpBtn = (id: string) => {
|
||||||
|
// Make a copy so we don't mutate state directly
|
||||||
|
const newButtons = [...buttonConfig.buttons];
|
||||||
|
|
||||||
|
// Find the index of the button to move
|
||||||
|
const index = newButtons.findIndex(b => b.id === id);
|
||||||
|
|
||||||
|
if (index > 0) {
|
||||||
|
// Swap with the previous element
|
||||||
|
[newButtons[index - 1], newButtons[index]] = [
|
||||||
|
newButtons[index],
|
||||||
|
newButtons[index - 1],
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
// Re-assign sort values
|
||||||
|
const nextButtons = newButtons.map((b, i) => ({ ...b, sort: i }));
|
||||||
|
handleSerialButtonConfigChange("buttons", stableSort(nextButtons) );
|
||||||
|
setEditorOpen(null);
|
||||||
|
};
|
||||||
|
|
||||||
|
const moveDownBtn = (id: string) => {
|
||||||
|
// Make a copy so we don't mutate state directly
|
||||||
|
const newButtons = [...buttonConfig.buttons];
|
||||||
|
|
||||||
|
// Find the index of the button to move
|
||||||
|
const index = newButtons.findIndex(b => b.id === id);
|
||||||
|
|
||||||
|
if (index >= 0 && index < newButtons.length - 1) {
|
||||||
|
// Swap with the next element
|
||||||
|
[newButtons[index], newButtons[index + 1]] = [
|
||||||
|
newButtons[index + 1],
|
||||||
|
newButtons[index],
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
// Re-assign sort values
|
||||||
|
const nextButtons = newButtons.map((b, i) => ({ ...b, sort: i }));
|
||||||
|
handleSerialButtonConfigChange("buttons", stableSort(nextButtons) );
|
||||||
|
setEditorOpen(null);
|
||||||
|
};
|
||||||
|
|
||||||
|
const saveDraft = () => {
|
||||||
|
const label = draftLabel.trim() || "Unnamed";
|
||||||
|
const command = draftCmd;
|
||||||
|
if (!command) {
|
||||||
|
notifications.error("Command cannot be empty.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const terminator = draftTerminator;
|
||||||
|
|
||||||
|
// if editing, get current id, otherwise undefined => new button
|
||||||
|
const currentID = editorOpen?.id;
|
||||||
|
|
||||||
|
// either update existing or add new
|
||||||
|
// if new, assign next sort index
|
||||||
|
// if existing, keep sort index
|
||||||
|
const nextButtons = currentID
|
||||||
|
? buttonConfig.buttons.map(b => (b.id === currentID ? { ...b, label, command } : b))
|
||||||
|
: [...buttonConfig.buttons, { id: genId(), label, command, terminator, sort: buttonConfig.buttons.length }];
|
||||||
|
|
||||||
|
handleSerialButtonConfigChange("buttons", stableSort(nextButtons) );
|
||||||
|
setEditorOpen(null);
|
||||||
|
};
|
||||||
|
|
||||||
|
/** simple reordering: alphabetical by sort, then label */
|
||||||
|
const sortedButtons = useMemo(() => buttonConfig.buttons, [buttonConfig.buttons]);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="space-y-4">
|
||||||
|
<SettingsPageHeader
|
||||||
|
title="Serial Buttons"
|
||||||
|
description="Quick custom commands over the extension serial port"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<Card className="animate-fadeIn opacity-0">
|
||||||
|
<div className="space-y-4 p-3">
|
||||||
|
{/* Top actions */}
|
||||||
|
<div className="flex flex-wrap justify-around items-center gap-3">
|
||||||
|
<Button
|
||||||
|
size="XS"
|
||||||
|
theme="primary"
|
||||||
|
LeadingIcon={buttonConfig.hideSerialSettings ? LuEye : LuEyeOff}
|
||||||
|
text={buttonConfig.hideSerialSettings ? "Show Settings" : "Hide Settings"}
|
||||||
|
onClick={() => handleSerialButtonConfigChange("hideSerialSettings", !buttonConfig.hideSerialSettings )}
|
||||||
|
/>
|
||||||
|
<Button
|
||||||
|
size="XS"
|
||||||
|
theme="primary"
|
||||||
|
LeadingIcon={LuPlus}
|
||||||
|
text="Add Button"
|
||||||
|
onClick={addNew}
|
||||||
|
/>
|
||||||
|
<Button
|
||||||
|
size="XS"
|
||||||
|
theme="primary"
|
||||||
|
LeadingIcon={LuTerminal}
|
||||||
|
text="Open Console"
|
||||||
|
onClick={() => {
|
||||||
|
setTerminalType("serial");
|
||||||
|
console.log("Opening serial console with settings: ", buttonConfig);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<hr className="border-slate-700/30 dark:border-slate-600/30" />
|
||||||
|
|
||||||
|
{/* Serial settings (collapsible) */}
|
||||||
|
{!buttonConfig.hideSerialSettings && (
|
||||||
|
<>
|
||||||
|
<div className="grid grid-cols-2 gap-4">
|
||||||
|
<SelectMenuBasic
|
||||||
|
label="Baud Rate"
|
||||||
|
options={[
|
||||||
|
{ label: "1200", value: "1200" },
|
||||||
|
{ label: "2400", value: "2400" },
|
||||||
|
{ label: "4800", value: "4800" },
|
||||||
|
{ label: "9600", value: "9600" },
|
||||||
|
{ label: "19200", value: "19200" },
|
||||||
|
{ label: "38400", value: "38400" },
|
||||||
|
{ label: "57600", value: "57600" },
|
||||||
|
{ label: "115200", value: "115200" },
|
||||||
|
]}
|
||||||
|
value={buttonConfig.baudRate}
|
||||||
|
onChange={(e) => handleSerialButtonConfigChange("baudRate", e.target.value)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<SelectMenuBasic
|
||||||
|
label="Data Bits"
|
||||||
|
options={[
|
||||||
|
{ label: "8", value: "8" },
|
||||||
|
{ label: "7", value: "7" },
|
||||||
|
]}
|
||||||
|
value={buttonConfig.dataBits}
|
||||||
|
onChange={(e) => handleSerialButtonConfigChange("dataBits", e.target.value)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<SelectMenuBasic
|
||||||
|
label="Stop Bits"
|
||||||
|
options={[
|
||||||
|
{ label: "1", value: "1" },
|
||||||
|
{ label: "1.5", value: "1.5" },
|
||||||
|
{ label: "2", value: "2" },
|
||||||
|
]}
|
||||||
|
value={buttonConfig.stopBits}
|
||||||
|
onChange={(e) => handleSerialButtonConfigChange("stopBits", e.target.value)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<SelectMenuBasic
|
||||||
|
label="Parity"
|
||||||
|
options={[
|
||||||
|
{ label: "None", value: "none" },
|
||||||
|
{ label: "Even", value: "even" },
|
||||||
|
{ label: "Odd", value: "odd" },
|
||||||
|
]}
|
||||||
|
value={buttonConfig.parity}
|
||||||
|
onChange={(e) => handleSerialButtonConfigChange("parity", e.target.value)}
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
<SelectMenuBasic
|
||||||
|
className="mb-1"
|
||||||
|
label="Line ending"
|
||||||
|
options={[
|
||||||
|
{ label: "None", value: "" },
|
||||||
|
{ label: "CR (\\r)", value: "\r" },
|
||||||
|
{ label: "LF (\\n)", value: "\n" },
|
||||||
|
{ label: "CRLF (\\r\\n)", value: "\r\n" },
|
||||||
|
{ label: "LFCR (\\n\\r)", value: "\n\r" },
|
||||||
|
]}
|
||||||
|
value={buttonConfig.terminator.value}
|
||||||
|
onChange={(e) => handleSerialButtonConfigChange("terminator", {label: e.target.selectedOptions[0].text, value: e.target.value})}
|
||||||
|
/>
|
||||||
|
<div className="text-xs text-white opacity-70 mt-0 ml-2">
|
||||||
|
When sent, the selected line ending ({buttonConfig.terminator.label}) will be appended.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<SelectMenuBasic
|
||||||
|
className="mb-1"
|
||||||
|
label="Terminal Mode"
|
||||||
|
options={[
|
||||||
|
{ label: "Raw Mode", value: "raw" },
|
||||||
|
{ label: "Line Mode", value: "line" },
|
||||||
|
]}
|
||||||
|
value={buttonConfig.lineMode ? "line" : "raw"}
|
||||||
|
onChange={(e) => {
|
||||||
|
handleSerialButtonConfigChange("lineMode", e.target.value === "line")
|
||||||
|
setTerminalLineMode(e.target.value === "line");
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<div className="text-xs text-white opacity-70 mt-0 ml-2">
|
||||||
|
{buttonConfig.lineMode
|
||||||
|
? "In Line Mode, input is sent when you press Enter in the input field."
|
||||||
|
: "In Raw Mode, input is sent immediately as you type in the console."}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-4 m-2">
|
||||||
|
<SettingsItem
|
||||||
|
title="Local Echo"
|
||||||
|
description="Whether to echo received characters back to the sender"
|
||||||
|
>
|
||||||
|
<Checkbox
|
||||||
|
checked={buttonConfig.enableEcho}
|
||||||
|
onChange={e => {
|
||||||
|
handleSerialButtonConfigChange("enableEcho", e.target.checked);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</SettingsItem>
|
||||||
|
</div>
|
||||||
|
<hr className="border-slate-700/30 dark:border-slate-600/30" />
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* Buttons grid */}
|
||||||
|
<div className="grid grid-cols-2 gap-2 pt-2">
|
||||||
|
{sortedButtons.map((btn) => (
|
||||||
|
<div key={btn.id} className="flex items-stretch gap-2 min-w-0">
|
||||||
|
<div className=" flex-1 min-w-0 ">
|
||||||
|
<Button
|
||||||
|
size="MD"
|
||||||
|
fullWidth
|
||||||
|
className="overflow-hidden text-ellipsis whitespace-nowrap"
|
||||||
|
theme="primary"
|
||||||
|
text={btn.label}
|
||||||
|
onClick={() => onClickButton(btn)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<Button
|
||||||
|
size="MD"
|
||||||
|
theme="light"
|
||||||
|
className="shrink-0"
|
||||||
|
LeadingIcon={LuPencil}
|
||||||
|
onClick={() => editBtn(btn)}
|
||||||
|
aria-label={`Edit ${btn.label}`}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
{sortedButtons.length === 0 && (
|
||||||
|
<div className="col-span-2 text-sm text-black dark:text-slate-300">No buttons yet. Click “Add Button”.</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Editor drawer/modal (inline lightweight) */}
|
||||||
|
{editorOpen && (
|
||||||
|
<div className="mt-4 border rounded-md p-3 bg-slate-50 dark:bg-slate-900/30">
|
||||||
|
<div className="flex items-center gap-2 mb-2">
|
||||||
|
<LuSettings2 className="h-3.5 text-white shrink-0 justify-start" />
|
||||||
|
<div className="font-medium text-black dark:text-white">{editorOpen.id ? "Edit Button" : "New Button"}</div>
|
||||||
|
</div>
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-3 h-23">
|
||||||
|
<div>
|
||||||
|
<InputFieldWithLabel
|
||||||
|
size="SM"
|
||||||
|
type="text"
|
||||||
|
label="Label"
|
||||||
|
placeholder="New Command"
|
||||||
|
value={draftLabel}
|
||||||
|
onChange={e => {
|
||||||
|
setDraftLabel(e.target.value);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<InputFieldWithLabel
|
||||||
|
size="SM"
|
||||||
|
type="text"
|
||||||
|
label="Command"
|
||||||
|
placeholder="Command to send"
|
||||||
|
value={draftCmd}
|
||||||
|
onChange={e => {
|
||||||
|
setDraftCmd(e.target.value);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
{draftTerminator.value != "" && (
|
||||||
|
<div className="text-xs text-white opacity-70 mt-1">
|
||||||
|
When sent, the selected line ending ({draftTerminator.label}) will be appended.
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="flex justify-around items-end">
|
||||||
|
<SelectMenuBasic
|
||||||
|
label="Line ending"
|
||||||
|
options={[
|
||||||
|
{ label: "None", value: "" },
|
||||||
|
{ label: "CR (\\r)", value: "\r" },
|
||||||
|
{ label: "LF (\\n)", value: "\n" },
|
||||||
|
{ label: "CRLF (\\r\\n)", value: "\r\n" },
|
||||||
|
{ label: "LFCR (\\n\\r)", value: "\n\r" },
|
||||||
|
]}
|
||||||
|
value={draftTerminator.value}
|
||||||
|
onChange={(e) => setDraftTerminator({label: e.target.selectedOptions[0].text, value: e.target.value})}
|
||||||
|
/>
|
||||||
|
<div className="pb-[3px]">
|
||||||
|
<Button size="SM" theme="primary" LeadingIcon={LuSave} text="Save" onClick={saveDraft} />
|
||||||
|
</div>
|
||||||
|
<div className="pb-[3px]">
|
||||||
|
<Button size="SM" theme="primary" LeadingIcon={LuCircleX} text="Cancel" onClick={() => setEditorOpen(null)} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="flex justify-around mt-3">
|
||||||
|
{editorOpen.id && (
|
||||||
|
<>
|
||||||
|
<Button
|
||||||
|
size="SM"
|
||||||
|
theme="danger"
|
||||||
|
LeadingIcon={LuTrash2}
|
||||||
|
text="Delete"
|
||||||
|
onClick={() => removeBtn(editorOpen.id!)}
|
||||||
|
aria-label={`Delete ${draftLabel}`}
|
||||||
|
/>
|
||||||
|
<Button
|
||||||
|
size="SM"
|
||||||
|
theme="primary"
|
||||||
|
LeadingIcon={LuArrowBigUp}
|
||||||
|
text="Move Up"
|
||||||
|
aria-label={`Move ${draftLabel} up`}
|
||||||
|
disabled={sortedButtons.findIndex(b => b.id === editorOpen.id) === 0}
|
||||||
|
onClick={() => moveUpBtn(editorOpen.id!)}
|
||||||
|
/>
|
||||||
|
<Button
|
||||||
|
size="SM"
|
||||||
|
theme="primary"
|
||||||
|
LeadingIcon={LuArrowBigDown}
|
||||||
|
text="Move Down"
|
||||||
|
aria-label={`Move ${draftLabel} down`}
|
||||||
|
disabled={sortedButtons.findIndex(b => b.id === editorOpen.id)+1 === sortedButtons.length}
|
||||||
|
onClick={() => moveDownBtn(editorOpen.id!)}
|
||||||
|
/>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
/** ============== helpers ============== */
|
||||||
|
function genId() {
|
||||||
|
return "b_" + Math.random().toString(36).slice(2, 10);
|
||||||
|
}
|
||||||
|
function stableSort(arr: QuickButton[]) {
|
||||||
|
return [...arr].sort((a, b) => (a.sort - b.sort) || a.label.localeCompare(b.label));
|
||||||
|
}
|
||||||
|
|
||||||
|
|
@ -7,6 +7,7 @@ import { SettingsPageHeader } from "@components/SettingsPageheader";
|
||||||
import { ATXPowerControl } from "@components/extensions/ATXPowerControl";
|
import { ATXPowerControl } from "@components/extensions/ATXPowerControl";
|
||||||
import { DCPowerControl } from "@components/extensions/DCPowerControl";
|
import { DCPowerControl } from "@components/extensions/DCPowerControl";
|
||||||
import { SerialConsole } from "@components/extensions/SerialConsole";
|
import { SerialConsole } from "@components/extensions/SerialConsole";
|
||||||
|
import { SerialButtons } from "@components/extensions/SerialButtons";
|
||||||
import { Button } from "@components/Button";
|
import { Button } from "@components/Button";
|
||||||
import notifications from "@/notifications";
|
import notifications from "@/notifications";
|
||||||
|
|
||||||
|
|
@ -36,6 +37,12 @@ const AVAILABLE_EXTENSIONS: Extension[] = [
|
||||||
description: "Access your serial console extension",
|
description: "Access your serial console extension",
|
||||||
icon: LuTerminal,
|
icon: LuTerminal,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
id: "serial-buttons",
|
||||||
|
name: "Serial Buttons",
|
||||||
|
description: "Send custom serial signals by buttons",
|
||||||
|
icon: LuTerminal,
|
||||||
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
export default function ExtensionPopover() {
|
export default function ExtensionPopover() {
|
||||||
|
|
@ -76,6 +83,8 @@ export default function ExtensionPopover() {
|
||||||
return <DCPowerControl />;
|
return <DCPowerControl />;
|
||||||
case "serial-console":
|
case "serial-console":
|
||||||
return <SerialConsole />;
|
return <SerialConsole />;
|
||||||
|
case "serial-buttons":
|
||||||
|
return <SerialButtons />;
|
||||||
default:
|
default:
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -69,6 +69,9 @@ export interface UIState {
|
||||||
|
|
||||||
terminalType: AvailableTerminalTypes;
|
terminalType: AvailableTerminalTypes;
|
||||||
setTerminalType: (type: UIState["terminalType"]) => void;
|
setTerminalType: (type: UIState["terminalType"]) => void;
|
||||||
|
|
||||||
|
terminalLineMode: boolean;
|
||||||
|
setTerminalLineMode: (enabled: boolean) => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const useUiStore = create<UIState>(set => ({
|
export const useUiStore = create<UIState>(set => ({
|
||||||
|
|
@ -96,6 +99,9 @@ export const useUiStore = create<UIState>(set => ({
|
||||||
isAttachedVirtualKeyboardVisible: true,
|
isAttachedVirtualKeyboardVisible: true,
|
||||||
setAttachedVirtualKeyboardVisibility: (enabled: boolean) =>
|
setAttachedVirtualKeyboardVisibility: (enabled: boolean) =>
|
||||||
set({ isAttachedVirtualKeyboardVisible: enabled }),
|
set({ isAttachedVirtualKeyboardVisible: enabled }),
|
||||||
|
|
||||||
|
terminalLineMode: true,
|
||||||
|
setTerminalLineMode: (enabled: boolean) => set({ terminalLineMode: enabled }),
|
||||||
}));
|
}));
|
||||||
|
|
||||||
export interface RTCState {
|
export interface RTCState {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue