refactor(pages): decompose index.ts into specialized renderers and utils

2026-03-28 18:22:21 +01:00 · 2026-03-08 01:44:25 +09:00
parent 74c7c7b803
commit 5e2c00dcb8
10 changed files with 712 additions and 662 deletions
--- a/pages/src/assets/ts/renderers/patches.ts
+++ b/pages/src/assets/ts/renderers/patches.ts
@@ -0,0 +1,89 @@
+import { DateTime } from 'luxon';
+import { fetchJson } from '../api.js';
+import type { MirrorFileEntry, StoredData } from '../types.js';
+import { BASE_URL, FILE_SIZE_OPTS, gameTargets } from '../utils/constants.js';
+import math from '../utils/math.js';
+import { generateDownloadLinks } from '../utils/ui.js';
+
+export async function renderPatches(container: HTMLElement, mirrorFileDb: MirrorFileEntry[]) {
+  for (const target of gameTargets) {
+    const url = `${BASE_URL}/akEndfield/launcher/game/${target.dirName}/all_patch.json`;
+    try {
+      const data = await fetchJson<StoredData<any>[]>(url);
+      if (data.length === 0) continue;
+
+      const section = document.createElement('div');
+      section.className = 'mb-5';
+      section.innerHTML = `<h3 class="mb-3">${target.region === 'cn' ? 'China' : 'Global'}, ${target.name}</h3>`;
+
+      const accordion = document.createElement('div');
+      accordion.className = 'accordion';
+      accordion.id = `accordion-patch-${target.dirName}`;
+
+      let itemIndex = 0;
+      for (const e of [...data].reverse()) {
+        if (!e.rsp.patch) continue;
+        const version = e.rsp.version;
+        const reqVersion = e.rsp.request_version;
+        const dateStr = DateTime.fromISO(e.updatedAt).toFormat('yyyy/MM/dd HH:mm:ss');
+        const packedSize = math.arrayTotal(e.rsp.patch.patches.map((f: any) => parseInt(f.package_size)));
+        const unpackedSize = parseInt(e.rsp.patch.total_size) - packedSize;
+
+        let rows = '';
+        const fileName = (url: string) => new URL(url).pathname.split('/').pop() ?? '';
+        if (e.rsp.patch.url) {
+          rows += `<tr>
+            <td>${fileName(e.rsp.patch.url)}</td>
+            <td><code>${e.rsp.patch.md5}</code></td>
+            <td class="text-end">${math.formatFileSize(parseInt(e.rsp.patch.package_size), FILE_SIZE_OPTS)}</td>
+            <td class="text-center">${generateDownloadLinks(e.rsp.patch.url, mirrorFileDb)}</td>
+          </tr>`;
+        }
+        for (const f of e.rsp.patch.patches) {
+          rows += `<tr>
+            <td>${fileName(f.url)}</td>
+            <td><code>${f.md5}</code></td>
+            <td class="text-end">${math.formatFileSize(parseInt(f.package_size), FILE_SIZE_OPTS)}</td>
+            <td class="text-center">${generateDownloadLinks(f.url, mirrorFileDb)}</td>
+          </tr>`;
+        }
+
+        const itemId = `patch-${target.dirName}-${itemIndex}`;
+        const isExpanded = false;
+        itemIndex++;
+
+        const item = document.createElement('div');
+        item.className = 'accordion-item';
+        item.innerHTML = `
+          <h2 class="accordion-header" id="heading-${itemId}">
+            <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse-${itemId}" aria-expanded="${isExpanded}" aria-controls="collapse-${itemId}">
+              <div class="d-flex w-100 justify-content-between me-3">
+                <span class="fw-bold">${reqVersion} → ${version}</span>
+                <span class="text-muted small">${dateStr}</span>
+              </div>
+            </button>
+          </h2>
+          <div id="collapse-${itemId}" class="accordion-collapse collapse ${isExpanded ? 'show' : ''}" aria-labelledby="heading-${itemId}" data-bs-parent="#${accordion.id}">
+            <div class="accordion-body">
+              <table class="table table-sm table-borderless w-auto mb-2">
+                <tr><td>Unpacked Size</td><td class="text-end fw-bold">${math.formatFileSize(unpackedSize, FILE_SIZE_OPTS)}</td></tr>
+                <tr><td>Packed Size</td><td class="text-end fw-bold">${math.formatFileSize(packedSize, FILE_SIZE_OPTS)}</td></tr>
+              </table>
+              <div class="table-responsive">
+                <table class="table table-striped table-bordered table-sm align-middle text-nowrap">
+                  <thead><tr><th>File</th><th>MD5 Checksum</th><th class="text-end">Size</th><th class="text-center">DL</th></tr></thead>
+                  <tbody>${rows}</tbody>
+                </table>
+              </div>
+            </div>
+          </div>
+        `;
+        accordion.appendChild(item);
+      }
+      section.appendChild(accordion);
+      container.appendChild(section);
+    } catch (err) {
+      // Ignore
+    }
+  }
+}