{{ block title }}
Part 3
{{ endblock }}

{{ block content }}
<div class="container" style="width:80%">
    <p>
        <h6>Round: {{player.round_number}} </h6><br />



        {% if group_id == 1 %}
        <p>You are in a group of 6. You are from the <tag style="color:Red">RED </tag> group. All
            the Workers in your group are from the <tag style="color:Blue"> BLUE</tag>
            group.</p>
        
        {% elif group_id == 2 %}
        <p>You are in a group of 6. You are from the <tag style="color:Blue"> BLUE </tag> group. All
            the Workers in your group are from the <tag style="color:Red">RED </tag>
            group.</p>
        
        {% else %}
        <p>You are in a group of 6. You are from the <tag style="color:Red">RED</tag> group. All
            the Workers in your group are from the <tag style="color:Blue"> BLUE </tag>
            group.</p>

        {% endif %}

        <p>You can type your message below. You have 60 seconds to type your
    message. The Workers in your group will receive the message.

        <form action="">
            {{ form.supervisor_message}}

            <br>
            <div id="next-btn" align="right">{{next_button}}</div>
        </form>
        <p id="message_sent" style="color:green;" align="right"></p>
</div>

{% comment %} <script>
      let seconds = 60;
      let timerElement = document.getElementById("timer");

      function countdown() {
        timerElement.textContent = seconds;
        seconds--;

        if (seconds < 0) {
          clearInterval(countdownInterval);
          timerElement.textContent = "Time's up!";

        }
      }

      let countdownInterval = setInterval(countdown, 1000);
</script> {% endcomment %}
{{ endblock }}