Aller au contenu

Utilisateur:Silvallié/common.js

De Poképédia

Note : après avoir publié 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 appuyez sur Ctrl + F5 ou Ctrl + R (⌘ + R sur un Mac).
  • Google Chrome : appuyez sur Ctrl + Maj + R (⌘ + Shift + R sur un Mac).
  •  Edge : maintenez la touche Ctrl en cliquant sur le bouton Actualiser ou pressez Ctrl + F5.
function updateCaption() {
  if (window.matchMedia('(max-width: 639px)').matches) {
    $('table.ficheinfo').each(function () {
      const $table = $(this);

      // Masquer les lignes dès le départ
      $table.find('tbody > tr:nth-child(n+3)').hide();

      // Si pas encore de caption avec le bouton, on l'ajoute
      if ($table.find('caption').length === 0) {
        const captionHTML = `
          <caption style="caption-side: bottom;">
            <button type="button" name="ficheinfo" value="afficher" title="[– d'infos]" onclick="afficherMasquerInfobox(this)" style="display: inline-block;">[+ d'infos]</button>
          </caption>
        `;
        $table.append(captionHTML);
      } else {
        // Si le bouton existe déjà (ex. au redimensionnement), on le remet en état masqué
        const $button = $table.find('caption button[name="ficheinfo"]');
        $button.html("[+ d'infos]");
      }
    });
  } else {
    // Si l'écran est plus large, tout est réinitialisé
    $('table.ficheinfo').each(function () {
      const $table = $(this);
      $table.find('caption').remove();
      $table.find('tbody > tr').show();
    });
  }
}

// Fonction de toggle : afficher / masquer les lignes après la 2e
function afficherMasquerInfobox(btn) {
  const $button = $(btn);
  const $table = $button.closest('table.ficheinfo');
  const $rows = $table.find('tbody > tr:nth-child(n+3)');

  if ($rows.is(':visible')) {
    $rows.hide();
    $button.html("[+ d'infos]");
  } else {
    $rows.show();
    $button.html("[- d'infos]");
  }
}

$(document).ready(updateCaption);
$(window).on('resize', updateCaption);