<html>

{% load static %}

<head>
    {% if tv %}

    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js">
    </script>
    <script>history.scrollRestoration = "manual"</script>
    {% else %}
    <script>history.scrollRestoration = "auto"</script>
    {% endif %}

    <link rel="stylesheet" href="{% static 'scores/style.css' %}">
        <title>Padel</title>
        {% if not tv %}
        <meta http-equiv="refresh" content="15"/>
        {% endif %}
</head>

<div class="wrapper">
    {% if tv %}
    <script>
        
        var iInterval = 4000;
        var iScrollInterval = 10000;
        var iFadeInterval = 500;
        var iScroll = $(document).height() - $(window).height();
        
        if (iScroll * 10 + 4000 < 15000) {
            iScrollInterval = 10000;
        } else {
            iScrollInterval = iScroll * 10;
        }
        
        var loop = function() {
            var iScroll = $(document).height() - $(window).height();
            if (iScroll * 10 + 4000 < 15000) {
                iScrollInterval = 10000;
            } else {
                iScrollInterval = iScroll * 10;
            }
            $("html, body").animate({
                scrollTop: iScroll
            }, {
                duration : iScrollInterval,
                easing : "linear",
                complete : function() {
                    setTimeout(function(){
                      $(window).scrollTop(0);
                      window.location.reload();
                }, iInterval);
                }
            });
        };
        setTimeout(loop, iInterval);
        </script>
    {% endif %}

  {% if tournament.club.header %}
  {% if tv %}
  <header class="scenter"><a href="/tv/club/{{ tournament.club.name }}/">{{ tournament.club.header }}</a></header>
{% else %}
  <header class="scenter"><a href="/club/{{ tournament.club.name }}/">{{ tournament.club.header }}</a></header>
{% endif %}
  {% endif %}

  <main class="page-body">
      {% autoescape off %}

    <div class="container">
        <div class="center">
          {% if tv %}
          <h1><a href="/tv/club/{{ tournament.club.name }}/tournoi/{{ tournament.id }}">{{ tournament.name }}</a></h1>
          {% else %}
          <h1><a href="/club/{{ tournament.club.name }}/tournoi/{{ tournament.id }}">{{ tournament.name }}</a></h1>
          {% endif %}
          
          <div>
                {% if tv %}
                <h3><a href="/tv/club/{{ tournament.club.name }}/tournoi/{{ tournament.id }}/classement">Classement</a> | <a href="/tv/club/{{ tournament.club.name }}/tournoi/{{ tournament.id }}/equipes">Équipes</a></h3>
                {% else %}
                <h3><a href="/club/{{ tournament.club.name }}/tournoi/{{ tournament.id }}/classement">Classement</a> | <a href="/club/{{ tournament.club.name }}/tournoi/{{ tournament.id }}/equipes">Équipes</a></h3>
                {% endif %}
            </div>
        </div>
        {% for match in brackets %}
        {% if match.isBracket %}
        <div class="match">
          <div style="width: 100%;">
              <div style="float: left;">
                  <h3>{{ match.title|default:"Match" }}</h3>
              </div>
              <div style="float: right;">
                  <h3><a href="/match/{{ match.id }}/">POULE #{{ match.poule|floatformat:0 }}</a><h3>
              </div>
          </div>
        {% if match.team3 %}

        <table>
          <tr><td class="teamname">{{ match.team1|linebreaksbr }}</td>
            {% if match.team1scorecolumn1 %}<td class="score">{{ match.team1scorecolumn1 }}</td>{% endif %}
            {% if match.team2scorecolumn1 %}<td class="score">{{ match.team2scorecolumn1 }}</td>{% endif %}
          </tr>
          <tr><td class="teamname">{{ match.team2|linebreaksbr }}</td>
            {% if match.team1scorecolumn2 %}<td class="score">{{ match.team1scorecolumn2 }}</td>{% endif %}
            {% if match.team2scorecolumn2 %}<td class="score">{{ match.team2scorecolumn2 }}</td>{% endif %}
          </tr>
          <tr><td class="teamname">{{ match.team3|linebreaksbr }}</td>
            {% if match.team1scorecolumn3 %}<td class="score">{{ match.team1scorecolumn3 }}</td>{% endif %}
            {% if match.team2scorecolumn3 %}<td class="score">{{ match.team2scorecolumn3 }}</td>{% endif %}
          </tr>
          <tr><td class="teamname">{{ match.team4|linebreaksbr }}</td>
            {% if match.team1scorecolumn4 %}<td class="score">{{ match.team1scorecolumn4 }}</td>{% endif %}
            {% if match.team2scorecolumn4 %}<td class="score">{{ match.team2scorecolumn4 }}</td>{% endif %}
          </tr>

          {% if match.team5 %}

          <tr><td class="teamname">{{ match.team5|linebreaksbr }}</td>
            {% if match.team1scorecolumn5 %}<td class="score">{{ match.team1scorecolumn5 }}</td>{% endif %}
            {% if match.team2scorecolumn5 %}<td class="score">{{ match.team2scorecolumn5 }}</td>{% endif %}
          </tr>
          {% endif %}

        </table>
        {% else %}

        <table>
          <tr>
            <td class="teamname">{{ match.team1|linebreaksbr }}</td>
            {% if match.team1scorecolumn1 %}<td class="score">{{ match.team1scorecolumn1 }}</td>{% endif %}
            {% if match.team1scorecolumn2 %}<td class="score">{{ match.team1scorecolumn2 }}</td>{% endif %}
            {% if match.team1scorecolumn3 %}<td class="score">{{ match.team1scorecolumn3 }}</td>{% endif %}
            {% if match.team1scorecolumn4 %}<td class="score">{{ match.team1scorecolumn4 }}</td>{% endif %}
            {% if match.team1scorecolumn5 %}<td class="score">{{ match.team1scorecolumn5 }}</td>{% endif %}
          </tr>
          <tr>
            <td class="teamname">{{ match.team2|linebreaksbr }}</td>
            {% if match.team2scorecolumn1 %}<td class="score">{{ match.team2scorecolumn1 }}</td>{% endif %}
            {% if match.team2scorecolumn2 %}<td class="score">{{ match.team2scorecolumn2 }}</td>{% endif %}
            {% if match.team2scorecolumn3 %}<td class="score">{{ match.team2scorecolumn3 }}</td>{% endif %}
            {% if match.team2scorecolumn4 %}<td class="score">{{ match.team2scorecolumn4 }}</td>{% endif %}
            {% if match.team2scorecolumn5 %}<td class="score">{{ match.team2scorecolumn5 }}</td>{% endif %}
          </tr>
        </table>

        {% endif %}

        <!-- <p id="demo"></p> -->
        {% if not match.isStatistic %}
        <p class="duration">
          <div class="small"> {{ match.durationPrefix }}</div>
          <div class="big">{{ match.duration }}</div>
        </p>
        {% endif %}

      </div>
      {% endif %}
      {% endfor %}

    </div>
    {% endautoescape %}
  </main>

  {% if club.footer %}
  <footer class="page-footer, center">{{ club.footer }}</footer>
  {% endif %}

</div>

</html>
