let timeout = null;

/**
 * Ensemble d'actions effectuées au chargement de la page
 */
document.addEventListener("DOMContentLoaded", () => {
  const $navbarBurgers = Array.prototype.slice.call(
      document.querySelectorAll(".navbar-burger"),
      0
  );
  if ($navbarBurgers.length > 0) {
      $navbarBurgers.forEach((el) => {
          el.addEventListener("click", () => {
              const { target } = el.dataset;
              const $target = document.getElementById(target);

              el.classList.toggle("is-active");
              $target.classList.toggle("is-active");
          });
      });
  }
});

/**
 * Fonction permettant d'afficher un message dans un toastr
 * @param {String} message
 */
function showToastr(message, success = false) {
    const x = document.getElementById("toastr");
    if (message) {
        x.getElementsByTagName("SPAN")[0].innerHTML = message;
    }

    if (timeout) {
        clearTimeout(timeout);
        x.classList.remove("show");
    }

    x.classList.remove("success");
    x.classList.remove("error");
    if (success) {
        x.classList.add("success");
    } else {
        x.classList.add("error");
    }

    x.classList.add("show");

    timeout = setTimeout(() => {
        x.classList.remove("show");
    }, 3000);
}

/**
 * Fonction permettant de masquer le toastr
 */
function hideToastr() {
    const x = document.getElementById("toastr");

    x.className = x.className.replace("show", "");
    x.getElementsByTagName("SPAN")[0].innerHTML = "";
}

const copyToClipboard = (itemId, message) => {
    const copyText = document.getElementById(itemId);
    copyText.select();
    document.execCommand('copy');

    showToastr(message, true);
};

const showModale = () => {
    const x = document.getElementsByClassName("modal");

    x[0].classList.add('is-visible');
}

const closeModale = () => {
    const x = document.getElementsByClassName("modal");

    x[0].classList.remove('is-visible');
}

const displayImageDetails = (itemId) => {
    const x = document.getElementById(`item-${itemId}`);
    const original = x.dataset.original;
    const medium = x.dataset.medium;
    const small = x.dataset.small;

    document.getElementById('previewImage').src = small;
    document.getElementById('originalFile-0').value = original;
    document.getElementById('mediumFile-0').value = medium;
    document.getElementById('smallFile-0').value = small;
    document.getElementById('bbcode-0').value = `[url=${original}][img]${medium}[/img][/url]`;

    showModale();
}