(function () {
  "use strict";

  document.addEventListener("DOMContentLoaded", function () {
    var board = document.querySelector("[data-board]");
    if (!board) {
      return;
    }

    var filterMenu = document.querySelector(".board-filter-menu");
    if (filterMenu) {
      document.addEventListener("click", function (event) {
        if (filterMenu.open && !filterMenu.contains(event.target)) {
          filterMenu.open = false;
        }
      });
      document.addEventListener("keydown", function (event) {
        if (event.key === "Escape") {
          filterMenu.open = false;
        }
      });
    }

    var dragged = null;
    var csrf = board.dataset.csrf;

    board.querySelectorAll("[data-todo-toggle] input[type=checkbox]").forEach(function (checkbox) {
      checkbox.addEventListener("change", function () {
        checkbox.closest("form").submit();
      });
    });

    board.querySelectorAll("[data-task-id]").forEach(function (card) {
      card.addEventListener("dragstart", function (event) {
        if (event.target.closest("button, input, select, textarea, label, summary, a")) {
          event.preventDefault();
          return;
        }
        dragged = card;
        card.classList.add("dragging");
        event.dataTransfer.effectAllowed = "move";
        event.dataTransfer.setData("text/plain", card.dataset.taskId);
      });
      card.addEventListener("dragend", function () {
        card.classList.remove("dragging");
        board.querySelectorAll(".drag-over").forEach(function (zone) {
          zone.classList.remove("drag-over");
        });
        dragged = null;
      });
    });

    board.querySelectorAll("[data-drop-zone]").forEach(function (zone) {
      zone.addEventListener("dragover", function (event) {
        event.preventDefault();
        event.dataTransfer.dropEffect = "move";
        zone.classList.add("drag-over");
      });
      zone.addEventListener("dragleave", function (event) {
        if (!zone.contains(event.relatedTarget)) {
          zone.classList.remove("drag-over");
        }
      });
      zone.addEventListener("drop", function (event) {
        event.preventDefault();
        zone.classList.remove("drag-over");
        var taskID = event.dataTransfer.getData("text/plain");
        var status = zone.dataset.dropZone;
        if (!taskID || !dragged || dragged.closest("[data-board-column]").dataset.boardColumn === status) {
          return;
        }

        var body = new URLSearchParams({ csrf: csrf, status: status });
        dragged.classList.add("moving");
        fetch("/board/tasks/" + encodeURIComponent(taskID) + "/move", {
          method: "POST",
          headers: { "Content-Type": "application/x-www-form-urlencoded" },
          body: body.toString(),
          credentials: "same-origin"
        }).then(function (response) {
          if (!response.ok) {
            throw new Error("Could not move task");
          }
          window.location.assign("/board?flash=Task+moved");
        }).catch(function () {
          dragged.classList.remove("moving");
          window.alert("The task could not be moved. Please reload and try again.");
        });
      });
    });
  });
})();
