First play with websockets

Signed-off-by: Emmy D'Anello <emmy.danello@animath.fr>

draw/templates/draw/index.html

@@ -1,5 +1,34 @@
 {% extends "base.html" %}
 
+{% load static %}
+
 {% block content %}
-Hello world!
+    <ul class="nav nav-tabs" id="tournaments-tab" role="tablist">
+        {% for tournament in tournaments %}
+            <li class="nav-item" role="presentation">
+                <button class="nav-link{% if forloop.first %} active{% endif %}"
+                        id="tab-{{ tournament.name|slugify }}" data-bs-toggle="tab"
+                        data-bs-target="#tab-{{ tournament.name|slugify }}-pane" type="button" role="tab"
+                        aria-controls="tab-{{ tournament.name|slugify }}-pane" aria-selected="true">
+                    {{ tournament.name }}
+                </button>
+            </li>
+        {% endfor %}
+    </ul>
+
+    <div class="tab-content" id="tab-content">
+    {% for tournament in tournaments %}
+        <div class="tab-pane fade{% if forloop.first %} show active{% endif %}"
+             id="tab-{{ tournament.name|slugify }}-pane" role="tabpanel"
+             aria-labelledby="tab-{{ tournament.name|slugify }}" tabindex="0">
+            {% include "draw/tournament_content.html" with tournament=tournament %}
+        </div>
+    {% endfor %}
+    </div>
+{% endblock %}
+
+{% block extrajavascript %}
+    {{ tournaments|json_script:'tournaments_list' }}
+
+    <script src="{% static 'draw.js' %}"></script>
 {% endblock %}

draw/templates/draw/tournament_content.html

@@ -0,0 +1,6 @@
+{{ tournament.name }}
+
+<!-- This is only a test -->
+<textarea id="chat-log-{{ tournament.id }}"></textarea>
+<input id="chat-message-{{ tournament.id }}-input">
+<input id="chat-message-{{ tournament.id }}-submit" type="submit">