Add disconnect button, fix memory leaks

Stevie-Ray · Oct 25, 2024 · c131f37 · c131f37
1 parent b5f929f
commit c131f37
Show file tree

Hide file tree

Showing 14 changed files with 275 additions and 221 deletions.
diff --git a/examples/chart/package.json b/examples/chart/package.json
@@ -19,7 +19,7 @@
   "devDependencies": {
     "@types/w3c-web-serial": "^1.0.7",
     "typescript": "^5.6.3",
-    "vite": "^5.4.9"
+    "vite": "^5.4.10"
   },
   "workspaces": [
     "examples"

diff --git a/examples/chart/src/devices.ts b/examples/chart/src/devices.ts
@@ -64,6 +64,19 @@ export function setupDevice(massesElement: HTMLDivElement, outputElement: HTMLDi
       deviceName.innerHTML = `${device.constructor.name}`
       deviceControlDiv.appendChild(deviceName)
 
+      // Create the "Disconnect" button
+      const disconnectButton = document.createElement("button")
+      disconnectButton.innerHTML = `
+    <div>
+      <i class="fa-solid fa-link-slash"></i>
+    </div>
+    <div>Disconnect</div>
+  `
+      disconnectButton.addEventListener("click", async () => {
+        await device.disconnect()
+      })
+      deviceControlDiv.appendChild(disconnectButton)
+
       // Create the "Stop" button
       const streamButton = document.createElement("button")
       streamButton.innerHTML = `

diff --git a/examples/chart/src/icons.ts b/examples/chart/src/icons.ts
@@ -7,6 +7,7 @@ import {
   faDownload,
   faGamepad,
   faGlobe,
+  faLinkSlash,
   faScaleBalanced,
   faStop,
   faPlay,
@@ -32,6 +33,7 @@ export function setupFontAwesome() {
     faGamepad,
     faGithub,
     faGlobe,
+    faLinkSlash,
     faScaleBalanced,
     faStop,
     faPlay,

diff --git a/examples/chart/src/style.css b/examples/chart/src/style.css
@@ -117,14 +117,14 @@ h2 {
 
 .input {
   display: grid;
-  grid-template-columns: 1fr 1fr 1fr;
+  grid-template-columns: repeat(4, 1fr);
   align-items: center;
   justify-content: center;
   gap: 0.5rem;
   width: 100%;
 }
 .input > button {
-  grid-column: span 1;
+  grid-column: span 2;
 }
 
 .input:last-of-type {
@@ -135,7 +135,7 @@ h2 {
 }
 
 .input > strong {
-  grid-column: span 3;
+  grid-column: span 4;
   padding: 0.5rem;
 }
 
@@ -257,6 +257,10 @@ footer a:hover {
     flex: 0 0 auto;
   }
 
+  .input > button {
+    grid-column: span 1;
+  }
+
   #masses {
     min-height: 40px;
   }

diff --git a/examples/flappy-bird/package.json b/examples/flappy-bird/package.json
@@ -13,7 +13,7 @@
   },
   "devDependencies": {
     "typescript": "^5.6.3",
-    "vite": "^5.4.9"
+    "vite": "^5.4.10"
   },
   "workspaces": [
     "examples"

diff --git a/examples/kilter-board/package.json b/examples/kilter-board/package.json
@@ -13,7 +13,7 @@
   },
   "devDependencies": {
     "typescript": "^5.6.3",
-    "vite": "^5.4.9"
+    "vite": "^5.4.10"
   },
   "workspaces": [
     "examples"

diff --git a/examples/pong/package.json b/examples/pong/package.json
@@ -13,7 +13,7 @@
   },
   "devDependencies": {
     "typescript": "^5.6.3",
-    "vite": "^5.4.9"
+    "vite": "^5.4.10"
   },
   "workspaces": [
     "examples"