doc: add README with build, config, deployment, and OSCAR hotkey guide

Covers architecture, building, configuration, deployment, port
switching with Avocent OSCAR (tested hotkey syntax with recommended
pause settings), full hotkey syntax reference, and protocol heritage
naming the Peppercon e-RIC/LARA lineage.

Completes success criterion 5: source on git.lair.cafe with a README
that names the Peppercon e-RIC heritage.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

.gitea/workflows/publish.yml

@@ -10,6 +10,10 @@ env:
 jobs:
   frontend:
     runs-on: rust
+    if: >-
+      contains(github.event.head_commit.message, '[deploy: frontend]')
+      || contains(github.event.head_commit.message, '[deploy: backend, frontend]')
+      || contains(github.event.head_commit.message, '[deploy: frontend, backend]')
     steps:
       - uses: actions/checkout@v4
 
@@ -37,6 +41,10 @@ jobs:
 
   backend:
     runs-on: rust
+    if: >-
+      contains(github.event.head_commit.message, '[deploy: backend]')
+      || contains(github.event.head_commit.message, '[deploy: backend, frontend]')
+      || contains(github.event.head_commit.message, '[deploy: frontend, backend]')
     steps:
       - uses: actions/checkout@v4
 

README.md

@@ -0,0 +1,142 @@
+# blekin
+
+A Rust proxy that translates the Belkin OmniView Remote IP Manager's proprietary
+e-RIC RFB protocol (Peppercon LARA, originally served via a Java applet) into a
+modern HTML5 KVM console. No Java anywhere in the stack.
+
+## What it does
+
+```
+Browser (Vite + TypeScript)
+   │ WebSocket (binary, RGBA blits + input events)
+   ▼
+blekin proxy (Rust, tokio + axum)
+   │ HTTP session (cookie + APPLET_ID extraction)
+   │ TCP to OmniView:443 (e-RIC RFB)
+   ▼
+Belkin OmniView Remote IP Manager → downstream KVM switch → servers
+```
+
+The proxy authenticates with the OmniView's web interface, establishes an e-RIC
+RFB session over TCP, decodes the proprietary 8bpp protocol to RGBA, and bridges
+video frames and input events to a browser-based console over WebSocket.
+
+## Features
+
+- Full KVM console: keyboard, mouse, scroll wheel
+- Encodings: Raw, CopyRect, Hextile, Tight (with zlib), IIP tile cache, Raw-tile
+- Send Key menu for browser-intercepted keys (Print Screen, Scroll Lock, etc.)
+- Port switching with downstream KVM support (Avocent OSCAR tested)
+- Port configuration: naming, hotkeys, visibility
+- Auto-reconnect with exponential backoff
+- Session persistence across page refreshes
+- Dark theme, fullscreen mode
+
+## Building
+
+```sh
+# Backend
+cargo build --release -p ericrfb-proxy
+
+# Frontend
+cd crates/ericrfb-frontend
+npm ci
+npm run build   # outputs to ../../dist/
+```
+
+## Configuration
+
+The proxy reads `config.toml` or falls back to the `BLEKIN_HOST` environment variable:
+
+```toml
+bind = "0.0.0.0:3000"
+static_dir = "dist"
+
+[omniview]
+host = "10.3.0.130"
+http_port = 80
+rfb_port = 443
+```
+
+## Deployment
+
+The systemd unit runs the proxy as a service. Nginx serves the static frontend
+and reverse-proxies `/api/` to the proxy:
+
+```sh
+# Backend
+sudo cp target/release/ericrfb-proxy /usr/local/bin/
+sudo cp asset/systemd/blekin.service /etc/systemd/system/
+sudo systemctl enable --now blekin.service
+
+# Frontend
+sudo cp -r dist/* /var/www/blekin.example.com/
+sudo cp asset/nginx/blekin.example.conf /etc/nginx/sites-available/
+sudo ln -sf /etc/nginx/sites-available/blekin.example.conf /etc/nginx/sites-enabled/
+sudo nginx -t && sudo systemctl reload nginx
+```
+
+## Port switching with downstream KVM
+
+The Belkin OmniView can control a downstream KVM switch (e.g., Avocent AutoView)
+by sending configurable hotkey sequences when switching ports. Configure these
+in the Ports page of the blekin interface.
+
+### Avocent OSCAR setup
+
+The Avocent OSCAR menu is invoked with Print Screen, then expects the port's EID
+(Electronic ID) typed as digits, followed by Enter. Each phase needs a pause to
+let the OSCAR process the input.
+
+**Recommended settings:**
+
+- **Key pause:** `1000` ms (in the Ports page global settings)
+- **Hotkey format:** `PRINTSCREEN-***<EID digits>-***ENTER`
+
+The `*` character inserts a pause of the configured duration. Three `***` = 3
+seconds, which gives the OSCAR reliable processing time.
+
+**Examples** (with key pause = 1000ms):
+
+| Server | Avocent EID | Hotkey |
+|--------|-------------|--------|
+| server-a | 01 | `PRINTSCREEN-***1-***ENTER` |
+| server-b | 05 | `PRINTSCREEN-***5-***ENTER` |
+| server-c | 17 | `PRINTSCREEN-***1-7-***ENTER` |
+| server-d | 22 | `PRINTSCREEN-***2-2-***ENTER` |
+| server-e | 31 | `PRINTSCREEN-***3-1-***ENTER` |
+
+Note: don't type the leading zero in EIDs (per Avocent OSCAR convention).
+
+### Hotkey syntax reference
+
+The Belkin hotkey syntax uses key names connected by operators:
+
+| Operator | Meaning |
+|----------|---------|
+| `+` | Press additionally (hold previous, press next) |
+| `-` | Release all pressed keys |
+| `>` | Release most recently pressed key only |
+| `*` | Pause for the configured key pause duration |
+
+Key names: `A`-`Z`, `0`-`9`, `F1`-`F12`, `PRINTSCREEN`, `ENTER`, `ESCAPE`,
+`LCTRL`/`CTRL`, `LALT`/`ALT`, `LSHIFT`/`SHIFT`, `SPACE`, `TAB`, `DELETE`,
+`INSERT`, `HOME`, `END`, `PAGE_UP`, `PAGE_DOWN`, `UP`, `DOWN`, `LEFT`, `RIGHT`,
+`BACK_SPACE`, `NUM_LOCK`, `NUMPAD0`-`NUMPAD9`, `NUMPADPLUS`, `NUMPADMINUS`,
+`NUMPADMUL`, `NUMPAD/`, `NUMPADENTER`, `SCROLL_LOCK`, `BREAK`, `CAPS_LOCK`.
+
+## Protocol heritage
+
+The e-RIC RFB protocol is a proprietary variant of VNC/RFB developed by
+Peppercon (later acquired by Raritan) under the name "LARA" (LAN Attached
+Remote Access). It was used in several KVM-over-IP products including the Belkin
+OmniView Remote IP Manager (F1DE101H). The protocol shares structural
+similarities with standard RFB but uses its own handshake, pixel format
+negotiation, and encoding extensions.
+
+This implementation was reverse-engineered from the CFR-decompiled `rc.jar` Java
+applet that originally provided the browser-based console.
+
+## License
+
+MIT

crates/ericrfb-frontend/src/hotkey.ts

@@ -0,0 +1,92 @@
+// Parse Belkin hotkey syntax and convert to scancode sequences.
+//
+// Syntax: [confirm] <keyname>((+|->|>)<keyname>)*
+//   + = press simultaneously (hold first, press second)
+//   > = press sequentially (release first, then press second)
+//   -> = same as >
+//
+// Examples:
+//   PrintScreen>0>1    → tap PrintScreen, tap 0, tap 1
+//   Ctrl+Alt+Del       → hold Ctrl+Alt, tap Del, release all
+//   PrintScreen>1>7    → tap PrintScreen, tap 1, tap 7
+
+import { makeKeyPress, makeKeyRelease } from './protocol'
+
+// Belkin key names → e-RIC scancodes (from KeyTranslator.java)
+const KEY_NAMES: Record<string, number> = {
+  // Letters
+  A: 29, B: 47, C: 45, D: 31, E: 17, F: 32, G: 33, H: 34, I: 22,
+  J: 35, K: 36, L: 37, M: 49, N: 48, O: 23, P: 24, Q: 15, R: 18,
+  S: 30, T: 19, U: 21, V: 46, W: 16, X: 44, Y: 20, Z: 43,
+
+  // Digits
+  '0': 10, '1': 1, '2': 2, '3': 3, '4': 4, '5': 5, '6': 6, '7': 7, '8': 8, '9': 9,
+
+  // Modifiers
+  Ctrl: 54, Alt: 55, Shift: 41, Win: 105,
+  CtrlLeft: 54, CtrlRight: 58, AltLeft: 55, AltRight: 57,
+  ShiftLeft: 41, ShiftRight: 53,
+
+  // Special keys
+  Esc: 59, Escape: 59, Tab: 14, CapsLock: 28, Space: 56,
+  Enter: 27, Return: 27, Backspace: 13, Del: 78, Delete: 78,
+  Insert: 75, Home: 76, End: 79, PageUp: 77, PageDown: 80,
+  PrintScreen: 72, Print: 72, SysRq: 72,
+  ScrollLock: 73, Pause: 74, Break: 74,
+  NumLock: 85,
+
+  // Arrow keys
+  Up: 81, Down: 83, Left: 82, Right: 84,
+
+  // F-keys
+  F1: 60, F2: 61, F3: 62, F4: 63, F5: 64, F6: 65,
+  F7: 66, F8: 67, F9: 68, F10: 69, F11: 70, F12: 71,
+
+  // Numpad
+  NumPlus: 89, 'Num+': 89, NumMinus: 99, 'Num-': 99,
+  NumMultiply: 94, 'Num*': 94, NumDivide: 90, 'Num/': 90,
+  NumEnter: 98,
+}
+
+/**
+ * Parse a Belkin hotkey string into a sequence of WS messages to send.
+ * Returns an array of ArrayBuffer messages (press/release pairs).
+ */
+export function parseHotkey(hotkey: string): ArrayBuffer[] {
+  if (!hotkey.trim()) return []
+
+  const messages: ArrayBuffer[] = []
+  // Split on > (sequential) first, preserving + groups
+  const groups = hotkey.split(/->|>/).map(g => g.trim()).filter(Boolean)
+
+  for (const group of groups) {
+    // Each group may contain + (simultaneous keys)
+    const keys = group.split('+').map(k => k.trim()).filter(Boolean)
+    const scancodes: number[] = []
+
+    for (const key of keys) {
+      const sc = KEY_NAMES[key]
+      if (sc !== undefined) {
+        scancodes.push(sc)
+      }
+    }
+
+    if (scancodes.length === 0) continue
+
+    if (scancodes.length === 1) {
+      // Single key: press then release
+      messages.push(makeKeyPress(scancodes[0]))
+      messages.push(makeKeyRelease(scancodes[0]))
+    } else {
+      // Combo: press all in order, release in reverse
+      for (const sc of scancodes) {
+        messages.push(makeKeyPress(sc))
+      }
+      for (const sc of scancodes.reverse()) {
+        messages.push(makeKeyRelease(sc))
+      }
+    }
+  }
+
+  return messages
+}

crates/ericrfb-frontend/src/main.ts

@@ -1,5 +1,29 @@
 import './style.css'
 import { showLogin } from './login'
+import { mountShell } from './shell'
 
 const app = document.getElementById('app')!
-showLogin(app)
+
+// Try to resume a session from stored credentials
+const user = sessionStorage.getItem('blekin_user')
+const pass = sessionStorage.getItem('blekin_pass')
+
+if (user && pass) {
+  app.innerHTML = '<div class="login"><div class="login-form"><h1>Reconnecting...</h1></div></div>'
+  fetch('/api/login', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ username: user, password: pass }),
+  })
+    .then(r => r.ok ? r.json() : Promise.reject())
+    .then(data => {
+      mountShell(app, { appletId: data.applet_id, port: data.port, boardName: data.board_name })
+    })
+    .catch(() => {
+      sessionStorage.removeItem('blekin_user')
+      sessionStorage.removeItem('blekin_pass')
+      showLogin(app)
+    })
+} else {
+  showLogin(app)
+}

crates/ericrfb-frontend/src/pages/console.ts

@@ -1,4 +1,5 @@
 import { codeToScancode } from '../input'
+import { parseHotkey } from '../hotkey'
 import {
   TAG_BLIT, TAG_RESIZE,
   makeKeyPress, makeKeyRelease, makePointer, makeCtrlAltDel,
@@ -20,7 +21,21 @@ export function mountConsole(el: HTMLElement, s: SessionInfo) {
     <div class="toolbar">
       <span>${s.boardName}</span>
       <select id="port-select" title="Switch KVM port"></select>
-      <button id="btn-cad">Ctrl+Alt+Del</button>
+      <div class="sendkey-wrap">
+        <button id="btn-sendkey">Send Key &#x25BE;</button>
+        <div class="sendkey-menu" id="sendkey-menu" hidden>
+          <button data-sc="72">Print Screen</button>
+          <button data-sc="73">Scroll Lock</button>
+          <button data-sc="74">Pause / Break</button>
+          <hr />
+          <button data-sc="59">Escape</button>
+          <button data-sc="14">Tab</button>
+          <button data-sc="28">Caps Lock</button>
+          <button data-sc="85">Num Lock</button>
+          <hr />
+          <button data-cad="1">Ctrl + Alt + Del</button>
+        </div>
+      </div>
       <button id="btn-fs">Fullscreen</button>
       <span class="status" id="status">connecting...</span>
     </div>
@@ -41,6 +56,8 @@ export function unmountConsole() {
   ws?.close()
   ws = null
   buttonMask = 0
+  inputSuspended = false
+  portSelectWired = false
   if (containerEl) containerEl.innerHTML = ''
   containerEl = null
 }
@@ -139,34 +156,114 @@ function handleMessage(ev: MessageEvent) {
 // Port switcher
 // ---------------------------------------------------------------------------
 
+let portHotkeys: Record<number, string> = {}
+let keyPauseDuration = 2000
+let inputSuspended = false
+let selectedPort = -1
+let portSelectWired = false
+
 async function loadPortList() {
   try {
     const resp = await fetch('/api/kvm/ports')
     if (!resp.ok) return
     const data = await resp.json()
+    keyPauseDuration = data.key_pause_duration || 2000
     const select = document.getElementById('port-select') as HTMLSelectElement
     if (!select) return
     select.innerHTML = ''
+    portHotkeys = {}
+    // Use locally tracked selection if we've switched, otherwise use device's active port
+    const activePort = selectedPort >= 0 ? selectedPort : data.active_port
     for (const p of data.ports) {
       const opt = document.createElement('option')
       opt.value = String(p.index)
       opt.textContent = p.name || `Port ${p.index + 1}`
-      opt.selected = p.index === data.active_port
+      opt.selected = p.index === activePort
       select.appendChild(opt)
+      if (p.hotkey) portHotkeys[p.index] = p.hotkey
     }
-    select.addEventListener('change', async () => {
-      const port = parseInt(select.value)
-      await fetch('/api/kvm/switch', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ port }),
+    if (!portSelectWired) {
+      select.addEventListener('change', () => {
+        const port = parseInt(select.value)
+        switchToPort(port)
       })
-      // Reconnect to pick up new video stream
-      ws?.close()
-    })
+      portSelectWired = true
+    }
   } catch { /* port list optional */ }
 }
 
+let switchTimerId = 0
+
+function switchToPort(port: number) {
+  selectedPort = port
+  const hotkey = portHotkeys[port]
+  if (!hotkey || ws?.readyState !== WebSocket.OPEN) return
+
+  // Total duration: proxy round-trip + key sequence execution + settle time
+  const pauseCount = (hotkey.match(/\*/g) || []).length
+  const proxyLatency = 4000 // WS → proxy → Belkin → Avocent pipeline delay
+  const settleTime = 1000  // wait for video stream to stabilize after switch
+  const duration = proxyLatency + (pauseCount * keyPauseDuration) + settleTime
+
+  // Suspend input and show overlay
+  inputSuspended = true
+  if (switchTimerId) window.clearTimeout(switchTimerId)
+  showSwitchOverlay(duration)
+
+  // Send the hotkey sequence
+  const messages = parseHotkey(hotkey)
+  for (const msg of messages) {
+    ws.send(msg)
+  }
+
+  // Update Belkin's active port tracking
+  fetch('/api/kvm/switch', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ port }),
+  }).catch(() => {})
+
+  // Resume input after the switch completes
+  switchTimerId = window.setTimeout(dismissOverlay, duration)
+}
+
+function dismissOverlay() {
+  switchTimerId = 0
+  inputSuspended = false
+  const overlay = document.getElementById('switch-overlay')
+  if (overlay) overlay.style.display = 'none'
+  document.getElementById('canvas')?.focus()
+}
+
+function showSwitchOverlay(duration: number) {
+  let overlay = document.getElementById('switch-overlay')
+  if (!overlay) {
+    overlay = document.createElement('div')
+    overlay.id = 'switch-overlay'
+    overlay.className = 'switch-overlay'
+    document.querySelector('.console-wrap')?.appendChild(overlay)
+  }
+  overlay.style.display = ''
+  overlay.innerHTML = `
+    <div class="switch-overlay-content">
+      <div class="switch-spinner"></div>
+      <div>Switching port...</div>
+      <div class="switch-timer" id="switch-timer"></div>
+    </div>
+  `
+
+  // Countdown timer
+  const endTime = Date.now() + duration
+  const tick = () => {
+    const timerEl = document.getElementById('switch-timer')
+    if (!timerEl) return
+    const remaining = Math.max(0, endTime - Date.now())
+    timerEl.textContent = `${(remaining / 1000).toFixed(1)}s`
+    if (remaining > 0) requestAnimationFrame(tick)
+  }
+  tick()
+}
+
 // ---------------------------------------------------------------------------
 // Input handlers
 // ---------------------------------------------------------------------------
@@ -176,18 +273,20 @@ function wireInputHandlers() {
 
   canvas.addEventListener('keydown', (e) => {
     e.preventDefault()
+    if (inputSuspended) return
     const sc = codeToScancode(e.code)
     if (sc !== undefined && ws?.readyState === WebSocket.OPEN) ws.send(makeKeyPress(sc))
   })
 
   canvas.addEventListener('keyup', (e) => {
     e.preventDefault()
+    if (inputSuspended) return
     const sc = codeToScancode(e.code)
     if (sc !== undefined && ws?.readyState === WebSocket.OPEN) ws.send(makeKeyRelease(sc))
   })
 
   function sendPointer(e: MouseEvent) {
-    if (ws?.readyState !== WebSocket.OPEN) return
+    if (inputSuspended || ws?.readyState !== WebSocket.OPEN) return
     const rect = canvas.getBoundingClientRect()
     const x = Math.round((e.clientX - rect.left) * canvas.width / rect.width)
     const y = Math.round((e.clientY - rect.top) * canvas.height / rect.height)
@@ -217,7 +316,7 @@ function wireInputHandlers() {
   canvas.addEventListener('contextmenu', (e) => e.preventDefault())
   canvas.addEventListener('wheel', (e) => {
     e.preventDefault()
-    if (ws?.readyState !== WebSocket.OPEN) return
+    if (inputSuspended || ws?.readyState !== WebSocket.OPEN) return
     const rect = canvas.getBoundingClientRect()
     const x = Math.round((e.clientX - rect.left) * canvas.width / rect.width)
     const y = Math.round((e.clientY - rect.top) * canvas.height / rect.height)
@@ -228,11 +327,40 @@ function wireInputHandlers() {
 }
 
 function wireToolbar() {
-  document.getElementById('btn-cad')?.addEventListener('click', () => {
-    if (ws?.readyState === WebSocket.OPEN) ws.send(makeCtrlAltDel())
-    document.getElementById('canvas')?.focus()
+  // Send Key dropdown
+  const sendKeyBtn = document.getElementById('btn-sendkey')!
+  const sendKeyMenu = document.getElementById('sendkey-menu')!
+
+  sendKeyBtn.addEventListener('click', (e) => {
+    e.stopPropagation()
+    sendKeyMenu.hidden = !sendKeyMenu.hidden
   })
 
+  // Close menu on outside click
+  document.addEventListener('click', () => { sendKeyMenu.hidden = true })
+  sendKeyMenu.addEventListener('click', (e) => e.stopPropagation())
+
+  sendKeyMenu.querySelectorAll('button[data-sc]').forEach(btn => {
+    btn.addEventListener('click', () => {
+      const sc = parseInt((btn as HTMLElement).dataset.sc!)
+      if (ws?.readyState === WebSocket.OPEN) {
+        ws.send(makeKeyPress(sc))
+        ws.send(makeKeyRelease(sc))
+      }
+      sendKeyMenu.hidden = true
+      document.getElementById('canvas')?.focus()
+    })
+  })
+
+  sendKeyMenu.querySelectorAll('button[data-cad]').forEach(btn => {
+    btn.addEventListener('click', () => {
+      if (ws?.readyState === WebSocket.OPEN) ws.send(makeCtrlAltDel())
+      sendKeyMenu.hidden = true
+      document.getElementById('canvas')?.focus()
+    })
+  })
+
+  // Fullscreen
   document.getElementById('btn-fs')?.addEventListener('click', () => {
     const shell = document.querySelector('.shell')
     if (document.fullscreenElement) document.exitFullscreen()

crates/ericrfb-frontend/src/pages/ports.ts

@@ -58,6 +58,7 @@ export function mountPorts(el: HTMLElement, _session: SessionInfo) {
 
   document.getElementById('btn-reload')?.addEventListener('click', loadPorts)
   document.getElementById('btn-save')?.addEventListener('click', savePorts)
+  document.getElementById('port-count')?.addEventListener('change', onPortCountChange)
   loadPorts()
 }
 
@@ -86,18 +87,26 @@ async function loadPorts() {
   }
 }
 
+let currentActivePort = 0
+
 function renderPorts(data: PortsData) {
   const countEl = document.getElementById('port-count') as HTMLSelectElement
   const pauseEl = document.getElementById('key-pause') as HTMLInputElement
-  const tbody = document.getElementById('ports-body')!
 
   if (countEl) countEl.value = String(data.port_count)
   if (pauseEl) pauseEl.value = String(data.key_pause_duration)
+  currentActivePort = data.active_port
 
+  renderPortRows(data.ports, data.active_port)
+}
+
+function renderPortRows(ports: PortInfo[], activePort: number) {
+  const tbody = document.getElementById('ports-body')!
   tbody.innerHTML = ''
-  for (const p of data.ports) {
+
+  for (const p of ports) {
     const tr = document.createElement('tr')
-    tr.className = p.index === data.active_port ? 'active-port' : ''
+    tr.className = p.index === activePort ? 'active-port' : ''
     tr.innerHTML = `
       <td class="port-num">${p.index + 1}</td>
       <td><input type="text" class="port-name" data-idx="${p.index}" value="${esc(p.name)}" maxlength="20" /></td>
@@ -119,7 +128,7 @@ function renderPorts(data: PortsData) {
           body: JSON.stringify({ port: idx }),
         })
         showToast(`Switched to port ${idx + 1}`, true)
-        loadPorts() // refresh to show new active
+        loadPorts()
       } catch (e) {
         showToast(`Switch failed: ${e}`, false)
       }
@@ -127,6 +136,27 @@ function renderPorts(data: PortsData) {
   })
 }
 
+function onPortCountChange() {
+  const countEl = document.getElementById('port-count') as HTMLSelectElement
+  const newCount = parseInt(countEl?.value || '16')
+
+  // Read current values from the existing rows
+  const ports: PortInfo[] = []
+  for (let i = 0; i < newCount; i++) {
+    const nameEl = document.querySelector(`.port-name[data-idx="${i}"]`) as HTMLInputElement | null
+    const hotkeyEl = document.querySelector(`.port-hotkey[data-idx="${i}"]`) as HTMLInputElement | null
+    const showEl = document.querySelector(`.port-show[data-idx="${i}"]`) as HTMLInputElement | null
+    ports.push({
+      index: i,
+      name: nameEl?.value || '',
+      hotkey: hotkeyEl?.value || '',
+      show_in_rc: showEl?.checked || false,
+    })
+  }
+
+  renderPortRows(ports, currentActivePort)
+}
+
 async function savePorts() {
   const countEl = document.getElementById('port-count') as HTMLSelectElement
   const pauseEl = document.getElementById('key-pause') as HTMLInputElement

crates/ericrfb-frontend/src/style.css

@@ -126,6 +126,44 @@ body {
 .toolbar .status { margin-left: auto; color: #888; }
 .toolbar .status.connected { color: #4a7c59; }
 
+/* Send Key dropdown */
+.sendkey-wrap {
+  position: relative;
+}
+
+.sendkey-menu {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  z-index: 100;
+  background: #2a2a2a;
+  border: 1px solid #444;
+  border-radius: 4px;
+  padding: 0.25rem 0;
+  min-width: 160px;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
+}
+
+.sendkey-menu button {
+  display: block;
+  width: 100%;
+  padding: 0.35rem 0.75rem;
+  border: none;
+  background: none;
+  color: #ccc;
+  text-align: left;
+  cursor: pointer;
+  font-size: 0.8rem;
+}
+
+.sendkey-menu button:hover { background: #383838; }
+
+.sendkey-menu hr {
+  border: none;
+  border-top: 1px solid #3a3a3a;
+  margin: 0.2rem 0;
+}
+
 /* Console canvas */
 .console-wrap {
   flex: 1;
@@ -141,6 +179,48 @@ body {
   cursor: none;
 }
 
+/* Port switch overlay */
+.switch-overlay {
+  position: absolute;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.75);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 50;
+}
+
+.switch-overlay-content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 0.75rem;
+  color: #ccc;
+  font-size: 0.9rem;
+}
+
+.switch-spinner {
+  width: 32px;
+  height: 32px;
+  border: 3px solid #444;
+  border-top-color: #4a7c59;
+  border-radius: 50%;
+  animation: spin 0.8s linear infinite;
+}
+
+.switch-timer {
+  font-variant-numeric: tabular-nums;
+  color: #888;
+  font-size: 0.8rem;
+}
+
+@keyframes spin { to { transform: rotate(360deg); } }
+
+/* Console wrap needs position for overlay */
+.console-wrap {
+  position: relative;
+}
+
 /* Ports config page */
 .ports-page {
   padding: 1.5rem;

crates/ericrfb-proxy/src/kvm.rs

@@ -83,7 +83,14 @@ fn extract_input_value(html: &str, name: &str) -> Option<String> {
     let val_needle = "value=\"";
     let val_pos = after.find(val_needle)? + val_needle.len();
     let end = after[val_pos..].find('"')? + val_pos;
-    Some(after[val_pos..end].to_string())
+    Some(html_unescape(&after[val_pos..end]))
+}
+
+fn html_unescape(s: &str) -> String {
+    s.replace("&gt;", ">")
+        .replace("&lt;", "<")
+        .replace("&amp;", "&")
+        .replace("&quot;", "\"")
 }
 
 fn extract_selected_option(html: &str, name: &str) -> Option<String> {
@@ -93,10 +100,7 @@ fn extract_selected_option(html: &str, name: &str) -> Option<String> {
     // Find "selected>" then the text until newline or '<'
     let sel_pos = after.find("selected>")?;
     let text_start = sel_pos + "selected>".len();
-    let text_end = after[text_start..]
-        .find(['<', '\n'])
-        .unwrap_or(0)
-        + text_start;
+    let text_end = after[text_start..].find(['<', '\n']).unwrap_or(0) + text_start;
     Some(after[text_start..text_end].trim().to_string())
 }
 
@@ -175,6 +179,8 @@ pub async fn save_ports(
     let cookie = get_cookie(&state).await?;
 
     let mut form: Vec<(String, String)> = vec![
+        // Hidden template field required by the firmware
+        ("__templates__".into(), " kvm_port_list kvm".into()),
         ("ECG_kvm_nr_ports".into(), req.port_count.to_string()),
         (
             "ECG_key_pause_duration".into(),
@@ -182,6 +188,7 @@ pub async fn save_ports(
         ),
         ("ECG_kvm_portname_cnt".into(), req.port_count.to_string()),
         ("ECG_kvm_hotkey_cnt".into(), req.port_count.to_string()),
+        ("ECG_kvm_powerport_cnt".into(), req.port_count.to_string()),
         ("ECG_kvm_show_in_rc_cnt".into(), req.port_count.to_string()),
     ];
 
@@ -199,7 +206,9 @@ pub async fn save_ports(
         }
     }
 
-    form.push(("action_apply".into(), "Apply".into()));
+    // Image button submits with .x/.y coordinates
+    form.push(("action_apply.x".into(), "0".into()));
+    form.push(("action_apply.y".into(), "0".into()));
 
     let resp = state
         .http_client
@@ -233,8 +242,13 @@ pub async fn switch_port(
     let cookie = get_cookie(&state).await?;
 
     let form = [
+        (
+            "__templates__",
+            " kvm_port_list rc_preview power_control_ipmi power_control_intern power_control_direct".to_string(),
+        ),
         ("kvm_active_port_0", req.port.to_string()),
-        ("action_switch_0", "Switch".into()),
+        ("action_switch_0.x", "0".into()),
+        ("action_switch_0.y", "0".into()),
     ];
 
     state