working prototype

Client/WebUI/static/index.html

@@ -116,6 +116,48 @@
 </div>
 
 <div id="layout-menu"></div>
+
+<!-- ── Signal style context menu ─────────────────────────────── -->
+<div id="sig-ctx-menu" style="display:none">
+  <div class="ctx-menu-header">Style: <span id="ctx-menu-key" class="ctx-menu-key"></span></div>
+  <div class="ctx-row">
+    <label>Color</label>
+    <input type="color" id="ctx-color">
+  </div>
+  <div class="ctx-row">
+    <label>Width</label>
+    <div class="ctx-btns" id="ctx-width-btns">
+      <button class="ctx-btn" data-w="1">1px</button>
+      <button class="ctx-btn active" data-w="1.5">1.5</button>
+      <button class="ctx-btn" data-w="2">2px</button>
+      <button class="ctx-btn" data-w="3">3px</button>
+    </div>
+  </div>
+  <div class="ctx-row">
+    <label>Line</label>
+    <div class="ctx-btns" id="ctx-dash-btns">
+      <button class="ctx-btn active" data-dash="solid">——</button>
+      <button class="ctx-btn" data-dash="dashed">╌╌</button>
+      <button class="ctx-btn" data-dash="dotted">·····</button>
+    </div>
+  </div>
+  <div class="ctx-row">
+    <label>Marker</label>
+    <div class="ctx-btns" id="ctx-marker-btns">
+      <button class="ctx-btn active" data-marker="none">none</button>
+      <button class="ctx-btn" data-marker="circle">●</button>
+      <button class="ctx-btn" data-marker="square">■</button>
+      <button class="ctx-btn" data-marker="cross">✕</button>
+      <button class="ctx-btn" data-marker="diamond">◆</button>
+    </div>
+  </div>
+  <div class="ctx-row">
+    <label>Size</label>
+    <input type="range" class="ctx-range" id="ctx-marker-size" min="2" max="10" value="4">
+    <span class="ctx-range-val" id="ctx-marker-size-val">4px</span>
+  </div>
+</div>
+
 <script src="/app.js"></script>
 </body>
 </html>