{% extends "global/Page.html" %}

{% block title %}Task{% endblock %}
{% block content %}

  {#  player questions #}


<img id="image" src="{% static {{ player.grid }} %}"/>

<span id="letter">{{ player.letter }}</span>
    <br><br>
    <input type="text" id="inputbox" value=" "><br><br>

     <button onclick="submitValue()" type="button" id="my_submit" class="btn btn-primary">Submit</button>

{% endblock %}

{% block script %}
    <script>

        function submitValue() {
            let response = (document.getElementById("inputbox").value);
            document.getElementById('inputbox').value = "";
            window.location.reload();
            liveSend(response)
        }

        function liveRecv(data) {
            console.log(data)

            // update question text
            $('#letter').text(data['letter']);
            $('#image').attr('src', data['grid']);
        }
    </script>


{% endblock %}