function check(id) {
  let checkbox = $("#task-" + id);
  let uri = "/v1/undo";
  if (checkbox.prop("checked")) {
    uri = "/v1/do";
  }
  $.post(uri, {api_key: API_KEY, id: id}, function(data, status) {
    if (status == "success") {
      checkbox.prop("checked", data.task.done);
    } else {
      console.log(data); // NOTE TEMPORARY (need to handle errors better)
    }
  });
}

function new_task() {
  let input = $("#new-task-input");
  let template = $("#task-template").html();
  template = $(template);
  $.post("/v1/new", {api_key: API_KEY, content: input.val()}, function(data) {
    let input = $("input", template);
    input.prop("id", "task-" + data.task.id);
    // input.prop("onchange", "check('" + data.task.id + "')");
    input.change(function() {
      check(data.task.id);
    });
    input.next().replace(" " + data.task.content);
    $("#new-task").before(template);
  })
    .fail(function(request) {
      // TODO handle error
  });
  input.val("");
  return false; // prevent form submission
}

function new_api_key() {
  let template = $("#api-key-template").html();
  template = $(template);
  $.get("/v1/key/new", function(data) {
    $("code", template).text(data.api_key.key);
    $("#new-api-key").before(template);
  })
    .fail(function(request) {
      $("code", template)
        .css("background-color", "red")
        .css("color", "white")
        .text("ERROR: " + request.responseJSON.errors.join(" "));
      $("#new-api-key").before(template);
  });
}

function delete_item(e) {
  e = $(e);
  while (!e.is("li")) {
    e = e.parent();
  }
  // TODO here, grab content to delete by (for api_key), send delete request, hide element (delete on success, reappear with red on failure)
  e.remove();
}