Update public/index.html

public/index.html

@@ -290,8 +290,9 @@
 let characters = [];
 let activeIndex = -1;
 let sessionToken = null;
-let originalRaw  = '';
 
+// Field indices within each character's fields[] array (server-side record)
+// fields[0]=name, fields[1]=alias, numeric stats follow
 const STAT_MAP = {
   civPower: 9,  civDef: 10,  civSpd: 11,
   supPower: 13, supDef: 14,  supSpd: 15,
@@ -328,21 +329,17 @@ fetch('/download-link').then(r => r.json()).then(data => {
 }).catch(() => {});
 
 // ── AUTO-INIT ──────────────────────────────────────────────────────
-const LS_TOKEN_KEY  = 'supercity_session_token';
-const LS_RAW_KEY    = 'supercity_raw';
-const LS_EDITED_KEY = 'supercity_edited';
+const LS_TOKEN_KEY = 'supercity_session_token';
 
 (function initFromServer() {
   const wrap  = document.getElementById('progressWrap');
   const bar   = document.getElementById('progressBar');
   const label = document.getElementById('progressLabel');
 
-  // Try to restore a previous session from localStorage
+  // Try to restore a previous session from the server
   const savedToken = localStorage.getItem(LS_TOKEN_KEY);
-  const savedRaw   = localStorage.getItem(LS_RAW_KEY);
 
-  if (savedToken && savedRaw) {
-    // Verify the session is still alive on the server
+  if (savedToken) {
     label.textContent = 'Resuming session…';
     wrap.style.display = 'block';
     bar.style.width = '50%';
@@ -351,32 +348,22 @@ const LS_EDITED_KEY = 'supercity_edited';
       .then(r => r.json())
       .then(data => {
         if (data.alive) {
-          bar.style.width = '100%';
           sessionToken = savedToken;
-          originalRaw  = savedRaw;
-          parseCharacters(savedRaw);
-
-          // Restore edits if any were saved
-          const savedEdited = localStorage.getItem(LS_EDITED_KEY);
-          if (savedEdited) {
-            const editedFields = savedEdited.split('|');
-            characters.forEach(ch => {
-              ch.fields = editedFields.slice(ch.startIdx, ch.startIdx + ch.fields.length);
-            });
-          }
-
-          wrap.style.display = 'none';
-          document.getElementById('fileInfoBar').style.display = 'flex';
-          document.getElementById('fileInfoBar').innerHTML = `
-            <div class="file-info">♻ <span class="file-info-name">Session restored</span>
-            &nbsp;·&nbsp; ${characters.length} characters loaded${savedEdited ? ' &nbsp;·&nbsp; <b style="color:var(--accent2)">edits recovered</b>' : ''}</div>`;
-          document.getElementById('editorLayout').style.display = 'grid';
-          setStep(savedEdited ? 3 : 2);
-          showToast(savedEdited ? '✔ Session + edits restored — ready to export' : '✔ Session restored');
+          bar.style.width = '80%';
+          return loadCharacters(savedToken).then(() => {
+            bar.style.width = '100%';
+            wrap.style.display = 'none';
+            document.getElementById('fileInfoBar').style.display = 'flex';
+            document.getElementById('fileInfoBar').innerHTML = `
+              <div class="file-info">♻ <span class="file-info-name">Session restored</span>
+              &nbsp;·&nbsp; ${characters.length} characters loaded</div>`;
+            document.getElementById('editorLayout').style.display = 'grid';
+            setStep(2);
+            showToast('✔ Session restored');
+          });
         } else {
           localStorage.removeItem(LS_TOKEN_KEY);
-          localStorage.removeItem(LS_RAW_KEY);
-          loadFresh(wrap, bar, label);
+          return loadFresh(wrap, bar, label);
         }
       })
       .catch(() => loadFresh(wrap, bar, label));
@@ -392,12 +379,13 @@ const LS_EDITED_KEY = 'supercity_edited';
     fetch('/init')
       .then(r => { if (!r.ok) return r.json().then(e => { throw new Error(e.error); }); return r.json(); })
       .then(data => {
-        bar.style.width = '100%';
         sessionToken = data.token;
-        originalRaw  = data.characters;
         localStorage.setItem(LS_TOKEN_KEY, data.token);
-        localStorage.setItem(LS_RAW_KEY, data.characters);
-        parseCharacters(data.characters);
+        bar.style.width = '70%';
+        return loadCharacters(data.token);
+      })
+      .then(() => {
+        bar.style.width = '100%';
         wrap.style.display = 'none';
         document.getElementById('fileInfoBar').style.display = 'flex';
         document.getElementById('fileInfoBar').innerHTML = `
@@ -414,41 +402,15 @@ const LS_EDITED_KEY = 'supercity_edited';
   }
 })();
 
-// ── PARSE ──────────────────────────────────────────────────────────
-function parseCharacters(raw) {
-  characters = [];
-  const allFields = raw.split('|');
-
-  function isNameToken(s) {
-    s = s.trim();
-    return s.length > 1 && /[A-Za-z]/.test(s) && !/^-?[\d.]+$/.test(s);
-  }
-  function isNumeric(s) { return /^-?[\d.]+$/.test(s.trim()); }
-
-  const boundaries = [];
-  for (let i = 1; i < allFields.length - 1; i++) {
-    if (isNameToken(allFields[i]) && isNumeric(allFields[i + 1]) && isNameToken(allFields[i - 1])) {
-      boundaries.push(i);
-    }
-  }
-
-  for (let b = 0; b < boundaries.length; b++) {
-    const start = boundaries[b];
-    const end   = b + 1 < boundaries.length ? boundaries[b + 1] - 1 : allFields.length;
-    const fields = allFields.slice(start, end);
-    characters.push({
-      index:    b,
-      name:     allFields[start - 1].trim(),
-      alias:    fields[0].trim(),
-      fields:   fields,
-      original: [...fields],
-      startIdx: start,
-      endIdx:   end,
+// ── LOAD CHARACTERS FROM SERVER ────────────────────────────────────
+function loadCharacters(token) {
+  return fetch('/characters/' + token)
+    .then(r => { if (!r.ok) return r.json().then(e => { throw new Error(e.error); }); return r.json(); })
+    .then(data => {
+      characters = data.characters;
+      document.getElementById('charCount').textContent = characters.length;
+      renderList(characters);
     });
-  }
-
-  document.getElementById('charCount').textContent = characters.length;
-  renderList(characters);
 }
 
 // ── LIST ───────────────────────────────────────────────────────────
@@ -524,45 +486,51 @@ function saveCharacter() {
   if (activeIndex < 0) return;
   const ch = characters[activeIndex];
   let valid = true;
+  const edits = [];
+
   Object.keys(STAT_MAP).forEach(key => {
     const v = parseInt(document.getElementById(key).value, 10);
     if (isNaN(v) || v < 0 || v > 99999) { valid = false; document.getElementById(key).classList.add('invalid'); return; }
+    edits.push({ characterIndex: ch.index, fieldIndex: STAT_MAP[key], value: String(v) });
+    // Update local cache too
     ch.fields[STAT_MAP[key]] = String(v);
     updateBar(key, v);
   });
+
   if (!valid) { showToast('Fix invalid values first', true); return; }
-  document.getElementById('unsavedBadge').style.display = 'none';
-  showToast(`✔ ${ch.name} saved`);
-  setStep(3);
-  persistEdits();
-}
 
-function persistEdits() {
-  // Rebuild current edited raw and save to localStorage
-  const allFields = originalRaw.split('|');
-  characters.forEach(ch => {
-    ch.fields.forEach((val, j) => { allFields[ch.startIdx + j] = val; });
-  });
-  localStorage.setItem(LS_EDITED_KEY, allFields.join('|'));
+  // Persist edits server-side via /edit-bulk
+  fetch('/edit-bulk', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ token: sessionToken, edits }),
+  })
+  .then(r => { if (!r.ok) return r.json().then(e => { throw new Error(e.error); }); return r.json(); })
+  .then(() => {
+    document.getElementById('unsavedBadge').style.display = 'none';
+    showToast(`✔ ${ch.name} saved`);
+    setStep(3);
+  })
+  .catch(err => showToast('Save failed: ' + err.message, true));
 }
 
 function resetCharacter() {
   if (activeIndex < 0) return;
-  characters[activeIndex].fields = [...characters[activeIndex].original];
-  selectChar(activeIndex);
-  showToast('↺ Reset to original');
+  // Ask server to reset characters.txt to original APK state
+  fetch('/reset/' + sessionToken, { method: 'POST' })
+    .then(r => { if (!r.ok) return r.json().then(e => { throw new Error(e.error); }); return r.json(); })
+    .then(() => loadCharacters(sessionToken))
+    .then(() => {
+      // Re-select current character to refresh UI
+      if (activeIndex < characters.length) selectChar(activeIndex);
+      showToast('↺ Reset all to original');
+    })
+    .catch(err => showToast('Reset failed: ' + err.message, true));
 }
 
 // ── EXPORT ─────────────────────────────────────────────────────────
 function exportAPK() {
-  if (!sessionToken) { showToast('No APK session — re-upload', true); return; }
-
-  // Rebuild raw text from all character fields
-  const allFields = originalRaw.split('|');
-  characters.forEach(ch => {
-    ch.fields.forEach((val, j) => { allFields[ch.startIdx + j] = val; });
-  });
-  const rebuiltChars = allFields.join('|');
+  if (!sessionToken) { showToast('No APK session — reload page', true); return; }
 
   const btn = document.getElementById('exportBtn');
   btn.disabled = true;
@@ -572,7 +540,7 @@ function exportAPK() {
   fetch('/patch', {
     method:  'POST',
     headers: { 'Content-Type': 'application/json' },
-    body:    JSON.stringify({ token: sessionToken, characters: rebuiltChars }),
+    body:    JSON.stringify({ token: sessionToken }),
   })
   .then(res => {
     if (!res.ok) return res.json().then(e => { throw new Error(e.error); });
@@ -583,7 +551,7 @@ function exportAPK() {
     btn.textContent = '⬇ Export Patched APK';
     showToast('✔ Patched — click the download link');
     setStep(3);
-    // Show native browser download prompt
+    // Trigger browser download
     const a = document.createElement('a');
     a.href = data.url;
     a.download = 'supercity_modded.apk';