56 lines
1.9 KiB
HTML
56 lines
1.9 KiB
HTML
|
<h1 class="title">Saved skins</h1>
|
||
|
|
<div class="columns is-mobile">
|
||
|
|
<div class="column">
|
||
|
|
<img src="" class="skin" id="flat" alt="Current Skin" style="display: none;">
|
||
|
|
<div id="mesh" style="display: inline;"></div>
|
||
|
|
</div>
|
||
|
|
<div class="column">
|
||
|
|
<div class="box">
|
||
|
|
<div id="list"></div>
|
||
|
|
</div>
|
||
|
|
<div class="buttons">
|
||
|
|
<button class="button" id="set">Use this skin</button>
|
||
|
|
<button class="button" id="switch" style="display: none;">Switch to 2D</button>
|
||
|
|
</div>
|
||
|
|
<div class="buttons has-addons">
|
||
|
|
<button class="button" id="download">Download</button>
|
||
|
|
<button class="button is-danger" id="delete">Delete</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script src="../src/skin.js"></script>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
fs.readdir(path.join(__dirname + "/../assets/skins/download/"), (err, files) => {
|
||
|
|
files.forEach(file => {
|
||
|
|
var ctx = document.createElement("canvas");
|
||
|
|
ctx.width = 32;
|
||
|
|
ctx.height = 32;
|
||
|
|
$(ctx).addClass("py-1 px-1");
|
||
|
|
|
||
|
|
var canvas = ctx.getContext("2d");
|
||
|
|
|
||
|
|
canvas["imageSmoothingEnabled"] = false; /* standard */
|
||
|
|
canvas["mozImageSmoothingEnabled"] = false; /* Firefox */
|
||
|
|
canvas["oImageSmoothingEnabled"] = false; /* Opera */
|
||
|
|
canvas["webkitImageSmoothingEnabled"] = false; /* Safari */
|
||
|
|
canvas["msImageSmoothingEnabled"] = false; /* IE */
|
||
|
|
|
||
|
|
var img = new Image();
|
||
|
|
img.onload = function () {
|
||
|
|
canvas.drawImage(img, 8, 8, 8, 8, 0, 0, 32, 32);
|
||
|
|
};
|
||
|
|
img.src = "data:image/png;base64," + fs.readFileSync(path.join(__dirname +
|
||
|
|
"/../assets/skins/download/" + file), {
|
||
|
|
encoding: "base64"
|
||
|
|
});
|
||
|
|
|
||
|
|
ctx.addEventListener("click", (e) => {
|
||
|
|
setView(img.src);
|
||
|
|
});
|
||
|
|
|
||
|
|
list.appendChild(ctx);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|