Added Skinview3D
This commit is contained in:
parent
9dd358e097
commit
bde532e123
@ -14,8 +14,11 @@
|
||||
|
||||
<div class="content">
|
||||
<p class="message"></p>
|
||||
<img src="" class="skin" alt="Current Skin">
|
||||
<button id="render">Switch to 3D</button>
|
||||
|
||||
<img src="" class="skin" id="flat" alt="Current Skin" style="display: none;">
|
||||
<div id="mesh" style="display: inline;"></div>
|
||||
|
||||
<button id="switch">Switch to 2D</button>
|
||||
<button id="download">Download</button>
|
||||
<button id="main">Back</button>
|
||||
</div>
|
||||
|
2
main.js
2
main.js
@ -13,7 +13,7 @@ function createWindow () {
|
||||
// Create the browser window.
|
||||
const win = new BrowserWindow({
|
||||
width: 320,
|
||||
height: 480,
|
||||
height: 520,
|
||||
backgroundColor: "#ffffff",
|
||||
resizable: false,
|
||||
frame: true,
|
||||
|
26
package-lock.json
generated
26
package-lock.json
generated
@ -2462,6 +2462,27 @@
|
||||
"resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.3.tgz",
|
||||
"integrity": "sha512-VUJ49FC8U1OxwZLxIbTTrDvLnf/6TDgxZcK8wxR8zs13xpx7xbG60ndBlhNrFi2EMuFRoeDoJO7wthSLq42EjA=="
|
||||
},
|
||||
"skinview-utils": {
|
||||
"version": "0.2.1",
|
||||
"resolved": "https://registry.npmjs.org/skinview-utils/-/skinview-utils-0.2.1.tgz",
|
||||
"integrity": "sha512-WhXaKwYp1FBspaKq/AXb4EG3E2gaVpA57dXWvPgM7GP2F36E8Pfdg1MZESWpTMG2TGp8xKz5JELgKD3uXSG0EA=="
|
||||
},
|
||||
"skinview3d": {
|
||||
"version": "2.0.0-alpha.1",
|
||||
"resolved": "https://registry.npmjs.org/skinview3d/-/skinview3d-2.0.0-alpha.1.tgz",
|
||||
"integrity": "sha512-HCA6nfBgr7SUwx+UYe8irNsHN0aVVKOplSPUVxEx5WRd9ZG5wpF4nXpObrKutfOz/TzYuxjdL0t1Th7E/noI/w==",
|
||||
"requires": {
|
||||
"skinview-utils": "^0.2.0",
|
||||
"three": "^0.112.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"three": {
|
||||
"version": "0.112.1",
|
||||
"resolved": "https://registry.npmjs.org/three/-/three-0.112.1.tgz",
|
||||
"integrity": "sha512-8I0O74hiYtKl3LgDNcPJbBGOlpekbcJ6fJnImmW3mFdeUFJ2H9Y3/UuUSW2sBdjrIlCM0gvOkaTEFlofO900TQ=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"slice-ansi": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-2.1.0.tgz",
|
||||
@ -2675,6 +2696,11 @@
|
||||
"resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
|
||||
"integrity": "sha1-f17oI66AUgfACvLfSoTsP8+lcLQ="
|
||||
},
|
||||
"three": {
|
||||
"version": "0.116.1",
|
||||
"resolved": "https://registry.npmjs.org/three/-/three-0.116.1.tgz",
|
||||
"integrity": "sha512-l2JCMiA/lVZAuSrLWRYMalvpR+0j8hbIhCpfs4V6JFnw2+JQEQJ5HltNpfFr+9TDpQts1BhtcISehWf/xBGPvQ=="
|
||||
},
|
||||
"through": {
|
||||
"version": "2.3.8",
|
||||
"resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
|
||||
|
@ -24,7 +24,9 @@
|
||||
"electron-handlebars": "^2.0.0",
|
||||
"electron-reload": "^1.5.0",
|
||||
"eslint": "^7.0.0",
|
||||
"pngjs": "^5.0.0"
|
||||
"pngjs": "^5.0.0",
|
||||
"skinview3d": "^2.0.0-alpha.1",
|
||||
"three": "^0.116.1"
|
||||
},
|
||||
"devDependencies": {},
|
||||
"repository": {
|
||||
|
48
src/skin.js
48
src/skin.js
@ -3,6 +3,8 @@ const { BrowserWindow, ipcRenderer, remote } = require("electron");
|
||||
const axios = require("axios").default;
|
||||
const path = require("path");
|
||||
|
||||
const skinview3d = require("skinview3d/dist/skinview3d.min.js");
|
||||
|
||||
const session = ipcRenderer.sendSync("getSession");
|
||||
if (!session.accessToken) {
|
||||
console.log("Session does not exist, return to auth");
|
||||
@ -20,9 +22,46 @@ case "current":
|
||||
method: "GET",
|
||||
url: "https://sessionserver.mojang.com/session/minecraft/profile/" + session.selectedProfile.id
|
||||
}).then((data) => {
|
||||
const url = JSON.parse(atob(data.data.properties[0].value)).textures.SKIN.url;
|
||||
document.querySelectorAll("div.content > img.skin")[0].src = url;
|
||||
// Switch button and views
|
||||
var btn = document.querySelectorAll("div.content > button#switch")[0];
|
||||
var view = {
|
||||
flat: document.querySelectorAll("div.content > img.skin#flat")[0],
|
||||
mesh: document.querySelectorAll("div.content > div#mesh")[0]
|
||||
};
|
||||
|
||||
// Set flat view
|
||||
const url = JSON.parse(atob(data.data.properties[0].value)).textures.SKIN.url;
|
||||
view.flat.src = url;
|
||||
|
||||
// Set mesh view
|
||||
let skinViewer = new skinview3d.SkinViewer({
|
||||
domElement: view.mesh,
|
||||
width: 200,
|
||||
height: 200,
|
||||
skinUrl: url
|
||||
});
|
||||
|
||||
let control = skinview3d.createOrbitControls(skinViewer);
|
||||
control.enableRotate = true;
|
||||
control.enableZoom = false;
|
||||
control.enablePan = false;
|
||||
|
||||
|
||||
// Switch button action
|
||||
btn.addEventListener("click", (e) => {
|
||||
console.log("Switch button clicked");
|
||||
if (view.flat.style.display == "inline") {
|
||||
view.flat.style.display = "none";
|
||||
view.mesh.style.display = "inline";
|
||||
btn.innerHTML = "Switch to 2D";
|
||||
} else {
|
||||
view.flat.style.display = "inline";
|
||||
view.mesh.style.display = "none";
|
||||
btn.innerHTML = "Switch to 3D";
|
||||
}
|
||||
});
|
||||
|
||||
// Download button action
|
||||
document.querySelectorAll("div.content > button#download")[0].addEventListener("click", (e) => {
|
||||
ipcRenderer.send("download", {
|
||||
url: url,
|
||||
@ -32,16 +71,13 @@ case "current":
|
||||
});
|
||||
|
||||
ipcRenderer.on("downloadResult", (event, arg) => {
|
||||
const msg = document.querySelectorAll("div.content > p.message")[0];
|
||||
var msg = document.querySelectorAll("div.content > p.message")[0];
|
||||
console.log(msg);
|
||||
msg.classList.add("success");
|
||||
msg.innerHTML = "Downloaded successfully";
|
||||
});
|
||||
});
|
||||
|
||||
document.querySelectorAll("div.content > button#render")[0].addEventListener("click", (e) => {
|
||||
console.log("Switch to 3D clicked");
|
||||
});
|
||||
});
|
||||
break;
|
||||
case "upload":
|
||||
|
Loading…
Reference in New Issue
Block a user