homepage/homepage/static/js/index.js

55 lines
1.5 KiB
JavaScript

function toggleDetails(e) {
var parentElement = e.parentElement
var detailsElement = parentElement.querySelector(".details");
if (detailsElement.style.display === "flex") {
detailsElement.style.display = "none";
} else {
detailsElement.style.display = "flex";
}
return false;
}
// Fetch a list of all online player hashes
function getSkins() {
let xhr = new XMLHttpRequest();
xhr.open ( "GET", "getPlayerSkins", true );
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
skins = JSON.parse(xhr.responseText)["skins"];
skins.forEach(skin_hash => addSkin(skin_hash));
}
}
xhr.send ();
}
// Add a new canvas to the container and render the given skin
function addSkin(hash) {
var container = document.querySelector("#skin_container");
var canvas = document.createElement("canvas");
container.appendChild(canvas);
canvas.id = hash;
renderSkin(hash, canvas);
}
// Create a new instance of the renderer in the given canvas with the given hash as player skin
function renderSkin(hash, canvas) {
let skinViewer = new skinview3d.SkinViewer({
canvas: canvas,
width: 60,
height: 80,
skin: "/img/skins/" + hash
});
let control = skinview3d.createOrbitControls(skinViewer);
control.enableRotate = false;
control.enableZoom = false;
control.enablePan = false;
let walk = skinViewer.animations.add(skinview3d.WalkingAnimation);
let rotate = skinViewer.animations.add(skinview3d.RotatingAnimation);
}
window.onload = function () {
getSkins();
}