summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorJavier Sánchez Parra <jsanchez@soleta.eu>2022-02-25 13:17:11 +0100
committerJavier Sánchez Parra <jsanchez@soleta.eu>2022-02-25 13:53:47 +0100
commited967216aa51e59c50d30a38737a677b9706c28e (patch)
tree1ecad4f0ef1cc4e281781260181c96e93cff8f36
parent500d92007f358db02f00689717bb802c4fd3df89 (diff)
Show client state on pills
Color pills to represent their state, like scopes tree.
-rw-r--r--ogcp/static/css/soleta.css4
-rw-r--r--ogcp/static/js/ogcp.js25
2 files changed, 29 insertions, 0 deletions
diff --git a/ogcp/static/css/soleta.css b/ogcp/static/css/soleta.css
index 8efbf3c..6871cf8 100644
--- a/ogcp/static/css/soleta.css
+++ b/ogcp/static/css/soleta.css
@@ -31,3 +31,7 @@ html, body {
color: #99791a !important;
}
+.badge-wol {
+ color: white !important;
+ background-color: #99791a !important;
+}
diff --git a/ogcp/static/js/ogcp.js b/ogcp/static/js/ogcp.js
index 3623eb9..c5c1c62 100644
--- a/ogcp/static/js/ogcp.js
+++ b/ogcp/static/js/ogcp.js
@@ -104,6 +104,26 @@ function updateScopeState() {
}, Interval);
}
+function updatePillStatus(state, pill) {
+ const pillCls = ['badge', 'badge-pill', 'badge-info',
+ 'badge-danger', 'badge-success', 'badge-warning',
+ 'badge-wol', 'badge-light'];
+ pill.classList.remove(...pillCls);
+ let newPillCls = [];
+ if (state === 'OPG') {
+ newPillCls.push('badge', 'badge-pill', 'badge-warning');
+ } else if (state === 'BSY') {
+ newPillCls.push('badge', 'badge-pill', 'badge-danger');
+ } else if (state === 'VDI') {
+ newPillCls.push('badge', 'badge-pill', 'badge-success');
+ } else if (state === 'WOL_SENT') {
+ newPillCls.push('badge', 'badge-pill', 'badge-wol');
+ } else {
+ newPillCls.push('badge', 'badge-pill', 'badge-light');
+ }
+ pill.classList.add(...newPillCls);
+}
+
function updateScopes(scopes) {
scopes.forEach((scope) => {
if (scope.state) {
@@ -125,6 +145,11 @@ function updateScopes(scopes) {
newIconCls.push('far');
}
iconEl.classList.add(...newIconCls);
+
+ const pillScopeId = `pill-${scopeId}`;
+ const pillEl = document.querySelector(`#${pillScopeId}`);
+ if (pillEl)
+ updatePillStatus(scope.state, pillEl);
}
if (scope.scope) {
// This is a level so we should update all childs