Created
January 19, 2021 17:57
-
-
Save krisrice/b35a30e116784f5b9781e06c120d7831 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/hack-font@3/build/web/hack-subset.css"> | |
| <script> | |
| var refreshInteval; | |
| function poolListing(){ | |
| // populate the list of pools | |
| fetch('http://localhost:8080/ords/_/instance-api/stable/database-pools-cache/', | |
| { headers: {'Authorization': 'Basic ' + btoa('klriceDBA:oracle')} } | |
| ) | |
| .then(response => response.text()) | |
| .then((response) => { | |
| items = JSON.parse(response).items; | |
| var pools = document.getElementById("pools"); | |
| for( item in items) { | |
| pool = document.createElement("option") | |
| pool.text =items[item].id | |
| pool.value =items[item].links[0].href; | |
| pools.add(pool); | |
| } | |
| }); | |
| // | |
| // if change in pool cancel interval | |
| if ( refreshInteval ) {clearInterval(refreshInteval); } | |
| // update stats every 250ms | |
| refreshInteval = setInterval(reloadData, 250); | |
| // | |
| } | |
| function reloadData(){ | |
| // Get the pool data based on the select list of pools | |
| fetch( document.getElementById('pools').selectedOptions[0].value, | |
| { headers: {'Authorization': 'Basic ' + btoa('klriceDBA:oracle')} }) | |
| .then(response => response.text()) | |
| .then((response) => {plot(JSON.parse(response))}); | |
| } | |
| function updateTable(data){ | |
| Object.keys(data.statistics).forEach(function(key) { | |
| var value = data.statistics[key]; | |
| var old = document.getElementById(key + "_value").innerHTML; | |
| // Mark up changes to be obvious | |
| if ( value != old ) { | |
| document.getElementById(key + "_value").innerHTML = value; | |
| document.getElementById(key + "_value").style.color ="red"; | |
| document.getElementById(key + "_value").style.fontSize ="xx-large"; | |
| } else { | |
| document.getElementById(key + "_value").innerHTML = value ; | |
| document.getElementById(key + "_value").style.color ="black"; | |
| document.getElementById(key + "_value").style.fontSize ="initial"; | |
| } | |
| }); | |
| } | |
| function plot(data){ | |
| if ( ! document.getElementById('stats') ) { | |
| // Make the new Table | |
| txt = "<table id='stats' border='0'>"; | |
| Object.keys(data.statistics).forEach(function(key) { | |
| var value = data.statistics[key]; | |
| txt += "<tr><td style='font-size:xx-large;' id='" + key + "'>" + key + "</td><td id='"+key+"_value' style='font-family:Hack;'>" + value+ "</td></tr>"; | |
| }); | |
| txt += "</table>"; | |
| document.getElementById("poolinfo").innerHTML = txt; | |
| } else { | |
| // Update the values | |
| updateTable(data); | |
| } | |
| } | |
| poolListing(); | |
| </script> | |
| </head> | |
| <body> | |
| <div style='font-family:Hack;font-size:xx-large;'>Choose a Pool to monitor:<select style='font-family:Hack;font-size:xx-large;' name="pools" id="pools" onchange="pickAPool()"></select></div> | |
| <div id="poolinfo"></div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment