feat: support external and step images with structured cooking instructions

2026-10-24 17:31:47 +02:00
1 parent 361862ad0b
commit 0ec1d45bdb
@@ -47,17 +47,26 @@ Schritt:
 {
  "id": "anbraten",
  "title": "Goldbraun anbraten",
-  "text": "{{huhn}} in Würfel schneiden und anbraten.",
+  "text": "- {{huhn}} in Würfel schneiden.\n- In der heißen Pfanne anbraten.",
  "ingredients": ["huhn"],
+  "images": [],
  "timers": [{ "id": "bratzeit", "label": "Hühnerbrust braten", "seconds": 480 }]
 }
 ```

 `{{huhn}}` wird zu **Menge + Einheit + Zutatenname + Hinweis** aufgelöst. Diese Referenz bleibt beim Skalieren konsistent. Keine konkreten skalierbaren Mengen als Freitext wiederholen. Temperaturen und Zeiten bleiben normaler Text. `ingredients` enthält die in diesem Schritt benötigten Zutaten-IDs. Timer-IDs müssen im gesamten Rezept eindeutig sein; ein Timer dauert 1–172800 Sekunden. Zeiten werden nicht mit Portionen skaliert.

+Schritttexte unterstützen Absätze bzw. Zeilenumbrüche (`\n`, `\n\n`), Aufzählungen mit `- `, `* ` oder `• ` und nummerierte Listen mit `1. ` bzw. `1) `. Die Darstellung funktioniert in Rezeptansicht, Kochmodus und Vorschau. Lange ältere Texte ohne Zeilenumbrüche werden für die Anzeige nach jeweils zwei Sätzen gegliedert; der gespeicherte Text bleibt erhalten. Zutatenreferenzen werden hervorgehoben. HTML und weitere Markdown-Formatierung sind nicht vorgesehen.
+
 ## Bilder

-Nur lokale URLs: `/media/<uuid>.webp` oder mitgelieferte `/images/<name>.jpg|webp|svg`. Bilder zuerst im Adminbereich hochladen, dann den lokalen Pfad verwenden. ChatGPT soll `image: ""` und `images: []` setzen und keine erfundenen URLs ausgeben.
+Bildfelder akzeptieren lokale Pfade (`/media/<uuid>.webp` oder mitgelieferte `/images/<name>.jpg|webp|svg`) und vollständige externe **HTTPS-URLs** bis 2048 Zeichen ohne Zugangsdaten. Queryparameter sind erlaubt, z. B. für Bild-CDNs. HTTP, eingebettete Base64-/Data-URLs und Webseiten statt direkter Bildadressen sind nicht geeignet.
+
+- `recipe.image`: ein Titelbild oder `""`.
+- `recipe.images`: Galerie mit bis zu 20 Bildadressen, Standard `[]`.
+- `recipe.steps[].images`: bis zu 10 Bildadressen pro Schritt, Standard `[]`. Bestehende Rezepte ohne dieses Feld bleiben kompatibel.
+
+Lokale Bilder können im Editor hochgeladen werden. HTTPS-Adressen können für Titelbild, Galerie und Schrittbilder im Editor eingetragen oder über JSON/XML importiert werden. Externe Bilder lädt der Browser direkt mit `referrerPolicy="no-referrer"`; HamHam lädt sie nicht auf den Server herunter. Bei nicht erreichbaren oder vom Anbieter blockierten Bildern erscheint ein Platzhalter. Externe Bilder sind daher nicht Bestandteil des lokalen Bild-Backups. ChatGPT soll nur bereitgestellte oder überprüfte Bildadressen verwenden und die Bildfelder andernfalls leer lassen.

 JSON/XML-Exporte enthalten Bildreferenzen, keine Binärdaten. Für einen Umzug das Bildvolume mitnehmen; für ein vollständiges Backup zusätzlich die Datenbank sichern. Metadaten, Zutaten, Schritte, Timer, Zeitstempel und IDs bleiben beim Export erhalten.

@@ -65,16 +74,17 @@ JSON/XML-Exporte enthalten Bildreferenzen, keine Binärdaten. Für einen Umzug d

 Das vollständige Beispiel ist `public/examples/pljeskavica.xml`. UTF-8, Wurzel `<hamham version="1">`, darunter `<recipes><recipe>…</recipe></recipes>`. Rezeptfelder entsprechen JSON. Array-Container:

-| JSON             | XML                                                         |
-| ---------------- | ----------------------------------------------------------- |
-| recipes          | `<recipes><recipe>…</recipe></recipes>`                     |
-| ingredients      | `<ingredients><ingredient>…</ingredient></ingredients>`     |
-| steps            | `<steps><step>…</step></steps>`                             |
-| timers           | `<timers><timer>…</timer></timers>`                         |
-| categories       | `<categories><category>Vegetarisch</category></categories>` |
-| tags             | `<tags><tag>Schnell</tag></tags>`                           |
-| images           | `<images><image>/media/…webp</image></images>`              |
-| step.ingredients | `<ingredients><ref>huhn</ref></ingredients>`                |
+| JSON             | XML                                                               |
+| ---------------- | ----------------------------------------------------------------- |
+| recipes          | `<recipes><recipe>…</recipe></recipes>`                           |
+| ingredients      | `<ingredients><ingredient>…</ingredient></ingredients>`           |
+| steps            | `<steps><step>…</step></steps>`                                   |
+| timers           | `<timers><timer>…</timer></timers>`                               |
+| categories       | `<categories><category>Vegetarisch</category></categories>`       |
+| tags             | `<tags><tag>Schnell</tag></tags>`                                 |
+| images           | `<images><image>/media/…webp</image></images>`                    |
+| step.ingredients | `<ingredients><ref>huhn</ref></ingredients>`                      |
+| step.images      | `<images><image>https://example.org/schritt.jpg</image></images>` |

 Leere Menge: `<amount/>`. Keine Nährwerte: `<nutrition/>`. Boolean: `true`/`false`. Texte standardkonform escapen (`&amp;`, `&lt;` etc.). DOCTYPE und Entity-Deklarationen sind verboten, es werden keine externen Ressourcen aufgelöst. Nach dem XML-Parsing gilt dieselbe Zod-Validierung wie bei JSON.