appRobotHoming/public/calibration_arm.html

<div class="sections">

  <div class="section full">
    <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:16px">
      <button id="btn-arm1-run">Board erkennen</button>
    </div>
  </div>

  <!-- ── Aktionen ───────────────────────────────────────────────────────────── -->
  <div class="section full">
    <h2>Aktionen</h2>

    <!-- Roboter-Bewegung -->
    <div style="margin-top:14px;display:flex;align-items:center;gap:20px;flex-wrap:wrap">
      <button id="btn-arm1-ccw" style="font-size:18px;padding:6px 22px" title="Bieps rauf">
        ⤴ Rauf
      </button>
      <span style="color:var(--muted);font-size:11px">Roboter-Bieps drehen (Schrittweite folgt)</span>
      <button id="btn-arm1-cw" style="font-size:18px;padding:6px 22px" title="Bieps runter">
        Runter ⤵
      </button>
    </div>

    <!-- Kalibrierungs-Aktionen (erscheinen wenn Rotation erkannt wurde) -->
    <div id="arm1-calib-actions" style="display:none;margin-top:20px;border-top:1px solid var(--border);padding-top:16px">
      <p style="font-size:11px;color:var(--muted);margin-bottom:12px">
        Aktionen aus erkannter Rotation (3 Positionen):
      </p>

      <!-- Aktion 1: Fixe Marker dem Base-Link zuordnen -->
      <div style="display:flex;align-items:flex-start;gap:12px;margin-bottom:14px;flex-wrap:wrap">
        <button id="btn-arm1-assign-fixed" disabled
          style="min-width:220px;padding:6px 14px;opacity:.45;cursor:not-allowed"
          title="Marker, die sich kaum bewegen, dem Link 'Base' zuordnen">
          Fixe Marker → Link «Base»
        </button>
        <span id="arm1-assign-fixed-info"
          style="font-size:11px;color:var(--muted);max-width:360px;line-height:1.5">
          Marker, die sich kaum bewegen, sind physisch am Basis-Körper befestigt.
          Diese Aktion trägt sie in robot.json unter «Base» ein.
        </span>
      </div>

      <!-- Aktion 2: Joint-Origin Y/Z aus Drehachse -->
      <div style="display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap">
        <button id="btn-arm1-set-origin" disabled
          style="min-width:220px;padding:6px 14px;opacity:.45;cursor:not-allowed"
          title="Y und Z des Schulter-Joints aus der berechneten Drehachse setzen">
          Joint-Origin Y/Z übernehmen
        </button>
        <span id="arm1-set-origin-info"
          style="font-size:11px;color:var(--muted);max-width:360px;line-height:1.5">
          Setzt Y und Z des Arm1-Joints (Schulter) in robot.json auf die
          berechnete Drehachsen-Position.
        </span>
      </div>
    </div>
  </div>

  <div class="section full">
    <h2>Ausgabe / Log</h2>
    <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>