Sucukdeluxe
4630c8c467
Resolve floating drops through Electron native paths, expand folders recursively, correlate terminal outcomes by job ID until final queue persistence succeeds, and keep current queue badges, telemetry, cancellation behavior, and copy-link wording synchronized.
101 lines
2.6 KiB
HTML
101 lines
2.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<style>
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
html, body {
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
background: transparent;
|
|
-webkit-app-region: drag;
|
|
user-select: none;
|
|
}
|
|
.target {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border: 1px dashed rgba(186, 208, 252, 0.62);
|
|
border-radius: 8px;
|
|
background: rgba(35, 35, 35, 0.94);
|
|
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025);
|
|
transition: border-color 0.15s, background-color 0.15s, transform 0.15s;
|
|
}
|
|
.target.drag-over {
|
|
border-color: #bad0fc;
|
|
background: rgba(51, 52, 54, 0.98);
|
|
transform: scale(0.98);
|
|
}
|
|
.icon {
|
|
width: 54px;
|
|
height: 54px;
|
|
display: grid;
|
|
place-items: center;
|
|
border-radius: 8px;
|
|
background: #2b2b2b;
|
|
color: #bad0fc;
|
|
-webkit-app-region: no-drag;
|
|
}
|
|
.icon svg {
|
|
width: 30px;
|
|
height: 30px;
|
|
fill: none;
|
|
stroke: currentColor;
|
|
stroke-width: 1.65;
|
|
stroke-linecap: round;
|
|
stroke-linejoin: round;
|
|
}
|
|
@media (prefers-reduced-motion: reduce) {
|
|
.target {
|
|
transition: none;
|
|
}
|
|
.target.drag-over {
|
|
transform: none;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="target" id="target">
|
|
<div class="icon" aria-hidden="true">
|
|
<svg viewBox="0 0 24 24"><path d="M12 16V4m0 0L7.5 8.5M12 4l4.5 4.5M5 14v4.5A1.5 1.5 0 0 0 6.5 20h11a1.5 1.5 0 0 0 1.5-1.5V14"/></svg>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
const target = document.getElementById('target');
|
|
target.addEventListener('dragover', (e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
target.classList.add('drag-over');
|
|
});
|
|
target.addEventListener('dragleave', (e) => {
|
|
e.preventDefault();
|
|
target.classList.remove('drag-over');
|
|
});
|
|
target.addEventListener('drop', (e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
target.classList.remove('drag-over');
|
|
const files = [];
|
|
for (const file of e.dataTransfer.files) {
|
|
let filePath = '';
|
|
try { filePath = window.dropTargetApi.getPathForFile(file); } catch {}
|
|
if (!filePath) continue;
|
|
files.push({
|
|
path: filePath,
|
|
name: file.name || '',
|
|
size: Number.isFinite(file.size) ? file.size : 0,
|
|
isDirectory: file.type === '' && file.size === 0
|
|
});
|
|
}
|
|
if (files.length > 0) {
|
|
window.dropTargetApi.sendFiles(files);
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|