From ef7f02e19f60bbfe1df19a6f1d6c93b673d8bae1 Mon Sep 17 00:00:00 2001 From: Hitonabi Date: Sat, 20 Jun 2026 21:44:38 +0200 Subject: [PATCH] feat: guides (Feature 7) --- ROADMAP.md | 22 +++++----- static/index.html | 6 ++- static/js/main.js | 3 +- static/js/panels/guides.js | 84 ++++++++++++++++++++++++++++++++++++++ 4 files changed, 102 insertions(+), 13 deletions(-) create mode 100644 static/js/panels/guides.js diff --git a/ROADMAP.md b/ROADMAP.md index 42db3c3..25de712 100644 --- a/ROADMAP.md +++ b/ROADMAP.md @@ -15,19 +15,15 @@ Modell-Listen, Aktivitäts-Stream) angelehnt an `docs/mission-control-overview.p **✅ Schritt 2 erledigt & live** — *Feature 3: Live-Auslastung*. `system.py` Router mit `psutil` und sysfs für CPU/RAM/Disk/GPU/Temp. **Reihenfolge (abgestimmt):** Design/Architektur zuerst (✅), dann Quick Wins, Security-Brocken zuletzt: -`1 (✅) Fundament → 2 (✅) Feature 3 Live-Auslastung → 3 (✅) Feature 6 Mehr LLM-Metriken → 4 (✅) Feature 1 Server-Management → 5 (✅) Feature 4 Cookbook → [6] Feature 7 Integrations-Anleitungen ← NÄCHSTES → Feature 2`. +`1 (✅) Fundament → 2 (✅) Feature 3 Live-Auslastung → 3 (✅) Feature 6 Mehr LLM-Metriken → 4 (✅) Feature 1 Server-Management → 5 (✅) Feature 4 Cookbook → 6 (✅) Feature 7 Integrations-Anleitungen → [7] Feature 2 Live-Terminal ← NÄCHSTES`. **Arbeitsweise je Schritt:** neuer `routers/.py` + `js/panels/.js` + Nav-Eintrag, sauber degradierend. Bauen + Smoke-Test auf Windows, dann push→pull→rsync→restart auf den Bosgame (CLAUDE.md „Entwickeln & Deployen"). Ein Commit je Schritt. **Ich (KI) habe key-basierten SSH-Zugang zum Bosgame und kann selbst deployen+restarten.** -**→ Nächster Schritt konkret = Feature 7 (Integrations-Anleitungen).** -- Unter "Guides" (neuer Tab links) gibt es Copy-Paste Templates. -- Templates für die Integration von llama-swap/mission-control in: - - Cline / Cursor - - N8N / Zapier - - OpenWebUI - - LangChain / Python Code +**→ Nächster Schritt konkret = Feature 2 (Live-Terminal / Log via SSH).** +- Unter "Server" -> "Console" soll man das Journal oder den direkten Output verfolgen können. +- Wahrscheinlich reicht auch schon ein simpler "Log" Endpunkt, der `journalctl -u llama-swap -n 100 -f` über Websockets liefert. --- @@ -68,9 +64,13 @@ Aktuell gibt es nur "Container aktualisieren" + "Alles aus dem Speicher". Ziel: - [x] Tokens/Sek, Kontextgröße, Quant, Dateigröße auf Platte - [x] Status pro Modell: geladen / idle / Ladezeit -### 7. Integrations-Anleitungen -- [ ] Eingebaute Guides: wie man die LLMs in andere Tools bekommt (OpenCode für Windows, Cline, …) -- [ ] Copy-Paste-fertige Configs (Base-URL, Modell-IDs) +### 7. Integrations-Anleitungen (Copy-Paste) (✅ Erledigt) +- [x] Unter "Guides" (neuer Tab links) gibt es Copy-Paste Templates. +- [x] Templates für die Integration von llama-swap/mission-control in: + - Cline / Cursor + - N8N / Zapier + - OpenWebUI + - LangChain / Python Code --- diff --git a/static/index.html b/static/index.html index 1509b2b..ab70a97 100644 --- a/static/index.html +++ b/static/index.html @@ -19,7 +19,7 @@ - +
@@ -65,6 +65,10 @@ + +
diff --git a/static/js/main.js b/static/js/main.js index 8486a0f..efcd376 100644 --- a/static/js/main.js +++ b/static/js/main.js @@ -10,8 +10,9 @@ import models from "./panels/models.js"; import maintenance from "./panels/maintenance.js"; import jobs from "./panels/jobs.js"; import cookbook from "./panels/cookbook.js"; +import guides from "./panels/guides.js"; -const panels = [overview, models, maintenance, jobs, cookbook]; +const panels = [overview, models, maintenance, jobs, cookbook, guides]; let lastJobs = []; let lastSystem = null; diff --git a/static/js/panels/guides.js b/static/js/panels/guides.js new file mode 100644 index 0000000..1411524 --- /dev/null +++ b/static/js/panels/guides.js @@ -0,0 +1,84 @@ +import { $ } from "../core/ui.js"; + +let currentUrl = "http://localhost:8000"; + +function render() { + const c = document.querySelector(".view[data-view='guides']"); + if (!c) return; + + c.innerHTML = ` +
+
+

Cline / Cursor

+

Nutze llama-swap als lokalen OpenAI-kompatiblen Provider in Cursor oder Cline.

+ + + + + + +
+ +
+

OpenWebUI

+

Füge llama-swap in OpenWebUI als externe OpenAI-Verbindung hinzu.

+ + + + +

+ OpenWebUI zieht sich danach automatisch alle geladenen Modelle. +

+
+ +
+

Python / LangChain (OpenAI SDK)

+

Nutze das offizielle openai Package, um mit llama-swap zu sprechen.

+ 
from openai import OpenAI
+
+client = OpenAI(
+    base_url="${currentUrl}/v1",
+    api_key="Dein_Token" # Optional, falls in Mission Control konfiguriert
+)
+
+response = client.chat.completions.create(
+    model="coder", # Alias aus deinem Cookbook
+    messages=[{"role": "user", "content": "Hallo Modell!"}]
+)
+
+print(response.choices[0].message.content)
+
+ +
+

n8n / Zapier / HTTP Node

+

Führe direkte HTTP POST Requests gegen den Endpunkt aus.

+ + + + + + 
{
+  "model": "coder",
+  "messages": [
+    { "role": "user", "content": "Erkläre mir Quantisierung." }
+  ]
+}
+
+
+ `; +} + +function mount() { + render(); +} + +function onStatus(s) { + if (s && s.swap_url) { + if (currentUrl !== s.swap_url) { + currentUrl = s.swap_url; + render(); // Neu rendern, wenn sich die URL ändert + } + } +} + +export default { id: "guides", mount, onStatus };