diff --git a/equipment/equipment.js b/equipment/equipment.js index 420803a..0280db7 100644 --- a/equipment/equipment.js +++ b/equipment/equipment.js @@ -1,59 +1,152 @@ window.loadHeader(function(headerContainer) { const logoutForm = document.getElementById("logout-form"); - if (logoutForm) { logoutForm.action = "/api/v1/spfn/logout"; const originInput = document.getElementById("logout_frontend_origin"); if (originInput) originInput.value = window.location.origin; - logoutForm.addEventListener('submit', () => { sessionStorage.removeItem('user_cache'); }); } - const renderData = (data) => { - if (typeof data === 'string') { - try { data = JSON.parse(data); } - catch (e) { console.error(e); } - } - const nameEl = document.getElementById('mii-name'); - const imgEl = document.getElementById('mii-img'); - if (nameEl) { - nameEl.textContent = (data.mii && data.mii.name) || data.nickname || data.user_id || data.username || "User"; - } - if (imgEl) { - const miiBlob = (data.mii && data.mii.data) || data.mii_data; - if (miiBlob) { - imgEl.src = `https://mii-unsecure.ariankordi.net/miis/image.png?erri=s6u7r-rsp&data=${encodeURIComponent(miiBlob)}&type=face&width=270`; - imgEl.style.display = 'block'; + const udemaeMap = { + "0": "C-", "1": "C", "2": "C+", "3": "B-", "4": "B", + "5": "B+", "6": "A-", "7": "A", "8": "A+", "9": "S", "10": "S+" + }; + + let combinedData = {}; + + const preloadImage = (url) => { + return new Promise((resolve) => { + if (!url) return resolve(); + const img = new Image(); + img.onload = () => resolve(); + img.onerror = () => resolve(); + img.src = url; + }); + }; + + const renderData = async (newData) => { + if (!newData) return; + + let data = newData; + while (typeof data === 'string') { + try { + data = JSON.parse(data); + } catch (e) { + console.error("Parse Error:", e); + break; } } + + combinedData = { ...combinedData, ...data }; + const finalData = combinedData; + const equipped = finalData.last_equipped || {}; + const name = (finalData.mii && finalData.mii.name) || finalData.user_id || finalData.mii_name || "User"; + const miiBlob = (finalData.mii && finalData.mii.data) || finalData.mii_data; + const miiImgUrl = miiBlob ? `https://mii-unsecure.ariankordi.net/miis/image.png?erri=s6u7r-rsp&data=${encodeURIComponent(miiBlob)}&type=face&width=270` : ""; + + const sidebarName = document.getElementById('mii-name'); + const sidebarImg = document.getElementById('mii-img'); + if (sidebarName) sidebarName.textContent = name; + if (sidebarImg && miiImgUrl) { + sidebarImg.src = miiImgUrl; + sidebarImg.style.display = 'block'; + } + + const infoBox = document.querySelector('.splat-info-box'); + if (infoBox) { + const fetchJson = url => fetch(url).then(r => r.ok ? r.json() : []); + const [clothing, headgear, shoes, weapons] = await Promise.all([ + fetchJson('/assets/mapping/clothing.json'), + fetchJson('/assets/mapping/headgear.json'), + fetchJson('/assets/mapping/shoes.json'), + fetchJson('/assets/mapping/weapons.json') + ]); + + const getImg = (list, id, folder) => { + if (!id) return ''; + const item = list.find(i => i.id == id); + return (item && item.image) ? `../assets/${folder}/${item.image}` : ''; + }; + + const weaponImg = getImg(weapons, equipped.weapon, 'weapons'); + const headImg = getImg(headgear, equipped.Gear_Head, 'headgear'); + const clothesImg = getImg(clothing, equipped.Gear_Clothes, 'clothing'); + const shoesImg = getImg(shoes, equipped.Gear_Shoes, 'shoes'); + + await Promise.all([ + preloadImage(miiImgUrl), + preloadImage(weaponImg), + preloadImage(headImg), + preloadImage(clothesImg), + preloadImage(shoesImg) + ]); + + const rankLevel = equipped.Rank !== undefined ? equipped.Rank : (finalData.Rank || "--"); + const udemaeKey = equipped.Udemae !== undefined ? String(equipped.Udemae) : String(finalData.Udemae || ""); + const rankGrade = udemaeMap[udemaeKey] || (udemaeKey !== "undefined" && udemaeKey !== "" ? udemaeKey : "C-"); + + infoBox.innerHTML = ` +
+
+
+
+ ${miiImgUrl ? `` : ''} +
+
${name}
+
+ ${rankLevel} + +
+
+ ${rankGrade} + +
+
${weaponImg ? `` : ''}
+
+ + ${headImg ? `` : ''} +
+
+ + ${clothesImg ? `` : ''} +
+
+ + ${shoesImg ? `` : ''} +
+
+
+
+
+
+ `; + } }; - const cached = sessionStorage.getItem('user_cache'); - if (cached) renderData(JSON.parse(cached)); + const init = async () => { + const overlay = document.getElementById("loading-overlay"); + try { + const [profileRes, equipRes] = await Promise.all([ + fetch("/api/v1/me", { credentials: 'include' }).then(res => res.ok ? res.json() : {}), + fetch("/api/v1/me/equipment", { credentials: 'include' }).then(res => res.ok ? res.json() : {}) + ]); + await renderData(profileRes); + await renderData(equipRes); - fetch("/api/v1/me", { credentials: 'include' }) - .then(res => res.ok ? res.json() : Promise.reject(res)) - .then(data => { - sessionStorage.setItem('user_cache', JSON.stringify(data)); - renderData(data); - }) - .catch(err => { - if (!cached) { - const nameEl = document.getElementById('mii-name'); - if (nameEl) nameEl.textContent = "Guest"; - } - console.error(err); - }); + sessionStorage.setItem('user_cache', JSON.stringify(combinedData)); + } catch (err) { + const cached = sessionStorage.getItem('user_cache'); + if (cached) await renderData(JSON.parse(cached)); + else await renderData({ user_id: "Guest" }); + } finally { + if (overlay) overlay.style.display = "none"; + } + }; const equipButton = headerContainer.querySelector('.menu-item.equipment'); - if (equipButton) { - equipButton.classList.add('active'); - } + if (equipButton) equipButton.classList.add('active'); - const overlay = document.getElementById("loading-overlay"); - if (overlay) { - overlay.style.display = "none"; - } + init(); }); \ No newline at end of file diff --git a/equipment/index.html b/equipment/index.html index 5a638b1..c89eaac 100644 --- a/equipment/index.html +++ b/equipment/index.html @@ -36,62 +36,8 @@ -
-
-
-
-
-
miinamehere
- -
- 50 - -
+
-
- S+ - -
- -
- -
- -
- - -
- -
- - -
- -
- - -
- -
- - - -
- -
- - - -
- -
- - - -
-
-
-