From 34510470cecb92ce073100e283b98d0fe8648848 Mon Sep 17 00:00:00 2001 From: Peter Goodhall Date: Wed, 28 May 2025 14:31:22 +0100 Subject: [PATCH] feat: Add auto-reconnect functionality for Web Serial API - Implement autoReconnect() function to automatically reconnect to previously authorized serial devices on page load - Use navigator.serial.getPorts() to retrieve previously connected ports - Add graceful error handling for auto-reconnect failures - Improve disconnect() function with null check for port - Eliminates need for manual reconnection after page refresh - Maintains backward compatibility with existing functionality Fixes issue where Web Serial connection was lost on page refresh, requiring users to manually reconnect their devices each time. --- assets/js/winkey.js | 45 +++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 43 insertions(+), 2 deletions(-) diff --git a/assets/js/winkey.js b/assets/js/winkey.js index c6195fe9..89b02e4a 100644 --- a/assets/js/winkey.js +++ b/assets/js/winkey.js @@ -88,6 +88,45 @@ async function clickConnect() { //Define outputstream, inputstream and port so they can be used throughout the sketch var outputStream, inputStream, port; + +// Auto-reconnect functionality +async function autoReconnect() { + try { + // Get previously connected ports + const ports = await navigator.serial.getPorts(); + if (ports.length > 0) { + // Try to reconnect to the first available port + port = ports[0]; + await port.open({ baudRate: 1200 }); + await port.setSignals({ dataTerminalReady: true }); + + statusBar.innerText = "Auto-reconnected"; + connectButton.innerText = "Disconnect"; + + let decoder = new TextDecoderStream(); + inputDone = port.readable.pipeTo(decoder.writable); + inputStream = decoder.readable; + + const encoder = new TextEncoderStream(); + outputDone = encoder.readable.pipeTo(port.writable); + outputStream = encoder.writable; + + writeToByte("0x00, 0x02"); + writeToByte("0x02, 0x00"); + + $('#winkey_buttons').show(); + + reader = inputStream.getReader(); + readLoop(); + } + } catch (e) { + console.log("Auto-reconnect failed:", e); + // If auto-reconnect fails, just continue with normal flow + } +} + +// Call auto-reconnect when page loads +window.addEventListener('load', autoReconnect); navigator.serial.addEventListener('connect', e => { statusBar.innerText = `Connected to ${e.port}`; connectButton.innerText = "Disconnect" @@ -182,8 +221,10 @@ async function disconnect() { statusBar.innerText = "Disconnected"; connectButton.innerText = "Connect" //Close the port. - await port.close(); - port = null; + if (port) { + await port.close(); + port = null; + } } //When the send button is pressed