Add WallPlotter p5 library with zigzag example.

Standalone package for Marlin polargraph control over Web Serial, including API docs and a runnable zigzag sketch. Co-authored-by: Cursor <cursoragent@cursor.com>
2026-08-14 18:36:23 +02:00
commit e293b2f434
6 changed files with 1488 additions and 0 deletions
@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Wall Plotter — zigzag</title>
+    <style>
+      * {
+        box-sizing: border-box;
+        margin: 0;
+      }
+      body {
+        background: #1c1c20;
+        color: #ddd;
+        font-family: system-ui, sans-serif;
+        min-height: 100vh;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        padding: 1rem;
+      }
+      h1 {
+        font-size: 1.1rem;
+        font-weight: 500;
+        margin-bottom: 0.75rem;
+        opacity: 0.85;
+      }
+      main {
+        border-radius: 8px;
+        overflow: hidden;
+        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
+      }
+      p.note {
+        max-width: 800px;
+        margin-top: 1rem;
+        font-size: 0.85rem;
+        line-height: 1.5;
+        opacity: 0.7;
+      }
+      code {
+        background: #2a2a30;
+        padding: 0.1em 0.35em;
+        border-radius: 4px;
+      }
+    </style>
+    <script src="https://cdn.jsdelivr.net/npm/p5@1.11.3/lib/p5.min.js"></script>
+    <script src="../../lib/WallPlotter.js"></script>
+    <script src="sketch.js"></script>
+  </head>
+  <body>
+    <h1>Wall Plotter — zigzag example</h1>
+    <main id="sketch-host"></main>
+    <p class="note">
+      Serve from the <code>p5-wallplotter</code> folder:
+      <code>python -m http.server 8080</code>
+      then open <code>http://localhost:8080/examples/zickzack/</code>.
+      Chrome or Edge. Press <code>C</code> to connect, <code>H</code> to set home.
+    </p>
+  </body>
+</html>