remove alert interface and use new error interface

This commit is contained in:
alu
2026-07-28 20:41:01 +00:00
parent 5786b7e1be
commit 1f672e16e6
7 changed files with 43 additions and 80 deletions
+2 -2
View File
@@ -1,5 +1,5 @@
import { requestAPI, setAppearance } from "./utils.js";
import { dialog } from "./dialog.js";
import { dialog, error } from "./dialog.js";
window.addEventListener("DOMContentLoaded", init);
@@ -15,7 +15,7 @@ function handlePasswordChangeButton () {
if (result === "confirm") {
const result = await requestAPI("/access/password", "POST", { password: form.get("new-password") });
if (result.status !== 200) {
alert(`Attempted to change password but got: ${result.error}`);
error(`Attempted to change password but got: ${result.error}`);
}
}
});
+7 -11
View File
@@ -1,5 +1,5 @@
import { requestAPI, getURIData, setAppearance, requestDash } from "./utils.js";
import { alert, dialog } from "./dialog.js";
import { error, dialog } from "./dialog.js";
window.addEventListener("DOMContentLoaded", init);
@@ -74,7 +74,7 @@ class BackupCard extends HTMLElement {
};
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/backup/notes`, "POST", body);
if (result.status !== 200) {
alert(`Attempted to edit backup but got: ${result.error}`);
error(`Attempted to edit backup but got: ${result.error}`);
}
refreshBackups();
}
@@ -90,7 +90,7 @@ class BackupCard extends HTMLElement {
};
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/backup`, "DELETE", body);
if (result.status !== 200) {
alert(`Attempted to delete backup but got: ${result.error}`);
error(`Attempted to delete backup but got: ${result.error}`);
}
refreshBackups();
}
@@ -106,7 +106,7 @@ class BackupCard extends HTMLElement {
};
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/backup/restore`, "POST", body);
if (result.status !== 200) {
alert(`Attempted to delete backup but got: ${result.error}`);
error(`Attempted to delete backup but got: ${result.error}`);
}
refreshBackups();
}
@@ -116,14 +116,10 @@ class BackupCard extends HTMLElement {
customElements.define("backup-card", BackupCard);
async function getBackupsFragment () {
return await requestDash(`/backups/backups?node=${node}&type=${type}&vmid=${vmid}`, "GET");
}
async function refreshBackups () {
let backups = await getBackupsFragment();
let backups = await requestDash(`/backups/backups?node=${node}&type=${type}&vmid=${vmid}`, "GET");
if (backups.status !== 200) {
alert("Error fetching backups.");
error("Error fetching backups.");
}
else {
backups = backups.data;
@@ -141,7 +137,7 @@ async function handleBackupAddButton () {
};
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/backup`, "POST", body);
if (result.status !== 200) {
alert(`Attempted to create backup but got: ${result.error}`);
error(`Attempted to create backup but got: ${result.error}`);
}
refreshBackups();
}
+3 -2
View File
@@ -1,4 +1,5 @@
import { getSetting, requestAPI } from "./utils.js";
import { error } from "./dialog.js";
export async function setupClientSync (callback) {
const scheme = getSetting("sync-scheme");
@@ -31,12 +32,12 @@ export async function setupClientSync (callback) {
callback();
}
else {
console.error("clientsync: recieved unexpected message from server, closing socket.");
error("clientsync: recieved unexpected message from server, closing socket.");
socket.close();
}
});
}
else {
console.error(`clientsync: unsupported scheme ${scheme} selected.`);
error(`clientsync: unsupported scheme ${scheme} selected.`);
}
}
+21 -21
View File
@@ -1,5 +1,5 @@
import { requestPVE, requestAPI, goToPage, getURIData, setAppearance, setIconSrc, requestDash } from "./utils.js";
import { alert, dialog } from "./dialog.js";
import { error, dialog } from "./dialog.js";
window.addEventListener("DOMContentLoaded", init);
@@ -59,7 +59,7 @@ class VolumeAction extends HTMLElement {
this.setStatusLoading();
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/disk/${disk}/detach`, "POST");
if (result.status !== 200) {
alert(`Attempted to detach ${disk} but got: ${result.error}`);
error(`Attempted to detach ${disk} but got: ${result.error}`);
}
refreshVolumes();
refreshBoot();
@@ -80,7 +80,7 @@ class VolumeAction extends HTMLElement {
const disk = `${prefix}${device}`;
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/disk/${disk}/attach`, "POST", body);
if (result.status !== 200) {
alert(`Attempted to attach ${this.dataset.volume} to ${disk} but got: ${result.error}`);
error(`Attempted to attach ${this.dataset.volume} to ${disk} but got: ${result.error}`);
}
refreshVolumes();
refreshBoot();
@@ -98,7 +98,7 @@ class VolumeAction extends HTMLElement {
};
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/disk/${disk}/resize`, "POST", body);
if (result.status !== 200) {
alert(`Attempted to resize ${disk} but got: ${result.error}`);
error(`Attempted to resize ${disk} but got: ${result.error}`);
}
refreshVolumes();
refreshBoot();
@@ -117,7 +117,7 @@ class VolumeAction extends HTMLElement {
};
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/disk/${disk}/move`, "POST", body);
if (result.status !== 200) {
alert(`Attempted to move ${disk} to ${body.storage} but got: ${result.error}`);
error(`Attempted to move ${disk} to ${body.storage} but got: ${result.error}`);
}
refreshVolumes();
refreshBoot();
@@ -141,7 +141,7 @@ class VolumeAction extends HTMLElement {
this.setStatusLoading();
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/disk/${disk}/delete`, "DELETE");
if (result.status !== 200) {
alert(`Attempted to delete ${disk} but got: ${result.error}`);
error(`Attempted to delete ${disk} but got: ${result.error}`);
}
refreshVolumes();
refreshBoot();
@@ -162,7 +162,7 @@ async function initVolumes () {
async function refreshVolumes () {
let volumes = await requestDash(`/config/volumes?node=${node}&type=${type}&vmid=${vmid}`, "GET");
if (volumes.status !== 200) {
alert("Error fetching instance volumes.");
error("Error fetching instance volumes.");
}
else {
volumes = volumes.data;
@@ -186,7 +186,7 @@ async function handleDiskAdd () {
const disk = `${prefix}${id}`;
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/disk/${disk}/create`, "POST", body);
if (result.status !== 200) {
alert(`Attempted to create ${disk} but got: ${result.error}`);
error(`Attempted to create ${disk} but got: ${result.error}`);
}
refreshVolumes();
refreshBoot();
@@ -214,7 +214,7 @@ async function handleCDAdd () {
const disk = `ide${form.get("device")}`;
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/disk/${disk}/create`, "POST", body);
if (result.status !== 200) {
alert(`Attempted to mount ${body.iso} to ${disk} but got: result.error`);
error(`Attempted to mount ${body.iso} to ${disk} but got: result.error`);
}
refreshVolumes();
refreshBoot();
@@ -263,7 +263,7 @@ class NetworkAction extends HTMLElement {
const net = `${netID}`;
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/net/${net}/modify`, "POST", body);
if (result.status !== 200) {
alert(`Attempted to change ${net} but got: ${result.error}`);
error(`Attempted to change ${net} but got: ${result.error}`);
}
refreshNetworks();
refreshBoot();
@@ -281,7 +281,7 @@ class NetworkAction extends HTMLElement {
const net = `${netID}`;
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/net/${net}/delete`, "DELETE");
if (result.status !== 200) {
alert(`Attempted to delete ${net} but got: ${result.error}`);
error(`Attempted to delete ${net} but got: ${result.error}`);
}
refreshNetworks();
refreshBoot();
@@ -299,7 +299,7 @@ async function initNetworks () {
async function refreshNetworks () {
let nets = await requestDash(`/config/nets?node=${node}&type=${type}&vmid=${vmid}`, "GET");
if (nets.status !== 200) {
alert("Error fetching instance nets.");
error("Error fetching instance nets.");
}
else {
nets = nets.data;
@@ -324,7 +324,7 @@ async function handleNetworkAdd () {
const net = `net${id}`;
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/net/${net}/create`, "POST", body);
if (result.status !== 200) {
alert(`Attempted to create ${net} but got: ${result.error}`);
error(`Attempted to create ${net} but got: ${result.error}`);
}
refreshNetworks();
refreshBoot();
@@ -367,7 +367,7 @@ class DeviceAction extends HTMLElement {
const device = `${deviceID}`;
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/pci/${device}/modify`, "POST", body);
if (result.status !== 200) {
alert(`Attempted to add ${device} but got: ${result.error}`);
error(`Attempted to add ${device} but got: ${result.error}`);
}
refreshDevices();
}
@@ -389,7 +389,7 @@ class DeviceAction extends HTMLElement {
const device = `${deviceID}`;
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/pci/${device}/delete`, "DELETE");
if (result.status !== 200) {
alert(`Attempted to delete ${device} but got: ${result.error}`);
error(`Attempted to delete ${device} but got: ${result.error}`);
}
refreshDevices();
}
@@ -408,7 +408,7 @@ async function initDevices () {
async function refreshDevices () {
let devices = await requestDash(`/config/devices?node=${node}&type=${type}&vmid=${vmid}`, "GET");
if (devices.status !== 200) {
alert("Error fetching instance devices.");
error("Error fetching instance devices.");
}
else {
devices = devices.data;
@@ -431,7 +431,7 @@ async function handleDeviceAdd () {
const deviceID = `hostpci${hostpci}`;
const result = await requestAPI(`/cluster/${node}/${type}/${vmid}/pci/${deviceID}/create`, "POST", body);
if (result.status !== 200) {
alert(`Attempted to add ${body.device} but got: ${result.error}`);
error(`Attempted to add ${body.device} but got: ${result.error}`);
}
refreshDevices();
}
@@ -447,12 +447,12 @@ async function handleDeviceAdd () {
async function refreshBoot () {
let boot = await requestDash(`/config/boot?node=${node}&type=${type}&vmid=${vmid}`, "GET");
if (boot.status !== 200) {
alert("Error fetching instance boot order.");
error("Error fetching instance boot order.");
}
else if (type === "qemu") {
boot = boot.data;
const order = document.querySelector("#boot-order");
order.setHTMLUnsafe(boot);
const container = document.querySelector("#boot-order");
container.setHTMLUnsafe(boot);
}
}
@@ -474,6 +474,6 @@ async function handleFormExit (event) {
goToPage("index");
}
else {
alert(`Attempted to set basic resources but got: ${result.error}`);
error(`Attempted to set basic resources but got: ${result.error}`);
}
}
+1 -29
View File
@@ -41,34 +41,6 @@ export function dialog (template, onclose = async (_result, _form) => { }) {
return dialog;
}
export function alert (message) {
const dialog = document.querySelector("#alert-dialog");
if (dialog == null) {
const dialog = document.createElement("dialog");
dialog.id = "alert-dialog";
dialog.innerHTML = `
<form method="dialog">
<p class="w3-large" id="prompt">Alert</p>
<p class="w3-center" style="margin-bottom: 0;">${message}</p>
<div class="w3-center">
<button class="w3-button w3-margin" id="submit">OK</button>
</div>
</form>
`;
dialog.className = "w3-container w3-card w3-border-0";
document.body.append(dialog);
dialog.showModal();
dialog.addEventListener("close", () => {
dialog.parentElement.removeChild(dialog);
});
return dialog;
}
else {
console.error("Attempted to create a new alert while one already exists!");
return null;
}
}
class ErrorDialog extends HTMLElement {
shadowRoot = null;
dialog = null;
@@ -141,7 +113,7 @@ customElements.define("error-dialog", ErrorDialog);
export function error (message) {
let dialog = document.querySelector("error-dialog");
if (dialog == null) {
if (dialog === null) {
dialog = document.createElement("error-dialog");
document.body.append(dialog);
dialog.appendError(message);
+5 -9
View File
@@ -1,5 +1,5 @@
import { requestPVE, requestAPI, setAppearance, getSetting, requestDash, setIconSrc, setIconAlt } from "./utils.js";
import { alert, dialog, error } from "./dialog.js";
import { dialog, error } from "./dialog.js";
import { setupClientSync } from "./clientsync.js";
import wfaInit from "../modules/wfa.js";
@@ -175,7 +175,7 @@ class InstanceCard extends HTMLElement {
break;
}
else if (taskStatus.data.status === "stopped") { // task stopped but was not successful
alert(`Attempted to ${targetAction} ${this.vmid} but got: ${taskStatus.data.exitstatus}`);
error(`Attempted to ${targetAction} ${this.vmid} but got: ${taskStatus.data.exitstatus}`);
break;
}
else { // task has not stopped
@@ -203,7 +203,7 @@ class InstanceCard extends HTMLElement {
const result = await requestAPI(`/cluster/${this.node.name}/${this.type}/${this.vmid}/delete`, "DELETE");
if (result.status !== 200) {
alert(`Attempted to delete ${this.vmid} but got: ${result.error}`);
error(`Attempted to delete ${this.vmid} but got: ${result.error}`);
}
this.actionLock = false;
@@ -216,12 +216,8 @@ class InstanceCard extends HTMLElement {
customElements.define("instance-card", InstanceCard);
async function getInstancesFragment () {
return await requestDash("/index/instances", "GET");
}
async function refreshInstances () {
let instances = await getInstancesFragment();
let instances = await requestDash("/index/instances", "GET");
if (instances.status !== 200) {
error(`Error fetching instances: ${instances.status} ${instances.error !== undefined ? instances.error : ""}`);
}
@@ -337,7 +333,7 @@ async function handleInstanceAddButton () {
refreshInstances();
}
else {
alert(`Attempted to create new instance ${vmid} but got: ${result.error}`);
error(`Attempted to create new instance ${vmid} but got: ${result.error}`);
refreshInstances();
}
}
+4 -6
View File
@@ -1,5 +1,5 @@
import { goToPage, setAppearance, requestAPI } from "./utils.js";
import { alert } from "./dialog.js";
import { error } from "./dialog.js";
window.addEventListener("DOMContentLoaded", init);
@@ -19,18 +19,16 @@ async function init () {
goToPage("index");
}
else if (ticket.status === 401) {
alert("Authenticaton failed.");
error("Authenticaton failed.");
formSubmitButton.innerText = "LOGIN";
}
else if (ticket.status === 408) {
alert("Network error.");
error("Network error.");
formSubmitButton.innerText = "LOGIN";
}
else {
alert("An error occured.");
console.error(ticket);
error(`An error occured: ${JSON.stringify(ticket)}`);
formSubmitButton.innerText = "LOGIN";
console.error(ticket.error);
}
});
}