97 lines
4.7 KiB
HTML
97 lines
4.7 KiB
HTML
<div class="sections">
|
||
|
||
<!-- ── Aktuelle Marker ──────────────────────────────────────────────────── -->
|
||
<div class="section full">
|
||
<h2>Aktuelle Marker <span class="status-badge open">aus robot.json</span></h2>
|
||
<p style="font-size:12px;color:var(--muted);margin-top:8px;margin-bottom:10px">
|
||
Arm-Marker aller Links (Board-Marker ausgeblendet). Spin = Drehung um die Marker-Normale in Grad.
|
||
</p>
|
||
<div id="marker-table-wrap">
|
||
<p style="font-size:12px;color:var(--muted)">(wird geladen …)</p>
|
||
</div>
|
||
<div class="controls" style="margin-top:12px">
|
||
<button id="btn-marker-reload">Neu laden</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ── Aktionen ─────────────────────────────────────────────────────────── -->
|
||
<div class="section full">
|
||
<h2>Aktionen</h2>
|
||
|
||
<!-- Auswahl Link / Marker -->
|
||
<div style="margin-top:14px;display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:12px;color:var(--text)">
|
||
<label>Link
|
||
<select id="marker-action-link"
|
||
style="margin-left:6px;background:#1e293b;border:1px solid #334155;color:#c8cdd8;border-radius:3px;padding:3px 8px;font:inherit;font-size:12px;cursor:pointer">
|
||
<option value="Arm1">Arm1</option>
|
||
<option value="Ellbow">Ellbow</option>
|
||
<option value="Arm2">Arm2</option>
|
||
<option value="Hand">Hand</option>
|
||
<option value="Palm">Palm</option>
|
||
<option value="FingerA">FingerA</option>
|
||
<option value="FingerB">FingerB</option>
|
||
</select>
|
||
</label>
|
||
|
||
<label>Marker-ID
|
||
<select id="marker-action-id"
|
||
style="margin-left:6px;background:#1e293b;border:1px solid #334155;color:#c8cdd8;border-radius:3px;padding:3px 8px;font:inherit;font-size:12px;cursor:pointer">
|
||
<option value="">– wählen –</option>
|
||
</select>
|
||
</label>
|
||
|
||
<span id="marker-spin-current" style="color:var(--muted);font-size:11px">–</span>
|
||
</div>
|
||
|
||
<!-- Spin-Aktionen -->
|
||
<div style="margin-top:12px">
|
||
<p style="font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px">
|
||
Spin (Drehung um Marker-Normale)
|
||
</p>
|
||
<div style="display:flex;flex-wrap:wrap;gap:8px;align-items:center">
|
||
<button id="btn-spin-minus90"
|
||
style="background:#1e293b;color:#c8cdd8;border:1px solid #334155;border-radius:3px;padding:5px 14px;cursor:pointer;font:inherit;font-size:12px">
|
||
−90°
|
||
</button>
|
||
<button id="btn-spin-plus90"
|
||
style="background:#1e293b;color:#c8cdd8;border:1px solid #334155;border-radius:3px;padding:5px 14px;cursor:pointer;font:inherit;font-size:12px">
|
||
+90°
|
||
</button>
|
||
<button id="btn-spin-180"
|
||
style="background:#1e293b;color:#c8cdd8;border:1px solid #334155;border-radius:3px;padding:5px 14px;cursor:pointer;font:inherit;font-size:12px">
|
||
180°
|
||
</button>
|
||
<span style="font-size:10px;color:var(--muted)">→ wird sofort in robot.json gespeichert und im Viewer aktualisiert</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Ergebnis -->
|
||
<div id="marker-action-result" style="margin-top:10px;font-size:11px;min-height:18px;color:var(--muted)"></div>
|
||
</div>
|
||
|
||
<!-- ── Log ──────────────────────────────────────────────────────────────── -->
|
||
<div class="section full">
|
||
<h2>Log</h2>
|
||
<textarea id="log-marker" readonly placeholder="(Aktionen erscheinen hier)"
|
||
style="height:100px"></textarea>
|
||
</div>
|
||
|
||
<!-- ── Viewer ───────────────────────────────────────────────────────────── -->
|
||
<div class="section full">
|
||
<h2>Viewer</h2>
|
||
<p style="font-size:12px;color:var(--muted);margin-bottom:10px">
|
||
Zeigt das Roboter-Modell mit den Arm-Markern in der aktuellen robot.json-Konfiguration.
|
||
Sind Homing-Messwerte vorhanden (aus letztem Homing-Run), werden auch die beobachteten Marker
|
||
als Kugeln und die Abweichungs-Linien dargestellt.
|
||
Nach einer Spin-Änderung wird der Viewer automatisch neu geladen.
|
||
</p>
|
||
<iframe
|
||
id="marker-viewer-frame"
|
||
src="/boardViewer.html?mode=homing"
|
||
style="width:100%;height:740px;border:1px solid #334155;border-radius:6px;background:#0d0f13;display:block"
|
||
title="Marker-Viewer"
|
||
></iframe>
|
||
</div>
|
||
|
||
</div>
|