Use background jobs for file transfers

server/public/app.js

@@ -209,7 +209,7 @@ function renderExplorer(body, win) {
   dropZone.addEventListener('dragover', (event) => {
     if (hasDropPayload(event)) {
       event.preventDefault();
-      setDropEffect(event, event.altKey ? 'copy' : 'move');
+      setDropEffect(event, 'copy');
       data.dragOver = true;
       dropZone.classList.add('drag-over');
     }
@@ -235,6 +235,9 @@ function renderExplorer(body, win) {
 
   for (const row of body.querySelectorAll('.file-row')) {
     const entry = data.entries.find((item) => item.path === row.dataset.path);
+    row.draggable = false;
+    row.addEventListener('dragstart', (event) => event.preventDefault());
+    row.addEventListener('selectstart', (event) => event.preventDefault());
     row.addEventListener('pointerdown', (event) => {
       lockExplorerScroll(win, body);
       startItemPointerDrag(event, win, entry);
@@ -334,18 +337,6 @@ async function handleDrop(event, win, targetPath) {
     return;
   }
 
-  const internalPath = state.draggedEntry?.path || '';
-  if (internalPath) {
-    const name = internalPath.split('/').filter(Boolean).at(-1);
-    const destination = `${targetPath.replace(/\/$/, '')}/${name}`;
-    if (internalPath === destination) {
-      throw new Error('Quelle und Ziel sind identisch.');
-    }
-    await createJob(event.altKey ? 'copy' : 'move', internalPath, destination);
-    await reloadExplorerWindows([win.id, state.draggedEntry?.sourceWindowId].filter(Boolean));
-    return;
-  }
-
   const files = getDroppedFiles(event);
   if (files.length) {
     const form = new FormData();
@@ -378,7 +369,8 @@ async function reloadExplorerWindows(ids) {
 }
 
 function hasDropPayload(event) {
-  return Boolean(state.draggedEntry || getDroppedFiles(event).length);
+  const types = [...(event.dataTransfer?.types || [])];
+  return types.includes('Files') || getDroppedFiles(event).length > 0;
 }
 
 function showError(error) {
@@ -546,7 +538,7 @@ function updatePropertiesWindows() {
 }
 
 function startItemPointerDrag(event, win, entry) {
-  if (event.button !== 0) return;
+  if (event.button !== 0 || !entry) return;
 
   state.pointerDrag = {
     sourceWindowId: win.id,
@@ -563,6 +555,9 @@ function startItemPointerDrag(event, win, entry) {
   const up = (upEvent) => finishItemPointerDrag(upEvent, move, up);
   document.addEventListener('pointermove', move);
   document.addEventListener('pointerup', up, { once: true });
+  try {
+    event.currentTarget.setPointerCapture(event.pointerId);
+  } catch {}
 }
 
 function updateItemPointerDrag(event) {
@@ -597,6 +592,7 @@ async function finishItemPointerDrag(event, move, up) {
     return;
   }
 
+  event.preventDefault();
   state.suppressClickPath = drag.path;
   const target = findPointerDropTarget(event);
   if (!target) {

server/public/styles.css

@@ -225,6 +225,7 @@
   background: var(--surface);
   color: var(--text);
   cursor: default;
+  -webkit-user-drag: none;
 }
 
 .u-nav .file-row:hover,
@@ -242,6 +243,7 @@
 }
 
 .u-nav .file-row {
+  -webkit-user-drag: none;
   user-select: none;
 }
 
@@ -257,7 +259,9 @@
   align-items: center;
   display: flex;
   gap: 8px;
+  -webkit-user-drag: none;
   min-width: 150px;
+  user-select: none;
 }
 
 .u-nav .badge {
@@ -269,6 +273,8 @@
   justify-content: center;
   min-width: 58px;
   padding: 2px 8px;
+  -webkit-user-drag: none;
+  user-select: none;
 }
 
 .u-nav .context-menu {