1 files changed, 80 insertions, 0 deletions
diff --git a/sflow-rt/app/browse-metrics/html/index.html b/sflow-rt/app/browse-metrics/html/index.html
new file mode 100644
index 0000000..bbb210a
--- /dev/null
+++ b/sflow-rt/app/browse-metrics/html/index.html
@@ -0,0 +1,80 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <link rel="icon" type="image/png" href="../../../inc/img/favicon.png">
+    <link rel="stylesheet" href="../../../inc/bootstrap.min.css">
+    <link rel="stylesheet" href="../../../inc/stripchart.css">
+    <script type="text/javascript" src="../../../inc/jquery.min.js"></script>
+    <script type="text/javascript" src="../../../inc/jquery.widget.js"></script>
+    <script type="text/javascript" src="../../../inc/jquery.stripchart.js"></script>
+    <script type="text/javascript" src="../../../inc/popper.min.js"></script>
+    <script type="text/javascript" src="../../../inc/bootstrap.min.js"></script>
+    <script type="text/javascript" src="js/app.js"></script>
+    <title>Metric Browser</title>
+  </head>
+  <body>
+    <nav class="navbar navbar-dark mb-3" style="background-color: #336;">
+      <a class="navbar-brand" href="#">
+        <img src="../../../inc/img/inmon.svg" height="30" class="d-inline-block align-top">
+        Metric Browser
+      </a>
+      <form class="form-inline">
+        <button id="clone" class="btn btn-outline-light" type="button">Clone</button>
+      </form>
+    </nav>
+    <main class="container" role="main">
+      <form>
+        <div class="form-row">
+        <div class="form-group col-md-4">
+          <label for="agent">Agent</label>
+          <select class="form-control" id="agent">
+          </select>
+        </div>
+        <div class="form-group col-md-4">
+          <label for="metric">Metric</label>
+          <select class="form-control" id="metric">
+          </select>
+        </div>
+        <div class="form-group col-md-2">
+          <label for="datasource">Datasource</label>
+          <select class="form-control" id="datasource">
+          </select>
+        </div>
+        <div class="form-group col-md-2">
+          <label for="aggregation">Statistic</label>
+          <select class="form-control" id="aggregation">
+             <option value="max">max</option>
+             <option value="min">min</option>
+             <option value="sum">sum</option>
+             <option value="avg">avg</option>
+             <option value="var">var</option>
+             <option value="sdev">sdev</option>
+             <option value="med">med</option>
+             <option value="q1">q1</option>
+             <option value="q2">q2</option>
+             <option value="q3">q3</option>
+             <option value="iqr">iqr</option>
+             <option value="any">any</option>
+          </select>
+        </div>
+        </div>
+      </form>
+      <table class="table table-striped table-bordered table-sm">
+        <tbody>
+          <tr><td class="text-right font-weight-bold" style="width: 50%">Value</td><td id="metric-value" style="width: 50%"></td></tr>
+          <tr><td class="text-right font-weight-bold" style="width: 50%">N</td><td id="metric-n" style="width: 50%"></td></tr>
+          <tr><td class="text-right font-weight-bold" style="width: 50%">Agent</td><td id="metric-agent" style="width: 50%"></td></tr>
+          <tr><td class="text-right font-weight-bold" style="wdith: 50%">Datasource</td><td id="metric-datasource" style="width: 50%"></td></tr>
+        </tbody>
+      </table>
+      <div id="chart" class="trend" style="height:300px"></div>
+    </main>
+    <footer class="footer page-footer border-top mt-3">
+       <div class="footer-copyright text-center py-2">
+         <small class="text-muted">Copyright &copy; 2015-<span class="year">2019</span> InMon Corp. ALL RIGHTS RESERVED</small>
+       </div>
+    </footer>
+  </body>
+</html>