MediaWiki:Timeless.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é et sécurité → Effacer les données d’exploration → Images et fichiers en cache.

/* Tout JavaScript ici sera chargé pour les utilisateurs de l’habillage Timeless */

$(window).on("load", function() {
    console.log('JavaScript chargé');

    var themeButton = $('<button>Changer le thème</button>')
        .attr('id', 'themeButton')
        .attr('aria-pressed', 'false')
        .attr('aria-label', 'Changer le thème entre clair et sombre')
        .attr('role', 'button');

    $('#mw-content-text').prepend(themeButton);

    // Récupérer le thème sauvegardé dans localStorage
    var savedTheme = localStorage.getItem('theme');
    console.log('Thème sauvegardé:', savedTheme);

    if (savedTheme === 'dark') {
        $('body').addClass('dark-theme');
        themeButton.text('Passer au thème clair');
        themeButton.attr('aria-pressed', 'true');
    } else {
        $('body').removeClass('dark-theme');
        themeButton.text('Passer au thème sombre');
        themeButton.attr('aria-pressed', 'false');
    }

    themeButton.click(function() {
        var isDarkTheme = $(this).attr('aria-pressed') === 'true';
        console.log('État actuel du thème (isDarkTheme):', isDarkTheme);

        if (isDarkTheme) {
            // Si le thème sombre est activé, on passe au thème clair
            console.log('Passage au thème clair');
            $('body').removeClass('dark-theme');
            themeButton.text('Passer au thème sombre');
            themeButton.attr('aria-pressed', 'false');
            localStorage.setItem('theme', 'light');
        } else {
            // Si le thème clair est activé, on passe au thème sombre
            console.log('Passage au thème sombre');
            $('body').addClass('dark-theme');
            themeButton.text('Passer au thème clair');
            themeButton.attr('aria-pressed', 'true');
            localStorage.setItem('theme', 'dark');
        }

        // Afficher l'état du bouton après changement
        console.log('Thème après clic:', $(this).attr('aria-pressed'));
        console.log('Classe appliquée au body:', $('body').attr('class'));
    });
});