diff --git a/scripts/account.js b/scripts/account.js index ff1df79..fe8af0a 100644 --- a/scripts/account.js +++ b/scripts/account.js @@ -53,12 +53,12 @@ function populateResources (containerID, meta, resources) { Object.keys(meta).forEach((resourceType) => { if (meta[resourceType].display) { if (meta[resourceType].type === "list") { - resources[resourceType].forEach((listResource) => { + resources[resourceType].total.forEach((listResource) => { createResourceUsageChart(container, listResource.name, listResource.avail, listResource.used, listResource.max, null); }); } else { - createResourceUsageChart(container, meta[resourceType].name, resources[resourceType].avail, resources[resourceType].used, resources[resourceType].max, meta[resourceType]); + createResourceUsageChart(container, meta[resourceType].name, resources[resourceType].total.avail, resources[resourceType].total.used, resources[resourceType].total.max, meta[resourceType]); } } }); @@ -124,29 +124,29 @@ function parseNumber (value, unitData) { function handlePasswordChangeForm () { const body = `
- - - - + + + +
-

`; - dialog("Change Password", body, async (result, form) => { + const d = dialog("Change Password", body, async (result, form) => { if (result === "confirm") { const result = await requestAPI("/auth/password", "POST", { password: form.get("new-password") }); if (result.status !== 200) { alert(result.error); } } - }, (dialog, form) => { - const pass = form.get("new-password"); - const conf = form.get("confirm-password"); - if (pass !== conf) { - dialog.querySelector("#error-message").innerText = "Passwords must match"; - return false; - } - else { - return true; - } }); + + var password = d.querySelector("#new-password") + var confirm_password = d.querySelector("#confirm-password"); + + function validatePassword(){ + confirm_password.setCustomValidity( password.value != + confirm_password.value ? "Passwords Don't Match" : ''); + } + + password.addEventListener("change", validatePassword); + confirm_password.addEventListener("keyup", validatePassword); } diff --git a/scripts/config.js b/scripts/config.js index 5b5fdf7..1caed75 100644 --- a/scripts/config.js +++ b/scripts/config.js @@ -54,8 +54,10 @@ async function populateResources () { const global = await requestAPI("/global/config/resources"); const user = await requestAPI("/user/config/resources"); let options = []; - if (global.cpu.whitelist) { - user.cpu.forEach((userType) => { + const globalCPU = global.cpu; + const userCPU = node in user.cpu.nodes ? user.cpu.nodes[node] : user.cpu.global; + if (globalCPU.whitelist) { + userCPU.forEach((userType) => { options.push(userType.name); }); options = options.sort((a, b) => { @@ -65,7 +67,7 @@ async function populateResources () { else { const supported = await requestPVE(`/nodes/${node}/capabilities/qemu/cpu`); supported.data.forEach((supportedType) => { - if (!user.cpu.some((userType) => supportedType.name === userType.name)) { + if (!userCPU.some((userType) => supportedType.name === userType.name)) { options.push(supportedType.name); } }); diff --git a/scripts/dialog.js b/scripts/dialog.js index af1540e..f3fecc0 100644 --- a/scripts/dialog.js +++ b/scripts/dialog.js @@ -1,6 +1,4 @@ -export function dialog (header, body, onclose = async (result, form) => { }, validate = async (dialog, form) => { - return true; -}) { +export function dialog (header, body, onclose = async (result, form) => { }) { const dialog = document.createElement("dialog"); dialog.innerHTML = `

@@ -15,29 +13,20 @@ export function dialog (header, body, onclose = async (result, form) => { }, val dialog.querySelector("#body").innerHTML = body; dialog.addEventListener("close", async () => { const formElem = dialog.querySelector("form"); - let formData = null; - if (formElem) { - formData = new FormData(formElem); - } + const formData = formElem ? new FormData(formElem) : null; await onclose(dialog.returnValue, formData); dialog.parentElement.removeChild(dialog); }); - dialog.querySelector("#confirm").addEventListener("click", async (e) => { - e.preventDefault(); - let valid = true; - const formElem = dialog.querySelector("form"); - if (formElem) { - const form = new FormData(formElem); - valid = await validate(dialog, form); - } - if (valid) { + if (!dialog.querySelector("form")) { + dialog.querySelector("#confirm").addEventListener("click", async (e) => { + e.preventDefault(); dialog.close(e.target.value); - } - }); - dialog.querySelector("#cancel").addEventListener("click", async (e) => { - e.preventDefault(); - dialog.close(e.target.value); - }); + }); + dialog.querySelector("#cancel").addEventListener("click", async (e) => { + e.preventDefault(); + dialog.close(e.target.value); + }); + } document.body.append(dialog); dialog.showModal(); return dialog; diff --git a/scripts/index.js b/scripts/index.js index 0e648be..b63214a 100644 --- a/scripts/index.js +++ b/scripts/index.js @@ -163,6 +163,9 @@ async function handleInstanceAdd () { const rootfsStorage = d.querySelector("#rootfs-storage"); rootfsStorage.selectedIndex = -1; + const userResources = await requestAPI("/user/dynamic/resources", "GET"); + const userCluster = await requestAPI("/user/config/cluster", "GET"); + const nodeSelect = d.querySelector("#node"); const clusterNodes = await requestPVE("/nodes", "GET"); const allowedNodes = await requestAPI("/user/config/nodes", "GET"); @@ -185,6 +188,23 @@ async function handleInstanceAdd () { }); templateStorage.selectedIndex = -1; rootfsStorage.selectedIndex = -1; + + if (node in userResources.cores.nodes) { + d.querySelector("#cores").max = userResources.cores.nodes[node].avail; + } + else { + d.querySelector("#cores").max = userResources.cores.global.avail; + } + + if (node in userResources.memory.nodes) { + d.querySelector("#memory").max = userResources.memory.nodes[node].avail; + } + else { + d.querySelector("#memory").max = userResources.memory.global.avail; + } + + d.querySelector("#vmid").min = userCluster.vmid.min; + d.querySelector("#vmid").max = userCluster.vmid.max; }); const templateImage = d.querySelector("#template-image"); // populate templateImage depending on selected image storage @@ -199,11 +219,4 @@ async function handleInstanceAdd () { }); templateImage.selectedIndex = -1; }); - - const userResources = await requestAPI("/user/dynamic/resources", "GET"); - const userCluster = await requestAPI("/user/config/cluster", "GET"); - d.querySelector("#cores").max = userResources.cores.avail; - d.querySelector("#memory").max = userResources.memory.avail; - d.querySelector("#vmid").min = userCluster.vmid.min; - d.querySelector("#vmid").max = userCluster.vmid.max; } diff --git a/scripts/instance.js b/scripts/instance.js index 34981c4..f095698 100644 --- a/scripts/instance.js +++ b/scripts/instance.js @@ -219,7 +219,7 @@ class InstanceCard extends HTMLElement { handleDeleteButton () { if (!this.actionLock && this.status === "stopped") { const header = `Delete VM ${this.vmid}`; - const body = `

Are you sure you want to delete VM

${this.vmid}

`; + const body = `

Are you sure you want to delete VM ${this.vmid}

`; dialog(header, body, async (result, form) => { if (result === "confirm") {