prometheus/web/static/js/graph_template.handlebar

        <div id="graph_wrapper{{id}}" class="graph_wrapper">
          <form action="/api/query_range" method="GET" class="query_form">
            <div class="grouping_box">
              <div class="head">
                <div class="expr">
                  <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>
                  </span>
                  <select name="insert_metric">
                      <option value="">- Insert Metric at Cursor -</option>
                  </select>
                </div>
              </div>
              <div class="eval_stats"></div>
              <img src="/static/img/ajax-loader.gif" class="spinner" alt="ajax_spinner">
              <div class="error alert alert-error hide"></div>
            </div>
            <!--
              TODO: Convert this to Bootstrap navbar.  This requires Javascript
                    refresh.
              -->
            <div class="grouping_box tabs">
              <ul>
                <li><a href="#graph{{id}}">Graph</a></li>
                <li><a href="#console{{id}}">Tabular</a></li>
              </ul>
              <div id="graph{{id}}" class="graph_container reload">
                <div class="config">
                  <label for="range_input{{id}}">Range:</label>
                  <!-- Extracted to force grouped inputs. -->
                  <input type="hidden" name="range">
                  <div class="input-prepend input-append">

                    <button
                        class="btn btn-mini"
                        type="button"
                        name="dec_range"
                        title="Shrink the time range.">
                      <i class="icon-minus"></i>
                    </button>

                    <input
                        class="input-mini"
                        id="range_input{{id}}"
                        title="Time range of graph"
                        type="text"
                        name="range_input"
                        size="3"
                        value="{{range_input}}">

                    <button
                        class="btn btn-mini"
                        type="button"
                        name="inc_range"
                        title="Grow the time range.">
                      <i class="icon-plus"></i>
                    </button>
                  </div>

                  <!-- Extracted to force grouped inputs. -->
                  <input type="hidden" name="end">
                  <div class="input-prepend input-append">

                    <button
                        class="btn btn-mini"
                        type="button"
                        name="dec_end"
                        title="Rewind the end time.">
                      <i class="icon-backward"></i>
                    </button>

                    <input
                        class="input-medium"
                        id="end{{id}}"
                        title="End time of graph"
                        placeholder="Until"
                        type="text"
                        name="end_input"
                        size="16"
                        value="{{end}}">

                    <button
                        class="btn btn-mini"
                        type="button"
                        name="inc_end"
                        title="Advance the end time.">
                      <i class="icon-forward"></i>
                    </button>
                  </div>


                  <input class="input-small" 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">

                  <label class="checkbox inline">
                    <input type="checkbox" name="stacked" {{stacked_checked}}>
                    Stacked
                  </label>
                </div>

                <div class="graph_area">
                  <div class="y_axis"></div>
                  <div class="graph"></div>
                </div>
                <div class="legend"></div>
              </div>
              <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>
            </div>
          </form>
        </div>