appRobotFileservice — Web-UI (Datei-Browser)

Stand: 2026-06-15
Beschreibt den implementierten Ist-Zustand der Browser-Oberfläche auf Port 2100.

Implementierter Funktionsumfang

Dateien: public/index.html, public/index.css

Programm-Liste (linke Spalte)

Feature	Status	Endpunkt
Programme auflisten	✅	`GET /api/programs?dir=`
Unterordner auflisten	✅	`GET /api/folders?dir=`
Breadcrumb-Navigation	✅	—
In Unterordner navigieren (Klick)	✅	—
Programm laden (Einzelklick)	✅	`PUT /api/active`
Neue Datei anlegen (📄+)	✅	`POST /api/programs`
Neuen Ordner anlegen (📁+)	✅	`POST /api/folders`
Auswahl löschen (🗑) — Datei oder Ordner	✅	`DELETE /api/programs/:id` / `DELETE /api/folders/:name`
Ordner-Löschen rekursiv	✅	`DELETE /api/folders/:name?dir=`
Auto-Refresh (5 s Polling)	✅	—

Aktives Programm (rechte Spalte)

Feature	Status	Endpunkt
Aktives Programm anzeigen (Zeilenliste in Grad)	✅	`GET /api/active`
Cursor in Tabelle hervorheben + auto-scrollen	✅	—
Stepping: First / Prev / Next / Last	✅	`POST /api/active/first
Programm leeren (FClear)	✅	`POST /api/active/clear`
Download `.gcode`	✅	`GET /api/programs/:id/download`
Zeilen löschen (🗑 pro Zeile, pending-State)	✅	`DELETE /api/active/lines/:index`
Abbrechen / Speichern Edit-Bar	✅	—

Navigieren / Senden Toggle (rechts in Controls-Zeile)

Feature	Status	Details
Modus-Schalter `↕ Navigieren` / `▶ Senden`	✅	Drei-Gruppen-Layout
Navigieren-Modus: nur Cursor bewegen	✅	`POST /api/active/next`
Senden-Modus: G-Code-Zeile an Driver senden	✅	`POST /api/active/next?execute=true`
Pfeil-Buttons während Fahrt gesperrt	✅	Bis HTTP-Antwort kommt
Driver-Fehlermeldung im UI anzeigen	✅	HTTP 502 → Statuszeile
Senden-Button deaktiviert wenn kein Driver	✅	`GET /api/config` beim Start

Architektur

Browser (index.html)
  │
  ├──[Navigieren]─► POST /api/active/next         (Fileservice)
  │                 Cursor +1, ;! in .gcode gespeichert
  │
  └──[Senden]──────► POST /api/active/next?execute=true  (Fileservice)
                      Fileservice: Cursor +1, sendet G-Code-Zeile
                      │  server-seitig (lokales Netz)
                      └──► appRobotDriver WS
                            Inverse Kinematik → GRBL → Roboter
                            M114-Broadcast / Fehler zurück an Fileservice
                      Fileservice → HTTP 200 (OK) oder 502 (Driver-Fehler)

Der Browser verbindet sich niemals direkt mit dem Driver — der Fileservice ist die einzige Aussenschnittstelle.

Cursor-Persistenz

Der Cursor wird als ;!-Marker direkt in der .gcode-Datei gespeichert (primäre Quelle, sichtbar in jedem Texteditor). Das .json-Sidecar enthält cursor nur noch als Fallback für Altdateien ohne Marker.

G90 G1 x0 y300 z0 a90.00 b-90.00 c0.00 e0.00 f1000 ;1
G90 G1 x10 y300 z0 a0.00 b-90.00 c0.00 e0.00 f1000 ;2!   ← Cursor-Zeile

store.read() liefert immer saubere Zeilen (kein !) und cursor als Index.

Echte Unterverzeichnisse in GCodeFiles/ (max. 5 Ebenen tief)
Segmente validiert mit /^[a-z0-9_-]+$/
dir-Parameter in allen relevanten Endpoints (?dir=training/run1)
Breadcrumb: klickbare Segmente, Root = GCodeFiles

Noch nicht implementiert / offene Punkte

Feature	Priorität	Hinweis
Upload `.gcode` vom Desktop	P2	`POST /api/programs/upload` (multipart)
Programm umbenennen	P2	`PUT /api/programs/:id` (Backend vorhanden, UI fehlt)
Zeile inline bearbeiten	P3	`PUT /api/active/lines/:index` (Backend vorhanden)
Zeile einfügen	P3	`POST /api/active/lines { atIndex }` (Backend vorhanden)
Live-Updates via SSE	P4	statt 5s-Polling; `GET /api/events`
`FPlay` / `FStop` im Browser	P4	Playback-Modus

Datei-Übersicht

public/
  index.html     HTML + JavaScript (inline)
  index.css      Design-System (dark, CSS-Variablen)
src/
  server.js      GET /api/config → driverConfigured
  driverClient.js  WS-Client zum Driver (für Senden-Modus)
  routes/
    programs.js  /api/programs* inkl. /download
    active.js    /api/active* mit ?execute=true für Step-Routes
    folders.js   /api/folders*
doc/
  fileBrowser.md            diese Datei (Ist-Zustand)
  commandsFromGCodeFile.md  Senden-Modus Konzept + Implementierungsplan

4.6 KiB Raw Blame History