From a2bd7cf409b59b9a8ae62ba47f3945aca2af57e5 Mon Sep 17 00:00:00 2001 From: Thomas Roskop Date: Mon, 28 Sep 2015 22:28:28 +0200 Subject: [PATCH 1/3] Added multi-language support and added german language (de-DE) --- index.html | 21 ++++++++---- js/languages/de-de.js | 35 +++++++++++++++++++ js/languages/en-us.js | 34 ++++++++++++++++++ js/languages/language-server.js | 61 +++++++++++++++++++++++++++++++++ js/main.js | 2 +- js/render.js | 16 ++++----- js/view.js | 11 +++--- 7 files changed, 160 insertions(+), 20 deletions(-) create mode 100644 js/languages/de-de.js create mode 100644 js/languages/en-us.js create mode 100644 js/languages/language-server.js diff --git a/index.html b/index.html index a8287cc56..8f603aeec 100644 --- a/index.html +++ b/index.html @@ -2,6 +2,7 @@ Hextris + @@ -35,6 +36,14 @@ + + + + + + @@ -69,17 +78,17 @@
-
HIGH SCORE
+
-
HIGH SCORE
10292
+
10292
-
GAME OVER
+
1843
-
HIGH SCORES
+
1.
0
2.
0
3.
0
@@ -89,7 +98,7 @@
- Share button + @@ -97,7 +106,7 @@ - SHARE MY SCORE! + diff --git a/js/languages/de-de.js b/js/languages/de-de.js new file mode 100644 index 000000000..c189b78d5 --- /dev/null +++ b/js/languages/de-de.js @@ -0,0 +1,35 @@ +/* + Language Server for hextris. + Allows to load languagre resources at runtime. + + Language: DE-DE (Germany's german) @Übersetzung von: Thomas Roskop +*/ + + + +____LanguageServerResourcesDE_DE = { + "AppName": "Hextris", + "AppDescription": "Ein süchtig machendes Spiel von Tetris inspiriert.", + "GameOver": "VERLOREN", + "HighScore": "BESTE BEWERTUNG", + "HighScores": "BESTE BEWERTUNGEN", + "ShareMyScore": "MEINE PUNKTZAHL TEILEN", + "ShareButtons": "TEILEN", + + 'paused': "
Spiel pausiert
", + 'pausedAndroid': "
Spiel pausiert.
Du möchtest den Entwickler unterstützen? Du magst keine Werbung? Tippe hier für die werbefreie Version!
", + 'pausediOS': "
Spiel pausiert
Du möchtest den Entwickler unterstützen? Du magst keine Werbung? Tippe hier für die werbefreie Version!
", + 'pausedOther': "
Spiel pausiert
Du möchtest den Entwickler unterstützen? Du magst keine Werbung? Tippe hier für die werbefreie Version!
", + 'start': "
Drücke die Eingabetaste zum weitermachen.
", + + "input_text": "Drücke die rechte und linke Pfeiltaste", + "action_text": "um das Hexagon zu drehen.", + "score_text": "Verbinde 3+ gleichfarbige Blöcke um Punkte zu sammeln.", + /* Mobile version */ + "input_textM": "Drücke auf die rechte und linke Seite", + "action_textM": "um das Hexagon zu drehen.", + "score_textM": "Verbinde 3+ gleichfarbige Blöcke um Punkte zu sammeln.", + + /* Only access this with "_SEval()" */ + "Instructions": "
HINWEISE ZUM SPIEL!

Ziel des Spieles ist es zu verhindern, dass die farbigen Balken den grauen Bereich verlassen.

\" + (settings.platform != 'mobile' ? 'Drücke dazu die rechte und linke Pfeiltaste' : 'Tippe auf die linke oder rechte Seite des Bildschirms') + \" um das Hexagon zu bewegen.

Die Blöcke verschwinden, wenn drei oder mehr der gleichn Farbe sich dirket berühren.

Die Zeit, bis deine Mehrfachattacke zuende ist, wird durch die bunten Linien an der Seite des Hexagons angezeigt.

Von Logan Engstrom & Garrett Finucane
Besuche Hextris auf iOS & Android
Hextris auf Github!" +}; diff --git a/js/languages/en-us.js b/js/languages/en-us.js new file mode 100644 index 000000000..5ca55a60d --- /dev/null +++ b/js/languages/en-us.js @@ -0,0 +1,34 @@ +/* + Language Server for hextris. + Allows to load languagre resources at runtime. + + Language: EN-US (American English) +*/ + + + +____LanguageServerResourcesEN_US = { + "AppName": "Hextris", + "AppDescription": "Ein süchtig machendes Spiel in", + "GameOver": "GAME OVER", + "HighScore": "HIGH SCORE", + "HighScores": "HIGH SCORES", + "ShareMyScore": "SHARE MY SCORE", + "ShareButtons": "Share buttons", + + 'paused': "
Game Paused
", + 'pausedAndroid': "
Game Paused
", + 'pausediOS': "
Game Paused
Want to support the developers? Don't like ads? Tap for Hextris ad-free!
", + 'pausedOther': "
Game Paused
Want to support the developers? Click here to buy one of the ad-free mobile versions!
", + 'start': "
Press enter to start
", + + "input_text": "Use the right and left arrow keys", + "action_text": "to rotate the hexagon", + "score_text": "Match 3+ blocks to score!", + /* Mobile version */ + "input_textM": "Tap the screen\'s left and ride", + "action_textM": "sides to rotate the hexagon", + "score_textM": "Match 3+ blocks to score!", + + "Instructions": "
HOW TO PLAY

The goal of Hextris is to stop blocks from leaving the inside of the outer gray hexagon.

\" + (settings.platform != 'mobile' ? 'Press the right and left arrow keys' : 'Tap the left and right sides of the screen') + \" to rotate the Hexagon

Clear blocks and get points by making 3 or more blocks of the same color touch.

Time left before your combo streak disappears is indicated by the colored lines on the outer hexagon

By Logan Engstrom & Garrett Finucane
Find Hextris on iOS & Android
More @ the Hextris Website" +}; diff --git a/js/languages/language-server.js b/js/languages/language-server.js new file mode 100644 index 000000000..79af495ce --- /dev/null +++ b/js/languages/language-server.js @@ -0,0 +1,61 @@ +/* + Language Server for hextris. + Allows to load languagre resources at runtime. + + von Thomas Roskop. + + We have to ad every language (currently) to the index.html file to support the language. + Moreover, we load only those variables we realy need. +*/ + +var ____LanguageServerResources = null; + +/* + This is a list of all the languages this app does currently support. + If the user uses a language we do not support, load fallback language en-US. +*/ +var ____LanguageServerLocales = [ + "en-US", + "de-DE" +]; + +(function _LanguageServerInit() { + var lang = navigator.language || navigator.userLanguage; /* form: "en-US" */ + var lngFound = false; + for (var i = 0; i < ____LanguageServerLocales.length; i++) { + if(____LanguageServerLocales[i] == lang) { + lngFound = true; /* We found the language in the list so we support it. */ + } + } + if(!lngFound) lang = "en-US"; /* Use Fallback language */ + + lang = "de-DE"; + + lang = lang.replace("-", "_").toUpperCase(); + + console.log("language: " + lang); + + eval("____LanguageServerResources = ____LanguageServerResources" + lang + ";"); + /* Looks like: ____LanguageServerResources = ____LanguageServerResourcesEN_US; */ +})(); + +/* + Gets the string matching the key. + If there is no string, simply return the key in brackets: '{' and '}' +*/ +function _S(key) { + return ____LanguageServerResources[key] || "{" + key + "}"; +} + +function _SEval(key) { + return eval(_S(key)); +} + +function _SText(key, elementID) { + var d = document.getElementById(elementID); + if(d != null) { d.textContent = _S(key); } +} + +function _SWrite(key) { + document.write(_S(key)); +} diff --git a/js/main.js b/js/main.js index afc8515d6..f518829b4 100644 --- a/js/main.js +++ b/js/main.js @@ -360,7 +360,7 @@ function showHelp() { } } - $("#inst_main_body").html("
HOW TO PLAY

The goal of Hextris is to stop blocks from leaving the inside of the outer gray hexagon.

" + (settings.platform != 'mobile' ? 'Press the right and left arrow keys' : 'Tap the left and right sides of the screen') + " to rotate the Hexagon

Clear blocks and get points by making 3 or more blocks of the same color touch.

Time left before your combo streak disappears is indicated by the colored lines on the outer hexagon

By Logan Engstrom & Garrett Finucane
Find Hextris on iOS & Android
More @ the Hextris Website"); + $("#inst_main_body").html(_SEval("Instructions")); if (gameState == 1) { pause(); } diff --git a/js/render.js b/js/render.js index 4c3a550fd..10d6be322 100644 --- a/js/render.js +++ b/js/render.js @@ -3,7 +3,7 @@ function render() { if (gameState === 0) { grey = "rgb(220, 223, 225)"; } - + ctx.clearRect(0, 0, trueCanvas.width, trueCanvas.height); clearGameBoard(); if (gameState === 1 || gameState === 2 || gameState === -1 || gameState === 0) { @@ -72,15 +72,15 @@ function renderBeginningText() { var mob, fontSize; if(/mobile|Mobile|iOS|Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) { mob = true; - input_text = 'Tap the screen\'s left and ride' - action_text = 'sides to rotate the hexagon' - score_text = 'Match 3+ blocks to score' + input_text = _S("input_textM"); + action_text = _S("action_textM"); + score_text = _S("score_textM"); fontSize = 35 } else { mob = false - input_text = 'Use the right and left arrow keys' - action_text = 'to rotate the hexagon' - score_text = 'Match 3+ blocks to score!' + input_text = _S("input_text"); + action_text = _S("action_text"); + score_text = _S("score_text"); fontSize = 27 } renderText((trueCanvas.width)/2 + 2 * settings.scale,upperheight-0*settings.scale, fontSize, '#2c3e50', input_text); @@ -108,7 +108,7 @@ function drawKey(key, x, y) { ctx.scale(settings.scale, settings.scale); ctx.fillText(String.fromCharCode("0xf04b"), 0, 0); break; - + default: drawKey("left", x - 5, y); drawKey("right", x + 5, y); diff --git a/js/view.js b/js/view.js index aeecc81da..38344a22f 100644 --- a/js/view.js +++ b/js/view.js @@ -94,12 +94,13 @@ function toggleClass(element, active) { } function showText(text) { + var messages = { - 'paused': "
Game Paused
", - 'pausedAndroid': "
Game Paused
", - 'pausediOS': "
Game Paused
Want to support the developers? Don't like ads? Tap for Hextris ad-free!
", - 'pausedOther': "
Game Paused
Want to support the developers? Click here to buy one of the ad-free mobile versions!
", - 'start': "
Press enter to start
" + "paused": _S("paused"), + "pausedAndroid": _S("pausedAndroid"), + "pausediOS": _S("pausediOS"), + "pausedOther": _S("pausedOther"), + "start": _S("start") }; if (text == 'paused') { From 00331660fcc19c417e64d28bf6e690c6c62715c0 Mon Sep 17 00:00:00 2001 From: Thomas Roskop Date: Mon, 28 Sep 2015 22:31:20 +0200 Subject: [PATCH 2/3] Added multi-language support and added german language (de-DE) --- js/languages/language-server.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/js/languages/language-server.js b/js/languages/language-server.js index 79af495ce..3515f15e5 100644 --- a/js/languages/language-server.js +++ b/js/languages/language-server.js @@ -27,9 +27,7 @@ var ____LanguageServerLocales = [ lngFound = true; /* We found the language in the list so we support it. */ } } - if(!lngFound) lang = "en-US"; /* Use Fallback language */ - - lang = "de-DE"; + if(!lngFound) lang = "en-US"; /* Use fallback language */ lang = lang.replace("-", "_").toUpperCase(); From 598168dba9ec65c46405447fb949c1b4ded0d2f4 Mon Sep 17 00:00:00 2001 From: Thomas Roskop Date: Thu, 29 Oct 2015 20:58:44 +0100 Subject: [PATCH 3/3] Language V2 + Added es-ES --- index.html | 3 ++- js/languages/Language.md | 23 +++++++++++++++++++++++ js/languages/es-es.js | 33 +++++++++++++++++++++++++++++++++ js/languages/language-server.js | 26 +++++++++++++++++++++----- 4 files changed, 79 insertions(+), 6 deletions(-) create mode 100644 js/languages/Language.md create mode 100644 js/languages/es-es.js diff --git a/index.html b/index.html index 8f603aeec..30eb4f7d1 100644 --- a/index.html +++ b/index.html @@ -38,10 +38,11 @@ + diff --git a/js/languages/Language.md b/js/languages/Language.md new file mode 100644 index 000000000..e6d29c1af --- /dev/null +++ b/js/languages/Language.md @@ -0,0 +1,23 @@ + +*How to: Add a Language* +============================ + +Adding more languages to "hextris" is very simple and fast. +You just need to follow these steps: + +1) Copy the "en-US.js" file and rename it to your languages name. +e.g. if your are translating to chinese, just use "zh-CN". And please use always the language code with 5 chars! +See here for a full list of languages: [http://www.lingoes.net/en/translator/langcode.htm] + +2) Replace the "____LanguageServerResourcesEN_US" to your language, e.g. "____LanguageServerResourcesZH_CN". + +3) Translate the content + +4) Add a reference to the language in "Language-server.js" and in the "index.html" file. + + +If you need help, you can ask me. + +______________________ +Version 29.10.2015 // TRoskop + diff --git a/js/languages/es-es.js b/js/languages/es-es.js new file mode 100644 index 000000000..338eb0454 --- /dev/null +++ b/js/languages/es-es.js @@ -0,0 +1,33 @@ +/* + Language Server for hextris. + Allows to load language resources at runtime. + Language: ES (Spanish) +*/ + + + +____LanguageServerResourcesES_ES = { + "AppName": "Hextris", + "AppDescription": "Hextris es una inspiracion del juego más conocido: Tetris", + "GameOver": "FIN DEL JUEGO", + "HighScore": "PUNTUACION MAS ALTA", + "HighScores": "PUNTAJES ALTOS", + "ShareMyScore": "COMPARTIR MI PUNTAJE", + "ShareButtons": "BOTONES PARA COMPARTIR", + + 'paused': "
Juego Pausado
", + 'pausedAndroid': "
Juego Pausado
Quieres apoyar a los desarrolladores? Comparte,¿No te gusta los anuncios? Haga click para Hextris libre de publicidad!
", + 'pausediOS': "
Juego Pausado
Quieres apoyar a los desarrolladores? Comparte,¿No te gusta los anuncios? Haga click para Hextris libre de publicidad!
", + 'pausedOther': "
Juego Pausado
Quieres apoyar a los desarrolladores? Haga clic aquí para comprar una de las versiones libres de publicidad móviles!
", + 'start': "
Presione ENTER para comenzar
", + + "input_text": "Utilice las teclas flecha derecha y flecha izquierda del teclado", + "action_text": "Para girar el hexágono", + "score_text": "Una 3 o + bloques para sumar puntos!", + /* Mobile version */ + "input_textM": "Toque la pantalla del lado izquierdo o derecho", + "action_textM": "para girar el hexágono", + "score_textM": "Una 3 o + bloques para sumar puntos!", + + "Instructions": "
Como jugar?

El objetivo de Hextris es no permitir que los bloques salgan del hexágono gris más grande.

\" + (settings.platform != 'mobile' ? 'Presione las teclas fecha izquierda y derecha del teclado' : 'Toque en los lados izquierdo y derecho de la pantalla') + \" Para girar el hexagono

Para limpiar los Bloques y obtener puntos, debe juntar 3 o más bloques del mismo color.

El tiempo restante antes de que su racha de combo, se indica mediante Las lineas de colores sobre nuestro hexagono

Creado por Logan Engstrom & Garrett Finucane
Encuentra el juego Hextris en iOS & Android
Mas @ en el sitio web Hextris" +}; diff --git a/js/languages/language-server.js b/js/languages/language-server.js index 3515f15e5..2f7e452cd 100644 --- a/js/languages/language-server.js +++ b/js/languages/language-server.js @@ -2,13 +2,13 @@ Language Server for hextris. Allows to load languagre resources at runtime. - von Thomas Roskop. + From Thomas Roskop (Github: TRoskop). We have to ad every language (currently) to the index.html file to support the language. Moreover, we load only those variables we realy need. */ -var ____LanguageServerResources = null; +var ____LanguageServerResources = {}; /* This is a list of all the languages this app does currently support. @@ -16,7 +16,8 @@ var ____LanguageServerResources = null; */ var ____LanguageServerLocales = [ "en-US", - "de-DE" + "de-DE", + "es-ES" ]; (function _LanguageServerInit() { @@ -27,7 +28,22 @@ var ____LanguageServerLocales = [ lngFound = true; /* We found the language in the list so we support it. */ } } - if(!lngFound) lang = "en-US"; /* Use fallback language */ + + // If we found no perfect match, let's look for a unexact match. + // This means that we only compare the first two chars as they only indicate the language without the region. + if(!lngFound) { + for (var i = 0; i < ____LanguageServerLocales.length; i++) { + var l1 = ____LanguageServerLocales[i].substring(0, 2); // e.g.: en + if( lang.indexOf(l1) > -1 ) { // e.g.: if "en-es" contains "en" we have a match. + lngFound = true; /* We found the language in the list so we support it. */ + lang = l1; + } + } + } + + if(!lngFound) lang = "en-US"; /* Use fallback language because no language was found! */ + + // lang = "es-es"; // For development test, should uncomment this line AND use your (valid!) language! lang = lang.replace("-", "_").toUpperCase(); @@ -39,7 +55,7 @@ var ____LanguageServerLocales = [ /* Gets the string matching the key. - If there is no string, simply return the key in brackets: '{' and '}' + If there is no string, simply return the key in brackets: '{key}' */ function _S(key) { return ____LanguageServerResources[key] || "{" + key + "}";