hyper-set-reda/HyperSet/vues/js/Settings.js

/*var color = 'normal';
var nb = 0;

function changeColorMode() {
    let selectColor = document.getElementById('color-selector');
    selectColor.addEventListener('change', function() {
        var index = selectColor.selectedIndex;
        // Rapporter cette donnée au <p>
        if (index != null){
            nb= index;
        }

    })
   /* if(color !== selectColor.value){
        color = selectColor.value;
    }
    return nb;

}


console.log(nb);
/*var nb = 0;

let selectColor = document.getElementById('color-selector');

selectColor.addEventListener('change', function() {
    var index = selectColor.selectedIndex;
    // Rapporter cette donnée au <p>
    if (index != null){
        nb= index;
    }

})



 */

var popupSettings = document.getElementById('popupSettings');
var popupExplain = document.getElementById('popupExplain');

window.onclick = function(event) {
    if (event.target === popupSettings) {
        popupSettings.style.display = "none";
        saveSettings();
    }
    if (event.target === popupExplain) {
        popupExplain.style.display = "none";
    }
}

function showSettings(){
    document.getElementById('popupSettings').style.display='block';
}

function showExplain(){
    document.getElementById('popupExplain').style.display='block';
}



function showGame(){
    document.getElementById('game').style.display='block';
    document.getElementById('playBtn').style.display='none';
}


function closeExplainPopup() {
    document.getElementById('popupExplain').style.display='none';
}

function closeSettingsPopup() {
    document.getElementById('popupSettings').style.display='none';
    saveSettings();
}


function saveSettings(){
    localStorage.setItem('isRootTheme', isRootTheme);
    localStorage.setItem('isBackgroundAnimated', isBackgroundAnimated);
    localStorage.setItem('lang', lang);

}


const html = document.getElementsByTagName('html')[0];
const themeSwitch = document.getElementById('themeSwitch');

themeSwitch.addEventListener('click', () => {
    html.classList.toggle('dark');

});

function setTheme() {
    if(!isRootTheme) {
        document.body.classList.toggle('dark');
        document.getElementById('themeSwitch').checked = true;
    }
    else{
        if(document.body.classList.contains('dark'))
            document.body.classList.toggle('dark');
        document.getElementById('themeSwitch').checked = false;

    }
}