{% extends "base.html" %}
{% load kegweblib %}

{% block title %}System Stats | {{ block.super }}{% endblock %}
{% block pagetitle %}System Stats{% endblock %}

{% block content%}

<div class="row">

{% if not stats %}
  <div class="span8">
    <div class="alert alert-info">
      <h2>No Stats.. yet.</h2>
      <p>
        This place will be a lot more interesting once somebody has
        poured a drink.
      </p>
    </div>
  </div>

{% else %}
  <div class="span8">
    <ul class="nav nav-tabs" id="systemDetails">
      <li><a href="#1" data-toggle="tab">Summary</a></li>
      <li><a href="#2" data-toggle="tab">Largest Session</a></li>
    </ul>

    <div class="tab-content">
      <div class="tab-pane" id="1">
        {% include "kegweb/basic-badges.html" %}
        <table class="table table-condensed table-striped">
          <tbody>
            {% include "kegweb/basic-stats.html" %}
          </tbody>
        </table>
      </div>

      {% if largest_session %}
      <div class="tab-pane" id="2">
        {% with largest_session as session %}
          {% include "kegweb/keg-session.html" %}
        {% endwith %}
      </div>
      {% endif %}
    </div>
  </div>
{% endif %}

  <div class="span4">
    {% if stats %}
      <h2>Top Drinkers</h2>
      {% chart users_by_volume stats 280 220 %}<br/>
      {% with top_drinkers as ranked_drinkers %}
      {% include "kegweb/drinker-rank.html" %}
      {% endwith %}
    {% endif %}
  </div>

</div>

{% endblock %}

{% block kb-extrajs %}
<script type="text/javascript">
$(document).ready(function () {
  $('#systemDetails a:first').tab('show');
});
</script>
{% endblock %}
