{% extends "base.html" %}

{% block title_page %}Lookup your distances{%endblock%}

{% block content %}
<div class="container-fluid">

  <div data-bind="visible: plotAvailable" class="col-md-12 cflow_graph" style="text-align:center;display:none">
    <div class="graph_content" id="placeholder"></div>
  </div>

  <div class="form-group">
    <label>Longitude</label>
    <input type="text" class="form-control" data-bind="value: lon">
  </div>

  <div class="form-group">
    <label>Latitude</label>
    <input type="text" class="form-control" data-bind="value: lat">
  </div>

  <div class="form-group">
    <label>CZMax</label>
    <input type="text" class="form-control" data-bind="value: czmax">
  </div>


  <button type="submit" data-bind="click: update_sky" class="btn btn-default">Update plot</button>

  <button data-bind="click: reset_selection" class="btn btn-default">Reset zoom</button>

</div>
{% endblock %}

{%block barescript %}
<script type="text/javascript" src="js/los.bundle.js" charset="utf-8"></script>
{%endblock%}