Merge pull request #934 from matrix-org/dbkr/translations

Translations!

README.md

@@ -24,6 +24,10 @@ In the interim, `vector-im/riot-web` and `matrix-org/matrix-react-sdk` should
 be considered as a single project (for instance, matrix-react-sdk bugs
 are currently filed against vector-im/riot-web rather than this project).
 
+Translation Status
+==================
+[![translationsstatus](https://translate.nordgedanken.de/widgets/riot-web/-/multi-auto.svg)](https://translate.nordgedanken.de/engage/riot-web/?utm_source=widget)
+
 Developer Guide
 ===============
 
@@ -190,4 +194,3 @@ Alternative instructions:
   * Create an index.html file pulling in your compiled javascript and the
     CSS bundle from the skin you use. For now, you'll also need to manually
     import CSS from any skins that your skin inherts from.
-

karma.conf.js

@@ -55,11 +55,18 @@ module.exports = function (config) {
             // some images to reduce noise from the tests
             {pattern: 'test/img/*', watched: false, included: false,
              served: true, nocache: false},
+            // translation files
+            {pattern: 'src/i18n/strings/*', watcheed: false, included: false, served: true},
+            {pattern: 'test/i18n/*', watched: false, included: false, served: true},
         ],
 
-        // redirect img links to the karma server
         proxies: {
+            // redirect img links to the karma server
             "/img/": "/base/test/img/",
+            // special languages.json file for the tests
+            "/i18n/languages.json": "/base/test/i18n/languages.json",
+            // and redirect i18n requests
+            "/i18n/": "/base/src/i18n/strings/",
         },
 
         // list of files to exclude

package.json

@@ -50,6 +50,7 @@
     "browser-request": "^0.3.3",
     "classnames": "^2.1.2",
     "commonmark": "^0.27.0",
+    "counterpart": "^0.18.0",
     "draft-js": "^0.8.1",
     "draft-js-export-html": "^0.5.0",
     "draft-js-export-markdown": "^0.2.0",

src/AddThreepid.js

@@ -16,6 +16,7 @@ limitations under the License.
 */
 
 var MatrixClientPeg = require("./MatrixClientPeg");
+import { _t } from './languageHandler';
 
 /**
  * Allows a user to add a third party identifier to their Home Server and,
@@ -44,7 +45,7 @@ class AddThreepid {
             return res;
         }, function(err) {
             if (err.errcode == 'M_THREEPID_IN_USE') {
-                err.message = "This email address is already in use";
+                err.message = _t('This email address is already in use');
             } else if (err.httpStatus) {
                 err.message = err.message + ` (Status ${err.httpStatus})`;
             }
@@ -69,7 +70,7 @@ class AddThreepid {
             return res;
         }, function(err) {
             if (err.errcode == 'M_THREEPID_IN_USE') {
-                err.message = "This phone number is already in use";
+                err.message = _t('This phone number is already in use');
             } else if (err.httpStatus) {
                 err.message = err.message + ` (Status ${err.httpStatus})`;
             }
@@ -91,7 +92,7 @@ class AddThreepid {
             id_server: identityServerDomain
         }, this.bind).catch(function(err) {
             if (err.httpStatus === 401) {
-                err.message = "Failed to verify email address: make sure you clicked the link in the email";
+                err.message = _t('Failed to verify email address: make sure you clicked the link in the email');
             }
             else if (err.httpStatus) {
                 err.message += ` (Status ${err.httpStatus})`;

src/CallHandler.js

@@ -55,6 +55,7 @@ var MatrixClientPeg = require('./MatrixClientPeg');
 var PlatformPeg = require("./PlatformPeg");
 var Modal = require('./Modal');
 var sdk = require('./index');
+import { _t } from './languageHandler';
 var Matrix = require("matrix-js-sdk");
 var dis = require("./dispatcher");
 
@@ -142,8 +143,8 @@ function _setCallListeners(call) {
             play("busyAudio");
             var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
             Modal.createDialog(ErrorDialog, {
-                title: "Call Timeout",
-                description: "The remote side failed to pick up."
+                title: _t('Call Timeout'),
+                description: _t('The remote side failed to pick up') + '.',
             });
         }
         else if (oldState === "invite_sent") {
@@ -203,8 +204,8 @@ function _onAction(payload) {
                 console.log("Can't capture screen: " + screenCapErrorString);
                 const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createDialog(ErrorDialog, {
-                    title: "Unable to capture screen",
-                    description: screenCapErrorString
+                    title: _t('Unable to capture screen'),
+                    description: screenCapErrorString,
                 });
                 return;
             }
@@ -223,8 +224,8 @@ function _onAction(payload) {
             if (module.exports.getAnyActiveCall()) {
                 const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createDialog(ErrorDialog, {
-                    title: "Existing Call",
-                    description: "You are already in a call."
+                    title: _t('Existing Call'),
+                    description: _t('You are already in a call') + '.',
                 });
                 return; // don't allow >1 call to be placed.
             }
@@ -233,8 +234,8 @@ function _onAction(payload) {
             if (!MatrixClientPeg.get().supportsVoip()) {
                 const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createDialog(ErrorDialog, {
-                    title: "VoIP is unsupported",
-                    description: "You cannot place VoIP calls in this browser."
+                    title: _t('VoIP is unsupported'),
+                    description: _t('You cannot place VoIP calls in this browser') + '.',
                 });
                 return;
             }
@@ -249,7 +250,7 @@ function _onAction(payload) {
             if (members.length <= 1) {
                 const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createDialog(ErrorDialog, {
-                    description: "You cannot place a call with yourself."
+                    description: _t('You cannot place a call with yourself') + '.',
                 });
                 return;
             }
@@ -275,14 +276,14 @@ function _onAction(payload) {
             if (!ConferenceHandler) {
                 const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createDialog(ErrorDialog, {
-                    description: "Conference calls are not supported in this client"
+                    description: _t('Conference calls are not supported in this client'),
                 });
             }
             else if (!MatrixClientPeg.get().supportsVoip()) {
                 const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createDialog(ErrorDialog, {
-                    title: "VoIP is unsupported",
-                    description: "You cannot place VoIP calls in this browser."
+                    title: _t('VoIP is unsupported'),
+                    description: _t('You cannot place VoIP calls in this browser') + '.',
                 });
             }
             else if (MatrixClientPeg.get().isRoomEncrypted(payload.room_id)) {
@@ -294,14 +295,14 @@ function _onAction(payload) {
                 // Therefore we disable conference calling in E2E rooms.
                 const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createDialog(ErrorDialog, {
-                    description: "Conference calls are not supported in encrypted rooms",
+                    description: _t('Conference calls are not supported in encrypted rooms'),
                 });
             }
             else {
                 var QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
                 Modal.createDialog(QuestionDialog, {
-                    title: "Warning!",
-                    description: "Conference calling is in development and may not be reliable.",
+                    title: _t('Warning!'),
+                    description: _t('Conference calling is in development and may not be reliable') + '.',
                     onFinished: confirm=>{
                         if (confirm) {
                             ConferenceHandler.createNewMatrixCall(
@@ -312,8 +313,8 @@ function _onAction(payload) {
                                 const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                                 console.error("Conference call failed: " + err);
                                 Modal.createDialog(ErrorDialog, {
-                                    title: "Failed to set up conference call",
-                                    description: "Conference call failed. " + ((err && err.message) ? err.message : ""),
+                                    title: _t('Failed to set up conference call'),
+                                    description: _t('Conference call failed') + '. ' + ((err && err.message) ? err.message : ''),
                                 });
                             });
                         }

src/ContentMessages.js

@@ -21,6 +21,7 @@ var extend = require('./extend');
 var dis = require('./dispatcher');
 var MatrixClientPeg = require('./MatrixClientPeg');
 var sdk = require('./index');
+import { _t } from './languageHandler';
 var Modal = require('./Modal');
 
 var encrypt = require("browser-encrypt-attachment");
@@ -347,14 +348,14 @@ class ContentMessages {
         }, function(err) {
             error = err;
             if (!upload.canceled) {
-                var desc = "The file '"+upload.fileName+"' failed to upload.";
+                var desc = _t('The file \'%(fileName)s\' failed to upload', {fileName: upload.fileName}) + '.';
                 if (err.http_status == 413) {
-                    desc = "The file '"+upload.fileName+"' exceeds this home server's size limit for uploads";
+                    desc = _t('The file \'%(fileName)s\' exceeds this home server\'s size limit for uploads', {fileName: upload.fileName});
                 }
                 var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createDialog(ErrorDialog, {
-                    title: "Upload Failed",
-                    description: desc
+                    title: _t('Upload Failed'),
+                    description: desc,
                 });
             }
         }).finally(() => {

src/DateUtils.js

@@ -1,5 +1,6 @@
 /*
 Copyright 2015, 2016 OpenMarket Ltd
+Copyright 2017 Vector Creations Ltd
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
@@ -15,9 +16,36 @@ limitations under the License.
 */
 
 'use strict';
+import { _t } from './languageHandler';
 
-const days = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
-const months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+function getDaysArray() {
+    return [
+        _t('Sun'),
+        _t('Mon'),
+        _t('Tue'),
+        _t('Wed'),
+        _t('Thu'),
+        _t('Fri'),
+        _t('Sat'),
+    ];
+}
+
+function getMonthsArray() {
+    return [
+        _t('Jan'),
+        _t('Feb'),
+        _t('Mar'),
+        _t('Apr'),
+        _t('May'),
+        _t('Jun'),
+        _t('Jul'),
+        _t('Aug'),
+        _t('Sep'),
+        _t('Oct'),
+        _t('Nov'),
+        _t('Dec'),
+    ];
+}
 
 function pad(n) {
     return (n < 10 ? '0' : '') + n;
@@ -34,20 +62,37 @@ function twelveHourTime(date) {
 module.exports = {
     formatDate: function(date) {
         var now = new Date();
+        const days = getDaysArray();
+        const months = getMonthsArray();
         if (date.toDateString() === now.toDateString()) {
             return this.formatTime(date);
         }
         else if (now.getTime() - date.getTime() < 6 * 24 * 60 * 60 * 1000) {
-            return days[date.getDay()] + " " + this.formatTime(date);
+            // TODO: use standard date localize function provided in counterpart
+            return _t('%(weekDayName)s %(time)s', {weekDayName: days[date.getDay()], time: this.formatTime(date)});
         }
         else if (now.getFullYear() === date.getFullYear()) {
-            return days[date.getDay()] + ", " + months[date.getMonth()] + " " + date.getDate() + " " + this.formatTime(date);
+            // TODO: use standard date localize function provided in counterpart
+            return _t('%(weekDayName)s, %(monthName)s %(day)s %(time)s', {
+                weekDayName: days[date.getDay()],
+                monthName: months[date.getMonth()],
+                day: date.getDate(),
+                time: this.formatTime(date),
+            });
         }
         return this.formatFullDate(date);
     },
 
     formatFullDate: function(date) {
-        return days[date.getDay()] + ", " + months[date.getMonth()] + " " + date.getDate() + " " + date.getFullYear() + " " + this.formatTime(date);
+        const days = getDaysArray();
+        const months = getMonthsArray();
+        return _t('%(weekDayName)s, %(monthName)s %(day)s %(fullYear)s %(time)s', {
+            weekDayName: days[date.getDay()],
+            monthName: months[date.getMonth()],
+            day: date.getDate(),
+            fullYear: date.getFullYear(),
+            time: this.formatTime(date),
+        });
     },
 
     formatTime: function(date, showTwelveHour=false) {

src/Lifecycle.js

@@ -27,6 +27,7 @@ import DMRoomMap from './utils/DMRoomMap';
 import RtsClient from './RtsClient';
 import Modal from './Modal';
 import sdk from './index';
+import { _t } from './languageHandler';
 
 /**
  * Called at startup, to attempt to build a logged-in Matrix session. It tries
@@ -229,14 +230,16 @@ function _handleRestoreFailure(e) {
 
     let msg = e.message;
     if (msg == "OLM.BAD_LEGACY_ACCOUNT_PICKLE") {
-        msg = "You need to log back in to generate end-to-end encryption keys "
-            + "for this device and submit the public key to your homeserver. "
-            + "This is a once off; sorry for the inconvenience.";
+        msg = _t(
+            'You need to log back in to generate end-to-end ' +
+            'encryption keys for this device and submit the public key to your homeserver. ' +
+            'This is a once off; sorry for the inconvenience'
+        ) + '.';
 
         _clearLocalStorage();
 
         return q.reject(new Error(
-            "Unable to restore previous session: " + msg,
+            _t('Unable to restore previous session') + ': ' + msg,
         ));
     }
 

src/Notifier.js

@@ -21,6 +21,7 @@ import TextForEvent from './TextForEvent';
 import Avatar from './Avatar';
 import dis from './dispatcher';
 import sdk from './index';
+import { _t } from './languageHandler';
 import Modal from './Modal';
 
 /*
@@ -134,13 +135,11 @@ const Notifier = {
                 if (result !== 'granted') {
                     // The permission request was dismissed or denied
                     const description = result === 'denied'
-                        ? 'Riot does not have permission to send you notifications'
-                        + ' - please check your browser settings'
-                        : 'Riot was not given permission to send notifications'
-                        + ' - please try again';
+                        ? _t('Riot does not have permission to send you notifications - please check your browser settings')
+                        : _t('Riot was not given permission to send notifications - please try again');
                     const ErrorDialog = sdk.getComponent('dialogs.ErrorDialog');
                     Modal.createDialog(ErrorDialog, {
-                        title: 'Unable to enable Notifications',
+                        title: _t('Unable to enable Notifications'),
                         description,
                     });
                     return;

src/PasswordReset.js

@@ -15,6 +15,7 @@ limitations under the License.
 */
 
 var Matrix = require("matrix-js-sdk");
+import { _t } from './languageHandler';
 
 /**
  * Allows a user to reset their password on a homeserver.
@@ -53,7 +54,7 @@ class PasswordReset {
             return res;
         }, function(err) {
             if (err.errcode == 'M_THREEPID_NOT_FOUND') {
-                 err.message = "This email address was not found";
+                 err.message = _t('This email address was not found');
             } else if (err.httpStatus) {
                 err.message = err.message + ` (Status ${err.httpStatus})`;
             }
@@ -78,10 +79,10 @@ class PasswordReset {
             }
         }, this.password).catch(function(err) {
             if (err.httpStatus === 401) {
-                err.message = "Failed to verify email address: make sure you clicked the link in the email";
+                err.message = _t('Failed to verify email address: make sure you clicked the link in the email');
             }
             else if (err.httpStatus === 404) {
-                err.message = "Your email address does not appear to be associated with a Matrix ID on this Homeserver.";
+                err.message = _t('Your email address does not appear to be associated with a Matrix ID on this Homeserver') + '.';
             }
             else if (err.httpStatus) {
                 err.message += ` (Status ${err.httpStatus})`;