tronnet/ProxmoxAAS-Dashboard
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

use extra js file to store config data

Browse Source 
Signed-off-by: Arthur Lu <learthurgo@gmail.com>
This commit is contained in:
Arthur Lu 2023-01-19 19:58:44 +00:00
parent 1b4e8478dc
commit c9f9ad590c
5 changed files with 43 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
scripts/config.js
View File

@ -1,23 +1,9 @@
import {request, goToPage, getURIData, reload} from "./utils.js"; import {requestPVE, goToPage, getURIData, reload} from "./utils.js";
import {pveconfig} from "./meta.js";
window.addEventListener("DOMContentLoaded", init); window.addEventListener("DOMContentLoaded", init);
let diskConfig = { let diskMetaData = pveconfig.diskMetaData;
//actionBarOrder: ["config", "move", "reassign", "resize", "delete_detach_attach"],
actionBarOrder: ["config", "move", "resize", "delete_detach_attach"], // handle reassign later
lxc: {
prefixOrder: ["rootfs", "mp", "unused"],
rootfs: {name: "ROOTFS", icon: "images/resources/drive.svg", actions: ["move", "resize"]},
mp: {name: "MP", icon: "images/resources/drive.svg", actions: ["config", "detach", "move", "reassign", "resize"]},
unused: {name: "UNUSED", icon: "images/resources/drive.svg", actions: ["attach", "delete", "reassign"]}
},
qemu: {
prefixOrder: ["ide", "sata", "unused"],
ide: {name: "IDE", icon: "images/resources/disk.svg", actions: ["config", "delete"]},
sata: {name: "SATA", icon: "images/resources/drive.svg", actions: ["detach", "move", "reassign", "resize"]},
unused: {name: "UNUSED", icon: "images/resources/drive.svg", actions: ["attach", "delete", "reassign"]}
}
}
let node; let node;
let type; let type;
@ -40,11 +26,11 @@ async function init () {
goToPage("index.html"); goToPage("index.html");
}); });
console.log(diskConfig); console.log(diskMetaData);
} }
async function populateResources () { async function populateResources () {
let config = await request(`/nodes/${node}/${type}/${vmid}/config`); let config = await requestPVE(`/nodes/${node}/${type}/${vmid}/config`);
console.log(config); console.log(config);
let name = type === "qemu" ? "name" : "hostname"; let name = type === "qemu" ? "name" : "hostname";
@ -56,9 +42,9 @@ async function populateResources () {
addResourceLine("resources", "images/resources/swap.svg", "Swap", {type: "number", value: config.data.swap, min: 0, step: 1}, "MiB"); // TODO add max from quota API addResourceLine("resources", "images/resources/swap.svg", "Swap", {type: "number", value: config.data.swap, min: 0, step: 1}, "MiB"); // TODO add max from quota API
} }
for(let i = 0; i < diskConfig[type].prefixOrder.length; i++){ for(let i = 0; i < diskMetaData[type].prefixOrder.length; i++){
let prefix = diskConfig[type].prefixOrder[i]; let prefix = diskMetaData[type].prefixOrder[i];
let busName = diskConfig[type][prefix].name; let busName = diskMetaData[type][prefix].name;
let disks = {}; let disks = {};
Object.keys(config.data).forEach(element => { Object.keys(config.data).forEach(element => {
if (element.startsWith(prefix)) { if (element.startsWith(prefix)) {
@ -105,7 +91,7 @@ async function addDiskLine (fieldset, busPrefix, busName, device, disk) {
// Set the disk icon, either drive.svg or disk.svg // Set the disk icon, either drive.svg or disk.svg
let icon = document.createElement("img"); let icon = document.createElement("img");
icon.src = diskConfig[type][busPrefix].icon; icon.src = diskMetaData[type][busPrefix].icon;
icon.alt = `${busName} ${device}`; icon.alt = `${busName} ${device}`;
field.append(icon); field.append(icon);
@ -121,24 +107,24 @@ async function addDiskLine (fieldset, busPrefix, busName, device, disk) {
let actionDiv = document.createElement("div"); let actionDiv = document.createElement("div");
actionDiv.classList.add("last-item"); actionDiv.classList.add("last-item");
diskConfig.actionBarOrder.forEach((element) => { diskMetaData.actionBarOrder.forEach((element) => {
let action = document.createElement("img"); let action = document.createElement("img");
action.classList.add("clickable"); action.classList.add("clickable");
if (element === "delete_detach_attach" && diskConfig[type][busPrefix].actions.includes("attach")){ if (element === "delete_detach_attach" && diskMetaData[type][busPrefix].actions.includes("attach")){
action.src = "images/actions/attach.svg"; action.src = "images/actions/attach.svg";
action.title = "Attach Disk"; action.title = "Attach Disk";
} }
else if (element === "delete_detach_attach" && diskConfig[type][busPrefix].actions.includes("detach")){ else if (element === "delete_detach_attach" && diskMetaData[type][busPrefix].actions.includes("detach")){
action.src = "images/actions/detach.svg"; action.src = "images/actions/detach.svg";
action.title = "Detach Disk"; action.title = "Detach Disk";
} }
else if (element === "delete_detach_attach"){ else if (element === "delete_detach_attach"){
let active = diskConfig[type][busPrefix].actions.includes("delete") ? "active" : "inactive"; let active = diskMetaData[type][busPrefix].actions.includes("delete") ? "active" : "inactive";
action.src = `images/actions/delete-${active}.svg`; action.src = `images/actions/delete-${active}.svg`;
action.title = `Delete Disk`; action.title = `Delete Disk`;
} }
else { else {
let active = diskConfig[type][busPrefix].actions.includes(element) ? "active" : "inactive"; let active = diskMetaData[type][busPrefix].actions.includes(element) ? "active" : "inactive";
action.src = `images/actions/${element}-${active}.svg`; action.src = `images/actions/${element}-${active}.svg`;
action.title = `${element.charAt(0).toUpperCase()}${element.slice(1)} Disk`; action.title = `${element.charAt(0).toUpperCase()}${element.slice(1)} Disk`;
} }

6
scripts/elements.js
View File

@ -1,4 +1,4 @@
import {request, goToPage} from "./utils.js"; import {requestPVE, goToPage} from "./utils.js";
const waitFor = delay => new Promise(resolve => setTimeout(resolve, delay)); const waitFor = delay => new Promise(resolve => setTimeout(resolve, delay));
@ -77,7 +77,7 @@ class Instance extends HTMLElement {
configButton.src = "images/actions/config-inactive.svg"; configButton.src = "images/actions/config-inactive.svg";
try { try {
let task = await request(`/nodes/${this.node}/${this.type}/${this.vmid}/status/${targetAction}`, "POST", {node: this.node, vmid: this.vmid}); let task = await requestPVE(`/nodes/${this.node}/${this.type}/${this.vmid}/status/${targetAction}`, "POST", {node: this.node, vmid: this.vmid});
} }
catch { catch {
typeImg.src = `images/instances/${this.type}/${this.status}.svg`; typeImg.src = `images/instances/${this.type}/${this.status}.svg`;
@ -96,7 +96,7 @@ class Instance extends HTMLElement {
} }
while (true) { while (true) {
let taskStatus = await request(`/nodes/${this.node}/tasks/${task.data}/status`); let taskStatus = await requestPVE(`/nodes/${this.node}/tasks/${task.data}/status`);
if(taskStatus.data.status === "stopped" && taskStatus.data.exitstatus === "OK") { if(taskStatus.data.status === "stopped" && taskStatus.data.exitstatus === "OK") {
this.status = targetStatus; this.status = targetStatus;

4
scripts/index.js
View File

@ -1,4 +1,4 @@
import {request, goToPage, deleteAllCookies} from "./utils.js"; import {requestPVE, goToPage, deleteAllCookies} from "./utils.js";
window.addEventListener("DOMContentLoaded", init); window.addEventListener("DOMContentLoaded", init);
@ -23,7 +23,7 @@ async function populateInstances () {
goToPage("login.html"); goToPage("login.html");
} }
let resources = await request("/cluster/resources", "GET", null); let resources = await requestPVE("/cluster/resources", "GET", null);
let instanceContainer = document.getElementById("instance-container") let instanceContainer = document.getElementById("instance-container")

19
scripts/meta.js Normal file
View File

@ -0,0 +1,19 @@
export const pveconfig = {
pveAPI: "",
diskMetaData: {
//actionBarOrder: ["config", "move", "reassign", "resize", "delete_detach_attach"],
actionBarOrder: ["config", "move", "resize", "delete_detach_attach"], // handle reassign later
lxc: {
prefixOrder: ["rootfs", "mp", "unused"],
rootfs: {name: "ROOTFS", icon: "images/resources/drive.svg", actions: ["move", "resize"]},
mp: {name: "MP", icon: "images/resources/drive.svg", actions: ["config", "detach", "move", "reassign", "resize"]},
unused: {name: "UNUSED", icon: "images/resources/drive.svg", actions: ["attach", "delete", "reassign"]}
},
qemu: {
prefixOrder: ["ide", "sata", "unused"],
ide: {name: "IDE", icon: "images/resources/disk.svg", actions: ["config", "delete"]},
sata: {name: "SATA", icon: "images/resources/drive.svg", actions: ["detach", "move", "reassign", "resize"]},
unused: {name: "UNUSED", icon: "images/resources/drive.svg", actions: ["attach", "delete", "reassign"]}
}
}
}

8
scripts/utils.js
View File

@ -1,3 +1,5 @@
import {pveconfig} from "./meta.js";
export class ResponseError extends Error { export class ResponseError extends Error {
constructor(message) { constructor(message) {
super(message); super(message);
@ -29,7 +31,7 @@ function getCookie(cname) {
} }
export async function requestTicket (username, password) { export async function requestTicket (username, password) {
let response = await request("/access/ticket", "POST", {username: `${username}@pve`, password: password}, false); let response = await requestPVE("/access/ticket", "POST", {username: `${username}@pve`, password: password}, false);
return response; return response;
} }
@ -41,7 +43,7 @@ export function setTicket (ticket, csrf) {
document.cookie = `CSRFPreventionToken=${csrf}; path=/; expires=${d.toUTCString()}; domain=.tronnet.net;` document.cookie = `CSRFPreventionToken=${csrf}; path=/; expires=${d.toUTCString()}; domain=.tronnet.net;`
} }
export async function request (path, method, body = null, auth = true) { export async function requestPVE (path, method, body = null, auth = true) {
let prms = new URLSearchParams(body); let prms = new URLSearchParams(body);
let content = { let content = {
@ -57,7 +59,7 @@ export async function request (path, method, body = null, auth = true) {
content.headers.CSRFPreventionToken = getCookie("CSRFPreventionToken"); content.headers.CSRFPreventionToken = getCookie("CSRFPreventionToken");
} }
let response = await fetch(`https://pve.tronnet.net/api2/json${path}`, content) let response = await fetch(`${pveconfig.pveAPI}${path}`, content)
.then((response) => { .then((response) => {
if (!response.ok) { if (!response.ok) {
throw new ResponseError(`recieved response status code ${response.status}`); throw new ResponseError(`recieved response status code ${response.status}`);