Define supported locales instead of just languages

Author: jkimbo

TRANSLATION.md

@@ -21,17 +21,15 @@ At runtime, the proper translation will be picked based on the browser language.
 
 You need to add the new language in 4 places:
 
-1. Create `lib/challenges/locales/<lang>` and copy the whole `worlds` directory and `index.json` 
+1. Create `lib/challenges/locales/<locale>` and copy the whole `worlds` directory and `index.json` 
    These are the translations of the challenges, the main content of Make-Art.
 
-2. Create `locales/<lang>` and copy the content of `locales/en`
+2. Create `locales/<locale>` and copy the content of `locales/en`
    These are the translations of the views
 
 3. Directly edit `content/docs.json` and add your language to the map (at the top level)
 
-4. Add your language to `SUPPORTED_LANGUAGES` array in `lib/i18n.js`
-
-Note that languages are identified by their 2 letter abbreviation (ignoring the country), so for example fr-FR and fr-CA will share the same translation `fr`.
+4. Add your language to `SUPPORTED_LOCALES` array in `lib/i18n.js`
 
 ## How to make sure your code is i18n-aware
 

lib/i18n.js

@@ -1,17 +1,17 @@
 var url = require('url');
 
-var SUPPORTED_LANGUAGES = [
+var SUPPORTED_LOCALES = [
     'ja',
     'en',
-    'es',
+    'es-AR',
 ];
 
 function getLanguage() {
     var parsedUrl = url.parse(window.location.href, true);
 
     if (parsedUrl.query['lang'] !== undefined) {
-        var lang = parsedUrl.query['lang'].toLowerCase();
-        if (SUPPORTED_LANGUAGES.indexOf(lang) > -1) {
+        var lang = parsedUrl.query['lang'];
+        if (SUPPORTED_LOCALES.indexOf(lang) > -1) {
             return lang;
         }
         // not in supported languages so fall back to normal detection
@@ -20,14 +20,21 @@ function getLanguage() {
     var language = window.navigator.languages ? window.navigator.languages[0] :
         window.navigator.userLanguage || window.navigator.language || 'en',
         p = language.indexOf('-');
-    language = (p > -1) ? language.substr(0, p) : language;
+
+    // check if full locale is supported
+    if (SUPPORTED_LOCALES.indexOf(language) > -1) {
+        return language;
+    }
+
     language = language.toLowerCase();
 
-    if (SUPPORTED_LANGUAGES.indexOf(language) === -1) {
-        // language is not supported so default to 'en'
-        return 'en';
+    // otherwise check that if just language is supported
+    language = (p > -1) ? language.substr(0, p) : language;
+    if (SUPPORTED_LOCALES.indexOf(language) > -1) {
+        return language;
     }
-    return language;
+    // language is not supported so default to 'en'
+    return 'en';
 }
 
 function getChallengeLocalePath () {

test/unit/i18n-test.js

@@ -31,7 +31,7 @@ describe("i18n", function() {
         global.window.navigator.language = 'es-AR';
 
         var challengePath = i18n.getChallengeLocalePath();
-        assert.equal(challengePath, '/locales/es');
+        assert.equal(challengePath, '/locales/es-AR');
     });
 
     it("should return correct html locale path", function() {
@@ -43,7 +43,7 @@ describe("i18n", function() {
         global.window.navigator.language = 'es-AR';
 
         var challengePath = i18n.getHtmlLocalePath();
-        assert.equal(challengePath, '/locales/es');
+        assert.equal(challengePath, '/locales/es-AR');
     });
 
     it("should allow language override from url param", function() {