105 lines
3.1 KiB
HTML
Executable File
105 lines
3.1 KiB
HTML
Executable File
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<title>appRobotHoming</title>
|
||
|
||
<link rel="stylesheet" href="/styles.css">
|
||
</head>
|
||
<body>
|
||
|
||
<div class="sections">
|
||
|
||
<!-- AKTIONEN -->
|
||
<div class="section full">
|
||
<h2>Aktionen</h2>
|
||
|
||
<!-- Homing – primäre Aktion -->
|
||
<div class="controls" style="flex-wrap:wrap;gap:10px;align-items:center">
|
||
<button id="btn-homing-run">📷 Foto & Homing berechnen</button>
|
||
<button id="btn-homing-send" disabled
|
||
style="opacity:.4;cursor:not-allowed"
|
||
title="Erst Homing ausführen">
|
||
✅ An Roboter senden
|
||
</button>
|
||
<span id="homing-status" class="status-badge idle">○ Warte</span>
|
||
</div>
|
||
|
||
<!-- Fortschrittsbalken -->
|
||
<div id="homing-progress" style="display:none;margin-top:12px">
|
||
<div id="homing-progress-track">
|
||
<div id="homing-progress-bar"></div>
|
||
</div>
|
||
<span id="homing-progress-text"></span>
|
||
</div>
|
||
|
||
<!-- Sekundäre Aktionen -->
|
||
<div class="controls" style="margin-top:14px;flex-wrap:wrap;gap:8px;padding-top:12px;border-top:1px solid #1e293b">
|
||
<button data-cmd="HOME" style="font-size:12px;padding:4px 12px">HOME</button>
|
||
<button data-cmd="PING" style="font-size:12px;padding:4px 12px">PING</button>
|
||
<input
|
||
id="gcodePayload"
|
||
type="text"
|
||
placeholder="G-Code / Motorbefehl"
|
||
style="font-size:12px;padding:4px 8px"
|
||
/>
|
||
<button data-cmd="GCODEMOTOR" data-payload="#gcodePayload"
|
||
style="font-size:12px;padding:4px 12px">GCodeMotor</button>
|
||
<button id="btn-foto" style="font-size:12px;padding:4px 12px">Foto-Vorschau</button>
|
||
<a href="/calibration.html">
|
||
<button type="button" style="font-size:12px;padding:4px 12px">Kalibrierung</button>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- AUSGABE / LOG -->
|
||
<div class="section full">
|
||
<h2>Ausgabe</h2>
|
||
<textarea id="log" readonly></textarea>
|
||
</div>
|
||
|
||
<!-- ANALYSE -->
|
||
<div class="section full">
|
||
<h2>Analysis & Reasoning</h2>
|
||
<textarea id="analysis-log" readonly></textarea>
|
||
</div>
|
||
|
||
<!-- RESULT RAW JSON -->
|
||
<div class="section half">
|
||
<h2>Result – Raw JSON</h2>
|
||
<div class="panel">
|
||
<label>Raw JSON</label>
|
||
<textarea id="result-json" readonly></textarea>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- RESULT TREE VIEW -->
|
||
<div class="section half">
|
||
<h2>Result – Tree View</h2>
|
||
<div class="panel">
|
||
<label>Tree View</label>
|
||
<div id="result-tree"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- SNAPSHOT -->
|
||
<div class="section full">
|
||
<h2>Snapshot CSV</h2>
|
||
<div id="snapshot-info"></div>
|
||
<table id="snapshot-table"></table>
|
||
</div>
|
||
|
||
<div class="section full">
|
||
<h2>Snapshots</h2>
|
||
<div id="snapshot-info-picture"></div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<script src="/calculateAngles.js"></script>
|
||
<script src="/client.js"></script>
|
||
|
||
</body>
|
||
</html>
|