more localizations

service-worker.js

@@ -5,15 +5,37 @@ importScripts('firebase-init.js');
 
 firebase.initializeApp(FIREBASE_INIT);
 
-// This method shows the notifications.
-firebase.messaging().setBackgroundMessageHandler(function(payload) {
+// Basic internationalization.
+const i18n = {
+  'en': {
+    'new_message': "New message",
+    'new_chat': "New chat",
+  },
+  'ru': {
+    'new_message': "Новое сообщение",
+    'new_chat': "Новый чат",
+  },
+  'zh': {
+    'new_message': "新讯息",
+    'new_chat': "新聊天",
+  }
+};
+self.i18nMessage = function(id) {
+  // Choose translations: given something like 'de-CH', try 'de-CH' then 'de' then 'en'.
+  const lang = i18n[self.locale] || i18n[self.baseLocale] || i18n['en'];
+  // Try id in the specified language, if missing try English, otherwise use id as the last resort.
+  return lang[id] || i18n['en'][id] || id;
+}
+
+// This method shows the push notifications.
+firebase.messaging().setBackgroundMessageHandler((payload) => {
   if (payload.data.silent === 'true') {
     return;
   }
   const pushType = payload.data.what || 'msg';
-  const title = payload.data.title || (pushType == 'msg' ? "New message" : "New chat");
+  const title = payload.data.title || self.i18nMessage(pushType == 'msg' ? 'new_message' : 'new_chat');
   const options = {
-    body: payload.data.content || "",
+    body: payload.data.content || '',
     icon: '/img/logo96.png',
     badge: '/img/badge96.png',
     tag: payload.data.topic || undefined,
@@ -82,7 +104,14 @@ self.addEventListener('fetch', event => {
       })
       .catch((err) => {
         // Something went wrong.
-        console.log("Service worker Fetch: ", err);
+        console.log("Service worker Fetch:", err);
       })
   );
 });
+
+// This code get the human language from the webapp for localization of strings.
+self.addEventListener('message', event => {
+  const data = JSON.parse(event.data);
+  self.locale = data.locale || '';
+  self.baseLocale = self.locale.toLowerCase().split(/[-_]/)[0];
+});

src/i18n/en.json

@@ -98,6 +98,10 @@
   "update_available": "Update available. <a href=\"\">Reload</a>.",
   "reconnect_countdown": "Disconnected. Reconnecting in {seconds}…",
   "reconnect_now": "Try now",
+  "push_init_failed": "Failed to initialize push notifications",
+  "invalid_security_token": "Invalid security token",
+  "no_connection": "No connection",
+  "code_doesnot_match": "Code does not match",
   "phone_dative": "phone",
   "email_dative": "email",
   "enter_confirmation_code_prompt": "Enter confirmation code sent to you by {method}:",

src/i18n/ru.json

@@ -165,5 +165,9 @@
   "button_add_another": "Добавить",
   "sidepanel_title_acc_general": "Общие настройки",
   "blocked_contacts_link": "Заблокированные ({count})",
-  "sidepanel_title_blocked": ":!![MISSING]!!:Blocked Chats"
+  "sidepanel_title_blocked": "Заблокированные чаты",
+  "push_init_failed": "Ошибка инициализации пуш уведомлений",
+  "invalid_security_token": "Токен некорректен",
+  "no_connection": "Нет связи",
+  "code_doesnot_match": "Код не совпадает"
 }

src/i18n/zh.json

@@ -165,5 +165,9 @@
   "button_add_another": "加上另一个",
   "sidepanel_title_acc_general": "常用设定",
   "blocked_contacts_link": "封锁的联络人 ({count})",
-  "sidepanel_title_blocked": "被阻止的聊天"
+  "sidepanel_title_blocked": "被阻止的聊天",
+  "push_init_failed": "初始化推送通知失败",
+  "invalid_security_token": "无效的安全令牌",
+  "no_connection": "无连接",
+  "code_doesnot_match": "代码不匹配"
 }

src/messages.json

@@ -99,6 +99,10 @@
     "update_available": "Update available. <a href=\"\">Reload</a>.",
     "reconnect_countdown": "Disconnected. Reconnecting in {seconds}…",
     "reconnect_now": "Try now",
+    "push_init_failed": "Failed to initialize push notifications",
+    "invalid_security_token": "Invalid security token",
+    "no_connection": "No connection",
+    "code_doesnot_match": "Code does not match",
     "phone_dative": "phone",
     "email_dative": "email",
     "enter_confirmation_code_prompt": "Enter confirmation code sent to you by {method}:",
@@ -334,7 +338,12 @@
     "button_edit": "Редактировать",
     "button_add_another": "Добавить",
     "sidepanel_title_acc_general": "Общие настройки",
-    "blocked_contacts_link": "Заблокированные ({count})"
+    "blocked_contacts_link": "Заблокированные ({count})",
+    "sidepanel_title_blocked": "Заблокированные чаты",
+    "push_init_failed": "Ошибка инициализации пуш уведомлений",
+    "invalid_security_token": "Токен некорректен",
+    "no_connection": "Нет связи",
+    "code_doesnot_match": "Код не совпадает"
   },
   "zh": {
     "archived_contacts": "已归档联系人 ({count})",
@@ -503,6 +512,10 @@
     "button_add_another": "加上另一个",
     "sidepanel_title_acc_general": "常用设定",
     "blocked_contacts_link": "封锁的联络人 ({count})",
-    "sidepanel_title_blocked": "被阻止的聊天"
+    "sidepanel_title_blocked": "被阻止的聊天",
+    "push_init_failed": "初始化推送通知失败",
+    "invalid_security_token": "无效的安全令牌",
+    "no_connection": "无连接",
+    "code_doesnot_match": "代码不匹配"
   }
 }

src/views/tinode-web.jsx

@@ -42,6 +42,26 @@ const messages = defineMessages({
     id: 'reconnect_now',
     defaultMessage: 'Try now',
     description: 'Prompt for reconnecting now'
+  },
+  push_init_failed: {
+    id: 'push_init_failed',
+    defaultMessage: 'Failed to initialize push notifications',
+    description: 'Error message when push notifications have failed to initialize.'
+  },
+  invalid_security_token: {
+    id: 'invalid_security_token',
+    defaultMessage: 'Invalid security token',
+    description: 'Error message when resetting password.'
+  },
+  no_connection: {
+    id: 'no_connection',
+    defaultMessage: 'No connection',
+    description: 'Warning that the user is offline.'
+  },
+  code_doesnot_match: {
+    id: 'code_doesnot_match',
+    defaultMessage: 'Code does not match',
+    description: 'Error message when the credential validation code is incorrect.'
   }
 });
 
@@ -197,7 +217,7 @@ class TinodeWeb extends React.Component {
       viewportHeight: document.documentElement.clientHeight
     });
 
-    const {locale} = this.props.intl;
+    const {formatMessage, locale} = this.props.intl;
     this.tinode = TinodeWeb.tnSetup(this.state.serverAddress, this.state.transport, locale);
     this.tinode.onConnect = this.handleConnected;
     this.tinode.onDisconnect = this.handleDisconnect;
@@ -211,6 +231,7 @@ class TinodeWeb extends React.Component {
         navigator.serviceWorker.register('/service-worker.js').then((reg) => {
           this.checkForAppUpdate(reg);
           this.fbPush.useServiceWorker(reg);
+          reg.active.postMessage(JSON.stringify({locale: locale}));
           this.initDesktopAlerts();
           if (this.state.desktopAlerts) {
             if (!this.state.firebaseToken) {
@@ -224,7 +245,7 @@ class TinodeWeb extends React.Component {
           console.log("Failed to register service worker:", err);
         });
       } catch (err) {
-        this.handleError("Failed to initialize push notifications", 'err');
+        this.handleError(formatMessage({id: 'push_init_failed'}), 'err');
         console.log("Failed to initialize push notifications", err);
         this.setState({desktopAlertsEnabled: false});
       }
@@ -338,7 +359,7 @@ class TinodeWeb extends React.Component {
     if (online) {
       this.handleError();
     } else {
-      this.handleError("No connection", 'warn');
+      this.handleError(this.props.intl.formatMessage({id: 'no_connection'}), 'warn');
     }
     this.setState({liveConnection: online});
   }
@@ -461,7 +482,7 @@ class TinodeWeb extends React.Component {
         if (ctrl.code >= 300 && ctrl.text === 'validate credentials') {
           this.setState({loadSpinnerVisible: false});
           if (cred) {
-            this.handleError("Code does not match", 'warn');
+            this.handleError(this.props.intl.formatMessage({id: 'code_doesnot_match'}), 'warn');
           }
           this.handleCredentialsRequest(ctrl.params);
         } else {
@@ -901,8 +922,7 @@ class TinodeWeb extends React.Component {
       this.tinode.onDisconnect = undefined;
       this.tinode.disconnect();
     }
-    const {locale} = this.props.intl;
-    this.tinode = TinodeWeb.tnSetup(serverAddress, transport, locale);
+    this.tinode = TinodeWeb.tnSetup(serverAddress, transport, this.props.intl.locale);
     this.tinode.onConnect = this.handleConnected;
     this.tinode.onDisconnect = this.handleDisconnect;
 
@@ -1131,8 +1151,7 @@ class TinodeWeb extends React.Component {
       this.tinode.disconnect();
     }
     this.setState(this.getBlankState());
-    const {locale} = this.props.intl;
-    this.tinode = TinodeWeb.tnSetup(this.state.serverAddress, this.state.transport, locale);
+    this.tinode = TinodeWeb.tnSetup(this.state.serverAddress, this.state.transport, this.props.intl.locale);
     this.tinode.onConnect = this.handleConnected;
     this.tinode.onDisconnect = this.handleDisconnect;
     HashNavigation.navigateTo('');
@@ -1217,7 +1236,6 @@ class TinodeWeb extends React.Component {
 
   defaultTopicContextMenu(topicName) {
     const topic = this.tinode.getTopic(topicName);
-    const {formatMessage} = this.props.intl;
 
     let muted = false, blocked = false, self_blocked = false, subscribed = false, deleter = false, archived = false;
     if (topic) {
@@ -1234,7 +1252,10 @@ class TinodeWeb extends React.Component {
     }
 
     return [
-      subscribed ? {title: formatMessage({id: 'menu_item_info'}), handler: this.handleShowInfoView} : null,
+      subscribed ? {
+        title: this.props.intl.formatMessage({id: 'menu_item_info'}),
+        handler: this.handleShowInfoView
+      } : null,
       subscribed ? 'messages_clear' : null,
       subscribed && deleter ? 'messages_clear_hard' : null,
       muted ? (blocked ? null : 'topic_unmute') : 'topic_mute',
@@ -1344,8 +1365,8 @@ class TinodeWeb extends React.Component {
 
   handleResetPassword(scheme, newPassword, token) {
     token = base64ReEncode(token);
-    if (!token)  {
-      this.handleError("Invalid security token", 'err');
+    if (!token) {
+      this.handleError(this.props.intl.formatMessage({id: 'invalid_security_token'}), 'err');
     } else {
       this.tinode.connect()
         .then(() => {