rotation vorbereitung

public/calibration_arm.html

@@ -1,28 +1,42 @@
 <div class="sections">
 
   <div class="section full">
-    <h2>Arm1 / Arm2 <span class="status-badge open">offen</span></h2>
-    <div class="placeholder-note">
-      Ziel: Nullposition und Kinematikparameter von Arm1 und Arm2 einmessen.
-      Arm fährt in mechanische Nullposition, Kamera prüft die tatsächliche Pose,
-      Offset wird berechnet und gespeichert.<br><br>
-      Geplante Aktionen: Arm1 → Nullpos → Foto → Winkel · Arm2 → Nullpos → Foto →
-      Winkel · Offset-Korrektur speichern.<br><br>
-      <em>Aktionen werden ergänzt sobald das Konzept feststeht.</em>
+    <h2>Arm1 – Y-Achse <span class="status-badge open">offen</span></h2>
+    <div class="info-grid" style="margin-top:14px">
+      <span class="info-label">Ziel</span>
+      <span class="info-value" style="font-family:inherit;font-size:13px;color:var(--muted)">
+        Y-Rotationsachse von Arm1 bestimmen: drei Positionen aufnehmen, Umkreismittelpunkte berechnen.
+      </span>
+      <span class="info-label">Ablauf</span>
+      <span class="info-value" style="font-family:inherit;font-size:13px;color:var(--muted)">
+        Board erkennen (Pos A) → Arm1 drehen → Board erkennen (Pos B) → Arm1 drehen → Board erkennen (Pos C)
+        → Viewer zeigt berechnete Rotationsachse (magenta)
+      </span>
+      <span class="info-label">Letzter Run</span>
+      <span class="info-value" id="arm1-last-run">–</span>
     </div>
-    <div class="controls" style="margin-top: 14px;">
-      <button disabled>Arm1 → Nullpos</button>
-      <button disabled>Foto Arm1</button>
-      <button disabled>Arm2 → Nullpos</button>
-      <button disabled>Foto Arm2</button>
-      <button disabled>Offsets berechnen</button>
-      <button disabled>Speichern</button>
+    <div class="controls" style="margin-top:16px">
+      <button id="btn-arm1-run">Board erkennen</button>
     </div>
   </div>
 
   <div class="section full">
     <h2>Ausgabe / Log</h2>
-    <textarea id="log-arm" readonly placeholder="(Ausgabe erscheint hier)"></textarea>
+    <textarea id="log-arm1" readonly placeholder="(Ausgabe erscheint hier)"></textarea>
+  </div>
+
+  <div class="section full">
+    <h2>Board-Viewer</h2>
+    <p style="font-size:12px;color:var(--muted);margin-bottom:10px">
+      <strong>Pos A</strong> (Basis) · <strong>Pos B</strong> (orange) · <strong>Pos C</strong> (cyan) –
+      alle drei Timestamps sind vorgewählt. Sobald Pos C gesetzt ist, wird die Rotationsachse berechnet.
+    </p>
+    <iframe
+      id="arm1-viewer-frame"
+      src="/boardViewer.html?defaults=abc"
+      style="width:100%;height:740px;border:1px solid #334155;border-radius:6px;background:#0d0f13;display:block"
+      title="Board-Viewer (Arm1)"
+    ></iframe>
   </div>
 
 </div>