125 lines
4.1 KiB
JavaScript
125 lines
4.1 KiB
JavaScript
// fileDragDrop.js
|
|
import { showToast } from './domUtils.js';
|
|
import { loadFileList } from './fileListView.js';
|
|
|
|
export function fileDragStartHandler(event) {
|
|
const row = event.currentTarget;
|
|
let fileNames = [];
|
|
|
|
const selectedCheckboxes = document.querySelectorAll("#fileList .file-checkbox:checked");
|
|
if (selectedCheckboxes.length > 1) {
|
|
selectedCheckboxes.forEach(chk => {
|
|
const parentRow = chk.closest("tr");
|
|
if (parentRow) {
|
|
const cell = parentRow.querySelector("td:nth-child(2)");
|
|
if (cell) {
|
|
let rawName = cell.textContent.trim();
|
|
const tagContainer = cell.querySelector(".tag-badges");
|
|
if (tagContainer) {
|
|
const tagText = tagContainer.innerText.trim();
|
|
if (rawName.endsWith(tagText)) {
|
|
rawName = rawName.slice(0, -tagText.length).trim();
|
|
}
|
|
}
|
|
fileNames.push(rawName);
|
|
}
|
|
}
|
|
});
|
|
} else {
|
|
const fileNameCell = row.querySelector("td:nth-child(2)");
|
|
if (fileNameCell) {
|
|
let rawName = fileNameCell.textContent.trim();
|
|
const tagContainer = fileNameCell.querySelector(".tag-badges");
|
|
if (tagContainer) {
|
|
const tagText = tagContainer.innerText.trim();
|
|
if (rawName.endsWith(tagText)) {
|
|
rawName = rawName.slice(0, -tagText.length).trim();
|
|
}
|
|
}
|
|
fileNames.push(rawName);
|
|
}
|
|
}
|
|
|
|
if (fileNames.length === 0) return;
|
|
|
|
const dragData = fileNames.length === 1
|
|
? { fileName: fileNames[0], sourceFolder: window.currentFolder || "root" }
|
|
: { files: fileNames, sourceFolder: window.currentFolder || "root" };
|
|
|
|
event.dataTransfer.setData("application/json", JSON.stringify(dragData));
|
|
|
|
let dragImage = document.createElement("div");
|
|
dragImage.style.display = "inline-flex";
|
|
dragImage.style.width = "auto";
|
|
dragImage.style.maxWidth = "fit-content";
|
|
dragImage.style.padding = "6px 10px";
|
|
dragImage.style.backgroundColor = "#333";
|
|
dragImage.style.color = "#fff";
|
|
dragImage.style.border = "1px solid #555";
|
|
dragImage.style.borderRadius = "4px";
|
|
dragImage.style.alignItems = "center";
|
|
dragImage.style.boxShadow = "2px 2px 6px rgba(0,0,0,0.3)";
|
|
const icon = document.createElement("span");
|
|
icon.className = "material-icons";
|
|
icon.textContent = "insert_drive_file";
|
|
icon.style.marginRight = "4px";
|
|
const label = document.createElement("span");
|
|
label.textContent = fileNames.length === 1 ? fileNames[0] : fileNames.length + " files";
|
|
dragImage.appendChild(icon);
|
|
dragImage.appendChild(label);
|
|
|
|
document.body.appendChild(dragImage);
|
|
event.dataTransfer.setDragImage(dragImage, 5, 5);
|
|
setTimeout(() => {
|
|
document.body.removeChild(dragImage);
|
|
}, 0);
|
|
}
|
|
|
|
export function folderDragOverHandler(event) {
|
|
event.preventDefault();
|
|
event.currentTarget.classList.add("drop-hover");
|
|
}
|
|
|
|
export function folderDragLeaveHandler(event) {
|
|
event.currentTarget.classList.remove("drop-hover");
|
|
}
|
|
|
|
export function folderDropHandler(event) {
|
|
event.preventDefault();
|
|
event.currentTarget.classList.remove("drop-hover");
|
|
const dropFolder = event.currentTarget.getAttribute("data-folder");
|
|
let dragData;
|
|
try {
|
|
dragData = JSON.parse(event.dataTransfer.getData("application/json"));
|
|
} catch (e) {
|
|
console.error("Invalid drag data");
|
|
return;
|
|
}
|
|
if (!dragData || !dragData.fileName) return;
|
|
fetch("/api/file/moveFiles.php", {
|
|
method: "POST",
|
|
credentials: "include",
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
"X-CSRF-Token": document.querySelector('meta[name="csrf-token"]').getAttribute("content")
|
|
},
|
|
body: JSON.stringify({
|
|
source: dragData.sourceFolder,
|
|
files: [dragData.fileName],
|
|
destination: dropFolder
|
|
})
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
showToast(`File "${dragData.fileName}" moved successfully to ${dropFolder}!`);
|
|
loadFileList(dragData.sourceFolder);
|
|
} else {
|
|
showToast("Error moving file: " + (data.error || "Unknown error"));
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error("Error moving file via drop:", error);
|
|
showToast("Error moving file.");
|
|
});
|
|
} |