From 7e7622420325986d7da3da1c5828afbcc05e0dee Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9CNaeel=E2=80=9D?= <tazet@narod.ru>
Date: Thu, 25 Jun 2026 09:25:15 +0400
Subject: [PATCH] =?UTF-8?q?v1.0.178:=20=D0=A4=D0=B0=D0=B7=D0=B0=204=20?=
 =?UTF-8?q?=E2=80=94=20renderStepper(state).=20=D0=A1=D1=82=D0=B5=D0=BF?=
 =?UTF-8?q?=D0=BF=D0=B5=D1=80=20=D1=87=D0=B5=D1=80=D0=B5=D0=B7=20state.ui.?=
 =?UTF-8?q?steps=20=D0=B2=D0=BC=D0=B5=D1=81=D1=82=D0=BE=20=D0=BF=D1=80?=
 =?UTF-8?q?=D1=8F=D0=BC=D0=BE=D0=B9=20=D0=BC=D0=B0=D0=BD=D0=B8=D0=BF=D1=83?=
 =?UTF-8?q?=D0=BB=D1=8F=D1=86=D0=B8=D0=B8=20DOM.=20stepDone/stepActive/res?=
 =?UTF-8?q?etStepper=20=D0=BC=D1=83=D1=82=D0=B8=D1=80=D1=83=D1=8E=D1=82=20?=
 =?UTF-8?q?state=20=E2=86=92=20renderStepper.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 deploy/app.js | 69 ++++++++++++++++++++++++++++++++++++++-------------
 1 file changed, 52 insertions(+), 17 deletions(-)

diff --git a/deploy/app.js b/deploy/app.js
index 97e1373..5041053 100644
--- a/deploy/app.js
+++ b/deploy/app.js
@@ -36,31 +36,66 @@ var fileTable = document.getElementById('fileTable');
  */
 function render(state) {
   renderFiles(state);
+  renderStepper(state);
 }
 
 // syncDB, statusToHTML, renderFiles, toggleClassifyDetail, uploadFile, refreshSupps
 // → вынесены в files.js (Фаза 1)
 
-// ── Pipeline stepper ─────────────────────────────────────────
-function stepDone(id) {
-  var el = document.getElementById(id);
-  if (el) { el.innerHTML = el.innerHTML.replace('○','✓'); el.style.color = 'var(--green)'; }
-}
-function stepActive(id) {
-  var el = document.getElementById(id);
-  if (el) { el.innerHTML = el.innerHTML.replace('○','⏳').replace('✓','⏳'); el.style.color = 'var(--brand-primary)'; }
-}
-function resetStepper(fromId) {
-  var steps = ['stepUpload','stepClassify','stepGroups','stepCompare'];
-  var reset = false;
-  steps.forEach(function(id) {
-    if (id === fromId) reset = true;
-    if (reset) {
-      var el = document.getElementById(id);
-      if (el) { el.innerHTML = el.innerHTML.replace('✓','○').replace('⏳','○'); el.style.color = 'var(--muted)'; }
+// ── Pipeline stepper (Фаза 4: state-driven) ──────────────────
+
+/**
+ * renderStepper(state) — Рендер степпера из state.ui.steps (Фаза 4).
+ * 
+ * Читает state.ui.steps.{upload,classify,groups,compare}, обновляет DOM.
+ * Значения: '○' (не начат) | '⏳' (в процессе) | '✓' (завершён).
+ */
+function renderStepper(state) {
+  var steps = state.ui.steps;
+  var map = { upload: 'stepUpload', classify: 'stepClassify', groups: 'stepGroups', compare: 'stepCompare' };
+  var colors = { '○': 'var(--muted)', '⏳': 'var(--brand-primary)', '✓': 'var(--green)' };
+  Object.keys(map).forEach(function(key) {
+    var el = document.getElementById(map[key]);
+    if (el) {
+      el.textContent = steps[key] + ' ' + {upload:'Загрузка',classify:'Классификация',groups:'Группировка',compare:'Сравнение'}[key];
+      el.style.color = colors[steps[key]] || 'var(--muted)';
     }
   });
 }
+
+/**
+ * stepDone(id) — Отметить шаг как завершённый (Фаза 4).
+ * Мутирует state.ui.steps, вызывает renderStepper.
+ */
+function stepDone(id) {
+  var key = { stepUpload: 'upload', stepClassify: 'classify', stepGroups: 'groups', stepCompare: 'compare' }[id];
+  if (key) { state.ui.steps[key] = '✓'; renderStepper(state); }
+}
+
+/**
+ * stepActive(id) — Отметить шаг как активный (Фаза 4).
+ * Мутирует state.ui.steps, вызывает renderStepper.
+ */
+function stepActive(id) {
+  var key = { stepUpload: 'upload', stepClassify: 'classify', stepGroups: 'groups', stepCompare: 'compare' }[id];
+  if (key) { state.ui.steps[key] = '⏳'; renderStepper(state); }
+}
+
+/**
+ * resetStepper(fromId) — Сбросить шаги начиная с fromId (Фаза 4).
+ * Все шаги после (и включая) fromId получают '○'.
+ * Мутирует state.ui.steps, вызывает renderStepper.
+ */
+function resetStepper(fromId) {
+  var order = ['stepUpload','stepClassify','stepGroups','stepCompare'];
+  var keys  = ['upload','classify','groups','compare'];
+  var reset = false;
+  order.forEach(function(id, i) {
+    if (id === fromId) reset = true;
+    if (reset) { state.ui.steps[keys[i]] = '○'; }
+  });
+  renderStepper(state);
+}
 // Утилиты (formatSize, formatDate, moveUp, moveDown, escHtml, fmtDate) —
 // вынесены в app_utils.js для облегчения анализа и отладки.
 // statusToHTML, renderFiles → files.js (Фаза 1)