{{ block title }}
    Page title
{{ endblock }}
{{ block content }}
    <div id="main">
        What is {{ number_1 }} + {{ number_2 }}? <br>
        <input id="result_input"> <br>
        <button type="button" onclick="check_result()">Submit Result</button>
    </div>
{{ endblock }}

{% block scripts %}
    <script>
        function check_result() {
            var entered_result = document.getElementById("result_input").value;
            var actual_result = {{ number_1|json }} + {{ number_2|json }};
            actual_result = parseFloat(actual_result);
            if (entered_result == actual_result){
                document.getElementById("main").innerHTML = "Your answer was correct";
            } else {
                document.getElementById("main").innerHTML = "Your answer was wrong";
            }
        }
    </script>
{% endblock %}