{% extends 'baseTemplate.html' %} {% block title %}{{counter.trigramme}}{% endblock %} {% block content %}
<div class="text-center">
  <h1>
      <a class="counter-link" href="{% url 'home' %}"><b>{{counter.trigramme}}</b> <small>{{ counter.name }}</small></a>
  </h1>
</div>
<div class="container-fluid">
  <div class="row">
    <div class="col-md-3">
      <div class="panel panel-primary">
        <div class="panel-heading">
            <form action="{% url 'like' %}" method="POST" name="like{{counter.id}}">
                {% csrf_token %}
                <input type="hidden" name="liker" value="{{myCounter.id}}" />
                <input type="hidden" name="reset" value="{{counter.lastReset.id}}" <h2 class="panel-title" />
                <input type="hidden" name="redirect" value="{% url 'counter' id_counter=counter.id %}" />
                <a class="counter-link" href="{% url 'counter' id_counter=counter.id %}">
                    <b>{{ counter.trigramme }}</b> <small>{{ counter.name }}</small>
                </a>
                {% if not counter.lastReset.noSeum %}
                {% if counter.alreadyLiked %}
                <span class="pull-right badge" {% if counter.likeCount > 0 %} data-toggle="tooltip" data-placement="top" title="{{ counter.likersString }}" {% endif %}>
                    <span class="glyphicon glyphicon-ok"></span>&emsp;{{ counter.likeCount }}
                </span>
                {% elif counter.id == myCounter.id or counter.lastReset.who.id == myCounter.id %}
                <span class="pull-right badge" {% if counter.likeCount > 0 %} data-toggle="tooltip" data-placement="top" title="{{ counter.likersString }}" {% endif %}>
                    <span class="glyphicon glyphicon-heart"></span>&emsp;{{ counter.likeCount }}
                </span>
                {% else %}
                <a class="pull-right badge" onclick="document.forms['like{{counter.id}}'].submit();">
                    <span class="glyphicon glyphicon-heart"></span>&emsp;{{ counter.likeCount }}
                </a>
                {% endif %}
                {% endif %}
                </h2>
            </form>
        </div>
        <div class="seum-counter panel-body" style="height:125px" id="container{{counter.id}}">
          {% if counter.lastReset.noSeum %}
          <strong>N'a pas encore eu le seum.</strong>
          <br> {% else %}
          <strong>
          {% if counter.lastReset.selfSeum %}
              A eu le seum il y a {{ counter.lastReset.formatted_delta }}.
          {% else %}
              {{ counter.lastReset.who.trigramme }} lui a foutu le seum il y a {{ counter.lastReset.formatted_delta }}.
          {% endif %}
          </strong>
          <br> {% endif %}

          <p>{{ counter.lastReset.reason }}</p>
          <div class="text-center">
            <button id="button{{counter.id}}" class="btn btn-default btn-danger" type="button" onclick="revealSeumForm({{counter.id}})">Remettre à zéro</button>
          </div>
          <form style="display:none" id="counter{{counter.id}}" action="{% url 'reset-counter' %}" method="post">
            {% csrf_token %}
            <div class="form-group">
              <label for="reason">Motif du seum :</label>
              <input id="reason{{counter.id}}" type="text" class="form-control" name="reason"></input>
            </div>
            <input type="hidden" name="counter" value="{{counter.id}}"></input>
            <input type="hidden" name="redirect" value="{% url 'counter' id_counter=counter.id %}"></input>
            <input type="hidden" name="who" value="{{myCounter.id}}"></input>
            <div class="text-center">
              <button type="submit" class="btn btn-default btn-success">Foutre le seum</button>
            </div>
          </form>
        </div>
      </div>
    </div>
    <div class="col-md-9">
      <div class="panel panel-info">
        <div class="panel-heading">
          <h2 class="panel-title">Timeline du seum</h2>
        </div>
        <div class="graphs timeline panel-body">
            {% if counter.lastReset.noSeum %}
            <div class="text-center text-muted">
                <p>Pas encore de timeline du seum...</p>
            </div>
            {% else %}
            {{chart.as_html}}
            {% endif %}
        </div>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-sm-12">
      <div class="panel panel-default">
        <div class="panel-heading">
          <h2 class="panel-title">Historique du seum <small class="badge pull-right">{{seumFrequency}}/seum</small></h2>
        </div>
        <div class="panel-body" style="max-height:350px;overflow:auto;">
          <table class="table table-striped">
            <thead>
              <tr>
                <th>Date</th>
                <th>Motif</th>
                <th>Fouteur de seum</th>
                <th>Nombre de likes</th>
              </tr>
            </thead>
            <tbody>
              {% for reset in resets %}
              <tr>
                <td><b>{{ reset.date }}</b></td>
                <td>{{ reset.reason }}</td>
                <td>
                {% if not reset.selfSeum %}
                    {{ reset.who.trigramme }}
                {% endif %}
                </td>
                <td>{{ reset.likeCount }}</td>
              </tr>
              {% endfor %}
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="row">
  <div class="text-center">
    <a class="btn btn-success" href="{% url 'home' %}">Retour à la liste des compteurs</a>
  </div>
</div>
</div>
{% endblock %}