{% extends 'base.html' %}

{% block title %}{% if page %} - {{ page }}{% endif %}{% endblock %}

{% block nav %}
  {% if drones %}
    <select id="view-node" title="Node to View">
      <option value="" disabled selected hidden>Node</option>
      <option value="" {% if is_queen %}selected{% endif %}>&#9819; Queen</option>
      {% for drone_id, drone in drones.items() %}
        <option value="{{ drone_id }}" {% if drone_id == app_id %}selected{% endif %}>
          {{ drone["name"] }}
        </option>
      {% endfor %}
    </select>
  {% endif %}

  <div class="dropdown">
    <button id="session">
      <span class="material-icons-outlined" title="User Session">
        manage_accounts
      </span>
    </button>
    <div class="dropdown-options">
      {% if g.user %}
        <span>{{ g.user['username'] }}</span>
        <a href="{{ url_for('auth.logout') }}">Log Out</a>
      {% else %}
        <a href="{{ url_for('auth.login') }}">Log In</a>
      {% endif %}
    </div>
  </div>
{% endblock %}

{% block content %}
  <article>
    <section class="report">
      <div class="panel-header">
        <span class="header">Bee Report: <span id="report-slug">{{ report_slug }}</span></span>
        <nav>
          <div id="daterange">
            <span style="font-size:0.8em;color:#bdf0c9;">Created: </span>
            <input type="text" name="start" placeholder="Start Date"
                   value="{% if daterange.start %}{{ daterange.start }}{% endif %}">
            <span style="font-size:0.8em;color:#bdf0c9;">to</span>
            <input type="text" name="end" placeholder="End Date"
                   value="{% if daterange.end %}{{ daterange.end }}{% endif %}">
          </div>

          <span id="report-reload" class="material-icons-outlined" title="Reload Report">
            refresh
          </span>
        </nav>
      </div>
      <div class="panel">
        <div id="report-wrapper"></div>
      </div>
    </section>
  </article>
  {% include 'modals/status-info.html' %}
{% endblock %}

{% block scripts %}
  <!-- script src="https://cdn.jsdelivr.net/gh/google/code-prettify@master/loader/run_prettify.js"></script -->
  <script src="{{ url_for('static', filename='node_modules/rainbow-code/dist/rainbow.min.js') }}"></script>
  <script src="{{ url_for('static', filename='node_modules/vanillajs-datepicker/dist/js/datepicker-full.min.js') }}"></script>
  <script src="{{ url_for('static', filename='node_modules/gridjs/dist/gridjs.umd.js') }}"></script>

  <script type="module" src="{{ url_for('static', filename='report.js') }}"></script>
{% endblock %}