93 lines
3.1 KiB
JavaScript
93 lines
3.1 KiB
JavaScript
(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.");
|
|
});
|
|
});
|
|
});
|
|
});
|
|
})();
|