{% extends "templates/main.html" %}

{% block body %}
<script>launch_game_on_init = true;</script>
<p class="alert">Alert content goes here</p>
<main class="card-container">
  <div class="timer game-element">
    <span class="time">60</span>
  </div>
  <div class="card game-element">
    <p class="team"></p>
    <h2 class="keyword">application</h2>
    <ul>
      {% set i = 0 %}
      {% for word in ['use', 'utilization', 'exercise', 'employment', 'request'] %}
      <li class="unmentionable unmentionable-{{ i }}">
        <span class="content">
          <span class="taboo-bar"></span>
          <span class="word">{{ word }}</span>
        </span>
      </li>
      {% set i = i + 1 %}
      {% endfor %}
    </ul>
    <div class="incorrect action" onclick="game.getRound().incorrect();">
      <p><span class="icon icon-incorrect">
        <span class="taboo-bar"></span>
        X</span></p>
    </div>
    <div class="pass action">
      <p><span class="icon icon-pass" onclick="game.getRound().pass();">
        <span class="taboo-bar"></span>
        ?</span></p>
    </div>
    <div class="correct action">
      <p><span class="icon icon-correct" onclick="game.getRound().correct();">
        <span class="taboo-bar"></span>
        O</span></p>
    </div>
  </div>
  <div class="card intermission-element">
    <h2 class="keyword">Round Complete</h2>
    <div class="copy">
      <p>
        Team 1 : <span class="points-team1"></span><br />
        Team 2 : <span class="points-team2"></span><br />
        <span onclick="game.nextRound();" class="intermission-start button"></span>
        <span onclick="game.getRound().resume();" class="intermission-resume button">Resume</span>
      </p>
    </div>
  </div>
</main>
{% endblock %}