fix: HTTP fallback for clipboard — execCommand('copy') textarea method
- Added copyToClipboard() in utils.js with dual strategy:
- HTTPS: navigator.clipboard.writeText() (modern API)
- HTTP: textarea + execCommand('copy') (legacy fallback)
- viewer.js: uses copyToClipboard() instead of direct navigator.clipboard
- popout.html: same dual-strategy inline
- Fixed: 'Erreur lors de la copie' on HTTP contexts
This commit is contained in:
+31
-1
@@ -650,4 +650,34 @@ function initEditor() {
|
||||
);
|
||||
}
|
||||
|
||||
export { getFileIcon, safeCreateIcons, flushIcons, safeHighlight, escapeHtml, EXT_ICONS, openEditor, closeEditor, saveFile, deleteFile, waitForCodeMirror, initEditor };
|
||||
function safeHighlight(block) {
|
||||
try { hljs.highlightElement(block); } catch (e) { /* skip */ }
|
||||
}
|
||||
|
||||
/** Copy text to clipboard — works on both HTTP and HTTPS */
|
||||
function copyToClipboard(text) {
|
||||
// Try modern API first (HTTPS-only)
|
||||
if (navigator.clipboard && window.isSecureContext) {
|
||||
navigator.clipboard.writeText(text).catch(() => {});
|
||||
return true;
|
||||
}
|
||||
// Fallback for HTTP contexts
|
||||
const ta = document.createElement("textarea");
|
||||
ta.value = text;
|
||||
ta.style.position = "fixed";
|
||||
ta.style.left = "-9999px";
|
||||
ta.style.top = "-9999px";
|
||||
document.body.appendChild(ta);
|
||||
ta.focus();
|
||||
ta.select();
|
||||
try {
|
||||
document.execCommand("copy");
|
||||
return true;
|
||||
} catch (e) {
|
||||
return false;
|
||||
} finally {
|
||||
document.body.removeChild(ta);
|
||||
}
|
||||
}
|
||||
|
||||
export { getFileIcon, safeCreateIcons, flushIcons, safeHighlight, escapeHtml, EXT_ICONS, openEditor, closeEditor, saveFile, deleteFile, waitForCodeMirror, initEditor, copyToClipboard };
|
||||
|
||||
@@ -681,16 +681,16 @@ export function renderFile(data) {
|
||||
wrapper.appendChild(pre);
|
||||
|
||||
const btn = el("button", { class: "copy-code-btn", title: "Copier le code" }, [document.createTextNode("Copier")]);
|
||||
btn.addEventListener("click", async (e) => {
|
||||
btn.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
const code = pre.querySelector("code")?.textContent || pre.textContent;
|
||||
try {
|
||||
await navigator.clipboard.writeText(code);
|
||||
const copied = copyToClipboard(code);
|
||||
if (copied) {
|
||||
btn.textContent = "✓ Copié";
|
||||
btn.classList.add("copied");
|
||||
if (typeof showToast === "function") showToast("Code copié dans le presse-papiers", "success");
|
||||
setTimeout(() => { btn.textContent = "Copier"; btn.classList.remove("copied"); }, 2000);
|
||||
} catch {
|
||||
} else {
|
||||
if (typeof showToast === "function") showToast("Erreur lors de la copie", "error");
|
||||
}
|
||||
});
|
||||
|
||||
+17
-2
@@ -913,11 +913,26 @@ const RightSidebarManager = {
|
||||
btn.addEventListener('click', function(e) {
|
||||
e.stopPropagation();
|
||||
var code = (pre.querySelector('code') || pre).textContent;
|
||||
navigator.clipboard.writeText(code).then(function() {
|
||||
var ok = false;
|
||||
// Try modern API first (HTTPS)
|
||||
if (navigator.clipboard && window.isSecureContext) {
|
||||
navigator.clipboard.writeText(code).then(function() { ok = true; }).catch(function() {});
|
||||
} else {
|
||||
// Fallback for HTTP
|
||||
var ta = document.createElement('textarea');
|
||||
ta.value = code;
|
||||
ta.style.position = 'fixed';
|
||||
ta.style.left = '-9999px';
|
||||
document.body.appendChild(ta);
|
||||
ta.focus(); ta.select();
|
||||
try { document.execCommand('copy'); ok = true; } catch(er) {}
|
||||
document.body.removeChild(ta);
|
||||
}
|
||||
if (ok) {
|
||||
btn.textContent = '✓ Copié';
|
||||
btn.classList.add('copied');
|
||||
setTimeout(function() { btn.textContent = 'Copier'; btn.classList.remove('copied'); }, 2000);
|
||||
}).catch(function() {});
|
||||
}
|
||||
});
|
||||
wrapper.appendChild(btn);
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user