diff --git a/frontend/package.json b/frontend/package.json index b552a24..9ad6b0c 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -12,6 +12,7 @@ "pretty-checkbox-vue": "^1.1.9", "socket.io-client": "^3.0.3", "vue": "^2.6.11", + "vue-i18n": "^8.22.2", "vue-socket.io": "^3.0.10" }, "devDependencies": { diff --git a/frontend/src/App.vue b/frontend/src/App.vue index 39f33c1..9052697 100644 --- a/frontend/src/App.vue +++ b/frontend/src/App.vue @@ -2,29 +2,29 @@
-

Scegli un username:

+

{{$t("choose_username")}}

-

Giocatori online: {{onlinePlayers}}

+

{{$t("online_players")}}{{onlinePlayers}}

-

Giocatori online: {{onlinePlayers}}

+

{{$t("online_players")}}{{onlinePlayers}}

-

Lobby disponibili:

+

{{$t("available_lobbies")}}

-

Nessuna lobby disponibile

+

{{$t("no_lobby_available")}}

-

Crea una lobby:

-

Nome:

+

{{$t("create_lobby")}}

+

{{$t("lobby_name")}}

@@ -33,9 +33,17 @@
-

Attenzione!

-

Connessione al server assente.

+

{{$t("warning")}}

+

{{$t("connection_error")}}

+
@@ -66,7 +74,7 @@ export default { getSelfCard() { return { name: this.username, - number: 'YOU', + number: this.$t('you'), icon: '🤠', is_character: true, } @@ -120,7 +128,7 @@ export default { e.preventDefault(); }, joinLobby(lobby) { - let password = lobby.locked ? prompt("Room password:", "") : ''; + let password = lobby.locked ? prompt(this.$t("room_password_prompt"), "") : ''; this.$socket.emit('join_room', {name:lobby.name,password:password}) }, init() { @@ -217,7 +225,7 @@ h1,h2,h3,h4,p,span,b,label{ transform: scale(0); } } -input { +input, select { border: 2px solid; border-radius: 4px; font-size: 1rem; @@ -227,7 +235,7 @@ input { transition: border-color 0.5s ease-out; } @media (prefers-color-scheme: dark) { - :root, #app, input { + :root, #app, input, select { background-color: #181a1b; color: rgb(174, 194, 211); } diff --git a/frontend/src/components/Chat.vue b/frontend/src/components/Chat.vue index 1528f07..1ec4706 100644 --- a/frontend/src/components/Chat.vue +++ b/frontend/src/components/Chat.vue @@ -1,6 +1,6 @@ @@ -133,7 +133,7 @@ export default { }, computed:{ respondText() { - return `Scegli come rispondere ${this.attacker?('a '+this.attacker):''}${(this.mancato_needed>1)?(' (NE OCCORRONO ' + this.mancato_needed + ')'):''}` + return `${this.$t('choose_response')}${this.attacker?(this.$t('choose_response_to')+this.attacker):''}${(this.mancato_needed>1)?(` (${this.$t('choose_response_needed')} ` + this.mancato_needed + ')'):''}` }, showScrapScreen() { return this.isEndingTurn && !this.canEndTurn && this.is_my_turn; @@ -159,7 +159,7 @@ export default { vis.push({ name: this.name, number: 0, - icon: 'TU', + icon: this.$t('you'), is_character: true, }) } @@ -171,7 +171,7 @@ export default { instruction() { if (this.pending_action == null) return '' - let x = ['▶️ Estrai una carta', '▶️ Pesca le tue carte', '▶️ Gioca le tue carte', '▶️ Rispondi alla carta', '⏸ Attendi', '▶️ Scegli una carta'] + let x = [this.$t('flip_card'), this.$t('draw_cards'), this.$t('play_cards'), this.$t('respond_card'), this.$t('wait'), this.$t('choose_cards')] return x[this.pending_action] }, canEndTurn() { @@ -179,7 +179,7 @@ export default { }, respondCards() { let cc = [{ - name: 'Prendi Danno', + name: this.$t('take_dmg'), icon: '❌', is_equipment: true, }] diff --git a/frontend/src/i18n/en.json b/frontend/src/i18n/en.json new file mode 100644 index 0000000..7fd328b --- /dev/null +++ b/frontend/src/i18n/en.json @@ -0,0 +1,55 @@ +{ + "trademark": "Bang! is a trademark owned by DVGiochi", + "online_players": "Online players: ", + "choose_username": "Pick an username:", + "available_lobbies": "Available Lobbies:", + "no_lobby_available": "No lobbies available", + "create_lobby": "Open a lobby:", + "lobby_name": "Name:", + "warning": "Warning!", + "connection_error": "Cannot connect to server.", + "chat": "Chat", + "end_turn": "End Turn!", + "start_game": "Start!", + "expansions": "Expansions", + "details": "Details", + "ok": "OK", + "you": "YOU", + "owner": "OWNER", + "cancel": "CANCEL", + "password": "Password: ", + "room_password_prompt": "Lobby Password: ", + "private_room": "Private Lobby", + "room": "Lobby: ", + "room_players": "Players (you are {username})", + "choose_character": "Choose your character", + "choose_card": "Choose a card", + "choose_card_from": " from ", + "flip_card": "▶️ Flip a card", + "draw_cards": "▶️ Draw you cards from the deck", + "play_cards": "▶️ Play your cards", + "respond_card":"▶️ Respond to the card", + "wait": "⏸ Wait", + "choose_cards": "▶️ Choose a card", + "take_dmg": "Take damage", + "choose_response": "Choose your response ", + "choose_response_to": "to ", + "choose_response_needed": "NEEDED ", + "hand": "HAND", + "card_against": "Who will you play your card against?", + "choose_card_to_get": "Choose a card", + "you_died":"YOU DIED", + "spectate":"SPECTATE", + "you_win":"YOU WON", + "you_lose":"YOU LOST", + "special_ability": "SPECIAL ABILITY", + "discard": "DISCARD", + "to_regain_1_hp": "TO REGAIN 1 HP", + "play_your_turn": "PLAY YOUR TURN", + "you_are": "You are", + "did_pick_as": "picked this as second card", + "if_card_red":"If the card is diamonds or hearts, he picks another card.", + "choose_scarp_card_to": "CHOOSE WHICH CARD TO DISCARD TO USE", + "pick_a_card": "FLIP A CARD", + "to_defend_from": "TO DEFEND YOURSELF FROM" +} \ No newline at end of file diff --git a/frontend/src/i18n/index.js b/frontend/src/i18n/index.js new file mode 100644 index 0000000..56667db --- /dev/null +++ b/frontend/src/i18n/index.js @@ -0,0 +1,9 @@ +import it from './it.json' +import en from './en.json' + +export const defaultLocale = 'it' + +export const languages = { + it: it, + en: en, +} \ No newline at end of file diff --git a/frontend/src/i18n/it.json b/frontend/src/i18n/it.json new file mode 100644 index 0000000..7d256d5 --- /dev/null +++ b/frontend/src/i18n/it.json @@ -0,0 +1,55 @@ +{ + "trademark": "Bang! è un marchio registrato DVGiochi", + "online_players": "Giocatori online: ", + "choose_username": "Scegli un username:", + "available_lobbies": "Stanze disponibili:", + "no_lobby_available": "Nessuna stanza disponibile", + "create_lobby": "Crea una stanza:", + "lobby_name": "Nome:", + "warning": "Attenzione!", + "connection_error": "Connessione al server assente.", + "chat": "Chat", + "end_turn": "Termina turno!", + "start_game": "Avvia!", + "expansions": "Espansioni", + "details": "Dettagli", + "ok": "OK", + "you": "TU", + "owner": "GESTORE", + "cancel": "ANNULLA", + "password": "Password: ", + "room_password_prompt": "Password Stanza: ", + "private_room": "Stanza Privata", + "room": "Stanza: ", + "room_players": "Giocatori (tu sei {username})", + "choose_character": "Scegli il tuo personaggio", + "choose_card": "Scegli una carta", + "choose_card_from": " da ", + "flip_card": "▶️ Estrai una carta", + "draw_cards": "▶️ Pesca le tue carte", + "play_cards": "▶️ Gioca le tue carte", + "respond_card": "▶️ Rispondi alla carta", + "wait": "⏸ Attendi", + "choose_cards": "▶️ Scegli una carta", + "take_dmg": "Prendi Danno", + "choose_response": "Scegli come rispondere ", + "choose_response_to": "a ", + "choose_response_needed": "NE OCCORRONO ", + "hand": "MANO", + "card_against": "Contro chi vuoi giocare la carta", + "choose_card_to_get": "Scegli che carta pescare", + "you_died": "SEI MORTO", + "spectate": "SPETTATORE", + "you_win": "HAI VINTO", + "you_lose": "HAI PERSO", + "special_ability": "ABILITÀ SPECIALE", + "discard": "SCARTA", + "to_regain_1_hp": "PER RECUPERARE 1 VITA", + "play_your_turn": "GIOCA IL TUO TURNO", + "you_are": "Tu sei", + "did_pick_as": "ha pescato come seconda carta", + "if_card_red": "Se la carta è cuori o quadri ne pesca un'altra", + "choose_scarp_card_to": "SCEGLI CHE CARTA SCARTARE PER USARE", + "pick_a_card": "ESTRAI UNA CARTA", + "to_defend_from": "PER DIFENDERTI DA" +} \ No newline at end of file diff --git a/frontend/src/main.js b/frontend/src/main.js index d86bdbf..83cb373 100644 --- a/frontend/src/main.js +++ b/frontend/src/main.js @@ -11,6 +11,18 @@ Vue.use(new VueSocketIO({ import PrettyCheckbox from 'pretty-checkbox-vue'; Vue.use(PrettyCheckbox) +import VueI18n from 'vue-i18n' +Vue.use(VueI18n) + +import { languages, defaultLocale } from './i18n'; +const messages = Object.assign(languages) + +const i18n = new VueI18n({ + locale: defaultLocale, + messages +}) + new Vue({ + i18n, render: h => h(App), }).$mount('#app') diff --git a/frontend/yarn.lock b/frontend/yarn.lock index 9c6e53c..c6335a4 100644 --- a/frontend/yarn.lock +++ b/frontend/yarn.lock @@ -8310,6 +8310,11 @@ vue-hot-reload-api@^2.3.0: resolved "https://registry.npm.taobao.org/vue-hot-reload-api/download/vue-hot-reload-api-2.3.4.tgz#532955cc1eb208a3d990b3a9f9a70574657e08f2" integrity sha1-UylVzB6yCKPZkLOp+acFdGV+CPI= +vue-i18n@^8.22.2: + version "8.22.2" + resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-8.22.2.tgz#58299a5a050e67b4f799d96fee7dd8bd269e0907" + integrity sha512-rb569fVJInPUgS/bbCxEQ9DrAoFTntuJvYoK4Fpk2VfNbA09WzdTKk57ppjz3S+ps9hW+p9H+2ASgMvojedkow== + "vue-loader-v16@npm:vue-loader@^16.0.0-beta.7": version "16.0.0-rc.2" resolved "https://registry.npm.taobao.org/vue-loader/download/vue-loader-16.0.0-rc.2.tgz?cache=0&sync_timestamp=1605670716799&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvue-loader%2Fdownload%2Fvue-loader-16.0.0-rc.2.tgz#b6a7e7f30d28f35659a83de41f4a1831a4232a04"