diff --git a/js/clipboard.js b/js/clipboard.js index 78acd923..89ef6363 100644 --- a/js/clipboard.js +++ b/js/clipboard.js @@ -10,8 +10,9 @@ import "./clipboard.css"; * Setup trigger element to toggle showing / hiding clipboard element * @param {Element} trigger * @param {Element} clipboard + * @param {Array[Element]} closers array of elements that should close the clipboard if clicked */ -export function setupClipboard(trigger, clipboard, parent) { +export function setupClipboard(trigger, clipboard, closers) { const arrowElement = clipboard.querySelector(".arrow"); function updatePosition() { computePosition(trigger, clipboard, { @@ -61,10 +62,12 @@ export function setupClipboard(trigger, clipboard, parent) { e.stopPropagation(); }); // Close the popup if we click outside it - parent.addEventListener("click", () => { - if (trigger.classList.contains("active")) { - clipboard.classList.toggle("hidden"); - trigger.classList.toggle("active"); - } + closers.forEach((el) => { + el.addEventListener("click", () => { + if (trigger.classList.contains("active")) { + clipboard.classList.toggle("hidden"); + trigger.classList.toggle("active"); + } + }); }); } diff --git a/js/index.js b/js/index.js index c11a3e34..f5d32a5c 100644 --- a/js/index.js +++ b/js/index.js @@ -85,7 +85,7 @@ function connect() { setupClipboard( document.getElementById("clipboard-button"), document.getElementById("clipboard-container"), - document.body, + [document.body, document.getElementsByTagName("canvas")[0]], ); }