DragonWind/chrome-extension/content.js

74 lines
2.7 KiB
JavaScript
Raw Permalink Normal View History

"use strict";
/**
* Dragon Wind Content Script
* Injects drag-and-drop overlay on any page, sends files to background for upload.
*/
(function() {
if (window.__dragonWindLoaded) return;
window.__dragonWindLoaded = true;
let overlay = null;
document.addEventListener('dragover', (e) => {
if (e.dataTransfer?.types?.includes('Files')) {
e.preventDefault();
showOverlay();
}
});
document.addEventListener('dragleave', (e) => {
if (!e.relatedTarget || e.relatedTarget === document.body) hideOverlay();
});
document.addEventListener('drop', (e) => {
hideOverlay();
// Only intercept if dropping on the overlay itself
if (e.target !== overlay) return;
e.preventDefault();
const files = Array.from(e.dataTransfer.files);
if (!files.length) return;
chrome.runtime.sendMessage({ type: 'PAGE_DROP', files: files.map(f => ({ name: f.name, size: f.size })) });
showToast(`Dragon Wind: ${files.length} file${files.length>1?'s':''} ready — open extension to upload`);
});
function showOverlay() {
if (overlay) return;
overlay = document.createElement('div');
overlay.style.cssText = `
position:fixed;inset:0;z-index:2147483647;
background:rgba(6,8,14,.85);
display:flex;align-items:center;justify-content:center;
backdrop-filter:blur(4px);
pointer-events:none;
`;
overlay.innerHTML = `
<div style="text-align:center;color:#e4e8f1;font-family:system-ui,sans-serif">
<div style="font-size:3rem;margin-bottom:1rem">🌪</div>
<div style="font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#e05c1a,#ff7d3b);-webkit-background-clip:text;-webkit-text-fill-color:transparent">Dragon Wind</div>
<div style="font-size:1rem;color:#7a85a0;margin-top:.5rem">Drop files to queue for upload</div>
</div>
`;
document.body.appendChild(overlay);
}
function hideOverlay() {
if (overlay) { overlay.remove(); overlay = null; }
}
function showToast(msg) {
const t = document.createElement('div');
t.style.cssText = `
position:fixed;bottom:24px;right:24px;z-index:2147483647;
background:#10141f;border:1px solid #e05c1a;border-radius:10px;
color:#e4e8f1;padding:12px 18px;font-family:system-ui,sans-serif;font-size:14px;
font-weight:600;box-shadow:0 4px 20px rgba(0,0,0,.4);
opacity:0;transform:translateY(8px);transition:all .25s;
`;
t.textContent = msg;
document.body.appendChild(t);
requestAnimationFrame(() => { t.style.opacity = '1'; t.style.transform = 'translateY(0)'; });
setTimeout(() => { t.style.opacity = '0'; setTimeout(() => t.remove(), 300); }, 4000);
}
})();