225725d951
Note that I'm not familiar with JavaScript, so I'm not sure whether the changes to monitor.js are correct, please review carefully.
140 lines
4.2 KiB
HTML
140 lines
4.2 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<link rel="stylesheet" href="bootstrap-1.4.0.min.css">
|
|
<link rel="stylesheet" href="monitor.css" type="text/css">
|
|
<script type="text/javascript" src="jquery-1.6.4.min.js"></script>
|
|
<script type="text/javascript" src="jquery.flot.min.js"></script>
|
|
<title>ekg-0.3.0.1</title>
|
|
</head>
|
|
<body>
|
|
<div class="topbar">
|
|
<div class="topbar-inner">
|
|
<div class="container-fluid">
|
|
<span class="brand">ekg-0.3.0.1</span>
|
|
<p class="pull-right">Polling interval:
|
|
<select id="updateInterval" class="small">
|
|
<option value="100">100 ms</option>
|
|
<option value="200">200 ms</option>
|
|
<option value="500">500 ms</option>
|
|
<option value="1000" selected="selected">1 s</option>
|
|
<option value="2000">2 s</option>
|
|
<option value="5000">5 s</option>
|
|
<option value="10000">10 s</option>
|
|
</select> |
|
|
<button id="pause-ui" class="btn">Pause UI</button>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="alert-message error fade in hide" data-alert="alert">
|
|
<p>Lost connection to server.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div id="plots" class="span11">
|
|
<div id="current-bytes-used-plot" class="plot-container">
|
|
<h3>Current residency</h3>
|
|
<div class="plot"></div>
|
|
</div>
|
|
|
|
<div id="allocation-rate-plot" class="plot-container">
|
|
<h3>Allocation rate</h3>
|
|
<div class="plot"></div>
|
|
</div>
|
|
|
|
<div id="productivity-plot" class="plot-container">
|
|
<h3>Productivity</h3>
|
|
<div class="plot"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="span5">
|
|
<h3>GC and memory statistics</h3>
|
|
<table class="condensed-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Statistic</th>
|
|
<th>Value</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>Maximum residency</td>
|
|
<td id="max-bytes-used" class="span3 value">0</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Current residency</td>
|
|
<td id="current-bytes-used" class="value">0</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Maximum slop</td>
|
|
<td id="max-bytes-slop" class="value">0</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Current slop</td>
|
|
<td id="current-bytes-slop" class="value">0</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Productivity (wall clock time)</td>
|
|
<td id="productivity-wall" class="value">0</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Productivity (cpu time)</td>
|
|
<td id="productivity-cpu" class="value">0</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Allocation rate</td>
|
|
<td id="allocation-rate" class="value">0</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<h3>Counters</h3>
|
|
<table id="counter-table" class="condensed-table">
|
|
<thead>
|
|
<tr>
|
|
<th class="span4">Name</th>
|
|
<th class="span1">Value</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
</tbody>
|
|
</table>
|
|
|
|
<h3>Gauges</h3>
|
|
<table id="gauge-table" class="condensed-table">
|
|
<thead>
|
|
<tr>
|
|
<th class="span4">Name</th>
|
|
<th class="span1">Value</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
</tbody>
|
|
</table>
|
|
|
|
<h3>Labels</h3>
|
|
<table id="label-table" class="condensed-table">
|
|
<thead>
|
|
<tr>
|
|
<th class="span4">Name</th>
|
|
<th class="span1">Value</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
</tbody>
|
|
</table>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="text/javascript" src="monitor.js"></script>
|
|
</body>
|
|
</html>
|