From f3745536689b90414bd41532bc14bf7a5fbcd42e Mon Sep 17 00:00:00 2001
From: Michael <mboehmlaender@gmx.net>
Date: Tue, 1 Sep 2026 16:16:57 +0200
Subject: [PATCH] UI

---
 plugins/trainingsplan/static/index.html | 33 ++++++++++++++++++-------
 1 file changed, 24 insertions(+), 9 deletions(-)

diff --git a/plugins/trainingsplan/static/index.html b/plugins/trainingsplan/static/index.html
index 7e0daac..e4353d2 100644
--- a/plugins/trainingsplan/static/index.html
+++ b/plugins/trainingsplan/static/index.html
@@ -138,20 +138,22 @@ function exerciseName(id) {
   return (state.cfg?.exercises || []).find((exercise) => exercise.id === id)?.name || id || "Übung";
 }
 
-function currentProgressionName(exerciseId) {
-  const exercise = (state.cfg?.exercises || []).find((item) => item.id === exerciseId);
-  if (!exercise) return "";
-  const progressions = exercise.progressions || [];
-  const selected = progressions.find((item) => item.id === exercise.current_progression_id) || progressions[0];
-  return selected?.name || "";
-}
-
 function progressionOptions(exercise, selected = "") {
   return (exercise.progressions || []).map((progression) =>
     `<option value="${esc(progression.id)}"${progression.id === selected ? " selected" : ""}>${esc(progression.name || progression.id)}</option>`
   ).join("");
 }
 
+function dayProgressionSelect(exerciseId) {
+  const exercise = (state.cfg?.exercises || []).find((item) => item.id === exerciseId);
+  const progressions = exercise?.progressions || [];
+  if (!progressions.length) {
+    return `<select data-day-current-progression disabled><option value="">Keine Progression</option></select>`;
+  }
+  const selected = exercise.current_progression_id || progressions[0].id;
+  return `<select data-day-current-progression>${progressionOptions(exercise, selected)}</select>`;
+}
+
 function optionList(selected = "") {
   return (state.cfg?.exercises || []).map((exercise) =>
     `<option value="${esc(exercise.id)}"${exercise.id === selected ? " selected" : ""}>${esc(exercise.name || exercise.id)}</option>`
@@ -250,7 +252,7 @@ function dayHtml(day, index) {
   const items = (day.exercises || []).map((item, itemIndex) => `
     <div class="tp-exercise-row" data-day-item="${esc(item.id)}">
       <label>Übung<select data-day-field="exercise_id">${optionList(item.exercise_id)}</select></label>
-      <label>Aktuell<input type="text" value="${esc(currentProgressionName(item.exercise_id) || "Keine Progression")}" readonly></label>
+      <label>Aktuell${dayProgressionSelect(item.exercise_id)}</label>
       <div class="tp-exercise-actions">
         <button class="mini ghost" data-move-day-item="-1" title="Nach oben">↑</button>
         <button class="mini ghost" data-move-day-item="1" title="Nach unten">↓</button>
@@ -416,6 +418,11 @@ function syncFormStateFromDom() {
       if (!item) return;
       const exercise = row.querySelector('[data-day-field="exercise_id"]');
       if (exercise) item.exercise_id = exercise.value;
+      const current = row.querySelector("[data-day-current-progression]");
+      const selectedExercise = state.cfg.exercises.find((entry) => entry.id === item.exercise_id);
+      if (selectedExercise && current && current.value) {
+        selectedExercise.current_progression_id = current.value;
+      }
     });
   });
 }
@@ -506,6 +513,14 @@ function handleFormEdit(event) {
       if (target.value.trim()) item[key] = target.value;
       else delete item[key];
       markDirty();
+      if (key === "exercise_id") renderAll();
+    } else if (itemRow && target.dataset.dayCurrentProgression !== undefined) {
+      const item = (day.exercises || []).find((entry) => entry.id === itemRow.dataset.dayItem);
+      const exercise = state.cfg.exercises.find((entry) => entry.id === item?.exercise_id);
+      if (!exercise) return;
+      exercise.current_progression_id = target.value;
+      markDirty();
+      renderAll();
     }
   }
 }