Azure
2e2b126df8
Introduces a cosmetics section in the profile with articles for username, capes, and skin. Adds UI for changing username, including input and button, and updates related CSS for styling. JS now shows the profile frame on initialization.
112 lines
3.4 KiB
JavaScript
112 lines
3.4 KiB
JavaScript
const player = await system.call("launcher::profile")
|
|
const buttons = document.querySelectorAll("button[frame]")
|
|
const dynmapFrame = document.querySelector("article.frame.dynmap > iframe")
|
|
|
|
const skinViewer = new skinview3d.SkinViewer({
|
|
canvas: document.getElementById("skin"),
|
|
width: 390,
|
|
height: 490,
|
|
skin: "assets/img/debug_skin.png"
|
|
})
|
|
|
|
skinViewer.animation = new skinview3d.IdleAnimation()
|
|
skinViewer.animation.speed = 1
|
|
|
|
function setActiveButton(frameIdentifier) {
|
|
for (const button of buttons) {
|
|
button.classList.remove("active")
|
|
if (button.getAttribute("frame") == frameIdentifier) {
|
|
button.classList.add("active")
|
|
}
|
|
}
|
|
}
|
|
|
|
function fixedTo(number, n) {
|
|
const k = Math.pow(10, n)
|
|
const result = (Math.round(number * k) / k)
|
|
return Number.isInteger(result) ? result.toFixed(2) : result
|
|
}
|
|
|
|
function flattenSettings(obj, prefix = "") {
|
|
return Object.keys(obj).reduce((acc, k) => {
|
|
const pre = prefix.length ? prefix + ".": "";
|
|
if (typeof obj[k] === "object" && obj[k] !== null && !Array.isArray(obj[k])) {
|
|
Object.assign(acc, flattenSettings(obj[k], pre + k));
|
|
} else {
|
|
acc[pre + k] = obj[k];
|
|
}
|
|
return acc;
|
|
}, {});
|
|
}
|
|
|
|
window.setting = {}
|
|
|
|
window.setting.set = async function settingSet(key, value) {
|
|
console.log(key, value)
|
|
await system.call("settings::set", { key, value })
|
|
}
|
|
|
|
window.showPage = function showPage(frameIdentifier) {
|
|
showFrame(frameIdentifier)
|
|
setActiveButton(frameIdentifier)
|
|
}
|
|
|
|
window.initDynmap = async function initDynmap() {
|
|
const dynampUrl = await system.call("lentia::dynamp") || "http://azures.fr:8123/"
|
|
if (dynmapFrame.src != dynampUrl) {
|
|
dynmapFrame.src = dynampUrl
|
|
}
|
|
}
|
|
|
|
window.getRamInformation = async function getRamInformation() {
|
|
const $ram = await system.call("hardware::ram")
|
|
ram.setAttribute("max", Math.floor($ram.freeGb * 1024))
|
|
freeRam.innerText = `${$ram.totalGb} Gb`
|
|
totalRam.innerText = `${$ram.freeGb} Gb`
|
|
}
|
|
|
|
window.handleSettingsChanges = async function handleSettingsChanges(key, value) {
|
|
const span = document.querySelector(`span#${key.includes("ram") ? "currentRam" : key}`)
|
|
setting.set(key, value)
|
|
if (span) {
|
|
span.innerText = key.includes("ram") ? fixedTo(value / 1024, 2) + " G" : value
|
|
}
|
|
}
|
|
|
|
window.initSettings = async function initSettings() {
|
|
const settings = await system.call("settings::read")
|
|
ram.value = settings.ram.max
|
|
javaPath.value = settings.javaPath
|
|
currentRam.innerText = fixedTo(settings.ram.max / 1024, 2) + " G"
|
|
getRamInformation()
|
|
}
|
|
|
|
window.initSkin = async function initSkin() {
|
|
const container = document.querySelector(".skinview3d")
|
|
|
|
if (container.clientWidth === 0 || container.clientHeight === 0) {
|
|
requestAnimationFrame(initSkin)
|
|
return
|
|
}
|
|
|
|
const skinViewer = new skinview3d.SkinViewer({
|
|
canvas: document.getElementById("skin"),
|
|
width: container.clientWidth,
|
|
height: container.clientHeight,
|
|
skin: "assets/img/debug_skin.png"
|
|
})
|
|
|
|
const ro = new ResizeObserver(() => {
|
|
skinViewer.width = container.clientWidth
|
|
skinViewer.height = container.clientHeight
|
|
})
|
|
|
|
skinViewer.animation = new skinview3d.IdleAnimation()
|
|
window.skinViewer = skinViewer
|
|
|
|
ro.observe(container)
|
|
}
|
|
|
|
initSkin()
|
|
initSettings()
|
|
showFrame("profile") |