From 513c126fba4a409e44d07ed3f773fbe1d2fdbabb Mon Sep 17 00:00:00 2001
From: Bjoern Welker <bjoern@welker.me>
Date: Fri, 30 Jan 2026 12:09:13 +0100
Subject: [PATCH] Send order API key from live page

---
 index.html | 26 +++++++++++++++++++++++++-
 1 file changed, 25 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index 59e600f..e3ea630 100644
--- a/index.html
+++ b/index.html
@@ -100,6 +100,17 @@
       box-shadow: 0 2px 0 rgba(0,0,0,.18);
     }
     .pill input { accent-color: var(--accent); }
+    .keybox {
+      display: inline-flex; align-items: center; gap: 8px;
+      padding: 8px 10px; border-radius: 999px;
+      background: rgba(255,255,255,.06);
+      border: 1px solid var(--line);
+      font-size: 12px;
+    }
+    .keybox input {
+      width: 140px; border: 0; outline: 0; background: transparent;
+      color: var(--text); font-size: 12px;
+    }
     main .wrap { padding-top: 14px; padding-bottom: 28px; }
     .grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
     .card-tile {
@@ -331,6 +342,10 @@
           <span aria-hidden="true">🔎</span>
           <input id="q" type="search" placeholder="Artikel suchen… (z.B. Badehose, Hoodie, Kappe)" />
         </div>
+        <label class="keybox" title="Bestell‑Key">
+          🔑
+          <input id="orderKey" type="password" placeholder="Bestell‑Key" />
+        </label>
       </div>
     </div>
   </div>
@@ -489,6 +504,12 @@ document.getElementById("q").addEventListener("input", applyFilters);
 const modal = document.getElementById("orderModal");
 const form = document.getElementById("orderForm");
 const setField = (id, v) => document.getElementById(id).value = v || "";
+const orderKeyInput = document.getElementById("orderKey");
+orderKeyInput.value = sessionStorage.getItem("orderKey") || "";
+orderKeyInput.addEventListener("change", () => {
+  const key = orderKeyInput.value.trim();
+  if (key) sessionStorage.setItem("orderKey", key);
+});
 
 document.addEventListener("click", (e) => {
   const imgBtn = e.target.closest(".thumb-btn");
@@ -553,9 +574,12 @@ document.getElementById("detailModal").addEventListener("click", (e) => {
 form.addEventListener("submit", async (e) => {
   e.preventDefault();
   const payload = Object.fromEntries(new FormData(form).entries());
+  const key = sessionStorage.getItem("orderKey") || "";
+  const headers = { "Content-Type": "application/json" };
+  if (key) headers["X-Order-Key"] = key;
   const res = await fetch("/wawi/order", {
     method: "POST",
-    headers: { "Content-Type": "application/json" },
+    headers,
     body: JSON.stringify(payload)
   });
   if (res.ok) {