Tools miteinander verknüpfen

Ein Tool kann einem anderen Daten schicken oder es öffnen, sobald du das erlaubst. So wird aus einzelnen Tools ein kleines System: Eine Aufgabe wandert auf die Einkaufsliste, Zutaten aus einem Rezept landen auf der Liste, ein Timer trägt Lernzeiten in ein Protokoll ein. Die mitgelieferte To-do-Liste macht es vor: Ihr 🛒-Knopf schickt eine Aufgabe an die Einkaufsliste. Wenn du es von Anfang an einplanst, klappt es am besten.

Neu: Die Beispiele auf dieser Seite nutzen jetzt das gemeinsame Nachrichtenformat der Galerie (typ, v, id, text). So verstehen deine Tools auch die Galerie-Tools und umgekehrt.

Die drei Bausteine

Beispiel: Aufgabe auf die Einkaufsliste

// Im Aufgaben-Tool: eine Aufgabe an die Einkaufsliste schicken
function anEinkaufslisteSchicken(artikel) {
  if (!window.ARTEFAKT) return;                    // außerhalb der Toolbox gibt es keine Verknüpfung
  ARTEFAKT.senden('Einkaufsliste', {
    typ: 'einkauf', v: 1,                          // Art und Version der Nachricht
    id: Date.now().toString(36) + Math.random().toString(36).slice(2, 6),   // gegen Doppelte
    text: artikel,                                 // für jedes Tool lesbar
    artikel: [artikel]                             // immer eine Liste, auch bei einem Artikel
  });
}

// In der Einkaufsliste: beim Start abholen, was andere Tools geschickt haben
function eingangAbholen() {
  if (!window.ARTEFAKT) return;
  for (const e of ARTEFAKT.eingang()) {            // e = { von: 'To-do', zeit: 1760000000000, daten: { typ: 'einkauf', artikel: ['Milch'], … } }
    const d = e.daten;
    if (!d || d.typ !== 'einkauf' || !Array.isArray(d.artikel)) continue;   // nur, was wir verstehen
    for (const a of d.artikel) {
      if (typeof a === 'string' && a.length <= 120) artikel.push({ text: a, von: e.von });
    }
  }
  speichern();                                      // wie gewohnt in localStorage
  zeichnen();
}
eingangAbholen();

In der App einrichten

1. Verknüpfungen öffnen

   Tool-Menü ⋮ › Einrichten › Verknüpfungen. Die Liste zeigt alle anderen Tools. Bei Tools, die selbst Daten abholen, steht „nimmt Daten entgegen“.

2. Erlauben

   Mit dem Schalter „darf … erreichen“ erlaubst du einem Tool, ein bestimmtes anderes zu erreichen. Ohne Schalter fragt die Toolbox beim ersten Versuch. Deine Antwort gilt für genau dieses Paar, wird gemerkt und lässt sich jederzeit zurücknehmen.

3. Per KI einbauen lassen

   Hat ein Tool noch keinen Knopf dafür, tippe neben dem Ziel auf das Roboter-Symbol. Die Toolbox übergibt der KI einen fertig formulierten Änderungswunsch samt Code (siehe unten) über „Mit KI ändern“. Das Ergebnis legst du als neue Fassung desselben Tools ein.

4. Beim Ziel abholen lassen

   Damit das Ziel die Daten anzeigt, muss es sie mit ARTEFAKT.eingang() abholen. Auch das lässt sich über „Mit KI ändern“ beim Ziel-Tool einbauen.

Verknüpfe dieses Tool mit „Einkaufsliste“: Füge einen gut sichtbaren Knopf hinzu, der die passenden Daten mit ARTEFAKT.senden("Einkaufsliste", daten) an „Einkaufsliste“ schickt.

Von Anfang an einplanen

Am saubersten wird es, wenn du beide Tools gleich als Paar beschreibst. Dieser Prompt zeigt, was hineingehört:

Erstelle mir ZWEI getrennte HTML-Dateien (je ein Tool, jeweils eine einzige Datei), die in der Artefakt Toolbox zusammenarbeiten.

Tool 1 „Rezepte“: Ich lege Rezepte mit Zutaten an. Bei jedem Rezept gibt es einen gut sichtbaren Knopf „Zutaten auf die Einkaufsliste“.
Tool 2 „Einkaufsliste“: eine Liste zum Abhaken, die zusätzlich übernimmt, was „Rezepte“ schickt.

Verknüpfung: In der Artefakt Toolbox gibt es window.ARTEFAKT. Tool 1 ruft ARTEFAKT.senden('Einkaufsliste', nachricht) auf, mit nachricht = { typ: 'einkauf', v: 1, id: eindeutige Kennung, text: 'Lasagne: 500 g Hackfleisch, 2 Dosen Tomaten', aktion: 'brauche', anlass: Rezeptname, artikel: [Zutaten als Text] }. Alle Zutaten eines Rezepts gehen in EINE Nachricht.
Tool 2 holt beim Start und beim Zurückkehren (visibilitychange) mit ARTEFAKT.eingang() alles ab (Liste von { von, zeit, daten }). Es übernimmt nur Nachrichten mit typ 'einkauf' und v höchstens 1, prüft, dass artikel eine Liste aus Texten (je höchstens 120 Zeichen) ist, merkt sich die letzten 200 id gegen Doppelte, zeigt die Herkunft („von Rezepte“) an, bietet „Rückgängig“ an und speichert alles in localStorage. Empfangen löst nie selbst ein Senden aus. Prüfe vorher, ob window.ARTEFAKT vorhanden ist, und zeige sonst einen freundlichen Hinweis statt eines Fehlers. Setze die Daten nie mit innerHTML ein, sondern mit textContent.

Technik: je eine einzige HTML-Datei, keine externen Dateien, localStorage, funktioniert offline, mobil zuerst, dunkles Design, Tippflächen mindestens 48 px, Deutsch. Gib beide Dateien in getrennten Code-Blöcken aus.

• Lege das Format der Daten fest und halte es klein. Am besten nimmst du die gemeinsame Hülle der Galerie: { typ, v, id, text, … }. typ sagt, was es ist, v ist die Version, id verhindert Doppelte, text ist für jedes Tool lesbar (siehe „Gemeinsame Nachrichten“).
• Der Empfänger nimmt nur an, was er versteht, und ignoriert alles andere. So kann niemand mit einem fremden Format etwas kaputtmachen.
• Verhindere Doppelte, etwa über eine feste Kennung je Eintrag oder durch Vergleichen des Textes.
• Setze empfangene Daten nie mit innerHTML ein, sondern mit textContent. Behandle sie wie jede fremde Eingabe.
• Das Ziel wird über den Namen gefunden. Nenne Tools ruhig und stabil und mach den Ziel-Namen im Tool einstellbar (zum Beispiel KONFIG.ziele). Benennst du das Ziel um, passe den Namen im Sender an.
• Zeige die Herkunft an („von Rezepte“) und biete an, einen Eintrag wieder zu entfernen.
• Teste die Kette zuerst mit Beispieldaten: erst Sender, dann Ziel öffnen, dann prüfen, ob alles angekommen ist.

Was möglich ist

• Aufgaben, Ideen oder Notizen in ein anderes Tool übergeben, etwa aus einer Notiz eine Aufgabe machen.
• Zutaten aus einem Rezept-Tool auf die Einkaufsliste setzen.
• Ein Timer, Zähler oder Messwert schickt seine Ergebnisse an ein Protokoll- oder Statistik-Tool.
• Ein Tool öffnet ein anderes als nächsten Schritt, zum Beispiel vom Plan zur Checkliste.
• Mehrere Quellen speisen ein Ziel, das alles sammelt und sortiert.

Wo die Grenzen liegen

Mit den Galerie-Tools zusammenarbeiten

Die Tools der Galerie sprechen sechs gemeinsame Nachrichtenarten, zum Beispiel „einkauf“, „erledigt“ oder „betrag“. Wenn deine Tools dieselben Arten senden oder verstehen, arbeiten sie ohne Absprache mit ihnen zusammen. Wie das geht und was eine vorgeschlagene Verbindungsschicht in der App daran ändern würde, steht auf diesen Seiten:

Siehe auch: Gemeinsame Nachrichten · Ausblick: Verbindungsschicht