{% extends "base.html" %}

{% block title %}My IoT{% endblock %}

{% block head %}
  <meta http-equiv="refresh" content="30">
{% endblock %}

{% block body %}
  <div class="hero is-info">
    <div class="hero-head">
      {{ NavbarPartialTemplate::new("index")|safe }}
    </div>
    <div class="hero-body">
      <div class="container">
        <h1 class="title is-4">Sensors</h1>
        <h2 class="subtitle is-6">{{ actuals.len() }} locations</h2>
      </div>
    </div>
  </div>

  <div class="columns">
    <div class="column is-2 is-hidden-touch">
      <div class="section">
        <div class="container">
          <aside class="menu">
            <p class="menu-label">Locations</p>
            <ul class="menu-list">
              {% for (location, _) in actuals %}
                <li><a href="#{{ location|slug }}">{{ location }}</a></li>
              {% endfor %}
            </ul>
          </aside>
        </div>
      </div>
    </div>

    <div class="column is-10">
      {% for (location, group) in actuals %}
        <div class="section" id="{{ location|slug }}">
          <div class="container">
            <h2 class="title is-5">{{ location }}</h2>
            <div class="columns is-multiline">
              {% for (sensor, reading) in group %}
                {{ SensorTilePartialTemplate::new(sensor, reading)|safe }}
              {% endfor %}
            </div>
          </div>
        </div>
      {% endfor %}
    </div>
  </div>
{% endblock %}