diff --git a/web/remote/index.html b/web/remote/index.html
index 1154b03d..876ede00 100644
--- a/web/remote/index.html
+++ b/web/remote/index.html
@@ -11,6 +11,7 @@
+
diff --git a/web/share/css/remote/remote.css b/web/share/css/remote/remote.css
index 968c7c10..338e3ddf 100644
--- a/web/share/css/remote/remote.css
+++ b/web/share/css/remote/remote.css
@@ -30,44 +30,6 @@ div#hosts div.host {
border-radius: 6px;
}
-span.bulb {
- width: 12px;
- height: 12px;
- border-radius: 50%;
- display: inline-block;
- margin-right: 8px;
-}
-
-div[state='unknown'] span.bulb {
- background-color: yellow;
-}
-
-div[state='online'] span.bulb {
- background-color: limegreen;
-}
-
-div[state='offline'] span.bulb {
- background-color: grey;
-}
-
-span.state {
- margin-left: 24px;
- color: grey;
- user-select: none;
-}
-
-div[state='unknown'] span.state::before {
- content: "[ Unknown ]";
-}
-
-div[state='online'] span.state::before {
- content: "[ Online ]";
-}
-
-div[state='offline'] span.state::before {
- content: "[ Offline ]";
-}
-
span.hostname {
font-size: 18px;
font-weight: 500;
diff --git a/web/share/css/remote/status.css b/web/share/css/remote/status.css
new file mode 100644
index 00000000..d648a138
--- /dev/null
+++ b/web/share/css/remote/status.css
@@ -0,0 +1,45 @@
+span.bulb {
+ width: 12px;
+ height: 12px;
+ border-radius: 50%;
+ display: inline-block;
+ margin-right: 8px;
+}
+
+div[state='unknown'] span.bulb {
+ background-color: yellow;
+}
+
+div[state='online'] span.bulb {
+ background-color: limegreen;
+}
+
+div[state='offline'] span.bulb {
+ background-color: grey;
+}
+
+div[state='error'] span.bulb {
+ background-color: orangered;
+}
+
+span.state {
+ margin-left: 24px;
+ color: grey;
+ user-select: none;
+}
+
+div[state='unknown'] span.state::before {
+ content: "[ Unknown ]";
+}
+
+div[state='online'] span.state::before {
+ content: "[ Online ]";
+}
+
+div[state='offline'] span.state::before {
+ content: "[ Offline ]";
+}
+
+div[state='error'] span.state::before {
+ content: "[ Error ]";
+}
diff --git a/web/share/js/remote/main.js b/web/share/js/remote/main.js
index 575cd9e9..cd8f4fcd 100644
--- a/web/share/js/remote/main.js
+++ b/web/share/js/remote/main.js
@@ -104,8 +104,12 @@ function actionPerform(target, action) {
let result = JSON.parse(response).result;
if (result.code != 0) {
- let state = $$$(`.host[name='${target}'] span.state`)[0];
- state.innerHTML = ' ⦻ Failed';
+ let element = $$$(`.host[name='${target}']`)[0];
+ let state = element.querySelector('span.state');
+
+ element.setAttribute("state", "error");
+ state.innerHTML = ' ⦻ '
+ + action[0] + action.slice(1).toLowerCase();
setTimeout(() => updateState(status[target]), 5000);
}
}, body, contentType);
@@ -148,7 +152,7 @@ function makeView(hosts) {
`;
- let actions = child.querySelector(".remote-actions");
+ let buttons = child.querySelector(".remote-actions");
for (const action of host.actions) {
let button = document.createElement("button");
button.classList.add("remote-action");
@@ -160,7 +164,7 @@ function makeView(hosts) {
+ action[0] + action.slice(1).toLowerCase();
actionPerform(host.name, action);
};
- actions.appendChild(button);
+ buttons.appendChild(button);
}
updateState(host, child);
}