« MediaWiki:Vaulttec.js » : différence entre les versions

Kims (discussion | contributions)
Page créée avec « ── Bandeau Discord ───────────────────────────────────────── : ( function () { 'use strict'; var STORAGE_KEY = 'vtDiscordBannerDismissed'; var DISCORD_URL = 'https://discord.gg/DxFnyyR'; var GUILD_ID = '181800470082355200'; // Ne pas afficher si déjà fermé if ( localStorage.getItem( STORAGE_KEY ) === '1' ) { return; } // Icône Discord SVG var icon... »
Balise : Recréé
 
Kims (discussion | contributions)
Aucun résumé des modifications
Ligne 10 : Ligne 10 :
   if ( localStorage.getItem( STORAGE_KEY ) === '1' ) { return; }
   if ( localStorage.getItem( STORAGE_KEY ) === '1' ) { return; }


   // Icône Discord SVG
   // Icône Discord SVG (officielle, monochrome)
   var iconSVG = '<svg class="vt-banner-icon" viewBox="0 0 24 24" fill="#7dff9c" xmlns="http://www.w3.org/2000/svg">'
   var iconSVG = '<svg class="vt-banner-icon" viewBox="0 0 24 24" fill="#7dff9c" xmlns="http://www.w3.org/2000/svg">'
     + '<path d="M20.317 4.492c-1.53-.69-3.17-1.2-4.885-1.49a.075.075 0 0 0-.079.036c-.21.369-.444.85-.608 1.23a18.566 18.566 0 0 0-5.487 0 12.36 12.36 0 0 0-.617-1.23A.077.077 0 0 0 8.562 3c-1.714.29-3.354.8-4.885 1.491a.07.07 0 0 0-.032.027C.533 9.093-.32 13.555.099 17.961a.08.08 0 0 0 .031.055 20.03 20.03 0 0 0 5.993 2.98.078.078 0 0 0 .084-.026 13.83 13.83 0 0 0 1.226-1.963.074.074 0 0 0-.041-.104 13.175 13.175 0 0 1-1.872-.878.075.075 0 0 1-.008-.125c.126-.093.252-.19.372-.287a.075.075 0 0 1 .078-.01c3.927 1.764 8.18 1.764 12.061 0a.075.075 0 0 1 .079.009c.12.098.245.195.372.288a.075.075 0 0 1-.006.125c-.598.344-1.22.635-1.873.877a.075.075 0 0 0-.041.105c.36.687.772 1.341 1.225 1.962a.077.077 0 0 0 .084.028 19.963 19.963 0 0 0 6.002-2.981.076.076 0 0 0 .032-.054c.5-5.094-.838-9.52-3.549-13.442a.06.06 0 0 0-.031-.028zM8.02 15.278c-1.182 0-2.157-1.069-2.157-2.38 0-1.312.956-2.38 2.157-2.38 1.21 0 2.176 1.077 2.157 2.38 0 1.312-.956 2.38-2.157 2.38zm7.975 0c-1.183 0-2.157-1.069-2.157-2.38 0-1.312.955-2.38 2.157-2.38 1.21 0 2.176 1.077 2.157 2.38 0 1.312-.946 2.38-2.157 2.38z"/>'
     + '<path d="M20.317 4.492c-1.53-.69-3.17-1.2-4.885-1.49a.075.075 0 0 0-.079.036c-.21.369-.444.85-.608 1.23a18.566 18.566 0 0 0-5.487 0 12.36 12.36 0 0 0-.617-1.23A.077.077 0 0 0 8.562 3c-1.714.29-3.354.8-4.885 1.491a.07.07 0 0 0-.032.027C.533 9.093-.32 13.555.099 17.961a.08.08 0 0 0 .031.055 20.03 20.03 0 0 0 5.993 2.98.078.078 0 0 0 .084-.026 13.83 13.83 0 0 0 1.226-1.963.074.074 0 0 0-.041-.104 13.175 13.175 0 0 1-1.872-.878.075.075 0 0 1-.008-.125c.126-.093.252-.19.372-.287a.075.075 0 0 1 .078-.01c3.927 1.764 8.18 1.764 12.061 0a.075.075 0 0 1 .079.009c.12.098.245.195.372.288a.075.075 0 0 1-.006.125c-.598.344-1.22.635-1.873.877a.075.075 0 0 0-.041.105c.36.687.772 1.341 1.225 1.962a.077.077 0 0 0 .084.028 19.963 19.963 0 0 0 6.002-2.981.076.076 0 0 0 .032-.054c.5-5.094-.838-9.52-3.549-13.442a.06.06 0 0 0-.031-.028zM8.02 15.278c-1.182 0-2.157-1.069-2.157-2.38 0-1.312.956-2.38 2.157-2.38 1.21 0 2.176 1.077 2.157 2.38 0 1.312-.956 2.38-2.157 2.38zm7.975 0c-1.183 0-2.157-1.069-2.157-2.38 0-1.312.955-2.38 2.157-2.38 1.21 0 2.176 1.077 2.157 2.38 0 1.312-.946 2.38-2.157 2.38z"/>'
Ligne 30 : Ligne 30 :
   document.body.appendChild( banner );
   document.body.appendChild( banner );


   // Animation d'entrée
   // Animation d'entrée (légère)
   requestAnimationFrame( function () {
   requestAnimationFrame( function () {
     banner.style.opacity = '0';
     banner.style.opacity = '0';

Version du 25 mai 2026 à 13:16

/* ── Bandeau Discord ───────────────────────────────────────── */
( function () {
  'use strict';

  var STORAGE_KEY = 'vtDiscordBannerDismissed';
  var DISCORD_URL  = 'https://discord.gg/DxFnyyR';
  var GUILD_ID     = '181800470082355200';

  // Ne pas afficher si déjà fermé
  if ( localStorage.getItem( STORAGE_KEY ) === '1' ) { return; }

  // Icône Discord SVG (officielle, monochrome)
  var iconSVG = '<svg class="vt-banner-icon" viewBox="0 0 24 24" fill="#7dff9c" xmlns="http://www.w3.org/2000/svg">'
    + '<path d="M20.317 4.492c-1.53-.69-3.17-1.2-4.885-1.49a.075.075 0 0 0-.079.036c-.21.369-.444.85-.608 1.23a18.566 18.566 0 0 0-5.487 0 12.36 12.36 0 0 0-.617-1.23A.077.077 0 0 0 8.562 3c-1.714.29-3.354.8-4.885 1.491a.07.07 0 0 0-.032.027C.533 9.093-.32 13.555.099 17.961a.08.08 0 0 0 .031.055 20.03 20.03 0 0 0 5.993 2.98.078.078 0 0 0 .084-.026 13.83 13.83 0 0 0 1.226-1.963.074.074 0 0 0-.041-.104 13.175 13.175 0 0 1-1.872-.878.075.075 0 0 1-.008-.125c.126-.093.252-.19.372-.287a.075.075 0 0 1 .078-.01c3.927 1.764 8.18 1.764 12.061 0a.075.075 0 0 1 .079.009c.12.098.245.195.372.288a.075.075 0 0 1-.006.125c-.598.344-1.22.635-1.873.877a.075.075 0 0 0-.041.105c.36.687.772 1.341 1.225 1.962a.077.077 0 0 0 .084.028 19.963 19.963 0 0 0 6.002-2.981.076.076 0 0 0 .032-.054c.5-5.094-.838-9.52-3.549-13.442a.06.06 0 0 0-.031-.028zM8.02 15.278c-1.182 0-2.157-1.069-2.157-2.38 0-1.312.956-2.38 2.157-2.38 1.21 0 2.176 1.077 2.157 2.38 0 1.312-.956 2.38-2.157 2.38zm7.975 0c-1.183 0-2.157-1.069-2.157-2.38 0-1.312.955-2.38 2.157-2.38 1.21 0 2.176 1.077 2.157 2.38 0 1.312-.946 2.38-2.157 2.38z"/>'
    + '</svg>';

  // Construction du bandeau
  var banner = document.createElement( 'div' );
  banner.id = 'vt-discord-banner';
  banner.innerHTML = iconSVG
    + '<span class="vt-banner-text">'
    +   '<strong>Communauté française</strong> — Rejoignez-nous sur Discord pour discuter, jouer, poser vos questions et contribuer au wiki !'
    + '</span>'
    + '<span class="vt-banner-members"><span id="vt-discord-count">—</span> connectés</span>'
    + '<a class="vt-banner-btn" href="' + DISCORD_URL + '" target="_blank" rel="noopener noreferrer">'
    +   '↗ Rejoindre'
    + '</a>'
    + '<button class="vt-banner-close" aria-label="Fermer">×</button>';

  document.body.appendChild( banner );

  // Animation d'entrée (légère)
  requestAnimationFrame( function () {
    banner.style.opacity = '0';
    banner.style.transform = 'translateY(100%)';
    requestAnimationFrame( function () {
      banner.style.transition = 'transform 0.35s ease, opacity 0.35s ease';
      banner.style.opacity = '';
      banner.style.transform = '';
    } );
  } );

  // Compteur connectés
  fetch( 'https://discord.com/api/guilds/' + GUILD_ID + '/widget.json' )
    .then( function ( r ) { return r.json(); } )
    .then( function ( data ) {
      var el = document.getElementById( 'vt-discord-count' );
      if ( el && data && data.presence_count !== undefined ) {
        el.textContent = data.presence_count.toLocaleString( 'fr-FR' );
      }
    } )
    .catch( function () {} );

  // Fermeture
  banner.querySelector( '.vt-banner-close' ).addEventListener( 'click', function () {
    banner.classList.add( 'vt-banner-hidden' );
    localStorage.setItem( STORAGE_KEY, '1' );
    setTimeout( function () { banner.remove(); }, 350 );
  } );

}() );

/* LCP — fetchpriority=high sur la première image de l'article */
( function () {
    var img = document.querySelector( '#mw-content-text .mw-file-element' );
    if ( img && !img.complete ) {
        img.setAttribute( 'fetchpriority', 'high' );
    }
} )();