|
|
| (11 versions intermédiaires par le même utilisateur non affichées) |
| Ligne 1 : |
Ligne 1 : |
| /* ── Bandeau Discord ───────────────────────────────────────── */
| |
| ( function () {
| |
| 'use strict';
| |
|
| |
|
| var STORAGE_KEY = 'vtDiscordBannerDismissed';
| |
| var DISCORD_URL = 'https://discord.gg/DxFnyyR';
| |
| var GUILD_ID = 'VOTRE_GUILD_ID'; // ← Remplacer par l'ID numérique du serveur
| |
|
| |
| // Ne pas afficher si déjà fermé
| |
| if ( localStorage.getItem( STORAGE_KEY ) === '1' ) { return; }
| |
|
| |
| // Icône Discord SVG
| |
| var iconSVG = '<svg viewBox="0 0 24 24" fill="#7dff9c" xmlns="http://www.w3.org/2000/svg" style="width:22px;height:22px;flex-shrink:0;display:block">'
| |
| + '<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.className = 'vt-discord-banner';
| |
| banner.setAttribute( 'role', 'complementary' );
| |
| banner.setAttribute( 'aria-label', 'Invitation Discord' );
| |
|
| |
| banner.innerHTML =
| |
| '<span class="vt-banner-icon-block">'
| |
| + iconSVG
| |
| + '<span class="vt-banner-members" aria-live="polite" style="display:none">'
| |
| + '<span id="vt-discord-count"></span> en ligne'
| |
| + '</span>'
| |
| + '</span>'
| |
| + '<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>'
| |
| + '<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
| |
| 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 = '';
| |
| } );
| |
| } );
| |
|
| |
| // 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 );
| |
| } );
| |
|
| |
| // Compteur membres en ligne — Discord Widget API
| |
| // Prérequis : Paramètres serveur → Engagement → Widget du serveur → activer
| |
| if ( GUILD_ID !== 'VOTRE_GUILD_ID' ) {
| |
| fetch( 'https://discord.com/api/guilds/' + GUILD_ID + '/widget.json' )
| |
| .then( function ( r ) { return r.ok ? r.json() : null; } )
| |
| .then( function ( data ) {
| |
| if ( !data || !data.presence_count ) { return; }
| |
| var countEl = document.getElementById( 'vt-discord-count' );
| |
| var membersEl = banner.querySelector( '.vt-banner-members' );
| |
| if ( countEl && membersEl ) {
| |
| countEl.textContent = data.presence_count;
| |
| membersEl.style.display = '';
| |
| }
| |
| } )
| |
| .catch( function () {} );
| |
| }
| |
|
| |
| }() );
| |
|
| |
| /* 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' );
| |
| }
| |
| } )();
| |