2013-01-15 02:30:55 -08:00
|
|
|
<!DOCTYPE html>
|
2013-01-17 14:46:43 -08:00
|
|
|
<html lang="en">
|
2013-01-15 02:30:55 -08:00
|
|
|
<head>
|
|
|
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
|
|
|
|
<title>Prometheus Expression Browser</title>
|
|
|
|
|
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
|
|
|
|
|
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.15/jquery-ui.min.js"></script>
|
2013-01-17 14:46:43 -08:00
|
|
|
<link type="text/css" rel="stylesheet" href="css/prometheus.css">
|
2013-02-12 04:15:40 -08:00
|
|
|
<link type="text/css" rel="stylesheet" href="css/graph.css">
|
2013-01-15 02:30:55 -08:00
|
|
|
|
2013-01-30 09:07:34 -08:00
|
|
|
<!-- copy all these CSSen/JSen to our own location -->
|
2013-01-15 02:30:55 -08:00
|
|
|
<link type="text/css" rel="stylesheet" href="http://code.shutterstock.com/rickshaw/rickshaw.min.css">
|
|
|
|
|
<script src="http://code.shutterstock.com/rickshaw/vendor/d3.min.js"></script>
|
|
|
|
|
<script src="http://code.shutterstock.com/rickshaw/vendor/d3.layout.min.js"></script>
|
|
|
|
|
<script src="http://code.shutterstock.com/rickshaw/rickshaw.min.js"></script>
|
|
|
|
|
|
2013-01-30 09:07:34 -08:00
|
|
|
<script src="vendor/js/handlebars.js"></script>
|
2013-01-17 14:46:43 -08:00
|
|
|
|
2013-01-24 04:55:32 -08:00
|
|
|
<script src="js/graph.js"></script>
|
2013-01-17 14:46:43 -08:00
|
|
|
|
2013-01-24 04:55:32 -08:00
|
|
|
<script id="graph_template" type="text/x-handlebars-template">
|
|
|
|
|
<div id="graph_wrapper{{id}}">
|
|
|
|
|
<div class="grouping_box">
|
|
|
|
|
<form action="/api/query_range" method="GET" class="query_form">
|
|
|
|
|
<label for="expr{{id}}">Expression:</label>
|
2013-02-06 08:08:05 -08:00
|
|
|
<input type="text" name="expr" id="expr{{id}}" size="80" value="{{expr}}">
|
|
|
|
|
<select name="insert_metric">
|
|
|
|
|
<option value="">- Insert Metric -</option>
|
|
|
|
|
</select>
|
|
|
|
|
|
|
|
|
|
<br>
|
2013-01-17 14:46:43 -08:00
|
|
|
|
2013-01-24 04:55:32 -08:00
|
|
|
<label for="range_input{{id}}">Range:</label>
|
|
|
|
|
<input type="button" value="-" name="dec_range">
|
|
|
|
|
<input type="text" name="range_input" id="range_input{{id}}" size="5" value="{{range_input}}">
|
|
|
|
|
<input type="hidden" name="range">
|
|
|
|
|
<input type="button" value="+" name="inc_range">
|
2013-01-17 14:46:43 -08:00
|
|
|
|
2013-01-24 04:55:32 -08:00
|
|
|
<label for="end{{id}}">End:</label>
|
|
|
|
|
<input type="button" value="<<" name="dec_end">
|
|
|
|
|
<input type="text" name="end" id="end{{id}}" value="{{end}}">
|
|
|
|
|
<input type="button" value=">>" name="inc_end">
|
2013-01-17 14:46:43 -08:00
|
|
|
|
2013-01-24 04:55:32 -08:00
|
|
|
<label for="step_input{{id}}">Resolution (s):</label>
|
|
|
|
|
<input type="text" name="step_input" id="step_input{{id}}" value="{{step_input}}" size="4">
|
|
|
|
|
<input type="hidden" name="step">
|
2013-01-17 14:46:43 -08:00
|
|
|
|
2013-01-24 04:55:32 -08:00
|
|
|
<input type="checkbox" name="stacked" id="stacked{{id}}" {{stacked_checked}}>
|
|
|
|
|
<label for="stacked{{id}}">Stacked</label>
|
2013-01-17 14:46:43 -08:00
|
|
|
|
2013-01-24 04:55:32 -08:00
|
|
|
<input type="submit" value="Graph" name="submit">
|
|
|
|
|
|
|
|
|
|
<img src="img/ajax-loader.gif" class="spinner" alt="ajax_spinner">
|
|
|
|
|
|
|
|
|
|
<div class="eval_stats"></div>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="grouping_box">
|
|
|
|
|
<div class="graph_container">
|
|
|
|
|
<div class="graph"></div>
|
|
|
|
|
<div class="legend"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2013-01-17 14:46:43 -08:00
|
|
|
</div>
|
2013-01-24 04:55:32 -08:00
|
|
|
</script>
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
|
<div id="graph_container">
|
2013-01-15 02:30:55 -08:00
|
|
|
</div>
|
2013-01-24 04:55:32 -08:00
|
|
|
<div><input type="button" value="Add Graph" id="add_graph"></div>
|
2013-01-15 02:30:55 -08:00
|
|
|
</body>
|
|
|
|
|
</html>
|
