MediaWiki:Script/Modal.js

Note : après avoir enregistré vos modifications, il se peut que vous deviez forcer le rechargement complet du cache de votre navigateur pour voir les changements.

• Firefox / Safari : maintenez la touche Maj (Shift) en cliquant sur le bouton Actualiser ou pressez Ctrl-F5 ou Ctrl-R (⌘-R sur un Mac)
• Google Chrome : appuyez sur Ctrl-Maj-R (⌘-Shift-R sur un Mac)
• Internet Explorer : maintenez la touche Ctrl en cliquant sur le bouton Actualiser ou pressez Ctrl-F5
• Opera : allez dans Menu → Settings (Opera → Préférences sur un Mac) et ensuite à Confidentialité & sécurité → Effacer les données d’exploration → Images et fichiers en cache.

const modalButtons = document.querySelectorAll(".modal-trigger");

modalButtons.forEach((button) => {
  const modalName = button.dataset.modal;
  let modalContainer;

  if (modalName) {
    modalContainer = document.querySelector(
      `.modal[data-modal="${modalName}"]`
    );
  } else {
    modalContainer = button.nextElementSibling;
  }

  const closeButton = modalContainer.querySelector(".close-button");
  const autoClose = modalContainer.dataset.autoClose === "1";

  button.addEventListener("click", openModal);
  closeButton.addEventListener("click", closeModal);

  if (autoClose) {
    modalContainer.addEventListener("change", closeModal);
  }

  function openModal() {
    button.classList.add("tabber-active");
    modalContainer.classList.add("show-modal");
    window.addEventListener("click", handleClickOutside);
    window.addEventListener("keydown", handleEscape);
  }

  function closeModal() {
    button.classList.remove("tabber-active");
    modalContainer.classList.remove("show-modal");
    window.removeEventListener("click", handleClickOutside);
    window.removeEventListener("keydown", handleEscape);
  }

  function handleClickOutside(event) {
    if (event.target === modalContainer) {
      closeModal();
    }
  }

  function handleEscape(event) {
    if (event.key === "Escape") {
      closeModal();
    }
  }
});