diff --git a/frontend/src/panels/GuidesPanel.svelte b/frontend/src/panels/GuidesPanel.svelte index 872437d..40b7f49 100644 --- a/frontend/src/panels/GuidesPanel.svelte +++ b/frontend/src/panels/GuidesPanel.svelte @@ -83,6 +83,20 @@ color: var(--fg); } + /* Source / link lines at bottom of tutorials */ + :global(.tut-sources) { + margin-top: 14px; + padding-top: 10px; + border-top: 1px solid var(--line); + font-size: 11.5px; + color: var(--mut); + } + :global(.tut-sources a) { + color: var(--accent); + text-decoration: none; + } + :global(.tut-sources a:hover) { text-decoration: underline; } + /* Code blocks inside tutorials */ :global(.tut-code) { display: block; diff --git a/frontend/src/panels/guides-data.ts b/frontend/src/panels/guides-data.ts index 57a422f..bfcb0fd 100644 --- a/frontend/src/panels/guides-data.ts +++ b/frontend/src/panels/guides-data.ts @@ -95,7 +95,8 @@ export const GUIDE_GROUPS: GuideGroup[] = [
/compact — Kontext komprimieren wenn er voll wird/clear — frischer Start, leerer KontextBevor OpenCode eine Datei ändert, fragt es nach — mit y bestätigen oder n ablehnen.
`], +Bevor OpenCode eine Datei ändert, fragt es nach — mit y bestätigen oder n ablehnen.
+Weitere Infos: opencode.ai/docs
`], ["Cline in VS Code verbinden und nutzen", `Cline ist installiert (VS Code Extension)? So richtest du es ein:
@@ -111,7 +112,8 @@ export const GUIDE_GROUPS: GuideGroup[] = [Unterschied zu OpenCode: Cline arbeitet direkt in VS Code — du siehst Änderungen sofort im Editor. - OpenCode ist besser für große, autonome Aufgaben; Cline für Aufgaben die du Schritt für Schritt begleiten willst.
`], + OpenCode ist besser für große, autonome Aufgaben; Cline für Aufgaben die du Schritt für Schritt begleiten willst. +Weitere Infos: cline.bot
`], ["OpenWebUI — chatten ohne Vorkenntnisse", `OpenWebUI ist installiert? Verbinden in 3 Schritten:
@@ -125,7 +127,8 @@ export const GUIDE_GROUPS: GuideGroup[] = [Bilder analysieren: Mit einem Vision-Modell (z.B. qwen3-vl) einfach ein Bild per Drag & Drop ins Chat-Fenster ziehen — das Modell beschreibt und analysiert es.
Gut für: Texte schreiben, übersetzen, zusammenfassen, erklären lassen, Brainstorming — - alles ohne Programmierkenntnisse.
`], + alles ohne Programmierkenntnisse. +Weitere Infos: openwebui.com
`], ], }, @@ -216,9 +219,11 @@ export const GUIDE_GROUPS: GuideGroup[] = [Wo MCPs finden? → mcp.run, - smithery.ai, - oder direkt: „Welche MCPs gibt es für [dein Werkzeug]?" im Chat fragen.
+Wo MCPs finden? + mcp.run · + smithery.ai · + modelcontextprotocol.io/servers + — oder einfach fragen: „Welche MCPs gibt es für [dein Werkzeug]?"
Merksatz: Fehlt dem Agenten eine Fähigkeit → MCP. Soll er etwas nur besser machen → Skill (nächster Abschnitt).
`], @@ -252,58 +257,97 @@ Bevor du Dateien änderst: erkläre kurz was du vorhast.Fertige Skills finden:
Eine Persona ist eine Rolle, die du dem Agenten gibst — über den System-Prompt oder - die erste Zeile deiner AGENTS.md. Sie bestimmt grundlegend wie der Agent antwortet: - Ton, Fokus, Detailtiefe und Verhalten.
-Ohne Persona: Allgemeines Sprachmodell. Mit Persona: Dein persönlicher - Senior-Entwickler, der genau weiß wie du arbeitest und was dir wichtig ist.
+ ["Die Persona — Rolle, Beziehung & Onboarding", ` +Eine Persona hat zwei Dimensionen — beide sind wichtig:
+Ein Agent der technisch gleich konfiguriert ist, verhält sich komplett anders + wenn er weiß: Du willst kurze Antworten ohne Erklärung. Oder: Du lernst noch — + ermutige mich und erkläre immer warum.
-Das Persona-Template:
+Das vollständige Persona-Template:
Du bist [Name], [Rolle]. -Dein Fokus: [Hauptaufgabe] -Dein Stil: [Kommunikationsstil — z.B. direkt, knapp, kein Smalltalk] -Sprache: Immer auf Deutsch antworten. Code-Kommentare auf Englisch. -Grenzen: [Was du ablehnst oder nachfragst statt zu raten]-
Beispiel 1 — Coding-Assistent:
+Fokus: [Was du hauptsächlich tust] +Wie du kommunizierst: [Stil — direkt/erklärend/ermutigend, kurze oder ausführliche Antworten] +Wie du mit mir umgehst: [Proaktivität, Rückfragen, Feedback-Stil, Fehlerkultur] +Sprache: Immer auf Deutsch. Code-Kommentare auf Englisch. +Grenzen: [Was du nicht tust, was du nachfragst statt zu raten] + +Beispiel 1 — Coding-Assistent (direkt, erfahren):
Du bist Alex, ein erfahrener Senior-Entwickler spezialisiert auf TypeScript und React. -Dein Fokus: Code schreiben, reviewen und erklären — immer mit konkreten Beispielen. -Dein Stil: direkt, pragmatisch. Keine unnötigen Erklärungen wenn der Code für sich spricht. -Sprache: Deutsch. Code-Kommentare auf Englisch. -Grenzen: Schreib keinen Code ohne den Kontext der Datei zu kennen. Frag lieber nach.-
Beispiel 2 — Lernbegleiter:
+Fokus: Code schreiben, reviewen, erklären — immer mit konkreten Beispielen. +Wie du kommunizierst: direkt, pragmatisch. Keine Erklärung wenn der Code für sich spricht. +Wie du mit mir umgehst: Du fragst nach bevor du loslegst wenn die Aufgabe unklar ist. + Fehler sprichst du klar an — aber ohne Schuldzuweisungen. Du machst Gegenvorschläge + wenn du eine bessere Lösung siehst, aber respektierst meine Entscheidung. +Sprache: Deutsch. Code-Kommentare auf Englisch. +Grenzen: Kein Code ohne Datei-Kontext. Keine neuen Dependencies ohne Rückfrage. + +Beispiel 2 — Lernbegleiter (geduldig, ermutigend):
Du bist Sam, eine geduldige Lernbegleiterin für Programmier-Anfänger. -Dein Fokus: Konzepte einfach erklären, Fehler ohne Kritik korrigieren, ermutigen. -Dein Stil: freundlich, mit Analogien aus dem Alltag. Fachbegriffe immer sofort erklären. + +Fokus: Konzepte erklären, Fehler korrigieren, Schritt für Schritt führen. +Wie du kommunizierst: freundlich, mit Analogien aus dem Alltag. Fachbegriffe sofort erklären. +Wie du mit mir umgehst: Du lobst Fortschritte, auch kleine. Fehler sind Lernchancen — + du zeigst was falsch war und warum, ohne zu urteilen. Du fragst ob ich es verstanden + habe bevor du weitermachst. Sprache: Immer auf Deutsch. Niemals Englisch ohne Übersetzung.-
Wo die Persona eintragen:
+Der schnellste Weg: Onboarding-Interview
+Statt die Persona selbst auszufüllen — lass den Agenten dich befragen. + Starte einen frischen Chat und gib ihm diesen Prompt:
+Ich möchte dich in mein Projekt und meinen Arbeitsstil einarbeiten. +Führe mit mir ein kurzes Interview durch — stelle mir 6–8 Fragen, +eine nach der anderen — um zu verstehen: + +1. Wer ich bin und wie ich am liebsten kommuniziere +2. Was unser Projekt ist und welches Ziel es hat +3. Was ich gut kann und wobei ich Unterstützung brauche +4. Meine Arbeitsgewohnheiten und Präferenzen +5. Was mir wichtig ist und was mich stört + +Wenn du alle Antworten hast, erstelle daraus: +- Eine vollständige AGENTS.md als dauerhaftes Fundament +- Einen Satz der zusammenfasst wer ich für dich bin+
Das Ergebnis: eine maßgeschneiderte Persona die wirklich zu dir passt — + weil du sie nicht selbst formulieren musstest, sondern im Gespräch entstanden ist.
+ +Wo eintragen:
AGENTS.md im Projektordner.
- Gilt nur dort.AGENTS.md im Projektordner.~/.config/opencode/AGENTS.md (OpenCode)~/.config/opencode/AGENTS.md (OpenCode) ·
Settings → System Prompt (OpenWebUI)Tipp: Eine gute Persona hat immer eine Grenze - — was der Agent nicht tun soll. Das verhindert, dass er bei Unklarheiten rät statt fragt.
`], +Fertige Personas: skills.sh · cursor.directory
`], ["AGENTS.MD & SAVEPOINT.MD — Gedächtnis für den Agenten", `Jedes Mal wenn du einen neuen Chat startest, weiß der Agent nichts über dein Projekt. @@ -378,7 +422,8 @@ src/
Tipp: Lass den Agenten die SAVEPOINT.md selbst schreiben — er sieht was er getan hat. - Du prüfst nur ob der Stand stimmt und ergänzt bei Bedarf.
`], + Du prüfst nur ob der Stand stimmt und ergänzt bei Bedarf. +Vorlagen & Inspiration: skills.sh · opencode.ai/docs
`], ], }, diff --git a/static/dist/main.css b/static/dist/main.css index 87ff706..4a9963a 100644 --- a/static/dist/main.css +++ b/static/dist/main.css @@ -1 +1 @@ -.guide-card.svelte-112sh7i{padding:0;overflow:hidden;margin-bottom:8px}.guide-group-hd.svelte-112sh7i{padding:9px 18px 7px;font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--accent);background:#2dd4bf0f;border-bottom:1px solid var(--line)}.tut-table{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:6px;overflow:hidden;margin-top:8px;font-size:12.5px}.tut-row{display:grid;grid-template-columns:1fr 2fr;border-bottom:1px solid var(--line)}.tut-row:last-child{border-bottom:none}.tut-cell-hd{padding:10px 14px;font-weight:500;border-right:1px solid var(--line);background:#ffffff06;line-height:1.5}.tut-cell-hd.bad{color:var(--mut);text-decoration:line-through;font-style:italic}.tut-cell-bd{padding:10px 14px;line-height:1.6;color:var(--fg)}.tut-code{display:block;background:var(--bg, #0d0d0d);border:1px solid var(--line);border-radius:6px;padding:12px 14px;font-family:monospace;font-size:11.5px;line-height:1.65;white-space:pre;overflow-x:auto;margin:10px 0;color:var(--fg)} +.guide-card.svelte-112sh7i{padding:0;overflow:hidden;margin-bottom:8px}.guide-group-hd.svelte-112sh7i{padding:9px 18px 7px;font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--accent);background:#2dd4bf0f;border-bottom:1px solid var(--line)}.tut-table{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:6px;overflow:hidden;margin-top:8px;font-size:12.5px}.tut-row{display:grid;grid-template-columns:1fr 2fr;border-bottom:1px solid var(--line)}.tut-row:last-child{border-bottom:none}.tut-cell-hd{padding:10px 14px;font-weight:500;border-right:1px solid var(--line);background:#ffffff06;line-height:1.5}.tut-cell-hd.bad{color:var(--mut);text-decoration:line-through;font-style:italic}.tut-cell-bd{padding:10px 14px;line-height:1.6;color:var(--fg)}.tut-sources{margin-top:14px;padding-top:10px;border-top:1px solid var(--line);font-size:11.5px;color:var(--mut)}.tut-sources a{color:var(--accent);text-decoration:none}.tut-sources a:hover{text-decoration:underline}.tut-code{display:block;background:var(--bg, #0d0d0d);border:1px solid var(--line);border-radius:6px;padding:12px 14px;font-family:monospace;font-size:11.5px;line-height:1.65;white-space:pre;overflow-x:auto;margin:10px 0;color:var(--fg)} diff --git a/static/dist/main.js b/static/dist/main.js index 9a58407..8db0881 100644 --- a/static/dist/main.js +++ b/static/dist/main.js @@ -1,25 +1,25 @@ -var rl=Object.defineProperty;var Di=e=>{throw TypeError(e)};var il=(e,t,a)=>t in e?rl(e,t,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[t]=a;var rn=(e,t,a)=>il(e,typeof t!="symbol"?t+"":t,a),Wr=(e,t,a)=>t.has(e)||Di("Cannot "+a);var f=(e,t,a)=>(Wr(e,t,"read from private field"),a?a.call(e):t.get(e)),ce=(e,t,a)=>t.has(e)?Di("Cannot add the same private member more than once"):t instanceof WeakSet?t.add(e):t.set(e,a),oe=(e,t,a,r)=>(Wr(e,t,"write to private field"),r?r.call(e,a):t.set(e,a),a),Fe=(e,t,a)=>(Wr(e,t,"access private method"),a);var bi=Array.isArray,sl=Array.prototype.indexOf,Tr=Array.prototype.includes,Br=Array.from,ll=Object.defineProperty,Ya=Object.getOwnPropertyDescriptor,ol=Object.getOwnPropertyDescriptors,dl=Object.prototype,cl=Array.prototype,os=Object.getPrototypeOf,zi=Object.isExtensible;const ul=()=>{};function vl(e){for(var t=0;t${t}
${t}
`:""} - + '),bd=k('| Modell | Kann | Details | Status | Port | Aktionen |
|---|
apt update & upgrade aus. Das kann ein paar Minuten dauern; der Fortschritt erscheint in der Aktivität."}))return;const M=await Hi({title:"sudo-Passwort",body:"Für die System-Updates wird einmalig dein sudo-Passwort gebraucht.",placeholder:"sudo-Passwort",password:!0,confirmLabel:"Installieren"});if(M)try{const W=await Me("/api/os-update",{method:"POST",body:JSON.stringify({password:M})});ee("OS-Update gestartet."),p(W.job_id,"OS-Update")}catch(W){ee(W.message,!0)}}async function te(){if(!await yn({title:"Server wirklich neu starten?",body:"Der ganze Bosgame startet physisch neu. Alles ist für ~1 Minute offline — auch dieses Dashboard.",confirmLabel:"Reboot",danger:!0}))return;const M=await Hi({title:"sudo-Passwort",body:"Für den Reboot wird einmalig dein sudo-Passwort gebraucht.",placeholder:"sudo-Passwort",password:!0,confirmLabel:"Jetzt neustarten",danger:!0});if(M)try{await Me("/api/reboot",{method:"POST",body:JSON.stringify({password:M})}),ee("Reboot ausgelöst — bis gleich.")}catch(W){ee(W.message,!0)}}async function ue(){h(Ae,"prüfe…");try{const M=await Me("/api/integration/test");h(Ae,M.ok?`✓ Engine antwortet — ${M.models.length} Modell(e): ${M.models.join(", ")}`:`✗ keine Verbindung: ${M.error}`,!0),h(K,M.ok,!0)}catch(M){h(Ae,"✗ "+M.message),h(K,!1)}}let Ae=R(""),K=R(!1);const V=O(()=>{var M;return((M=n(a))==null?void 0:M.models)||[]}),fe=["running","ready","loading","starting"],he=O(()=>n(V).find(M=>fe.includes(M.state)));function De(M){if(!M||M.state!=="running")return null;if(typeof M.progress=="number")return Math.min(100,M.progress);const le=((M.log||[]).at(-1)||"").match(/(\d+(?:\.\d+)?)\s*%/);return le?Math.min(100,parseFloat(le[1])):null}var Ve=Ud(),mt=s(ct(Ve),2),A=l(mt),H=s(l(A),2),re=l(H),Ue=s(A,4),Q=l(Ue),ze=s(l(Q)),Y=l(ze),rt=s(Q,2),L=s(l(rt),2),U=l(L),ie=s(rt,2),ge=s(l(ie),2),Te=l(ge),bt=s(Ue,2),pt=l(bt),xt=s(pt,2);{var Ct=M=>{var W=Bd(),le=l(W);z(()=>{pn(W,`color:${n(K)?"#7ee29a":"#ff9b95"}`),b(le,n(Ae))}),m(M,W)};q(xt,M=>{n(Ae)&&M(Ct)})}var St=s(mt,2),$t=s(l(St),4),Ot=s($t,2),Bt=s(Ot,2),P=s(Bt,2),F=s(P,2),Ce=s(St,2),ut=s(l(Ce),4),N=s(ut,2),Le=s(Ce,2);{var J=M=>{const W=O(()=>n(E)),le=O(()=>n(W).state==="done"),Je=O(()=>n(W).state==="failed"),Qe=O(()=>n(W).state==="canceled"),Qt=O(()=>n(le)||n(Je)||n(Qe)),Zt=O(()=>De(n(W)));var Wt=Vd(),S=l(Wt),G=s(l(S),2);{var Oe=Ke=>{var ht=Id();C("click",ht,async()=>{await yn({title:n(v)+" abbrechen?",body:"Der laufende Vorgang wird gestoppt.",confirmLabel:"Abbrechen",danger:!0})&&Me(`/api/jobs/${n(W).id}/cancel`,{method:"POST"})}),m(Ke,ht)};q(G,Ke=>{n(Qt)||Ke(Oe)})}var ne=s(G,2),Ie=l(ne);{var Ze=Ke=>{var ht=qd();m(Ke,ht)},et=Ke=>{var ht=Nd();m(Ke,ht)},Se=Ke=>{var ht=Fd();m(Ke,ht)},Pe=Ke=>{var ht=Kd();m(Ke,ht)};q(Ie,Ke=>{n(le)?Ke(Ze):n(Je)?Ke(et,1):n(Qe)?Ke(Se,2):Ke(Pe,-1)})}var Re=s(S,2),Rt=l(Re),It=s(Re,2);{var Ht=Ke=>{var ht=Gd(),Rn=l(ht);z(()=>pn(Rn,`width:${n(Zt)??""}%`)),m(Ke,ht)};q(It,Ke=>{n(Zt)!=null&&!n(Qt)&&Ke(Ht)})}var an=s(It,2),bn=l(an);z(Ke=>{b(Rt,`${n(v)??""}${n(Qt)?n(le)?" — erfolgreich.":n(Qe)?" — abgebrochen.":" — fehlgeschlagen.":" läuft…"}`),b(bn,Ke)},[()=>(n(W).log||[]).join(`
-`)]),m(M,Wt)};q(Le,M=>{n(E)&&M(J)})}var de=s(Le,2),se=l(de),Z=s(l(se),2),be=l(Z);be.value=be.__value="llama-swap";var ve=s(be);ve.value=ve.__value="mission-control";var ye=s(ve);ye.value=ye.__value="system";var xe=s(se,4),_e=l(xe);Io(xe,M=>c=M,()=>c),z(M=>{var W,le,Je;pn(H,`margin-left:auto;${(W=n(a))!=null&&W.swap_ok?"background:rgba(63,185,80,.12);border-color:rgba(63,185,80,.25);color:#7ee29a":"background:rgba(248,81,73,.12);border-color:rgba(248,81,73,.3);color:#ff9b95"}`),b(re,(le=n(a))!=null&&le.swap_ok?"● erreichbar":"● offline"),b(Y,(((Je=n(a))==null?void 0:Je.swap_url)||"—")+"/v1"),b(U,n(he)?n(he).name+` (${n(he).state})`:"nichts geladen — lädt bei der nächsten Anfrage"),b(Te,M),b(_e,n(o))},[()=>n(V).filter(M=>!M.incomplete).length||"keine"]),C("click",pt,ue),C("click",$t,()=>T("llama-swap","LLM-Engine neustarten?","Die Engine startet neu. Geladene Modelle werden kurz entladen (~5 Sekunden), laden danach automatisch wieder.")),C("click",Ot,()=>T("mission-control","Dashboard neustarten?","Diese Oberfläche trennt sich kurz und verbindet automatisch wieder.")),C("click",Bt,$),C("click",P,x),C("click",F,D),C("click",ut,ke),C("click",N,te),C("change",Z,y),ar(Z,()=>n(d),M=>h(d,M)),m(e,Ve),aa()}ya(["click","change"]);var Hd=k('http://192.168.178.151:8080/v1 — nicht den Proxy-Namen.Öffne die Zed-Settings mit Cmd/Strg + , und füge diesen Block in deine bestehende settings.json ein. Falls bereits ein "bosgame"-Eintrag existiert: vorher löschen.
API-Key: Öffne den Agent-Panel → Anbieter bosgame → trag irgendeinen Wert ein (z.B. local).
Datei anlegen oder öffnen:
Windows: %USERPROFILE%\\.config\\opencode\\opencode.json
"provider"-Block einfügen. Falls bereits ein "llama-swap"-Eintrag vorhanden: vorher löschen, sonst erscheinen Modelle doppelt. Danach in OpenCode /models → wählen.
In Cline/Cursor den Provider „OpenAI Compatible" wählen:
local).Settings → Admin Panel → Connections → neue OpenAI-Verbindung:
'),bd=k('| Modell | Kann | Details | Status | Port | Aktionen |
|---|
apt update & upgrade aus. Das kann ein paar Minuten dauern; der Fortschritt erscheint in der Aktivität."}))return;const M=await Hi({title:"sudo-Passwort",body:"Für die System-Updates wird einmalig dein sudo-Passwort gebraucht.",placeholder:"sudo-Passwort",password:!0,confirmLabel:"Installieren"});if(M)try{const U=await Me("/api/os-update",{method:"POST",body:JSON.stringify({password:M})});ee("OS-Update gestartet."),p(U.job_id,"OS-Update")}catch(U){ee(U.message,!0)}}async function te(){if(!await yn({title:"Server wirklich neu starten?",body:"Der ganze Bosgame startet physisch neu. Alles ist für ~1 Minute offline — auch dieses Dashboard.",confirmLabel:"Reboot",danger:!0}))return;const M=await Hi({title:"sudo-Passwort",body:"Für den Reboot wird einmalig dein sudo-Passwort gebraucht.",placeholder:"sudo-Passwort",password:!0,confirmLabel:"Jetzt neustarten",danger:!0});if(M)try{await Me("/api/reboot",{method:"POST",body:JSON.stringify({password:M})}),ee("Reboot ausgelöst — bis gleich.")}catch(U){ee(U.message,!0)}}async function ue(){h(Ae,"prüfe…");try{const M=await Me("/api/integration/test");h(Ae,M.ok?`✓ Engine antwortet — ${M.models.length} Modell(e): ${M.models.join(", ")}`:`✗ keine Verbindung: ${M.error}`,!0),h(K,M.ok,!0)}catch(M){h(Ae,"✗ "+M.message),h(K,!1)}}let Ae=R(""),K=R(!1);const W=O(()=>{var M;return((M=n(a))==null?void 0:M.models)||[]}),fe=["running","ready","loading","starting"],he=O(()=>n(W).find(M=>fe.includes(M.state)));function $e(M){if(!M||M.state!=="running")return null;if(typeof M.progress=="number")return Math.min(100,M.progress);const le=((M.log||[]).at(-1)||"").match(/(\d+(?:\.\d+)?)\s*%/);return le?Math.min(100,parseFloat(le[1])):null}var We=Vd(),mt=s(ct(We),2),A=l(mt),H=s(l(A),2),re=l(H),Ve=s(A,4),Q=l(Ve),De=s(l(Q)),Y=l(De),rt=s(Q,2),L=s(l(rt),2),V=l(L),ie=s(rt,2),ge=s(l(ie),2),Te=l(ge),bt=s(Ve,2),pt=l(bt),xt=s(pt,2);{var Ct=M=>{var U=Id(),le=l(U);D(()=>{pn(U,`color:${n(K)?"#7ee29a":"#ff9b95"}`),b(le,n(Ae))}),m(M,U)};q(xt,M=>{n(Ae)&&M(Ct)})}var St=s(mt,2),zt=s(l(St),4),Ot=s(zt,2),It=s(Ot,2),P=s(It,2),N=s(P,2),Ce=s(St,2),ut=s(l(Ce),4),F=s(ut,2),Le=s(Ce,2);{var J=M=>{const U=O(()=>n(E)),le=O(()=>n(U).state==="done"),Je=O(()=>n(U).state==="failed"),Qe=O(()=>n(U).state==="canceled"),Qt=O(()=>n(le)||n(Je)||n(Qe)),Zt=O(()=>$e(n(U)));var Ut=Wd(),S=l(Ut),G=s(l(S),2);{var Oe=Ke=>{var ht=Bd();C("click",ht,async()=>{await yn({title:n(v)+" abbrechen?",body:"Der laufende Vorgang wird gestoppt.",confirmLabel:"Abbrechen",danger:!0})&&Me(`/api/jobs/${n(U).id}/cancel`,{method:"POST"})}),m(Ke,ht)};q(G,Ke=>{n(Qt)||Ke(Oe)})}var ne=s(G,2),Be=l(ne);{var Ze=Ke=>{var ht=qd();m(Ke,ht)},et=Ke=>{var ht=Fd();m(Ke,ht)},Se=Ke=>{var ht=Nd();m(Ke,ht)},Pe=Ke=>{var ht=Kd();m(Ke,ht)};q(Be,Ke=>{n(le)?Ke(Ze):n(Je)?Ke(et,1):n(Qe)?Ke(Se,2):Ke(Pe,-1)})}var Re=s(S,2),Rt=l(Re),Bt=s(Re,2);{var Ht=Ke=>{var ht=Gd(),Rn=l(ht);D(()=>pn(Rn,`width:${n(Zt)??""}%`)),m(Ke,ht)};q(Bt,Ke=>{n(Zt)!=null&&!n(Qt)&&Ke(Ht)})}var an=s(Bt,2),bn=l(an);D(Ke=>{b(Rt,`${n(v)??""}${n(Qt)?n(le)?" — erfolgreich.":n(Qe)?" — abgebrochen.":" — fehlgeschlagen.":" läuft…"}`),b(bn,Ke)},[()=>(n(U).log||[]).join(`
+`)]),m(M,Ut)};q(Le,M=>{n(E)&&M(J)})}var de=s(Le,2),se=l(de),Z=s(l(se),2),be=l(Z);be.value=be.__value="llama-swap";var ve=s(be);ve.value=ve.__value="mission-control";var ye=s(ve);ye.value=ye.__value="system";var xe=s(se,4),_e=l(xe);Bo(xe,M=>c=M,()=>c),D(M=>{var U,le,Je;pn(H,`margin-left:auto;${(U=n(a))!=null&&U.swap_ok?"background:rgba(63,185,80,.12);border-color:rgba(63,185,80,.25);color:#7ee29a":"background:rgba(248,81,73,.12);border-color:rgba(248,81,73,.3);color:#ff9b95"}`),b(re,(le=n(a))!=null&&le.swap_ok?"● erreichbar":"● offline"),b(Y,(((Je=n(a))==null?void 0:Je.swap_url)||"—")+"/v1"),b(V,n(he)?n(he).name+` (${n(he).state})`:"nichts geladen — lädt bei der nächsten Anfrage"),b(Te,M),b(_e,n(o))},[()=>n(W).filter(M=>!M.incomplete).length||"keine"]),C("click",pt,ue),C("click",zt,()=>T("llama-swap","LLM-Engine neustarten?","Die Engine startet neu. Geladene Modelle werden kurz entladen (~5 Sekunden), laden danach automatisch wieder.")),C("click",Ot,()=>T("mission-control","Dashboard neustarten?","Diese Oberfläche trennt sich kurz und verbindet automatisch wieder.")),C("click",It,z),C("click",P,x),C("click",N,$),C("click",ut,ke),C("click",F,te),C("change",Z,y),ar(Z,()=>n(d),M=>h(d,M)),m(e,We),aa()}ya(["click","change"]);var Hd=k('http://192.168.178.151:8080/v1 — nicht den Proxy-Namen.Öffne die Zed-Settings mit Cmd/Strg + , und füge diesen Block in deine bestehende settings.json ein. Falls bereits ein "bosgame"-Eintrag existiert: vorher löschen.
API-Key: Öffne den Agent-Panel → Anbieter bosgame → trag irgendeinen Wert ein (z.B. local).
Datei anlegen oder öffnen:
Windows: %USERPROFILE%\\.config\\opencode\\opencode.json
"provider"-Block einfügen. Falls bereits ein "llama-swap"-Eintrag vorhanden: vorher löschen, sonst erscheinen Modelle doppelt. Danach in OpenCode /models → wählen.
In Cline/Cursor den Provider „OpenAI Compatible" wählen:
local).Settings → Admin Panel → Connections → neue OpenAI-Verbindung:
/compact — Kontext komprimieren wenn er voll wird/clear — frischer Start, leerer KontextBevor OpenCode eine Datei ändert, fragt es nach — mit y bestätigen oder n ablehnen.
`],["Cline in VS Code verbinden und nutzen",` +Bevor OpenCode eine Datei ändert, fragt es nach — mit y bestätigen oder n ablehnen.
+Weitere Infos: opencode.ai/docs
`],["Cline in VS Code verbinden und nutzen",`Cline ist installiert (VS Code Extension)? So richtest du es ein:
Unterschied zu OpenCode: Cline arbeitet direkt in VS Code — du siehst Änderungen sofort im Editor. - OpenCode ist besser für große, autonome Aufgaben; Cline für Aufgaben die du Schritt für Schritt begleiten willst.
`],["OpenWebUI — chatten ohne Vorkenntnisse",` + OpenCode ist besser für große, autonome Aufgaben; Cline für Aufgaben die du Schritt für Schritt begleiten willst. +Weitere Infos: cline.bot
`],["OpenWebUI — chatten ohne Vorkenntnisse",`OpenWebUI ist installiert? Verbinden in 3 Schritten:
Bilder analysieren: Mit einem Vision-Modell (z.B. qwen3-vl) einfach ein Bild per Drag & Drop ins Chat-Fenster ziehen — das Modell beschreibt und analysiert es.
Gut für: Texte schreiben, übersetzen, zusammenfassen, erklären lassen, Brainstorming — - alles ohne Programmierkenntnisse.
`]]},{label:"Agenten meistern",tutorials:[["Was ein Agent tut — und was er nicht kann",` + alles ohne Programmierkenntnisse. +Weitere Infos: openwebui.com
`]]},{label:"Agenten meistern",tutorials:[["Was ein Agent tut — und was er nicht kann",`Ein nacktes Modell antwortet auf Text — das war's. Ein Agent ist das Programm drumherum, das das Modell in eine Handlungsschleife bringt:
@@ -228,9 +231,11 @@ ${ge}
Wo MCPs finden? → mcp.run, - smithery.ai, - oder direkt: „Welche MCPs gibt es für [dein Werkzeug]?" im Chat fragen.
+Wo MCPs finden? + mcp.run · + smithery.ai · + modelcontextprotocol.io/servers + — oder einfach fragen: „Welche MCPs gibt es für [dein Werkzeug]?"
Merksatz: Fehlt dem Agenten eine Fähigkeit → MCP. Soll er etwas nur besser machen → Skill (nächster Abschnitt).
`],["Skills & Rules — Agenten Gewohnheiten beibringen",`Skills (auch Rules, AGENTS.md oder Instructions genannt) @@ -262,56 +267,95 @@ Bevor du Dateien änderst: erkläre kurz was du vorhast.
Fertige Skills finden:
Eine Persona ist eine Rolle, die du dem Agenten gibst — über den System-Prompt oder - die erste Zeile deiner AGENTS.md. Sie bestimmt grundlegend wie der Agent antwortet: - Ton, Fokus, Detailtiefe und Verhalten.
-Ohne Persona: Allgemeines Sprachmodell. Mit Persona: Dein persönlicher - Senior-Entwickler, der genau weiß wie du arbeitest und was dir wichtig ist.
+ `],["Die Persona — Rolle, Beziehung & Onboarding",` +Eine Persona hat zwei Dimensionen — beide sind wichtig:
+Ein Agent der technisch gleich konfiguriert ist, verhält sich komplett anders + wenn er weiß: Du willst kurze Antworten ohne Erklärung. Oder: Du lernst noch — + ermutige mich und erkläre immer warum.
-Das Persona-Template:
+Das vollständige Persona-Template:
Du bist [Name], [Rolle]. -Dein Fokus: [Hauptaufgabe] -Dein Stil: [Kommunikationsstil — z.B. direkt, knapp, kein Smalltalk] -Sprache: Immer auf Deutsch antworten. Code-Kommentare auf Englisch. -Grenzen: [Was du ablehnst oder nachfragst statt zu raten]-
Beispiel 1 — Coding-Assistent:
+Fokus: [Was du hauptsächlich tust] +Wie du kommunizierst: [Stil — direkt/erklärend/ermutigend, kurze oder ausführliche Antworten] +Wie du mit mir umgehst: [Proaktivität, Rückfragen, Feedback-Stil, Fehlerkultur] +Sprache: Immer auf Deutsch. Code-Kommentare auf Englisch. +Grenzen: [Was du nicht tust, was du nachfragst statt zu raten] + +Beispiel 1 — Coding-Assistent (direkt, erfahren):
Du bist Alex, ein erfahrener Senior-Entwickler spezialisiert auf TypeScript und React. -Dein Fokus: Code schreiben, reviewen und erklären — immer mit konkreten Beispielen. -Dein Stil: direkt, pragmatisch. Keine unnötigen Erklärungen wenn der Code für sich spricht. -Sprache: Deutsch. Code-Kommentare auf Englisch. -Grenzen: Schreib keinen Code ohne den Kontext der Datei zu kennen. Frag lieber nach.-
Beispiel 2 — Lernbegleiter:
+Fokus: Code schreiben, reviewen, erklären — immer mit konkreten Beispielen. +Wie du kommunizierst: direkt, pragmatisch. Keine Erklärung wenn der Code für sich spricht. +Wie du mit mir umgehst: Du fragst nach bevor du loslegst wenn die Aufgabe unklar ist. + Fehler sprichst du klar an — aber ohne Schuldzuweisungen. Du machst Gegenvorschläge + wenn du eine bessere Lösung siehst, aber respektierst meine Entscheidung. +Sprache: Deutsch. Code-Kommentare auf Englisch. +Grenzen: Kein Code ohne Datei-Kontext. Keine neuen Dependencies ohne Rückfrage. + +Beispiel 2 — Lernbegleiter (geduldig, ermutigend):
Du bist Sam, eine geduldige Lernbegleiterin für Programmier-Anfänger. -Dein Fokus: Konzepte einfach erklären, Fehler ohne Kritik korrigieren, ermutigen. -Dein Stil: freundlich, mit Analogien aus dem Alltag. Fachbegriffe immer sofort erklären. + +Fokus: Konzepte erklären, Fehler korrigieren, Schritt für Schritt führen. +Wie du kommunizierst: freundlich, mit Analogien aus dem Alltag. Fachbegriffe sofort erklären. +Wie du mit mir umgehst: Du lobst Fortschritte, auch kleine. Fehler sind Lernchancen — + du zeigst was falsch war und warum, ohne zu urteilen. Du fragst ob ich es verstanden + habe bevor du weitermachst. Sprache: Immer auf Deutsch. Niemals Englisch ohne Übersetzung.-
Wo die Persona eintragen:
+Der schnellste Weg: Onboarding-Interview
+Statt die Persona selbst auszufüllen — lass den Agenten dich befragen. + Starte einen frischen Chat und gib ihm diesen Prompt:
+Ich möchte dich in mein Projekt und meinen Arbeitsstil einarbeiten. +Führe mit mir ein kurzes Interview durch — stelle mir 6–8 Fragen, +eine nach der anderen — um zu verstehen: + +1. Wer ich bin und wie ich am liebsten kommuniziere +2. Was unser Projekt ist und welches Ziel es hat +3. Was ich gut kann und wobei ich Unterstützung brauche +4. Meine Arbeitsgewohnheiten und Präferenzen +5. Was mir wichtig ist und was mich stört + +Wenn du alle Antworten hast, erstelle daraus: +- Eine vollständige AGENTS.md als dauerhaftes Fundament +- Einen Satz der zusammenfasst wer ich für dich bin+
Das Ergebnis: eine maßgeschneiderte Persona die wirklich zu dir passt — + weil du sie nicht selbst formulieren musstest, sondern im Gespräch entstanden ist.
+ +Wo eintragen:
AGENTS.md im Projektordner.
- Gilt nur dort.AGENTS.md im Projektordner.~/.config/opencode/AGENTS.md (OpenCode)~/.config/opencode/AGENTS.md (OpenCode) ·
Settings → System Prompt (OpenWebUI)Tipp: Eine gute Persona hat immer eine Grenze - — was der Agent nicht tun soll. Das verhindert, dass er bei Unklarheiten rät statt fragt.
`],["AGENTS.MD & SAVEPOINT.MD — Gedächtnis für den Agenten",` +Fertige Personas: skills.sh · cursor.directory
`],["AGENTS.MD & SAVEPOINT.MD — Gedächtnis für den Agenten",`Jedes Mal wenn du einen neuen Chat startest, weiß der Agent nichts über dein Projekt. Diese zwei Dateien lösen das Problem:
Tipp: Lass den Agenten die SAVEPOINT.md selbst schreiben — er sieht was er getan hat. - Du prüfst nur ob der Stand stimmt und ergänzt bei Bedarf.
`]]},{label:"Wenn etwas nicht klappt",tutorials:[["Häufige Probleme & Lösungen",` + Du prüfst nur ob der Stand stimmt und ergänzt bei Bedarf. +Vorlagen & Inspiration: skills.sh · opencode.ai/docs
`]]},{label:"Wenn etwas nicht klappt",tutorials:[["Häufige Probleme & Lösungen",`