diff options
| author | Javier Sánchez Parra <jsanchez@soleta.eu> | 2022-02-25 13:17:11 +0100 |
|---|---|---|
| committer | Javier Sánchez Parra <jsanchez@soleta.eu> | 2022-02-25 13:53:47 +0100 |
| commit | ed967216aa51e59c50d30a38737a677b9706c28e (patch) | |
| tree | 1ecad4f0ef1cc4e281781260181c96e93cff8f36 /ogcp | |
| parent | 500d92007f358db02f00689717bb802c4fd3df89 (diff) | |
Show client state on pills
Color pills to represent their state, like scopes tree.
Diffstat (limited to 'ogcp')
| -rw-r--r-- | ogcp/static/css/soleta.css | 4 | ||||
| -rw-r--r-- | ogcp/static/js/ogcp.js | 25 |
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 |