2013-05-02 12:34:20 +00:00
|
|
|
<div id="graph_wrapper{{id}}" class="graph_wrapper">
|
2013-04-26 14:50:59 +00:00
|
|
|
<form action="/api/query_range" method="GET" class="query_form">
|
|
|
|
<div class="grouping_box">
|
2013-04-02 17:14:02 +00:00
|
|
|
<div class="head">
|
|
|
|
<div class="expr">
|
2014-12-25 15:27:35 +00:00
|
|
|
<span class="input-group">
|
|
|
|
<input placeholder="Expression" type="text" name="expr" id="expr{{id}}" value="{{expr}}" class="form-control">
|
|
|
|
<span class="input-group-btn">
|
|
|
|
<input class="btn btn-primary" type="submit" value="Execute" name="submit">
|
|
|
|
</span>
|
2013-07-13 17:30:51 +00:00
|
|
|
</span>
|
2013-04-02 17:14:02 +00:00
|
|
|
<select name="insert_metric">
|
2013-07-13 17:30:51 +00:00
|
|
|
<option value="">- Insert Metric at Cursor -</option>
|
2013-04-02 17:14:02 +00:00
|
|
|
</select>
|
|
|
|
</div>
|
2013-04-26 14:50:59 +00:00
|
|
|
</div>
|
|
|
|
<div class="eval_stats"></div>
|
|
|
|
<img src="/static/img/ajax-loader.gif" class="spinner" alt="ajax_spinner">
|
2014-10-30 15:18:05 +00:00
|
|
|
<div class="error alert alert-error hide"></div>
|
2013-04-26 14:50:59 +00:00
|
|
|
</div>
|
2013-07-13 17:30:51 +00:00
|
|
|
<!--
|
|
|
|
TODO: Convert this to Bootstrap navbar. This requires Javascript
|
|
|
|
refresh.
|
|
|
|
-->
|
2013-04-26 14:50:59 +00:00
|
|
|
<div class="grouping_box tabs">
|
|
|
|
<ul>
|
|
|
|
<li><a href="#graph{{id}}">Graph</a></li>
|
2013-07-13 17:30:51 +00:00
|
|
|
<li><a href="#console{{id}}">Tabular</a></li>
|
2013-04-26 14:50:59 +00:00
|
|
|
</ul>
|
|
|
|
<div id="graph{{id}}" class="graph_container reload">
|
2015-01-09 12:55:01 +00:00
|
|
|
<div>
|
2013-07-13 17:30:51 +00:00
|
|
|
<!-- Extracted to force grouped inputs. -->
|
2013-04-17 14:49:21 +00:00
|
|
|
<input type="hidden" name="range">
|
2015-01-09 12:55:01 +00:00
|
|
|
<div class="prometheus_input_group">
|
2013-07-13 17:30:51 +00:00
|
|
|
<button
|
2015-01-09 12:55:01 +00:00
|
|
|
class="btn btn-default pull-left"
|
|
|
|
type="button"
|
|
|
|
name="dec_range"
|
|
|
|
title="Shrink the time range.">
|
|
|
|
<i class="glyphicon glyphicon-minus"></i>
|
2013-07-13 17:30:51 +00:00
|
|
|
</button>
|
|
|
|
<input
|
2015-01-09 12:55:01 +00:00
|
|
|
class="pull-left input"
|
|
|
|
id="range_input{{id}}"
|
|
|
|
title="Time range of graph"
|
|
|
|
type="text"
|
|
|
|
name="range_input"
|
|
|
|
size="3"
|
|
|
|
value="{{range_input}}">
|
2013-07-13 17:30:51 +00:00
|
|
|
<button
|
2015-01-09 12:55:01 +00:00
|
|
|
class="btn btn-default pull-left"
|
2013-07-13 17:30:51 +00:00
|
|
|
type="button"
|
|
|
|
name="inc_range"
|
|
|
|
title="Grow the time range.">
|
2015-01-09 12:55:01 +00:00
|
|
|
<i class="glyphicon glyphicon-plus"></i>
|
2013-07-13 17:30:51 +00:00
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<!-- Extracted to force grouped inputs. -->
|
2013-04-02 17:14:02 +00:00
|
|
|
<input type="hidden" name="end">
|
2015-01-09 12:55:01 +00:00
|
|
|
<div class="prometheus_input_group">
|
2013-07-13 17:30:51 +00:00
|
|
|
|
|
|
|
<button
|
2015-01-09 12:55:01 +00:00
|
|
|
class="btn btn-default pull-left"
|
2013-07-13 17:30:51 +00:00
|
|
|
type="button"
|
|
|
|
name="dec_end"
|
|
|
|
title="Rewind the end time.">
|
2015-01-09 12:55:01 +00:00
|
|
|
<i class="glyphicon glyphicon-backward"></i>
|
2013-07-13 17:30:51 +00:00
|
|
|
</button>
|
|
|
|
|
|
|
|
<input
|
2015-01-09 12:55:01 +00:00
|
|
|
class="pull-left date_input input"
|
2013-07-13 17:30:51 +00:00
|
|
|
id="end{{id}}"
|
|
|
|
title="End time of graph"
|
|
|
|
placeholder="Until"
|
|
|
|
type="text"
|
|
|
|
name="end_input"
|
|
|
|
size="16"
|
|
|
|
value="{{end}}">
|
2013-05-02 12:34:20 +00:00
|
|
|
|
2013-07-13 17:30:51 +00:00
|
|
|
<button
|
2015-01-09 12:55:01 +00:00
|
|
|
class="btn btn-default pull-left"
|
2013-07-13 17:30:51 +00:00
|
|
|
type="button"
|
|
|
|
name="inc_end"
|
|
|
|
title="Advance the end time.">
|
2015-01-09 12:55:01 +00:00
|
|
|
<i class="glyphicon glyphicon-forward"></i>
|
2013-07-13 17:30:51 +00:00
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
2015-01-09 12:55:01 +00:00
|
|
|
<div class="prometheus_input_group">
|
|
|
|
<input class="input" title="Resolution in seconds" placeholder="Res. (s)" type="text" name="step_input" id="step_input{{id}}" value="{{step_input}}" size="6">
|
|
|
|
<input type="hidden" name="step">
|
|
|
|
</div>
|
2013-07-13 17:30:51 +00:00
|
|
|
|
2015-01-09 12:55:01 +00:00
|
|
|
<div class="prometheus_input_group checkbox">
|
|
|
|
<label class="prometheus_checkbox">
|
|
|
|
<input type="checkbox" name="stacked" {{stacked_checked}}>
|
|
|
|
Stacked
|
|
|
|
</label>
|
|
|
|
</div>
|
2013-04-02 17:14:02 +00:00
|
|
|
</div>
|
2013-04-26 14:50:59 +00:00
|
|
|
|
2013-07-01 12:47:43 +00:00
|
|
|
<div class="graph_area">
|
|
|
|
<div class="y_axis"></div>
|
|
|
|
<div class="graph"></div>
|
|
|
|
</div>
|
2013-04-26 14:50:59 +00:00
|
|
|
<div class="legend"></div>
|
2013-04-02 17:14:02 +00:00
|
|
|
</div>
|
2013-07-24 00:18:49 +00:00
|
|
|
<div id="console{{id}}" class="console reload">
|
|
|
|
<table class="table table-condensed table-bordered table-hover console_table">
|
|
|
|
<thead>
|
|
|
|
<th>Element</th>
|
|
|
|
<th>Value</th>
|
|
|
|
</thead>
|
|
|
|
<tbody>
|
|
|
|
</tbody>
|
|
|
|
</table>
|
|
|
|
</div>
|
2013-04-02 17:14:02 +00:00
|
|
|
</div>
|
2013-04-26 14:50:59 +00:00
|
|
|
</form>
|
2013-04-02 17:14:02 +00:00
|
|
|
</div>
|