GaCySR/Gacy-Srtool
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(gachabase): full game database sync and automatic cdn image resolution

Browse Source
This commit is contained in:
CAtlas0784 committed 2026-10-17 10:44:14 +07:00
1 parent 5944673e0e
commit 039609980e
4 files changed
+640 -1049
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

js/app.js
+168 -359
View File
@@ -2,14 +2,26 @@ import { AVATAR_METADATA, getAvatarInfo } from './avatars-data.js';
import { LIGHTCONE_METADATA, RELIC_SET_METADATA, getLightconeInfo, getRelicSetInfo } from './equipment-data.js';
import { SUPPORTED_LANGUAGES, TRANSLATIONS, getCurrentLanguage, setLanguage, t, translateElement, translatePath } from './i18n.js';
import {
parseGachabaseInput,
fetchGachabaseHtml,
parseGachabaseHtml,
registerGachabaseItem,
loadCachedGachabaseRegistry,
applyGachabaseToFreeSR
syncGachabaseDatabase,
loadCachedGachabaseData,
getAvatarIconUrl,
getLightconeArtUrl,
getLightconeThumbUrl,
handleAvatarImgError,
handleLcImgError,
GACHABASE_IMAGE_CACHE,
KNOWN_GACHABASE_ASSETS
} from './gachabase.js';
// Expose image resolvers & error handlers to window for inline onclick/onerror attributes
window.handleAvatarImgError = handleAvatarImgError;
window.handleLcImgError = handleLcImgError;
window.getAvatarIconUrl = getAvatarIconUrl;
window.getLightconeArtUrl = getLightconeArtUrl;
window.getLightconeThumbUrl = getLightconeThumbUrl;
window.GACHABASE_IMAGE_CACHE = GACHABASE_IMAGE_CACHE;
window.KNOWN_GACHABASE_ASSETS = KNOWN_GACHABASE_ASSETS;
// Application State
const state = {
serverMode: localStorage.getItem('gac_srtool_mode') || 'gac', // 'gac' | 'firefly' | 'robin'
@@ -66,25 +78,14 @@ const el = {
btnQuickAddAllLcs: document.getElementById('btn-quick-add-all-lcs'),
btnQuickTeleportTrain: document.getElementById('btn-quick-teleport-train'),
btnQuickClearLineup: document.getElementById('btn-quick-clear-lineup'),
btnQuickGachabase: document.getElementById('btn-quick-gachabase'),
btnOpenGachabase: document.getElementById('btn-open-gachabase'),
btnAvatarsGachabase: document.getElementById('btn-avatars-gachabase'),
btnEqGachabase: document.getElementById('btn-eq-gachabase'),
// Gachabase Modal
modalGachabase: document.getElementById('modal-gachabase'),
btnCloseGachabaseModal: document.getElementById('btn-close-gachabase-modal'),
gachabaseInput: document.getElementById('gachabase-input'),
gachabaseType: document.getElementById('gachabase-type'),
gachabaseBranch: document.getElementById('gachabase-branch'),
gachabaseLang: document.getElementById('gachabase-lang'),
btnGachabaseFetch: document.getElementById('btn-gachabase-fetch'),
gachabaseStatus: document.getElementById('gachabase-status'),
gachabasePreviewContainer: document.getElementById('gachabase-preview-container'),
gachabaseFooterActions: document.getElementById('gachabase-footer-actions'),
btnGachabaseSaveMeta: document.getElementById('btn-gachabase-save-meta'),
btnGachabaseImportE0S1: document.getElementById('btn-gachabase-import-e0s1'),
btnGachabaseImportE6S5: document.getElementById('btn-gachabase-import-e6s5'),
// Gachabase Sync
btnHeaderGachabaseSync: document.getElementById('btn-header-gachabase-sync'),
btnQuickGachabaseSync: document.getElementById('btn-quick-gachabase-sync'),
btnSyncGachabaseAvatars: document.getElementById('btn-sync-gachabase-avatars'),
btnSyncGachabaseEq: document.getElementById('btn-sync-gachabase-eq'),
btnSyncGachabaseNow: document.getElementById('btn-sync-gachabase-now'),
badgeGachabaseStatus: document.getElementById('badge-gachabase-status'),
lblGachabaseInfo: document.getElementById('lbl-gachabase-info'),
// Avatars
avatarsGrid: document.getElementById('avatars-grid'),
@@ -977,8 +978,8 @@ function renderLineup(lineups) {
<div class="lineup-slot-num">Slot ${slot + 1}</div>
${removeSlotBtnHtml}
<img class="lineup-slot-img"
src="./assets/avatars/${avatarId}.png"
onerror="if(this.src.indexOf('jsdelivr')===-1){this.src='https://cdn.jsdelivr.net/gh/Mar-7th/StarRailRes@master/icon/avatar/${avatarId}.png';}else{this.style.display='none';}"
src="${getAvatarIconSrc(avatarId)}"
onerror="handleAvatarImgError(this, ${avatarId})"
alt="${info.name}">
<div style="font-weight: 800; font-size: 1rem; color: var(--text-highlight); margin-top: 0.35rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;">${info.name}</div>
<div style="display: flex; gap: 0.4rem; margin-top: 0.4rem; justify-content: center; align-items: center;">
@@ -1135,8 +1136,8 @@ function renderPickerGrid() {
card.innerHTML = `
<div class="picker-avatar-img-wrap">
<img class="picker-avatar-img"
src="./assets/avatars/${item.avatar_id}.png"
onerror="if(this.src.indexOf('jsdelivr')===-1){this.src='https://cdn.jsdelivr.net/gh/Mar-7th/StarRailRes@master/icon/avatar/${item.avatar_id}.png';}else{this.style.display='none';}"
src="${getAvatarIconSrc(item.avatar_id)}"
onerror="handleAvatarImgError(this, ${item.avatar_id})"
alt="${meta.name}">
</div>
<div class="picker-avatar-info">
@@ -1266,8 +1267,8 @@ function renderAvatarsGrid() {
<div class="avatar-header-info">
<div class="avatar-image-container">
<img class="avatar-img"
src="./assets/avatars/${item.avatar_id}.png"
onerror="if(this.src.indexOf('jsdelivr')===-1){this.src='https://cdn.jsdelivr.net/gh/Mar-7th/StarRailRes@master/icon/avatar/${item.avatar_id}.png';}else{this.style.display='none';this.nextElementSibling.style.display='flex';}"
src="${getAvatarIconSrc(item.avatar_id)}"
onerror="handleAvatarImgError(this, ${item.avatar_id})"
alt="${meta.name}">
<div class="avatar-icon-placeholder" style="display: none;">${meta.name.charAt(0)}</div>
</div>
@@ -1575,12 +1576,14 @@ const RECOMMENDED_RELIC_BUILDS = {
Elation: { cavern: 115, planar: 306, name: "Grand Duke (4) + Inert Salsotto (2)" }
};
// Lightcone Art URL Resolvers (Local asset -> Gachabase -> StarRailRes)
// Lightcone Art URL Resolvers (Metadata -> Gachabase CDN -> Local asset -> StarRailRes)
function getLightconeArtSrc(lcId) {
const id = parseInt(lcId, 10);
const meta = LIGHTCONE_METADATA[id];
if (meta?.images?.fullArt) return meta.images.fullArt;
if (meta?.images?.thumbnail) return meta.images.thumbnail;
if (GACHABASE_IMAGE_CACHE.lightcones[id]) return GACHABASE_IMAGE_CACHE.lightcones[id];
if (KNOWN_GACHABASE_ASSETS.lightcones[id]) return KNOWN_GACHABASE_ASSETS.lightcones[id];
if (id === 23065) {
return './assets/lightcones/23065.png';
}
@@ -1592,6 +1595,10 @@ function getLightconeArtFallback(lcId) {
const meta = LIGHTCONE_METADATA[id];
if (meta?.images?.thumbnail) return meta.images.thumbnail;
if (meta?.images?.fullArt) return meta.images.fullArt;
if (GACHABASE_IMAGE_CACHE.lightconeThumbs[id]) return GACHABASE_IMAGE_CACHE.lightconeThumbs[id];
if (KNOWN_GACHABASE_ASSETS.lightconeThumbs[id]) return KNOWN_GACHABASE_ASSETS.lightconeThumbs[id];
if (GACHABASE_IMAGE_CACHE.lightcones[id]) return GACHABASE_IMAGE_CACHE.lightcones[id];
if (KNOWN_GACHABASE_ASSETS.lightcones[id]) return KNOWN_GACHABASE_ASSETS.lightcones[id];
if (id === 23065) {
return 'https://cdn.gachabase.net/hsr/assets/500cfc18698932759756f6b3ba4db417.png';
}
@@ -1603,6 +1610,8 @@ function getAvatarIconSrc(aid) {
const meta = AVATAR_METADATA[id];
if (meta?.images?.icon) return meta.images.icon;
if (meta?.images?.square) return meta.images.square;
if (GACHABASE_IMAGE_CACHE.avatars[id]) return GACHABASE_IMAGE_CACHE.avatars[id];
if (KNOWN_GACHABASE_ASSETS.avatars[id]) return KNOWN_GACHABASE_ASSETS.avatars[id];
return `./assets/avatars/${id}.png`;
}
@@ -1611,6 +1620,8 @@ function getAvatarSplashSrc(aid) {
const meta = AVATAR_METADATA[id];
if (meta?.images?.splash) return meta.images.splash;
if (meta?.images?.fullArt) return meta.images.fullArt;
if (GACHABASE_IMAGE_CACHE.avatarSplash[id]) return GACHABASE_IMAGE_CACHE.avatarSplash[id];
if (KNOWN_GACHABASE_ASSETS.avatarSplash[id]) return KNOWN_GACHABASE_ASSETS.avatarSplash[id];
return `https://raw.githubusercontent.com/Mar-7th/StarRailRes/master/image/character_portrait/${id}.png`;
}
@@ -1888,8 +1899,8 @@ function renderModalSwitcher(currentAvatarId) {
item.className = `modal-char-switcher-item ${av.avatar_id === currentAvatarId ? 'active' : ''}`;
item.title = `${meta.name} (ID: ${av.avatar_id})`;
item.innerHTML = `
<img src="./assets/avatars/${av.avatar_id}.png"
onerror="if(this.src.indexOf('jsdelivr')===-1){this.src='https://cdn.jsdelivr.net/gh/Mar-7th/StarRailRes@master/icon/avatar/${av.avatar_id}.png';}else{this.style.display='none';}"
<img src="${getAvatarIconSrc(av.avatar_id)}"
onerror="handleAvatarImgError(this, ${av.avatar_id})"
alt="${meta.name}">
`;
item.addEventListener('click', () => {
@@ -1909,12 +1920,9 @@ function renderModalOverviewTab(avatarId) {
// Portrait Art
if (el.overviewPortraitImg) {
el.overviewPortraitImg.src = `https://raw.githubusercontent.com/Mar-7th/StarRailRes/master/image/character_portrait/${aid}.png`;
el.overviewPortraitImg.src = getAvatarSplashSrc(aid);
el.overviewPortraitImg.onerror = function() {
this.src = `./assets/avatars/${aid}.png`;
this.onerror = function() {
this.src = `https://cdn.jsdelivr.net/gh/Mar-7th/StarRailRes@master/icon/avatar/${aid}.png`;
};
handleAvatarImgError(this, aid);
};
}
@@ -1940,12 +1948,7 @@ function renderModalOverviewTab(avatarId) {
if (el.overviewLcThumb) {
el.overviewLcThumb.src = getLightconeArtSrc(lcId);
el.overviewLcThumb.onerror = function() {
const fallback = getLightconeArtFallback(lcId);
if (this.src !== fallback) {
this.src = fallback;
} else {
this.src = './assets/logo.png';
}
handleLcImgError(this, lcId);
};
}
if (el.overviewLcName) el.overviewLcName.textContent = lcInfo.name || `Light Cone ${lcId}`;
@@ -2076,9 +2079,7 @@ function renderModalRelicsTab(avatarId) {
if (lcThumbEl) {
lcThumbEl.src = getLightconeArtSrc(lcId);
lcThumbEl.onerror = function() {
const fb = getLightconeArtFallback(lcId);
if (this.src !== fb) this.src = fb;
else this.src = './assets/logo.png';
handleLcImgError(this, lcId);
};
}
if (lcNameEl) lcNameEl.textContent = lcInfo.name || `Light Cone ${lcId}`;
@@ -2710,9 +2711,9 @@ function openAvatarDetailModal(avatarItem) {
const meta = getAvatarInfo(aid);
el.modalCharTitle.textContent = `${t('modalTitleCharEdit')}: ${meta.name} (ID: ${aid})`;
el.modalCharImg.src = `./assets/avatars/${aid}.png`;
el.modalCharImg.src = getAvatarIconSrc(aid);
el.modalCharImg.onerror = function() {
this.src = `https://cdn.jsdelivr.net/gh/Mar-7th/StarRailRes@master/icon/avatar/${aid}.png`;
handleAvatarImgError(this, aid);
};
el.modalCharName.textContent = meta.name;
el.modalCharMeta.innerHTML = `
@@ -3274,15 +3275,14 @@ function renderShowcaseCard(avatarId) {
`;
}
const primaryPortrait = `https://raw.githubusercontent.com/Mar-7th/StarRailRes/master/image/character_portrait/${aid}.png`;
const primaryPortrait = getAvatarSplashSrc(aid);
const fallbackPortrait = `https://cdn.jsdelivr.net/gh/Mar-7th/StarRailRes@master/image/character_portrait/${aid}.png`;
const lcArtThumb = getLightconeArtSrc(lcId);
const fallbackLcThumb = getLightconeArtFallback(lcId);
el.showcaseCardContainer.innerHTML = `
<!-- 1. Left Splash Art Column -->
<div class="showcase-splash-col">
<img class="showcase-splash-img" src="${primaryPortrait}" onerror="if(this.src!=='${fallbackPortrait}')this.src='${fallbackPortrait}';else this.src='./assets/avatars/${aid}.png';" alt="${meta.name}">
<img class="showcase-splash-img" src="${primaryPortrait}" onerror="if(this.src!=='${fallbackPortrait}')this.src='${fallbackPortrait}';else handleAvatarImgError(this, ${aid});" alt="${meta.name}">
<div class="showcase-splash-overlay">
<div class="showcase-char-name">${meta.name}</div>
<div style="display: flex; gap: 0.4rem; align-items: center; flex-wrap: wrap;">
@@ -3300,7 +3300,7 @@ function renderShowcaseCard(avatarId) {
<div class="showcase-center-col">
<!-- Lightcone Box -->
<div class="showcase-lc-box">
<img class="showcase-lc-thumb" src="${lcArtThumb}" onerror="if(this.src!=='${fallbackLcThumb}')this.src='${fallbackLcThumb}';else this.src='./assets/logo.png';" alt="${lcInfo.name}">
<img class="showcase-lc-thumb" src="${lcArtThumb}" onerror="handleLcImgError(this, ${lcId})" alt="${lcInfo.name}">
<div style="flex: 1; min-width: 0;">
<div style="font-weight: 800; font-size: 0.95rem; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">${lcInfo.name}</div>
<div style="font-size: 0.775rem; color: var(--text-muted); margin-top: 0.2rem;">
@@ -4017,15 +4017,14 @@ function renderLightconesGrid() {
const wearerBadgeHtml = lc.equip_avatar ? `
<div class="eq-tile-wearer-badge" title="สวมใส่โดย: ${getAvatarInfo(lc.equip_avatar).name}">
<img class="eq-tile-wearer-img" src="https://raw.githubusercontent.com/Mar-7th/StarRailRes/master/icon/character/${lc.equip_avatar}.png" onerror="if(this.src!=='./assets/avatars/${lc.equip_avatar}.png')this.src='./assets/avatars/${lc.equip_avatar}.png';else this.src='./assets/logo.png';" alt="Wearer">
<img class="eq-tile-wearer-img" src="${getAvatarIconSrc(lc.equip_avatar)}" onerror="handleAvatarImgError(this, ${lc.equip_avatar})" alt="Wearer">
</div>
` : '';
const primaryImg = getLightconeArtSrc(lc.item_id);
const fallbackImg = getLightconeArtFallback(lc.item_id);
card.innerHTML = `
<img class="eq-tile-img" src="${primaryImg}" onerror="if(this.src!=='${fallbackImg}')this.src='${fallbackImg}';else this.src='./assets/logo.png';" alt="${meta.name}">
<img class="eq-tile-img" src="${primaryImg}" onerror="handleLcImgError(this, ${lc.item_id})" alt="${meta.name}">
<div class="eq-tile-top-tag">${roman}</div>
${wearerBadgeHtml}
<div class="eq-tile-bottom-bar">
@@ -4085,7 +4084,7 @@ function renderRelicsGrid() {
const wearerBadgeHtml = r.equip_avatar ? `
<div class="eq-tile-wearer-badge" title="สวมใส่โดย: ${getAvatarInfo(r.equip_avatar).name}">
<img class="eq-tile-wearer-img" src="https://raw.githubusercontent.com/Mar-7th/StarRailRes/master/icon/character/${r.equip_avatar}.png" onerror="if(this.src!=='./assets/avatars/${r.equip_avatar}.png')this.src='./assets/avatars/${r.equip_avatar}.png';else this.src='./assets/logo.png';" alt="Wearer">
<img class="eq-tile-wearer-img" src="${getAvatarIconSrc(r.equip_avatar)}" onerror="handleAvatarImgError(this, ${r.equip_avatar})" alt="Wearer">
</div>
` : '';
@@ -4132,13 +4131,12 @@ function showLcInspector(lc) {
const def = lcMeta.def || (lcMeta.rarity === 5 ? 529 : (lcMeta.rarity === 4 ? 396 : 264));
const primaryThumb = getLightconeArtSrc(lc.item_id);
const fallbackThumb = getLightconeArtFallback(lc.item_id);
el.eqInspectorCard.style.display = 'flex';
el.eqInspectorCard.innerHTML = `
<div style="display: flex; justify-content: space-between; align-items: flex-start;">
<div class="eq-inspector-hero">
<img class="eq-inspector-thumb" src="${primaryThumb}" onerror="if(this.src!=='${fallbackThumb}')this.src='${fallbackThumb}';else this.src='./assets/logo.png';" alt="${lcInfo.name}">
<img class="eq-inspector-thumb" src="${primaryThumb}" onerror="handleLcImgError(this, ${lc.item_id})" alt="${lcInfo.name}">
<div class="eq-inspector-info">
<div class="eq-inspector-title">${lcInfo.name}</div>
<div class="eq-inspector-stars">${'★'.repeat(lcInfo.rarity || 5)}</div>
@@ -4386,7 +4384,7 @@ function updateAddLcPreview(lcId) {
const previewThumb = document.getElementById('add-lc-preview-thumb');
if (previewThumb) {
previewThumb.src = getLightconeArtSrc(id);
previewThumb.onerror = function() { this.src = getLightconeArtFallback(id); };
previewThumb.onerror = function() { handleLcImgError(this, id); };
}
const previewName = document.getElementById('add-lc-preview-name');
@@ -4463,7 +4461,7 @@ function renderAddLcVisualGrid() {
card.dataset.lcId = id;
card.innerHTML = `
<img class="add-lc-card-thumb" src="${getLightconeArtSrc(id)}" onerror="this.src='${getLightconeArtFallback(id)}'" alt="${info.name}" loading="lazy">
<img class="add-lc-card-thumb" src="${getLightconeArtSrc(id)}" onerror="handleLcImgError(this, ${id})" alt="${info.name}" loading="lazy">
<div class="add-lc-card-body">
<div class="add-lc-card-name" title="${info.name}">${info.name}</div>
<div class="add-lc-card-stars">${'★'.repeat(info.rarity || 5)}</div>
@@ -4706,8 +4704,8 @@ function renderExRanks(exList) {
<div style="display: flex; align-items: center; gap: 1rem;">
<div class="avatar-image-container" style="width: 52px; height: 52px;">
<img class="avatar-img"
src="./assets/avatars/${ex.avatar_id}.png"
onerror="if(this.src.indexOf('jsdelivr')===-1){this.src='https://cdn.jsdelivr.net/gh/Mar-7th/StarRailRes@master/icon/avatar/${ex.avatar_id}.png';}else{this.style.display='none';}"
src="${getAvatarIconSrc(ex.avatar_id)}"
onerror="handleAvatarImgError(this, ${ex.avatar_id})"
alt="${info.name}">
</div>
<div>
@@ -4966,6 +4964,7 @@ function setupTabs() {
loadJsonData(state.currentJsonMode);
} else if (targetId === 'tab-settings') {
updateCacheUsageDisplay();
updateGachabaseSyncUI();
}
}
});
@@ -4973,323 +4972,134 @@ function setupTabs() {
}
// ==========================================
// Gachabase Data Fetcher & Importer Logic
// Gachabase Catalog Sync & Dynamic Image Engine
// ==========================================
let currentGachabaseItem = null;
let isGachabaseSyncing = false;
function openGachabaseModal(defaultId = null, defaultType = 'character') {
if (!el.modalGachabase) return;
el.modalGachabase.classList.add('active');
if (defaultId) {
if (el.gachabaseInput) el.gachabaseInput.value = String(defaultId);
if (el.gachabaseType) el.gachabaseType.value = defaultType;
performGachabaseFetch();
} else {
setTimeout(() => el.gachabaseInput?.focus(), 50);
async function updateGachabaseSyncUI() {
if (!el.badgeGachabaseStatus && !el.lblGachabaseInfo) return;
try {
const lastSync = await idbGet('gac_gachabase_last_sync');
if (lastSync && lastSync.timestamp) {
const dateStr = new Date(lastSync.timestamp).toLocaleString();
if (el.badgeGachabaseStatus) {
el.badgeGachabaseStatus.textContent = 'ซิงค์แล้ว';
el.badgeGachabaseStatus.style.color = 'var(--accent-green)';
el.badgeGachabaseStatus.style.borderColor = 'rgba(52, 211, 153, 0.4)';
}
if (el.lblGachabaseInfo) {
el.lblGachabaseInfo.innerHTML = `ซิงค์ล่าสุดเมื่อ: <strong>${dateStr}</strong> (ตัวละครในระบบ: ${lastSync.totalAvatarsCount || Object.keys(AVATAR_METADATA).length}, กรวยแสง: ${lastSync.totalLcsCount || Object.keys(LIGHTCONE_METADATA).length})`;
}
} else {
if (el.badgeGachabaseStatus) {
el.badgeGachabaseStatus.textContent = 'ยังไม่เคยซิงค์';
el.badgeGachabaseStatus.style.color = 'var(--accent-gold)';
el.badgeGachabaseStatus.style.borderColor = 'rgba(245, 158, 11, 0.4)';
}
if (el.lblGachabaseInfo) {
el.lblGachabaseInfo.textContent = 'ยังไม่ได้ซิงค์แคตตาล็อกเกมจาก Gachabase กดปุ่มด้านล่างเพื่ออัปเดต';
}
}
} catch (err) {
console.warn('Error reading gachabase sync status:', err);
}
}
function closeGachabaseModal() {
if (!el.modalGachabase) return;
el.modalGachabase.classList.remove('active');
}
async function performGachabaseFetch() {
const input = el.gachabaseInput?.value?.trim();
if (!input) {
showToast('กรุณาระบุ ID หรือ URL ของ Gachabase', 'warning');
async function triggerGachabaseSync(showToastOnDone = true) {
if (isGachabaseSyncing) {
showToast('กำลังซิงค์ข้อมูลจาก Gachabase อยู่แล้ว กรุณารอสักครู่...', 'warning');
return;
}
const type = el.gachabaseType?.value || 'character';
const branch = el.gachabaseBranch?.value || 'beta';
const lang = el.gachabaseLang?.value || 'en';
isGachabaseSyncing = true;
const syncButtons = [
el.btnHeaderGachabaseSync,
el.btnQuickGachabaseSync,
el.btnSyncGachabaseAvatars,
el.btnSyncGachabaseEq,
el.btnSyncGachabaseNow
].filter(Boolean);
const parsedParams = parseGachabaseInput(input, type, branch, lang);
if (!parsedParams) {
showToast('รูปแบบข้อมูลไม่ถูกต้อง กรุณาระบุ ID ตัวเลขหรือ URL', 'error');
return;
syncButtons.forEach(btn => {
btn.disabled = true;
btn.classList.add('loading');
});
if (el.badgeGachabaseStatus) {
el.badgeGachabaseStatus.textContent = 'กำลังซิงค์...';
el.badgeGachabaseStatus.style.color = 'var(--accent-cyan)';
el.badgeGachabaseStatus.style.borderColor = 'rgba(56, 189, 248, 0.4)';
}
if (el.lblGachabaseInfo) {
el.lblGachabaseInfo.textContent = 'กำลังดึงฐานข้อมูลตัวละครและกรวยแสงจาก Gachabase CDN...';
}
if (parsedParams.type && el.gachabaseType) el.gachabaseType.value = parsedParams.type;
if (parsedParams.branch && el.gachabaseBranch) el.gachabaseBranch.value = parsedParams.branch;
if (el.gachabaseStatus) {
el.gachabaseStatus.style.display = 'block';
el.gachabaseStatus.style.background = 'rgba(56, 189, 248, 0.15)';
el.gachabaseStatus.style.border = '1px solid rgba(56, 189, 248, 0.4)';
el.gachabaseStatus.style.color = 'var(--accent-cyan)';
el.gachabaseStatus.innerHTML = `🔄 กำลังดึงข้อมูลจาก Gachabase (<code style="color: #fff;">${parsedParams.url}</code>)...`;
}
if (el.gachabasePreviewContainer) el.gachabasePreviewContainer.style.display = 'none';
if (el.gachabaseFooterActions) el.gachabaseFooterActions.style.display = 'none';
if (el.btnGachabaseFetch) el.btnGachabaseFetch.disabled = true;
showToast('🌐 เริ่มซิงค์ฐานข้อมูลตัวละครและรูปภาพจาก Gachabase...', 'info');
try {
const { html, finalUrl } = await fetchGachabaseHtml(parsedParams.url, state.apiUrl);
const parsedItem = parseGachabaseHtml(html, lang);
parsedItem.sourceUrl = finalUrl;
parsedItem.branch = parsedParams.branch;
parsedItem.lang = lang;
currentGachabaseItem = parsedItem;
const currentLang = getCurrentLanguage();
const result = await syncGachabaseDatabase({
apiUrl: state.apiUrl,
branch: 'beta',
lang: currentLang === 'th' ? 'th' : 'en',
metadataContext: {
AVATAR_METADATA,
LIGHTCONE_METADATA,
SIGNATURE_LIGHTCONES,
idbSet,
idbGet
}
});
if (el.gachabaseStatus) {
el.gachabaseStatus.style.background = 'rgba(52, 211, 153, 0.15)';
el.gachabaseStatus.style.border = '1px solid rgba(52, 211, 153, 0.4)';
el.gachabaseStatus.style.color = 'var(--accent-green)';
el.gachabaseStatus.innerHTML = `✅ ดึงข้อมูลสำเร็จ: <strong>[${parsedItem.rarity}★] ${parsedItem.name}</strong> (ID: ${parsedItem.id})`;
initAvatarsList(true);
renderAvatarsGrid();
loadEquipment();
if (state.selectedAvatarDetail) {
renderModalSwitcher(state.selectedAvatarDetail.avatar_id);
}
await updateGachabaseSyncUI();
renderGachabasePreview(parsedItem);
if (showToastOnDone) {
showToast(`✅ ซิงค์สำเร็จ! ตรวจพบตัวละครทั้งหมด ${result.totalAvatarsCount} ตัว (+ใหม่ ${result.newAvatarsCount}), กรวยแสง ${result.totalLcsCount} ชิ้น (+ใหม่ ${result.newLcsCount}) พร้อมผูกรูป Gachabase CDN เรียบร้อย`, 'success');
}
} catch (err) {
console.error('Gachabase fetch error:', err);
if (el.gachabaseStatus) {
el.gachabaseStatus.style.background = 'rgba(248, 113, 113, 0.15)';
el.gachabaseStatus.style.border = '1px solid rgba(248, 113, 113, 0.4)';
el.gachabaseStatus.style.color = 'var(--accent-red)';
el.gachabaseStatus.innerHTML = `❌ เกิดข้อผิดพลาดในการดึงข้อมูล: ${err.message}`;
console.error('Gachabase sync failed:', err);
if (el.badgeGachabaseStatus) {
el.badgeGachabaseStatus.textContent = 'ซิงค์ล้มเหลว';
el.badgeGachabaseStatus.style.color = 'var(--accent-red)';
el.badgeGachabaseStatus.style.borderColor = 'rgba(248, 113, 113, 0.4)';
}
if (el.lblGachabaseInfo) {
el.lblGachabaseInfo.textContent = `ข้อผิดพลาด: ${err.message}`;
}
showToast(`❌ ซิงค์ข้อมูล Gachabase ไม่สำเร็จ: ${err.message}`, 'error');
} finally {
if (el.btnGachabaseFetch) el.btnGachabaseFetch.disabled = false;
}
}
function renderGachabasePreview(item) {
if (!el.gachabasePreviewContainer) return;
el.gachabasePreviewContainer.style.display = 'block';
if (el.gachabaseFooterActions) el.gachabaseFooterActions.style.display = 'flex';
const isChar = item.type === 'character';
const isLc = item.type === 'lightcone';
const isRelic = item.type === 'relic';
if (el.btnGachabaseImportE0S1) {
el.btnGachabaseImportE0S1.textContent = isChar ? '⚡ นำเข้า FreeSR (E0S1)' : '⚡ เพิ่มเข้า FreeSR (S1)';
}
if (el.btnGachabaseImportE6S5) {
el.btnGachabaseImportE6S5.textContent = isChar ? '⭐ นำเข้า FreeSR (E6S5)' : '⭐ เพิ่มเข้า FreeSR (S5)';
}
const starsHtml = '⭐'.repeat(item.rarity || 5);
let mainImgUrl = '';
if (isChar) {
mainImgUrl = item.images.splash || item.images.icon || `./assets/avatars/${item.id}.png`;
} else if (isLc) {
mainImgUrl = item.images.fullArt || item.images.thumbnail || `./assets/lightcones/${item.id}.png`;
} else {
mainImgUrl = item.images.icon || `./assets/logo.png`;
}
let recHtml = '';
if (isChar) {
const cavernSets = item.recommended.cavernSets || [];
const planarSets = item.recommended.planarSets || [];
const sigLcId = item.recommended.signatureLcId;
const sigLcMeta = sigLcId ? getLightconeInfo(sigLcId) : null;
recHtml = `
<div style="background: rgba(251, 191, 36, 0.08); border: 1px dashed rgba(251, 191, 36, 0.4); border-radius: var(--radius-sm); padding: 0.75rem; margin-top: 0.5rem;">
<div style="font-weight: 800; font-size: 0.825rem; color: var(--accent-gold); margin-bottom: 0.4rem;">
💡 คำแนะนำการจัด Build จาก Gachabase
</div>
<div style="display: flex; flex-direction: column; gap: 0.35rem; font-size: 0.8rem;">
<div>
<strong>🗡️ กรวยแสงแนะนำ (Signature):</strong>
<span style="color: #fff;">${sigLcMeta ? sigLcMeta.name : (sigLcId ? `LC ID: ${sigLcId}` : 'ตามสายตัวละคร')}</span>
</div>
<div>
<strong>🛡️ เซ็ตรีลิกส์แนะนำ (Cavern):</strong>
<span style="color: #cbd5e1;">${cavernSets.map(s => getRelicSetInfo(s).name).join(', ') || 'ตามประเภทสาย'}</span>
</div>
<div>
<strong>🔮 เครื่องประดับแนะนำ (Planar):</strong>
<span style="color: #cbd5e1;">${planarSets.map(s => getRelicSetInfo(s).name).join(', ') || 'ตามประเภทสาย'}</span>
</div>
</div>
</div>
`;
}
let skillsHtml = '';
if (isChar && item.skills && item.skills.length > 0) {
skillsHtml = `
<div style="margin-top: 1rem;">
<h4 style="font-size: 0.95rem; font-weight: 800; color: var(--accent-cyan); margin-bottom: 0.6rem;">
⚡ สกิลและการต่อสู้ (${item.skills.length} ท่า)
</h4>
<div style="display: flex; flex-direction: column; gap: 0.5rem; max-height: 260px; overflow-y: auto; padding-right: 0.25rem;">
${item.skills.map(s => `
<div class="gachabase-skill-item">
${s.icon ? `<img class="gachabase-skill-icon" src="${s.icon}" alt="${s.name}" onerror="this.style.display='none'">` : ''}
<div style="flex: 1; min-width: 0;">
<div style="display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.2rem; flex-wrap: wrap;">
<span style="font-weight: 700; color: #fff; font-size: 0.875rem;">${s.name}</span>
<span class="skill-type-tag" style="font-size: 0.7rem;">${s.type}</span>
${s.tag ? `<span class="badge-super-tag" style="font-size: 0.7rem;">${s.tag}</span>` : ''}
</div>
<div style="font-size: 0.775rem; color: var(--text-muted); line-height: 1.4;">${s.description}</div>
</div>
</div>
`).join('')}
</div>
</div>
`;
} else if (isLc && item.lcSkill) {
skillsHtml = `
<div style="margin-top: 1rem; background: rgba(0, 0, 0, 0.25); border: 1px solid var(--border-color); border-radius: var(--radius-sm); padding: 0.75rem;">
<div style="font-weight: 700; color: var(--accent-gold); font-size: 0.9rem; margin-bottom: 0.35rem;">
✨ เอฟเฟกต์สกิลพิเศษ: ${item.lcSkill.name || 'Passive Skill'}
</div>
<div style="font-size: 0.8rem; color: var(--text-muted); line-height: 1.5;">${item.lcSkill.description || '-'}</div>
</div>
`;
}
let eidolonsHtml = '';
if (isChar && item.eidolons && item.eidolons.length > 0) {
eidolonsHtml = `
<div style="margin-top: 1rem;">
<h4 style="font-size: 0.95rem; font-weight: 800; color: var(--accent-gold); margin-bottom: 0.6rem;">
⭐ กลุ่มดาว Eidolons (E1 - E6)
</h4>
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 0.5rem; max-height: 220px; overflow-y: auto; padding-right: 0.25rem;">
${item.eidolons.map(e => `
<div class="gachabase-eidolon-item">
<span class="badge-super-tag" style="background: rgba(251, 191, 36, 0.2); color: var(--accent-gold); font-weight: 800; min-width: 32px; text-align: center;">E${e.rank}</span>
<div style="flex: 1; min-width: 0;">
<div style="font-weight: 700; color: #fff; font-size: 0.825rem;">${e.name}</div>
<div style="font-size: 0.75rem; color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;">${e.description}</div>
</div>
</div>
`).join('')}
</div>
</div>
`;
}
el.gachabasePreviewContainer.innerHTML = `
<div class="gachabase-preview-card">
<div class="gachabase-art-column">
<img class="gachabase-art-img" src="${mainImgUrl}" alt="${item.name}" onerror="this.src='./assets/logo.png'">
<div style="font-size: 1.1rem; letter-spacing: 2px;">${starsHtml}</div>
${isChar && item.maxEnergy ? `<div class="badge-super-tag" style="font-size: 0.75rem;">⚡ พลังงานสูงสุด: ${item.maxEnergy}</div>` : ''}
</div>
<div class="gachabase-details-column">
<div class="gachabase-header-title">
<span>${item.name}</span>
<span style="font-size: 0.75rem; font-weight: 600; padding: 0.15rem 0.5rem; background: rgba(255,255,255,0.08); border-radius: 4px; color: var(--text-muted);">ID: ${item.id}</span>
</div>
<div style="display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap;">
${isChar ? `${getElementIconHtml(item.element, 20)} <span style="font-size: 0.85rem; font-weight: 700;">${translateElement(item.element)}</span>` : ''}
${getPathIconHtml(item.path, 20)} <span style="font-size: 0.85rem; font-weight: 700;">${translatePath(item.path)}</span>
<span class="badge-super-tag" style="background: rgba(56, 189, 248, 0.15); color: var(--accent-cyan);">${item.branch.toUpperCase()}</span>
</div>
${recHtml}
${skillsHtml}
${eidolonsHtml}
</div>
</div>
`;
}
async function handleGachabaseSaveMetaOnly() {
if (!currentGachabaseItem) return;
try {
await registerGachabaseItem(currentGachabaseItem, {
AVATAR_METADATA,
LIGHTCONE_METADATA,
RELIC_SET_METADATA,
SIGNATURE_LIGHTCONES,
idbGet,
idbSet
isGachabaseSyncing = false;
syncButtons.forEach(btn => {
btn.disabled = false;
btn.classList.remove('loading');
});
initAvatarsList(true);
renderAvatarsGrid();
loadEquipment();
showToast(`💾 บันทึก Metadata ของ "${currentGachabaseItem.name}" เข้าสู่ระบบเรียบร้อย`, 'success');
} catch (err) {
showToast(err.message, 'error');
}
}
async function handleGachabaseImportToFreeSR(eLevel, sLevel) {
if (!currentGachabaseItem) return;
try {
await registerGachabaseItem(currentGachabaseItem, {
AVATAR_METADATA,
LIGHTCONE_METADATA,
RELIC_SET_METADATA,
SIGNATURE_LIGHTCONES,
idbGet,
idbSet
});
if (!state.fullFreesrData) {
state.fullFreesrData = { avatars: {}, lightcones: [], relics: [] };
}
const result = applyGachabaseToFreeSR(currentGachabaseItem, state.fullFreesrData, {
eLevel,
sLevel,
autoEquipLc: true,
autoEquipRelics: true
});
await saveFreesrChangesToServer();
initAvatarsList(true);
renderAvatarsGrid();
loadEquipment();
updateDashboard();
function setupGachabaseSyncEvents() {
const syncButtons = [
el.btnHeaderGachabaseSync,
el.btnQuickGachabaseSync,
el.btnSyncGachabaseAvatars,
el.btnSyncGachabaseEq,
el.btnSyncGachabaseNow
].filter(Boolean);
closeGachabaseModal();
if (currentGachabaseItem.type === 'character' && state.fullFreesrData.avatars[currentGachabaseItem.id]) {
openAvatarDetailModal(state.fullFreesrData.avatars[currentGachabaseItem.id]);
}
const rankLabel = currentGachabaseItem.type === 'character' ? (eLevel === 6 ? 'E6S5' : 'E0S1') : `S${sLevel}`;
showToast(`⚡ นำเข้า "${currentGachabaseItem.name}" (${rankLabel}) ลง FreeSR และบันทึกเซิร์ฟเวอร์สำเร็จ!`, 'success');
} catch (err) {
console.error('Import error:', err);
showToast(err.message, 'error');
}
}
function setupGachabaseEvents() {
const openButtons = [el.btnOpenGachabase, el.btnQuickGachabase, el.btnAvatarsGachabase, el.btnEqGachabase];
openButtons.forEach(btn => {
if (btn) {
btn.addEventListener('click', () => openGachabaseModal());
}
});
el.btnCloseGachabaseModal?.addEventListener('click', closeGachabaseModal);
document.querySelectorAll('.gachabase-quick-chip').forEach(chip => {
chip.addEventListener('click', () => {
const cid = chip.getAttribute('data-id');
const ctype = chip.getAttribute('data-type') || 'character';
if (el.gachabaseInput) el.gachabaseInput.value = cid;
if (el.gachabaseType) el.gachabaseType.value = ctype;
performGachabaseFetch();
syncButtons.forEach(btn => {
btn.addEventListener('click', () => {
triggerGachabaseSync(true);
});
});
el.btnGachabaseFetch?.addEventListener('click', performGachabaseFetch);
el.gachabaseInput?.addEventListener('keydown', (e) => {
if (e.key === 'Enter') {
performGachabaseFetch();
}
});
el.btnGachabaseSaveMeta?.addEventListener('click', handleGachabaseSaveMetaOnly);
el.btnGachabaseImportE0S1?.addEventListener('click', () => handleGachabaseImportToFreeSR(0, 1));
el.btnGachabaseImportE6S5?.addEventListener('click', () => handleGachabaseImportToFreeSR(6, 5));
}
// Setup Event Listeners
@@ -6057,7 +5867,7 @@ function setupEvents() {
updateCacheUsageDisplay();
// Modal Backdrop Click to close
[el.modalAvatarDetail, el.modalLineupPicker, el.modalSettings, el.modalGachabase].forEach(modal => {
[el.modalAvatarDetail, el.modalLineupPicker, el.modalSettings].forEach(modal => {
if (modal) {
modal.addEventListener('click', (e) => {
if (e.target === modal) {
@@ -6084,13 +5894,11 @@ function startPingLoop() {
// Initialize Application
async function init() {
await loadCachedGachabaseRegistry({
AVATAR_METADATA,
LIGHTCONE_METADATA,
RELIC_SET_METADATA,
SIGNATURE_LIGHTCONES,
await loadCachedGachabaseData({
idbGet,
idbSet
idbSet,
AVATAR_METADATA,
LIGHTCONE_METADATA
});
initAvatarsList();
await loadCachedStorageData();
@@ -6099,11 +5907,12 @@ async function init() {
setupTabs();
setupModalSubtabs();
setupEvents();
setupGachabaseEvents();
setupGachabaseSyncEvents();
applyTranslations();
renderLineup(state.statusData?.lineups || DEFAULT_LINEUP);
renderAvatarsGrid();
loadEquipment();
updateGachabaseSyncUI();
refreshStatus();
startPingLoop();
updateCacheUsageDisplay();
js/gachabase.js
+326 -493
View File
@@ -1,10 +1,43 @@
// Gachabase Data Fetcher, Parser & FreeSR Importer Module
// Supports fetching datamined/beta characters, lightcones, and relics from hsr.gachabase.net
// Integrates with GaC-srtool runtime metadata, IndexedDB cache, and FreeSR / persistent saves.
// Gachabase Data Fetcher, Catalog Sync & Image Engine for GaC-srtool
// Connects with hsr.gachabase.net to dynamically update characters, lightcones,
// and high-res assets whenever the game updates or new patches/betas drop.
export const GACHABASE_BASE_URL = 'https://hsr.gachabase.net';
export const GACHABASE_CDN_URL = 'https://cdn.gachabase.net';
// Pre-mapped known beta / newest assets from Gachabase CDN
export const KNOWN_GACHABASE_ASSETS = {
avatars: {
1501: 'https://cdn.gachabase.net/hsr/assets/09ee6e2618ac2a0dab2aec8d73b0bb01.png', // Sparxie
1502: 'https://cdn.gachabase.net/hsr/assets/8ca2530c42791593b72d54a850fce97e.png', // Yao Guang
1505: 'https://cdn.gachabase.net/hsr/assets/723a90e789fd354fb96b450a90c73e30.png', // Evanescia
1506: 'https://cdn.gachabase.net/hsr/assets/0cbfb275bfef439b16ba6ff9f848eb3a.png', // Silver Wolf Collab
1511: 'https://cdn.gachabase.net/hsr/assets/2be49dbbe7cfe8f77187dcfea51d9863.png', // Aeon ★ Aha
1513: 'https://cdn.gachabase.net/hsr/assets/2fdf5d4fe6eb998064438ffd373ce95f.png', // Aventurine • Waveflair
},
avatarSplash: {
1511: 'https://cdn.gachabase.net/hsr/assets/f8b5630e85022ab8b2761e4e3f614b42.png', // Aha Splash Art (2048x1914)
1513: 'https://cdn.gachabase.net/hsr/assets/65b90212f8623ad92243d739ea1fc9ec.png', // Waveflair Splash
1505: 'https://cdn.gachabase.net/hsr/assets/71cbe3943310cb233e8dbe6ef69caeb1.png', // Evanescia Splash
1502: 'https://cdn.gachabase.net/hsr/assets/8ca2530c42791593b72d54a850fce97e.png', // Yao Guang
1501: 'https://cdn.gachabase.net/hsr/assets/09ee6e2618ac2a0dab2aec8d73b0bb01.png', // Sparxie
},
lightcones: {
23065: 'https://cdn.gachabase.net/hsr/assets/500cfc18698932759756f6b3ba4db417.png', // Upon the First Echo of "Aha" Full Art
},
lightconeThumbs: {
23065: 'https://cdn.gachabase.net/hsr/assets/c794417a81e656bfdf1212202230f80f.png', // Aha LC Thumbnail
}
};
// Global in-memory image cache populated dynamically from Gachabase catalogs
export const GACHABASE_IMAGE_CACHE = {
avatars: { ...KNOWN_GACHABASE_ASSETS.avatars },
avatarSplash: { ...KNOWN_GACHABASE_ASSETS.avatarSplash },
lightcones: { ...KNOWN_GACHABASE_ASSETS.lightcones },
lightconeThumbs: { ...KNOWN_GACHABASE_ASSETS.lightconeThumbs }
};
// Path ID mappings according to HSR engine / Gachabase
export const GACHABASE_PATHS = {
1: 'Destruction',
@@ -69,76 +102,7 @@ export function cleanRichText(str) {
}
/**
* Parses user input into normalized search parameters
* Handles full URLs or raw IDs
*/
export function parseGachabaseInput(input, typeHint = 'character', branch = 'beta', lang = 'en') {
const trimmed = (input || '').trim();
if (!trimmed) return null;
// Check if input is a full URL
if (trimmed.startsWith('http://') || trimmed.startsWith('https://')) {
try {
const urlObj = new URL(trimmed);
const pathname = urlObj.pathname.toLowerCase();
let detectedType = typeHint;
if (pathname.includes('/characters/') || pathname.includes('/character/')) detectedType = 'character';
else if (pathname.includes('/lightcones/') || pathname.includes('/lightcone/')) detectedType = 'lightcone';
else if (pathname.includes('/relics/') || pathname.includes('/relic/')) detectedType = 'relic';
// Pattern: /type/:id/:slug?/:branch?
const parts = pathname.split('/').filter(Boolean);
// Expected: ['characters', '1511', 'aeon-aha', 'beta']
let id = null;
let detectedBranch = urlObj.searchParams.get('branch') || branch;
let detectedLang = urlObj.searchParams.get('lang') || lang;
if (parts.length >= 2) {
id = parseInt(parts[1], 10);
}
if (parts.length >= 4) {
detectedBranch = parts[3];
}
return {
url: trimmed,
id: id || null,
type: detectedType,
branch: detectedBranch || 'beta',
lang: detectedLang || 'en'
};
} catch (e) {
// Fall through to ID parsing
}
}
// Treat as numeric ID
const numId = parseInt(trimmed, 10);
if (!isNaN(numId)) {
let resolvedType = typeHint;
// Auto-guess type if default wasn't explicitly changed
if (numId >= 20000 && numId < 30000) resolvedType = 'lightcone';
else if (numId < 1000) resolvedType = 'relic';
else if (numId >= 1000 && numId < 9000) resolvedType = 'character';
const typeSlug = resolvedType === 'lightcone' ? 'lightcones' : (resolvedType === 'relic' ? 'relics' : 'characters');
const url = `${GACHABASE_BASE_URL}/${typeSlug}/${numId}/slug/${branch}?lang=${lang}`;
return {
url,
id: numId,
type: resolvedType,
branch: branch || 'beta',
lang: lang || 'en'
};
}
return null;
}
/**
* Fetches Gachabase HTML content
* Uses GaC-hkrpg-go API proxy if available to avoid CORS, falls back to direct fetch
* Fetches HTML from targetUrl via backend API proxy or direct fetch
*/
export async function fetchGachabaseHtml(targetUrl, apiUrl = 'http://localhost:21000') {
if (!targetUrl) throw new Error('Target URL is required for Gachabase fetch');
@@ -160,7 +124,7 @@ export async function fetchGachabaseHtml(targetUrl, apiUrl = 'http://localhost:2
}
}
// 2. Direct fetch fallback (works if user has CORS unblocker or runs in local browser environment)
// 2. Direct fetch fallback
const directResp = await fetch(targetUrl, {
method: 'GET',
headers: {
@@ -175,451 +139,320 @@ export async function fetchGachabaseHtml(targetUrl, apiUrl = 'http://localhost:2
}
/**
* Extracts and parses serialized SvelteKit DTO and refs from Gachabase HTML
* Parses SvelteKit streamed data payload from Gachabase catalog listing pages
*/
export function parseGachabaseHtml(html, fallbackLang = 'en') {
if (!html || typeof html !== 'string') {
throw new Error('Invalid HTML content received from Gachabase');
}
// Look for kit.start(...) serialized state in <script>
let kitJson = null;
const kitMatch = html.match(/kit\.start\(app,\s*element,\s*(\{.*?\})\);\s*\}\);/s);
if (kitMatch && kitMatch[1]) {
kitJson = kitMatch[1];
} else {
// Alternate pattern in newer or minified builds
const altMatch = html.match(/kit\.start\(app,\s*element,\s*(\{[\s\S]*?\})\s*\);/);
if (altMatch && altMatch[1]) {
kitJson = altMatch[1];
export function parseSvelteKitCatalog(html) {
if (!html || typeof html !== 'string') return null;
const scripts = [...html.matchAll(/<script[^>]*>([\s\S]*?)<\/script>/gi)];
for (const s of scripts) {
const text = s[1].trim();
if (text.includes('resolve') && text.includes('entries')) {
const startIdx = text.indexOf('() => ');
if (startIdx !== -1) {
let code = text.substring(startIdx + 6).trim();
if (code.endsWith(');')) code = code.slice(0, -2);
else if (code.endsWith(')')) code = code.slice(0, -1);
try {
const fn = new Function('return (' + code + ')');
const res = fn();
return res[0]?.data;
} catch (e) {
console.warn('Failed to parse catalog script:', e);
}
}
}
}
if (!kitJson) {
throw new Error('Could not find SvelteKit data payload in Gachabase HTML');
}
let kitData;
try {
const fn = new Function('return (' + kitJson + ')');
kitData = fn();
} catch (err) {
throw new Error('Failed to evaluate Gachabase state payload: ' + err.message);
}
if (!kitData || !Array.isArray(kitData.data)) {
throw new Error('Gachabase kitData does not contain data array');
}
// Search for the entry containing dto and refs
let targetData = null;
for (const entry of kitData.data) {
if (!entry) continue;
const cand = entry.data?.data?.data || entry.data?.data || entry.data;
if (cand && (cand.dto || cand.refs)) {
targetData = cand;
break;
}
}
if (!targetData || !targetData.dto) {
throw new Error('Gachabase DTO object not found in payload');
}
const dto = targetData.dto;
const refs = targetData.refs || {};
const assetsMap = refs.assets || {};
const pathsMap = refs.paths || {};
const typesMap = refs.types || {};
// Resolve CDN URL helper
const resolveAsset = (hash) => {
if (!hash) return null;
if (assetsMap[hash] && assetsMap[hash].url) {
return assetsMap[hash].url;
}
return `${GACHABASE_CDN_URL}/hsr/assets/${hash}.png`;
};
const id = dto.id;
const rawName = dto.name?.text || dto.name || `Item ${id}`;
const rarity = dto.rarity || 5;
// Path resolution
const pathId = dto.path_id || 0;
const rawPath = pathsMap[pathId]?.name?.text || GACHABASE_PATHS[pathId] || 'Unknown';
// Type / Element resolution
const typeId = dto.type_id || 0;
const rawElement = typesMap[typeId]?.name?.text || GACHABASE_ELEMENTS[typeId] || 'Unknown';
// Determine Item Type
let itemType = 'character';
if (dto.skills !== undefined || dto.eidolons !== undefined || dto.max_energy !== undefined) {
itemType = 'character';
} else if (dto.skill !== undefined || (id >= 20000 && id < 30000)) {
itemType = 'lightcone';
} else if (id < 1000) {
itemType = 'relic';
}
// Images resolution
const images = {
splash: resolveAsset(dto.assets?.splash_art_path_hash) || resolveAsset(dto.assets?.draw_card_art_path_hash),
icon: resolveAsset(dto.assets?.round_icon_path_hash) || resolveAsset(dto.assets?.small_icon_path_hash) || resolveAsset(dto.assets?.icon_path_hash),
square: resolveAsset(dto.assets?.square_icon_path_hash) || resolveAsset(dto.assets?.big_icon_path_hash),
fullArt: resolveAsset(dto.assets?.full_art_path_hash) || resolveAsset(dto.assets?.splash_art_path_hash),
thumbnail: resolveAsset(dto.assets?.thumbnail_art_path_hash) || resolveAsset(dto.assets?.big_icon_path_hash)
};
// Skills parsing (for characters)
const skills = [];
if (Array.isArray(dto.skills)) {
dto.skills.forEach(s => {
skills.push({
id: s.id,
type: s.type?.text || s.type || 'Skill',
name: s.name?.text || s.name || '',
tag: s.tag?.text || s.tag || '',
description: cleanRichText(s.description?.text || s.description || ''),
icon: resolveAsset(s.icon_path_hash)
});
});
}
// Eidolons parsing (for characters)
const eidolons = [];
if (Array.isArray(dto.eidolons)) {
dto.eidolons.forEach((e, idx) => {
eidolons.push({
rank: e.rank || idx + 1,
name: e.name?.text || e.name || `Eidolon ${idx + 1}`,
description: cleanRichText(e.description?.text || e.description || ''),
icon: resolveAsset(e.icon_path_hash) || resolveAsset(dto.assets?.[`eidolon_${idx + 1}_path_hash`])
});
});
}
// Lightcone skill (for lightcones)
let lcSkill = null;
if (dto.skill) {
lcSkill = {
name: dto.skill.name?.text || dto.skill.name || '',
description: cleanRichText(dto.skill.description?.text || dto.skill.description || '')
};
}
// Build recommendations
const rec = dto.build_recommendations || {};
const recommendedRelics = rec.relics?.relic_ids || [];
const cavernSets = recommendedRelics.filter(rId => rId < 300);
const planarSets = recommendedRelics.filter(rId => rId >= 300);
// Recommended Lightcones
const recommendedLcs = (Array.isArray(rec.lightcone_ids) ? rec.lightcone_ids : (rec.lightcones || []).map(lc => lc.lightcone_id)).filter(Boolean);
// Main stats recommendations
const mainStats = {};
if (Array.isArray(rec.relics?.main_stats)) {
rec.relics.main_stats.forEach(m => {
const pieceId = m.piece_type_id; // 3=Body, 4=Boots, 5=Sphere, 6=Rope
const stats = (m.stat_ids || []).map(sid => GACHABASE_STATS[sid] || `Stat ${sid}`);
mainStats[pieceId] = stats;
});
}
// Sub stats recommendations
const subStats = (rec.relics?.sub_stat_ids || []).map(sid => GACHABASE_STATS[sid] || `Stat ${sid}`);
return {
id,
type: itemType,
name: rawName,
rarity,
path: rawPath,
pathId,
element: rawElement,
typeId,
maxEnergy: dto.max_energy || 0,
images,
skills,
eidolons,
lcSkill,
recommended: {
relicIds: recommendedRelics,
cavernSets,
planarSets,
lightconeIds: recommendedLcs,
signatureLcId: recommendedLcs[0] || null,
mainStats,
subStats
},
rawDto: dto
};
return null;
}
/**
* Registers parsed item into tool runtime metadata and saves to IndexedDB
* Automatically synchronizes the full game database from Gachabase
* Pulls all characters and lightcones, adds missing ones into metadata,
* and caches all Gachabase CDN asset URLs for seamless rendering.
*/
export async function registerGachabaseItem(parsedItem, metadataContext = {}) {
const {
AVATAR_METADATA,
LIGHTCONE_METADATA,
RELIC_SET_METADATA,
SIGNATURE_LIGHTCONES,
idbSet
} = metadataContext;
const id = parsedItem.id;
const lang = parsedItem.lang || 'en';
if (parsedItem.type === 'character' && AVATAR_METADATA) {
if (!AVATAR_METADATA[id]) {
AVATAR_METADATA[id] = {
names: {
th: parsedItem.name,
en: parsedItem.name
},
path: parsedItem.path,
element: parsedItem.element,
rarity: parsedItem.rarity,
hasExRank: false,
isCustomGachabase: true,
images: parsedItem.images
};
} else {
// Update existing entry with high-res images and enriched data
AVATAR_METADATA[id].names = AVATAR_METADATA[id].names || {};
AVATAR_METADATA[id].names[lang] = parsedItem.name;
AVATAR_METADATA[id].names.en = AVATAR_METADATA[id].names.en || parsedItem.name;
AVATAR_METADATA[id].path = parsedItem.path;
AVATAR_METADATA[id].element = parsedItem.element;
AVATAR_METADATA[id].rarity = parsedItem.rarity;
AVATAR_METADATA[id].images = parsedItem.images;
}
if (SIGNATURE_LIGHTCONES && parsedItem.recommended.signatureLcId) {
SIGNATURE_LIGHTCONES[id] = parsedItem.recommended.signatureLcId;
}
} else if (parsedItem.type === 'lightcone' && LIGHTCONE_METADATA) {
if (!LIGHTCONE_METADATA[id]) {
LIGHTCONE_METADATA[id] = {
names: {
th: parsedItem.name,
en: parsedItem.name
},
rarity: parsedItem.rarity,
path: parsedItem.path,
isCustomGachabase: true,
images: parsedItem.images
};
} else {
LIGHTCONE_METADATA[id].names = LIGHTCONE_METADATA[id].names || {};
LIGHTCONE_METADATA[id].names[lang] = parsedItem.name;
LIGHTCONE_METADATA[id].path = parsedItem.path;
LIGHTCONE_METADATA[id].rarity = parsedItem.rarity;
LIGHTCONE_METADATA[id].images = parsedItem.images;
}
}
// Persist to IndexedDB
if (idbSet) {
try {
const cacheKey = `gac_gachabase_item_${parsedItem.type}_${id}`;
await idbSet(cacheKey, parsedItem);
// Also append to custom items registry
const regKey = 'gac_gachabase_registry';
const existing = (await (metadataContext.idbGet ? metadataContext.idbGet(regKey) : null)) || [];
const filtered = existing.filter(i => !(i.type === parsedItem.type && i.id === parsedItem.id));
filtered.push({
type: parsedItem.type,
id: parsedItem.id,
name: parsedItem.name,
path: parsedItem.path,
element: parsedItem.element,
rarity: parsedItem.rarity,
cacheKey
});
await idbSet(regKey, filtered);
} catch (e) {
console.warn('Failed to save Gachabase item to IndexedDB:', e);
}
}
return parsedItem;
}
/**
* Loads all cached Gachabase items from IndexedDB into runtime metadata
*/
export async function loadCachedGachabaseRegistry(metadataContext = {}) {
export async function syncGachabaseDatabase({ apiUrl, branch = 'beta', lang = 'en', metadataContext }) {
const {
AVATAR_METADATA,
LIGHTCONE_METADATA,
SIGNATURE_LIGHTCONES,
idbSet,
idbGet
} = metadataContext;
const charactersUrl = `${GACHABASE_BASE_URL}/characters?lang=${lang}&branch=${branch}`;
const lightconesUrl = `${GACHABASE_BASE_URL}/lightcones?lang=${lang}&branch=${branch}`;
let newAvatarsCount = 0;
let newLcsCount = 0;
let totalAvatarsCount = 0;
let totalLcsCount = 0;
// 1. Fetch & Parse Characters Catalog
try {
const { html: charHtml } = await fetchGachabaseHtml(charactersUrl, apiUrl);
const charData = parseSvelteKitCatalog(charHtml);
if (charData && Array.isArray(charData.entries)) {
totalAvatarsCount = charData.entries.length;
const assetsMap = charData.refs?.assets || {};
for (const entry of charData.entries) {
const aid = entry.id;
const hash = entry.assets?.square_icon_path_hash || entry.assets?.round_icon_path_hash;
const iconUrl = assetsMap[hash]?.url || KNOWN_GACHABASE_ASSETS.avatars[aid] || `${GACHABASE_CDN_URL}/hsr/assets/${hash}.png`;
if (iconUrl) {
GACHABASE_IMAGE_CACHE.avatars[aid] = iconUrl;
}
// Register new / missing characters into AVATAR_METADATA
if (AVATAR_METADATA && !AVATAR_METADATA[aid]) {
const charName = entry.name?.text || entry.name || `Avatar ${aid}`;
const pathName = GACHABASE_PATHS[entry.path_id] || 'Unknown';
const elementName = GACHABASE_ELEMENTS[entry.type_id] || 'Unknown';
AVATAR_METADATA[aid] = {
names: {
th: charName,
en: charName,
'zh-CN': charName
},
path: pathName,
element: elementName,
rarity: entry.rarity || 5,
hasExRank: false,
isGachabaseSync: true,
images: {
icon: iconUrl,
square: iconUrl
}
};
newAvatarsCount++;
} else if (AVATAR_METADATA && AVATAR_METADATA[aid]) {
// Enrich existing metadata with Gachabase CDN image
AVATAR_METADATA[aid].images = AVATAR_METADATA[aid].images || {};
if (iconUrl) AVATAR_METADATA[aid].images.icon = iconUrl;
}
}
}
} catch (err) {
console.error('Failed to sync characters from Gachabase:', err);
throw new Error('ไม่สามารถซิงค์ตัวละครจาก Gachabase ได้: ' + err.message);
}
// 2. Fetch & Parse Lightcones Catalog
try {
const { html: lcHtml } = await fetchGachabaseHtml(lightconesUrl, apiUrl);
const lcData = parseSvelteKitCatalog(lcHtml);
if (lcData && Array.isArray(lcData.entries)) {
totalLcsCount = lcData.entries.length;
const assetsMap = lcData.refs?.assets || {};
for (const entry of lcData.entries) {
const lcid = entry.id;
const thumbHash = entry.assets?.thumbnail_art_path_hash || entry.assets?.small_icon_path_hash;
const fullArtHash = entry.assets?.full_art_path_hash || entry.assets?.big_icon_path_hash;
const thumbUrl = assetsMap[thumbHash]?.url || KNOWN_GACHABASE_ASSETS.lightconeThumbs[lcid];
const fullArtUrl = assetsMap[fullArtHash]?.url || KNOWN_GACHABASE_ASSETS.lightcones[lcid];
if (thumbUrl) GACHABASE_IMAGE_CACHE.lightconeThumbs[lcid] = thumbUrl;
if (fullArtUrl) GACHABASE_IMAGE_CACHE.lightcones[lcid] = fullArtUrl;
// Register new / missing lightcones into LIGHTCONE_METADATA
if (LIGHTCONE_METADATA && !LIGHTCONE_METADATA[lcid]) {
const lcName = entry.name?.text || entry.name || `Lightcone ${lcid}`;
const pathName = GACHABASE_PATHS[entry.path_id] || 'Unknown';
LIGHTCONE_METADATA[lcid] = {
names: {
th: lcName,
en: lcName,
'zh-CN': lcName
},
rarity: entry.rarity || 5,
path: pathName,
isGachabaseSync: true,
images: {
thumbnail: thumbUrl,
fullArt: fullArtUrl
}
};
newLcsCount++;
} else if (LIGHTCONE_METADATA && LIGHTCONE_METADATA[lcid]) {
LIGHTCONE_METADATA[lcid].images = LIGHTCONE_METADATA[lcid].images || {};
if (thumbUrl) LIGHTCONE_METADATA[lcid].images.thumbnail = thumbUrl;
if (fullArtUrl) LIGHTCONE_METADATA[lcid].images.fullArt = fullArtUrl;
}
}
}
} catch (err) {
console.error('Failed to sync lightcones from Gachabase:', err);
throw new Error('ไม่สามารถซิงค์กรวยแสงจาก Gachabase ได้: ' + err.message);
}
// 3. Save cache to IndexedDB
if (idbSet) {
try {
await idbSet('gac_gachabase_image_cache', GACHABASE_IMAGE_CACHE);
await idbSet('gac_gachabase_last_sync', {
timestamp: Date.now(),
newAvatarsCount,
newLcsCount,
totalAvatarsCount,
totalLcsCount
});
} catch (e) {
console.warn('Failed to cache Gachabase database to IndexedDB:', e);
}
}
return {
newAvatarsCount,
newLcsCount,
totalAvatarsCount,
totalLcsCount
};
}
/**
* Loads cached Gachabase images and metadata from IndexedDB
*/
export async function loadCachedGachabaseData(metadataContext = {}) {
const { idbGet, AVATAR_METADATA, LIGHTCONE_METADATA } = metadataContext;
if (!idbGet) return;
try {
const registry = await idbGet('gac_gachabase_registry');
if (!Array.isArray(registry)) return;
const cachedImages = await idbGet('gac_gachabase_image_cache');
if (cachedImages) {
if (cachedImages.avatars) Object.assign(GACHABASE_IMAGE_CACHE.avatars, cachedImages.avatars);
if (cachedImages.avatarSplash) Object.assign(GACHABASE_IMAGE_CACHE.avatarSplash, cachedImages.avatarSplash);
if (cachedImages.lightcones) Object.assign(GACHABASE_IMAGE_CACHE.lightcones, cachedImages.lightcones);
if (cachedImages.lightconeThumbs) Object.assign(GACHABASE_IMAGE_CACHE.lightconeThumbs, cachedImages.lightconeThumbs);
}
for (const itemMeta of registry) {
const fullItem = await idbGet(itemMeta.cacheKey);
if (fullItem) {
await registerGachabaseItem(fullItem, metadataContext);
// Attach cached image links to metadata
if (AVATAR_METADATA) {
for (const aid in GACHABASE_IMAGE_CACHE.avatars) {
if (AVATAR_METADATA[aid]) {
AVATAR_METADATA[aid].images = AVATAR_METADATA[aid].images || {};
AVATAR_METADATA[aid].images.icon = GACHABASE_IMAGE_CACHE.avatars[aid];
}
}
}
if (LIGHTCONE_METADATA) {
for (const lcid in GACHABASE_IMAGE_CACHE.lightcones) {
if (LIGHTCONE_METADATA[lcid]) {
LIGHTCONE_METADATA[lcid].images = LIGHTCONE_METADATA[lcid].images || {};
LIGHTCONE_METADATA[lcid].images.fullArt = GACHABASE_IMAGE_CACHE.lightcones[lcid];
LIGHTCONE_METADATA[lcid].images.thumbnail = GACHABASE_IMAGE_CACHE.lightconeThumbs[lcid];
}
}
}
console.log(`[Gachabase] Successfully loaded ${registry.length} cached items from IndexedDB.`);
} catch (err) {
console.warn('[Gachabase] Failed to restore cached items from IndexedDB:', err);
console.warn('Failed to restore Gachabase cache from IndexedDB:', err);
}
}
/**
* Applies parsed Gachabase character, lightcone, or relics into FreeSR data structure
* Image resolver for avatars
* Prioritizes local asset, falls back to Gachabase CDN
*/
export function applyGachabaseToFreeSR(parsedItem, fullFreesrData, options = {}) {
if (!fullFreesrData) {
throw new Error('FreeSR data is not initialized');
export function getAvatarIconUrl(avatarId) {
const id = parseInt(avatarId, 10);
if (GACHABASE_IMAGE_CACHE.avatars[id]) {
return GACHABASE_IMAGE_CACHE.avatars[id];
}
fullFreesrData.avatars = fullFreesrData.avatars || {};
fullFreesrData.lightcones = fullFreesrData.lightcones || [];
fullFreesrData.relics = fullFreesrData.relics || [];
const eLevel = options.eLevel !== undefined ? options.eLevel : 0; // 0 or 6
const sLevel = options.sLevel !== undefined ? options.sLevel : 1; // 1 or 5
const autoEquipLc = options.autoEquipLc !== false;
const autoEquipRelics = options.autoEquipRelics !== false;
const results = {
avatarAdded: false,
lcAdded: false,
relicsAdded: 0
};
// If character:
if (parsedItem.type === 'character') {
const aid = parsedItem.id;
// Generate maxed traces & skills map
const skillsMap = {};
if (Array.isArray(parsedItem.skills) && parsedItem.skills.length > 0) {
parsedItem.skills.forEach(s => {
if (s.id) {
skillsMap[String(s.id)] = 10;
}
});
}
// Add standard fallback combat traces
skillsMap[`${aid}001`] = 6; // Basic ATK
skillsMap[`${aid}002`] = 10; // Skill
skillsMap[`${aid}003`] = 10; // Ultimate
skillsMap[`${aid}004`] = 10; // Talent
skillsMap[`${aid}007`] = 1; // Technique
if (!fullFreesrData.avatars[aid]) {
fullFreesrData.avatars[aid] = {
owner_uid: 0,
avatar_id: aid,
level: 80,
promotion: 6,
techniques: [],
sp_max: parsedItem.maxEnergy || 140,
sp_value: Math.floor((parsedItem.maxEnergy || 140) / 2),
data: {
rank: eLevel,
skills: skillsMap
}
};
} else {
const av = fullFreesrData.avatars[aid];
av.level = 80;
av.promotion = 6;
av.data = av.data || {};
av.data.rank = eLevel;
av.data.skills = Object.assign(av.data.skills || {}, skillsMap);
}
results.avatarAdded = true;
// Equip Signature Lightcone if available
const sigLcId = parsedItem.recommended.signatureLcId || (options.sigLcId || null);
if (autoEquipLc && sigLcId) {
// Check if this character already has an LC
let existingLc = fullFreesrData.lightcones.find(l => l.equip_avatar === aid);
if (existingLc) {
existingLc.item_id = sigLcId;
existingLc.level = 80;
existingLc.promotion = 6;
existingLc.rank = sLevel;
} else {
const nextUid = (fullFreesrData.lightcones.reduce((m, l) => Math.max(m, l.unique_id || 0), 0)) + 1;
fullFreesrData.lightcones.push({
unique_id: nextUid,
item_id: sigLcId,
level: 80,
promotion: 6,
rank: sLevel,
equip_avatar: aid
});
}
results.lcAdded = true;
}
// Equip Recommended Relics if available
if (autoEquipRelics && (parsedItem.recommended.cavernSets.length > 0 || parsedItem.recommended.planarSets.length > 0)) {
// Clear existing relics on this character
fullFreesrData.relics = fullFreesrData.relics.filter(r => r.equip_avatar !== aid);
const cavernSet = parsedItem.recommended.cavernSets[0] || 121;
const planarSet = parsedItem.recommended.planarSets[0] || 310;
let nextRelicUid = (fullFreesrData.relics.reduce((m, r) => Math.max(m, r.internal_uid || 0), 0)) + 1;
// 6 relic slots
for (let slot = 1; slot <= 6; slot++) {
const setId = slot <= 4 ? cavernSet : planarSet;
const relicId = 60000 + (setId * 10) + slot;
// Default smart main stats
let mainAffixId = 1;
if (slot === 3) mainAffixId = 5; // CRIT Rate% / ATK%
else if (slot === 4) mainAffixId = 5; // SPD / ATK%
else if (slot === 5) mainAffixId = 6; // Elemental DMG%
else if (slot === 6) mainAffixId = 4; // Energy Regen% / ATK%
fullFreesrData.relics.push({
internal_uid: nextRelicUid++,
relic_id: relicId,
level: 15,
equip_avatar: aid,
main_affix_id: mainAffixId,
sub_affixes: [
{ sub_affix_id: 1, cnt: 2, step: 2 },
{ sub_affix_id: 2, cnt: 3, step: 2 },
{ sub_affix_id: 3, cnt: 2, step: 2 },
{ sub_affix_id: 4, cnt: 2, step: 2 }
]
});
results.relicsAdded++;
}
}
} else if (parsedItem.type === 'lightcone') {
// Add standalone lightcone to inventory
const nextUid = (fullFreesrData.lightcones.reduce((m, l) => Math.max(m, l.unique_id || 0), 0)) + 1;
fullFreesrData.lightcones.push({
unique_id: nextUid,
item_id: parsedItem.id,
level: 80,
promotion: 6,
rank: sLevel,
equip_avatar: 0
});
results.lcAdded = true;
if (KNOWN_GACHABASE_ASSETS.avatars[id]) {
return KNOWN_GACHABASE_ASSETS.avatars[id];
}
return `./assets/avatars/${id}.png`;
}
/**
* Image resolver for lightcones
*/
export function getLightconeArtUrl(lcId) {
const id = parseInt(lcId, 10);
if (GACHABASE_IMAGE_CACHE.lightcones[id]) {
return GACHABASE_IMAGE_CACHE.lightcones[id];
}
if (KNOWN_GACHABASE_ASSETS.lightcones[id]) {
return KNOWN_GACHABASE_ASSETS.lightcones[id];
}
if (id === 23065) {
return './assets/lightcones/23065.png';
}
return `https://raw.githubusercontent.com/Mar-7th/StarRailRes/master/image/light_cone_preview/${id}.png`;
}
/**
* Image resolver for lightcone thumbnails
*/
export function getLightconeThumbUrl(lcId) {
const id = parseInt(lcId, 10);
if (GACHABASE_IMAGE_CACHE.lightconeThumbs[id]) {
return GACHABASE_IMAGE_CACHE.lightconeThumbs[id];
}
if (KNOWN_GACHABASE_ASSETS.lightconeThumbs[id]) {
return KNOWN_GACHABASE_ASSETS.lightconeThumbs[id];
}
return getLightconeArtUrl(lcId);
}
/**
* Robust error handler for Avatar images
* Falls back through: Local Asset -> StarRailRes -> Gachabase CDN -> Letter Placeholder
*/
export function handleAvatarImgError(img, avatarId) {
if (!img) return;
const id = parseInt(avatarId, 10);
const step = parseInt(img.getAttribute('data-err-step') || '0', 10);
if (step === 0) {
img.setAttribute('data-err-step', '1');
img.src = `https://raw.githubusercontent.com/Mar-7th/StarRailRes/master/icon/avatar/${id}.png`;
} else if (step === 1) {
img.setAttribute('data-err-step', '2');
const gachaUrl = GACHABASE_IMAGE_CACHE.avatars[id] || KNOWN_GACHABASE_ASSETS.avatars[id];
if (gachaUrl && img.src !== gachaUrl) {
img.src = gachaUrl;
} else {
img.style.display = 'none';
if (img.nextElementSibling && img.nextElementSibling.classList.contains('avatar-icon-placeholder')) {
img.nextElementSibling.style.display = 'flex';
}
}
} else {
img.style.display = 'none';
if (img.nextElementSibling && img.nextElementSibling.classList.contains('avatar-icon-placeholder')) {
img.nextElementSibling.style.display = 'flex';
}
}
}
/**
* Robust error handler for Lightcone images
* Falls back through: Local Asset -> StarRailRes -> Gachabase CDN -> Default Logo
*/
export function handleLcImgError(img, lcId) {
if (!img) return;
const id = parseInt(lcId, 10);
const step = parseInt(img.getAttribute('data-err-step') || '0', 10);
if (step === 0) {
img.setAttribute('data-err-step', '1');
img.src = `https://raw.githubusercontent.com/Mar-7th/StarRailRes/master/image/light_cone_preview/${id}.png`;
} else if (step === 1) {
img.setAttribute('data-err-step', '2');
const gachaUrl = GACHABASE_IMAGE_CACHE.lightcones[id] || KNOWN_GACHABASE_ASSETS.lightcones[id] || GACHABASE_IMAGE_CACHE.lightconeThumbs[id] || KNOWN_GACHABASE_ASSETS.lightconeThumbs[id];
if (gachaUrl && img.src !== gachaUrl) {
img.src = gachaUrl;
} else {
img.src = './assets/logo.png';
}
} else {
img.src = './assets/logo.png';
}
return results;
}