From b6642c9f0c09b9880998eb2fc048a1981865ef0d Mon Sep 17 00:00:00 2001 From: Arthur Lu Date: Tue, 21 Feb 2023 21:50:54 +0000 Subject: [PATCH] group action icons by type Signed-off-by: Arthur Lu --- config.html | 4 ++-- images/actions/{ => disk}/add-cd.svg | 0 images/actions/{ => disk}/add-disk.svg | 0 images/actions/{ => disk}/attach.svg | 0 images/actions/{ => disk}/detach.svg | 0 .../{ => disk}/detach_attach-inactive.svg | 0 images/actions/{ => disk}/move-active.svg | 0 images/actions/{ => disk}/move-inactive.svg | 0 images/actions/{ => disk}/resize-active.svg | 0 images/actions/{ => disk}/resize-inactive.svg | 0 .../actions/{ => instance}/config-active.svg | 0 .../actions/{ => instance}/config-inactive.svg | 0 .../actions/{ => instance}/console-active.svg | 0 .../{ => instance}/console-inactive.svg | 0 images/actions/{ => instance}/start.svg | 0 images/actions/{ => instance}/stop.svg | 0 index.html | 4 +++- scripts/config.js | 15 +++++++++------ scripts/utils.js | 18 +++++++++--------- 19 files changed, 23 insertions(+), 18 deletions(-) rename images/actions/{ => disk}/add-cd.svg (100%) rename images/actions/{ => disk}/add-disk.svg (100%) rename images/actions/{ => disk}/attach.svg (100%) rename images/actions/{ => disk}/detach.svg (100%) rename images/actions/{ => disk}/detach_attach-inactive.svg (100%) rename images/actions/{ => disk}/move-active.svg (100%) rename images/actions/{ => disk}/move-inactive.svg (100%) rename images/actions/{ => disk}/resize-active.svg (100%) rename images/actions/{ => disk}/resize-inactive.svg (100%) rename images/actions/{ => instance}/config-active.svg (100%) rename images/actions/{ => instance}/config-inactive.svg (100%) rename images/actions/{ => instance}/console-active.svg (100%) rename images/actions/{ => instance}/console-inactive.svg (100%) rename images/actions/{ => instance}/start.svg (100%) rename images/actions/{ => instance}/stop.svg (100%) diff --git a/config.html b/config.html index 99b7bd1..70ce43c 100644 --- a/config.html +++ b/config.html @@ -22,8 +22,8 @@

- Add New Disk - Add New CDROM + Add New Disk + Add New CDROM
diff --git a/images/actions/add-cd.svg b/images/actions/disk/add-cd.svg similarity index 100% rename from images/actions/add-cd.svg rename to images/actions/disk/add-cd.svg diff --git a/images/actions/add-disk.svg b/images/actions/disk/add-disk.svg similarity index 100% rename from images/actions/add-disk.svg rename to images/actions/disk/add-disk.svg diff --git a/images/actions/attach.svg b/images/actions/disk/attach.svg similarity index 100% rename from images/actions/attach.svg rename to images/actions/disk/attach.svg diff --git a/images/actions/detach.svg b/images/actions/disk/detach.svg similarity index 100% rename from images/actions/detach.svg rename to images/actions/disk/detach.svg diff --git a/images/actions/detach_attach-inactive.svg b/images/actions/disk/detach_attach-inactive.svg similarity index 100% rename from images/actions/detach_attach-inactive.svg rename to images/actions/disk/detach_attach-inactive.svg diff --git a/images/actions/move-active.svg b/images/actions/disk/move-active.svg similarity index 100% rename from images/actions/move-active.svg rename to images/actions/disk/move-active.svg diff --git a/images/actions/move-inactive.svg b/images/actions/disk/move-inactive.svg similarity index 100% rename from images/actions/move-inactive.svg rename to images/actions/disk/move-inactive.svg diff --git a/images/actions/resize-active.svg b/images/actions/disk/resize-active.svg similarity index 100% rename from images/actions/resize-active.svg rename to images/actions/disk/resize-active.svg diff --git a/images/actions/resize-inactive.svg b/images/actions/disk/resize-inactive.svg similarity index 100% rename from images/actions/resize-inactive.svg rename to images/actions/disk/resize-inactive.svg diff --git a/images/actions/config-active.svg b/images/actions/instance/config-active.svg similarity index 100% rename from images/actions/config-active.svg rename to images/actions/instance/config-active.svg diff --git a/images/actions/config-inactive.svg b/images/actions/instance/config-inactive.svg similarity index 100% rename from images/actions/config-inactive.svg rename to images/actions/instance/config-inactive.svg diff --git a/images/actions/console-active.svg b/images/actions/instance/console-active.svg similarity index 100% rename from images/actions/console-active.svg rename to images/actions/instance/console-active.svg diff --git a/images/actions/console-inactive.svg b/images/actions/instance/console-inactive.svg similarity index 100% rename from images/actions/console-inactive.svg rename to images/actions/instance/console-inactive.svg diff --git a/images/actions/start.svg b/images/actions/instance/start.svg similarity index 100% rename from images/actions/start.svg rename to images/actions/instance/start.svg diff --git a/images/actions/stop.svg b/images/actions/instance/stop.svg similarity index 100% rename from images/actions/stop.svg rename to images/actions/instance/stop.svg diff --git a/index.html b/index.html index ed37741..a726b2d 100644 --- a/index.html +++ b/index.html @@ -16,6 +16,8 @@ -
+
+
+
\ No newline at end of file diff --git a/scripts/config.js b/scripts/config.js index 8925bbb..2835488 100644 --- a/scripts/config.js +++ b/scripts/config.js @@ -133,18 +133,24 @@ function addDiskLine (fieldset, busPrefix, busName, device, diskDetails) { let action = document.createElement("img"); action.classList.add("clickable"); if (element === "detach_attach" && diskMetaData[type][busPrefix].actions.includes("attach")){ // attach - action.src = "images/actions/attach.svg"; + action.src = "images/actions/disk/attach.svg"; action.title = "Attach Disk"; action.addEventListener("click", handleDiskAttach); } else if (element === "detach_attach" && diskMetaData[type][busPrefix].actions.includes("detach")){ // detach - action.src = "images/actions/detach.svg"; + action.src = "images/actions/disk/detach.svg"; action.title = "Detach Disk"; action.addEventListener("click", handleDiskDetach); } + else if (element === "delete") { + let active = diskMetaData[type][busPrefix].actions.includes(element) ? "active" : "inactive"; // resize + action.src = `images/actions/delete-${active}.svg`; + action.title = "Delete Disk"; + action.addEventListener("click", handleDiskDelete); + } else { let active = diskMetaData[type][busPrefix].actions.includes(element) ? "active" : "inactive"; // resize - action.src = `images/actions/${element}-${active}.svg`; + action.src = `images/actions/disk/${element}-${active}.svg`; action.title = `${element.charAt(0).toUpperCase()}${element.slice(1)} Disk`; if (active === "active") { if (element === "move") { @@ -153,9 +159,6 @@ function addDiskLine (fieldset, busPrefix, busName, device, diskDetails) { else if (element === "resize") { action.addEventListener("click", handleDiskResize); } - else if (element === "delete") { - action.addEventListener("click", handleDiskDelete); - } } } action.dataset.disk = diskID; diff --git a/scripts/utils.js b/scripts/utils.js index ba67a59..27d7df5 100644 --- a/scripts/utils.js +++ b/scripts/utils.js @@ -34,31 +34,31 @@ export const resources = { export const instances = { running: { - powerButtonSrc: "images/actions/stop.svg", + powerButtonSrc: "images/actions/instance/stop.svg", powerButtonAlt: "Shutdown Instance", - configButtonSrc: "images/actions/config-inactive.svg", + configButtonSrc: "images/actions/instance/config-inactive.svg", configButtonAlt: "Change Configuration (Inactive)", - consoleButtonSrc: "images/actions/console-active.svg", + consoleButtonSrc: "images/actions/instance/console-active.svg", consoleButtonAlt: "Open Console", deleteButtonSrc: "images/actions/delete-inactive.svg", deleteButtonAlt: "Delete Instance (Inactive)" }, stopped: { - powerButtonSrc: "images/actions/start.svg", + powerButtonSrc: "images/actions/instance/start.svg", powerButtonAlt: "Start Instance", - configButtonSrc: "images/actions/config-active.svg", + configButtonSrc: "images/actions/instance/config-active.svg", configButtonAlt: "Change Configuration", - consoleButtonSrc: "images/actions/console-inactive.svg", + consoleButtonSrc: "images/actions/instance/console-inactive.svg", consoleButtonAlt: "Open Console (Inactive)", deleteButtonSrc: "images/actions/delete-active.svg", deleteButtonAlt: "Delete Instance" }, loading: { - powerButtonSrc: "images/actions/loading.svg", + powerButtonSrc: "images/actions/instance/loading.svg", powerButtonAlt: "Loading Instance", - configButtonSrc: "images/actions/config-inactive.svg", + configButtonSrc: "images/actions/instance/config-inactive.svg", configButtonAlt: "Change Configuration (Inactive)", - consoleButtonSrc: "images/actions/console-inactive.svg", + consoleButtonSrc: "images/actions/instance/console-inactive.svg", consoleButtonAlt: "Open Console (Inactive)", deleteButtonSrc: "images/actions/delete-inactive.svg", deleteButtonAlt: "Delete Instance (Inactive)"