From 2e6a1a58e5680325cbd742fad85a38cb7a6fb8b9 Mon Sep 17 00:00:00 2001
From: sylyx <Sylyxdream@gmail.com>
Date: Fri, 21 Aug 2026 10:07:41 +0200
Subject: [PATCH] Feld-Zuordnung: Feldname wieder frei eingebbar

Die Spalte "DocuWare-Feldname" war ein starres <select>, dessen Optionen
ausschliesslich aus availableFields kamen - der Feldliste eines Archivs. Die ist
aber erst gefuellt, wenn Schrankliste gecacht, Passwort dieser Sitzung eingegeben
und ein Archiv gewaehlt ist. Bis dahin enthielt jedes Dropdown nur
"- Feld waehlen -": eine neue Zeile hatte null auswaehlbare Felder, und weil
collectMapping() Zeilen ohne Feldnamen verwirft, verschwand sie beim Speichern
kommentarlos wieder.

Jetzt wieder freie Texteingabe mit Vorschlagsliste (<input list>), wie der
veraltete Kommentar an mapCabinet es schon beschrieb. Die Vorschlaege kommen aus
drei Quellen statt einer: Felder des gewaehlten Archivs, die Namen aus
DEFAULT_FIELD_MAP und alles bereits Eingetragene - damit stehen sofort nach dem
Oeffnen Vorschlaege bereit, auch ohne Anmeldung.

fillFieldSelect entfaellt; refreshFieldSelects baut nur noch die gemeinsame
<datalist> auf und wird zusaetzlich am Ende von loadMapping aufgerufen.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 options/options.html |  4 +++-
 options/options.js   | 48 +++++++++++++++++++++++++++-----------------
 2 files changed, 33 insertions(+), 19 deletions(-)

diff --git a/options/options.html b/options/options.html
index 4b2694a..5deb398 100644
--- a/options/options.html
+++ b/options/options.html
@@ -108,7 +108,7 @@
     .map-row.has-const .map-left { flex: 0 0 250px; }
     .map-right { display: none; flex: 1 1 auto; min-width: 0; }
     .map-row.has-const .map-right { display: flex; align-items: center; }
-    .map-left select, .map-right input { width: 100%; padding: 7px 9px; }
+    .map-left select, .map-left input, .map-right input { width: 100%; padding: 7px 9px; }
     .map-hint { font-size: 11px; letter-spacing: .4px; text-transform: uppercase;
       color: var(--muted); font-weight: 600; margin: 2px 2px 8px; }
     .icon-btn {
@@ -222,6 +222,8 @@
 
       <div class="map-hint">DocuWare-Feld&nbsp;→ Mail-Attribut · fester Wert</div>
       <div id="mapBody" class="map"></div>
+      <!-- Vorschlagsliste fuer alle Feldname-Eingaben (siehe refreshFieldSelects). -->
+      <datalist id="fieldNameList"></datalist>
 
       <div class="map-toolbar" style="margin-top:10px">
         <button id="mapAdd" class="ghost" type="button">+ Zeile</button>
diff --git a/options/options.js b/options/options.js
index 2130a26..aefc7d7 100644
--- a/options/options.js
+++ b/options/options.js
@@ -172,23 +172,26 @@ function mapValueState(value) {
   return { sel: "", konst: "" };
 }
 
-// Befüllt ein Feldname-Dropdown mit den Archiv-Feldern + dem aktuellen Wert (bleibt erhalten).
-function fillFieldSelect(sel, current) {
-  sel.innerHTML = "";
-  const empty = document.createElement("option");
-  empty.value = ""; empty.textContent = "— Feld wählen —";
-  sel.appendChild(empty);
-  [...new Set([...(availableFields || []), current].filter(Boolean))].sort().forEach((n) => {
-    const o = document.createElement("option");
-    o.value = n; o.textContent = n;
-    sel.appendChild(o);
-  });
-  sel.value = current || "";
+// Vorschläge für die Feldname-Eingaben: Felder des gewählten Archivs, dazu die
+// Standard-Feldnamen und alles schon Eingetragene. Der Archiv-Teil ist erst nach
+// Anmeldung + Archivwahl da – ohne die beiden anderen Quellen stünde man vorher
+// vor einer leeren Liste.
+function fieldSuggestions() {
+  const used = [...document.querySelectorAll("#mapBody .map-field")].map((i) => i.value);
+  const all = [...(availableFields || []), ...Object.keys(DEFAULT_FIELD_MAP), ...used];
+  return [...new Set(all.filter(Boolean))].sort();
 }
 
-// Aktualisiert alle Feldname-Dropdowns auf die aktuelle Archiv-Feldliste (Auswahl bleibt).
+// Baut die gemeinsame <datalist> neu auf (alle Zeilen hängen daran).
 function refreshFieldSelects() {
-  document.querySelectorAll("#mapBody .map-field").forEach((sel) => fillFieldSelect(sel, sel.value));
+  const dl = $("fieldNameList");
+  if (!dl) return;
+  dl.innerHTML = "";
+  fieldSuggestions().forEach((n) => {
+    const o = document.createElement("option");
+    o.value = n;
+    dl.appendChild(o);
+  });
 }
 
 function addMapRow(field = "", value = "") {
@@ -196,11 +199,19 @@ function addMapRow(field = "", value = "") {
   const row = document.createElement("div");
   row.className = "map-row" + (st.sel === CONST_OPT ? " has-const" : "");
 
-  // Links gestapelt: Feldname (Dropdown) über Mail-Attribut.
+  // Links gestapelt: Feldname (Eingabe mit Vorschlägen) über Mail-Attribut.
   const left = document.createElement("div"); left.className = "map-left";
 
-  const fieldSel = document.createElement("select"); fieldSel.className = "map-field";
-  fillFieldSelect(fieldSel, field);
+  // Freie Eingabe mit Vorschlagsliste – bewusst KEIN <select>: die Archiv-Feldliste
+  // gibt es erst nach Anmeldung, ein starres Dropdown wäre bis dahin leer und die
+  // Zeile unbenutzbar (ohne Feldnamen wirft collectMapping sie beim Speichern weg).
+  const fieldSel = document.createElement("input");
+  fieldSel.type = "text";
+  fieldSel.className = "map-field";
+  fieldSel.setAttribute("list", "fieldNameList");
+  fieldSel.placeholder = "DocuWare-Feldname, z. B. EML_SUBJECT";
+  fieldSel.value = field || "";
+  fieldSel.addEventListener("change", refreshFieldSelects);
 
   const src = document.createElement("select"); src.className = "map-source";
   const none = document.createElement("option"); none.value = ""; none.textContent = "— nichts —";
@@ -242,6 +253,7 @@ function addMapRow(field = "", value = "") {
 function loadMapping(map) {
   $("mapBody").innerHTML = "";
   Object.entries(map || {}).forEach(([f, v]) => addMapRow(f, v));
+  refreshFieldSelects();
 }
 
 function collectMapping() {
@@ -355,7 +367,7 @@ $("mappingPull").addEventListener("click", async () => {
   }
 });
 
-// Archiv wählen -> dessen Indexfelder als Vorschläge (datalist) für alle Feldnamen.
+// Archiv wählen -> dessen Indexfelder als Vorschläge für alle Feldname-Eingaben.
 $("mapCabinet").addEventListener("change", async () => {
   const id = $("mapCabinet").value;
   const st = $("mapFieldStatus");