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);
|
wrapper.appendChild(pre);
|
||||||
|
|
||||||
const btn = el("button", { class: "copy-code-btn", title: "Copier le code" }, [document.createTextNode("Copier")]);
|
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();
|
e.stopPropagation();
|
||||||
const code = pre.querySelector("code")?.textContent || pre.textContent;
|
const code = pre.querySelector("code")?.textContent || pre.textContent;
|
||||||
try {
|
const copied = copyToClipboard(code);
|
||||||
await navigator.clipboard.writeText(code);
|
if (copied) {
|
||||||
btn.textContent = "✓ Copié";
|
btn.textContent = "✓ Copié";
|
||||||
btn.classList.add("copied");
|
btn.classList.add("copied");
|
||||||
if (typeof showToast === "function") showToast("Code copié dans le presse-papiers", "success");
|
if (typeof showToast === "function") showToast("Code copié dans le presse-papiers", "success");
|
||||||
setTimeout(() => { btn.textContent = "Copier"; btn.classList.remove("copied"); }, 2000);
|
setTimeout(() => { btn.textContent = "Copier"; btn.classList.remove("copied"); }, 2000);
|
||||||
} catch {
|
} else {
|
||||||
if (typeof showToast === "function") showToast("Erreur lors de la copie", "error");
|
if (typeof showToast === "function") showToast("Erreur lors de la copie", "error");
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|||||||
+17
-2
@@ -913,11 +913,26 @@ const RightSidebarManager = {
|
|||||||
btn.addEventListener('click', function(e) {
|
btn.addEventListener('click', function(e) {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
var code = (pre.querySelector('code') || pre).textContent;
|
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.textContent = '✓ Copié';
|
||||||
btn.classList.add('copied');
|
btn.classList.add('copied');
|
||||||
setTimeout(function() { btn.textContent = 'Copier'; btn.classList.remove('copied'); }, 2000);
|
setTimeout(function() { btn.textContent = 'Copier'; btn.classList.remove('copied'); }, 2000);
|
||||||
}).catch(function() {});
|
}
|
||||||
});
|
});
|
||||||
wrapper.appendChild(btn);
|
wrapper.appendChild(btn);
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user