не работает многоязычное приложение (javascript) - PullRequest
0 голосов
/ 18 февраля 2020

Я пытаюсь создать игру в кости на трех языках: английском sh, итальянском и немецком. Я сделал три js файла со словами для перевода, а затем с помощью querySelector и getElementById я заменил слова на трех разных языках. Проблема в том, что когда я нажимаю одну из трех кнопок, язык переключается правильно, но тогда он остается навеки. Например, если я нажимаю кнопку «итальянский», язык меняется на итальянский, но если я нажимаю engli sh или немецкий, ничего не происходит. Я не могу понять, что случилось, кто-то может мне помочь? спасибо

//set date from moment.js
var mydate = new Date();

moment.locale('en');
mydate=moment().format('LL');
document.getElementById("date").innerHTML=mydate;


//create a new element
var langScript = document.createElement('script');

//declaration variables
var lang='winner!',player=['player 1','player 2'];

startGame();

var prefix1='<i class="ion-ios-plus-outline"></i>';
var prefix2='<i class="ion-ios-loop" ></i>';
var prefix3='<i class="ion-ios-download-outline" ></i>';



    //when i click the language IT button, the language's variables were changed
document.querySelector('.btn-it').addEventListener('click',function ita(){
    //window.location.reload();

    moment.locale('it');
    mydate=moment().format('LL');

    document.getElementById("date").innerHTML=mydate;
    
    langScript.src="./it.js";
    document.head.appendChild(langScript);

        langScript.addEventListener('load', function  () {
            console.log('test');
            document.getElementById("btn-new").innerHTML=prefix1+ui.textButtonNewGame;
            document.getElementById("btn-roll").innerHTML=prefix2+ui.textButtonRollDice;
            document.getElementById("btn-hold").innerHTML=prefix3+ui.textButtonHold;
            document.getElementById("currentTXT-0").innerHTML=ui.textCurrentInBotton;
            document.getElementById("currentTXT-1").innerHTML=ui.textCurrentInBotton;
            document.getElementById("name-0").innerHTML=ui.namePlayer1;
            document.getElementById("name-1").innerHTML=ui.namePlayer2;
            document.getElementById("btn-en").innerHTML=ui.buttonChangeLanguageEnglish;
            document.getElementById("btn-it").innerHTML=ui.buttonChangeLanguageItalian;
            document.getElementById("btn-de").innerHTML=ui.buttonChangeLanguageGerman;
            lang =ui.textWinner;
            player[0]=ui.namePlayer1;
            player[1]=ui.namePlayer2;
            
            
    })  
    
         
})  



//when i click the language DE button, the language's variables were changed
document.querySelector('.btn-de').addEventListener('click',function ger(){

    moment.locale('de');
    mydate=moment().format('LL');

    document.getElementById("date").innerHTML=mydate;
    
    langScript.src="./de.js";
    document.head.appendChild(langScript);
    
    langScript.addEventListener('load', function() {
        console.log('test');
        document.getElementById("btn-new").innerHTML=prefix1+ui.textButtonNewGame;
        document.getElementById("btn-roll").innerHTML=prefix2+ui.textButtonRollDice;
        document.getElementById("btn-hold").innerHTML=prefix3+ui.textButtonHold;
        document.getElementById("currentTXT-0").innerHTML=ui.textCurrentInBotton;
        document.getElementById("currentTXT-1").innerHTML=ui.textCurrentInBotton;
        document.getElementById("name-0").innerHTML=ui.namePlayer1;
        document.getElementById("name-1").innerHTML=ui.namePlayer2;
        document.getElementById("btn-en").innerHTML=ui.buttonChangeLanguageEnglish;
        document.getElementById("btn-it").innerHTML=ui.buttonChangeLanguageItalian;
        document.getElementById("btn-de").innerHTML=ui.buttonChangeLanguageGerman;
        lang =ui.textWinner;
        player[0]=ui.namePlayer1;
        player[1]=ui.namePlayer2;
        
        
    })
        //window.location.reload();
        
})



//when i click the language EN button, the language's variables were changed
document.querySelector('.btn-en').addEventListener('click',function eng(){
    
    langScript.src="./en.js";
    document.head.appendChild(langScript);

    langScript.addEventListener('load', function() {
        console.log('test');
        document.getElementById("btn-new").innerHTML=prefix1+ui.textButtonNewGame;
        document.getElementById("btn-roll").innerHTML=prefix2+ui.textButtonRollDice;
        document.getElementById("btn-hold").innerHTML=prefix3+ui.textButtonHold;
        document.getElementById("currentTXT-0").innerHTML=ui.textCurrentInBotton;
        document.getElementById("currentTXT-1").innerHTML=ui.textCurrentInBotton;
        document.getElementById("name-0").innerHTML=ui.namePlayer1;
        document.getElementById("name-1").innerHTML=ui.namePlayer2;
        document.getElementById("btn-en").innerHTML=ui.buttonChangeLanguageEnglish;
        document.getElementById("btn-it").innerHTML=ui.buttonChangeLanguageItalian;
        document.getElementById("btn-de").innerHTML=ui.buttonChangeLanguageGerman;
        lang =ui.textWinner;
        player[0]=ui.namePlayer1;
        player[1]=ui.namePlayer2;

        
    })
        
        //window.location.reload();     
        
})

1 Ответ

0 голосов
/ 18 февраля 2020

Вместо трех разных файлов JS для каждого языка создайте массив со всеми строками внутри, например (переменная "languages"):

var selected_language=0;
//0=English
//1=Italian
//2=German
//Allow the player to change this number before the game starts.

var languages = [
/*ENGLISH*/["winner!","player1","player2","more english..."],
/*ITALIAN*/["winner in italian!","player1 in italian","player2 in italian","more italian..."],
/*GERMAN*/["winner in german!","player1 in german","player2 in german","more german..."]
];


alert( languages[selected_language][0] );
//Gives "winner!", as the selected language is English (0)

И в зависимости от количества переведенных строк Возможно, вы захотите переместить его в файл JSON.

Но вы можете начать с этого.

В противном случае вы можете поместить строки в объекты, но я думаю, что это происходит быстрее.

Извините, если что-то было трудно понять (я написал это на мобильном телефоне). Удачи!

...