diff --git a/webui/assets/main.js b/webui/assets/main.js index 3bc7f0cce..2adec2148 100644 --- a/webui/assets/main.js +++ b/webui/assets/main.js @@ -186,6 +186,11 @@ function setNav(e) { interface_el = document.getElementById('interface-' + name) interface_el.classList.add("interface-active") + // hack hack + if(name == "cluster") { + update_cluster_status() + } + // toggle svgs // show all inactive images inactive_images = document.getElementsByClassName("nav-image") @@ -216,6 +221,18 @@ function setNav(e) { } +function update_cluster_status() { + var xhr = new XMLHttpRequest(); + xhr.open('GET', '/status') + status_node = document.getElementById('status') + time_node = document.getElementById('status-time') + xhr.onload = function() { + status_formatted = JSON.stringify(JSON.parse(xhr.responseText), null, 4) + status_node.innerHTML = status_formatted + } + xhr.send(null) +} + const input = document.getElementById('query') const output = document.getElementById('outputs') const button = document.getElementById('query-btn') diff --git a/webui/assets/style.css b/webui/assets/style.css index 15d50a6f8..689fc919f 100644 --- a/webui/assets/style.css +++ b/webui/assets/style.css @@ -150,7 +150,8 @@ em{ margin-bottom: 30px; } .query, -.output-container{ +.output-container, +.status-container{ width: 75%; } @@ -206,7 +207,8 @@ em{ .result-input, .result-output, -.result-error{ +.result-error, +.status{ border-radius: 2px; background-color: #fafafa; border: solid 1.5px #e4eff4; @@ -231,6 +233,9 @@ em{ color: #fa3035; } +.status{ + white-space: pre; +} .raw{ height: 253px; @@ -238,3 +243,10 @@ em{ align-items: center; justify-content: center; } + + +.string { color: green; } +.number { color: darkorange; } +.boolean { color: blue; } +.null { color: magenta; } +.key { color: red; } \ No newline at end of file diff --git a/webui/index.html b/webui/index.html index 25ed7e055..931bf8f17 100644 --- a/webui/index.html +++ b/webui/index.html @@ -60,7 +60,15 @@
- cluster stats! +
+

Status

+        + +
+ +
+
+