function update_board(f, o, s, score) {
    $("#first").text(f);
    $("#operation").text(o);
    $("#second").text(s);
    $("#score").text(score);
}

function new_problem() {
    $.get("/api/v0/problem/", function(d) {
        update_board(d["First"], d["Operation"], d["Second"], d["Score"]);
        $("#answer").val("");
    })
}

function deal_with_answer(e) {
    var data = {
        "first": $("#first").text(),
        "operation": $("#operation").text(),
        "second": $("#second").text(),
        "answer": $("#answer").val(),
    };
    $.post("/api/v0/attempt/", data, function(d) {
        $("#score").text(d["Score"]);
        if(d["Status"]) {
            $("body").removeClass("wrong");
            new_problem();
        }
        else {
            $("body").addClass("wrong");
            $("#answer").val("");
        }
        $("#answer").focus();
    });
}

$(function() {
    new_problem();
    $("#answer").keypress(function(e) {
        if (e.which == 13 || e.which == 32) {
            deal_with_answer(e);
        }
    });
});