{% extends "base.html" %}
{% load i18n static %}
{% load humanize %}
{% block head %}
  <script type="text/javascript" src="{{ STATIC_URL }}javascript/tippy.js"></script>
{% endblock %}

{% block nav %}
{% include "nav.html" with ls=ls season=season %}
{% endblock %}

{% block body %}
<div id="content-main">
  <div class="row">
    <div class="col-md-7">
      <h2>Neueste Nachrichten</h2>
      <p class="text-right">
        <a class="btn btn-default" href="/blog/1" role="button">zum Blog</a>
      </p>
      {% for post, avatar in posts %}
      <div class="panel panel-default">
        <div class="panel-heading">
          {{post.author.first_name}} schrieb {{post.created|naturaltime}}, 
          <a href="{{post.get_absolute_url}}">{{post.title}}</a>
        </div>
        <div class="panel-body">
          {% if avatar %}
              <img class="img-circle img-responsive pull-left blog" alt="Profile Pic" src="/media/{{avatar}}" /> 
          {% else %}
              <img class="img-circle img-responsive pull-left blog" alt="Profile Pic" src="/media/profiles/dummy.png" /> 
          {% endif %}
          {{post.content|safe}}
        </div>
      </div>
      {% endfor %}
    </div>
  </div>
  <div class="row">
    <div class="col-md-7">
      <h2>Deine Tipps</h2>
      <nav>
        <ul class="pager">
          <li data-toggle="tooltip" title="{% trans 'previous' %}" class="previous"><a href="/matchday/{{ ls }}/{{ season }}/{{ cur_md|add:"-1"|stringformat:"02i" }}"><span aria-hidden="true">&larr;</span></a></li>
          {{ cur_md }}. Spieltag
          <li data-toggle="tooltip" title="{% trans 'next' %}" class="next"><a href="/matchday/{{ ls }}/{{ season }}/{{ cur_md|add:"1"|stringformat:"02i" }}"><span aria-hidden="true">&rarr;</span></a></li>
        </ul>
      </nav>
      <form role="form" action="" method="post">{% csrf_token %}
        <div class="table-responsive">
          <table class="table table-hover table-condensed">
            <tr>
              <th>Anstoß</th>
              <th>Heim</th>
              <th>Gast</th>
              <th>Erg.></th>
              <th colspan="2">Tipp</th>
            </tr>
            {% for match in matches %}
              {% if match.started and not match.finished %}
                <tr class="danger">{% else %}<tr>{% endif %}
                <td>{{ match.matchDateTime }}</td> 
                <td><img src="{{ STATIC_URL}}{{ match.iconTeam1 }}" />
                  <span class="hidden-xs"> {{ match.nameTeam1 }}</span>
                  <span class="visible-xs"> {{ match.abbrTeam1 }}</span>
                </td>
                <td><img src="{{ STATIC_URL}}{{ match.iconTeam2 }}" />
                  <span class="hidden-xs"> {{ match.nameTeam2 }}</span>
                  <span class="visible-xs"> {{ match.abbrTeam2 }}</span>
                </td>
                <td>{{ match.matchResult }}</td>
                <td>{{ match.tippFormTeam1 }}</td><td>{{ match.tippFormTeam2 }}</td>
            </tr>
            {% endfor %}
          </table>
        </div>
        <button type="submit" class="btn btn-default btn-lg btn-block">
          <span class="glyphicon glyphicon-saved" aria-hidden="true"></span> Tipps abgeben
        </button>
      </form>
    </div>
  </div>
  <div class="row">
    <div class="col-md-7">
      <h2>Mitspieler</h2>
      <div class="table-responsive">
        <table class="table table-hover table-condensed">
          <tr>
            <th>Tipper</th>
            <th>Gesamt</th>
            {% for match in matches %}
            <th><img src="{{ STATIC_URL }}{{ match.iconTeam1 }}" /><br /><br />
                <img src="{{ STATIC_URL }}{{ match.iconTeam2 }}" /></th>
            {% endfor %}
            </tr>
            {% for mate in tipp_mates %}
            <tr>
              <td>{{ mate.mate }}</td>     
              <td>{{ mate.sum_score }}</td>     
              {% for tipp in mate.tipps %}
              <td>{{ tipp }}</td>
              {% endfor %}
              </tr>
             {% endfor %}
        </table>
      </div>
    </div>
  </div>
</div>
{% endblock %}