Files
appRobotFileservice/doc/fileBrowser.md
2026-06-15 09:22:41 +02:00

4.6 KiB

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.


Verzeichnis-Navigation

  • 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