Translate src/components/structures

src/components/structures/CompatibilityPage.js

@@ -17,6 +17,7 @@ limitations under the License.
 'use strict';
 
 var React = require('react');
+import { _t, _tJsx } from 'matrix-react-sdk/lib/languageHandler';
 
 module.exports = React.createClass({
     displayName: 'CompatibilityPage',
@@ -39,23 +40,37 @@ module.exports = React.createClass({
         return (
         <div className="mx_CompatibilityPage">
             <div className="mx_CompatibilityPage_box">
-                <p>Sorry, your browser is <b>not</b> able to run Riot.</p>
+                <p>{ _tJsx("Sorry, your browser is <b>not</b> able to run Riot.", /<b>(.*?)<\/b>/, (sub) => <b>{sub}</b>) } </p>
                 <p>
-                Riot uses many advanced browser features, some of which are not
+                { _t("Riot uses many advanced browser features, some of which are not available or experimental in your current browser.") }
-                available or experimental in your current browser.
                 </p>
                 <p>
-                Please install <a href="https://www.google.com/chrome">Chrome</a> or <a href="https://getfirefox.com">Firefox</a> for
+                { _tJsx('Please install <a href="https://www.google.com/chrome">Chrome</a> or <a href="https://getfirefox.com">Firefox</a> for the best experience.',
-                the best experience. <a href="http://apple.com/safari">Safari</a> and <a href="http://opera.com">Opera</a> work too.
+                    [
+                        /<a href="https:\/\/www.google.com\/chrome">(.*?)<\/a>/,
+                        /<a href="https:\/\/getfirefox.com">(.*?)<\/a>/,
+                    ],
+                    [
+                        (sub) => <a href="https://www.google.com/chrome">{sub}</a>,
+                        (sub) => <a href="https://getfirefox.com">{sub}</a>,
+                    ]
+                )}
+                { _tJsx('<a href="http://apple.com/safari">Safari</a> and <a href="http://opera.com">Opera</a> work too.',
+                    [
+                        /<a href="http:\/\/apple\.com\/safari">(.*?)<\/a>/,
+                        /<a href="http:\/\/opera\.com">(.*?)<\/a>/,
+                    ],
+                    [
+                        (sub) => <a href="http://apple.com/safari">{sub}</a>,
+                        (sub) => <a href="http://opera.com">{sub}</a>,
+                    ]
+                )}
                 </p>
                 <p>
-                With your current browser, the look and feel of the application may
+                { _t("With your current browser, the look and feel of the application may be completely incorrect, and some or all features may not function. If you want to try it anyway you can continue, but you are on your own in terms of any issues you may encounter!") }
-                be completely incorrect, and some or all features may not function.
-                If you want to try it anyway you can continue, but you are on your own
-                in terms of any issues you may encounter!
                 </p>
                 <button onClick={this.onAccept}>
-                    I understand the risks and wish to continue
+                    { _t("I understand the risks and wish to continue") }
                 </button>
             </div>
         </div>

src/components/structures/RightPanel.js

@@ -93,7 +93,7 @@ module.exports = React.createClass({
             var NeedToRegisterDialog = sdk.getComponent("dialogs.NeedToRegisterDialog");
             Modal.createDialog(NeedToRegisterDialog, {
                 title: _t('Please Register'),
-                description: _t('Guest users can\'t invite users. Please register to invite') + '.'
+                description: _t('Guest users can\'t invite users. Please register to invite.')
             });
             return;
         }
@@ -218,7 +218,7 @@ module.exports = React.createClass({
                             <TintableSvg src="img/icons-notifications.svg" width="25" height="25"/>
                             { notificationsHighlight }
                         </AccessibleButton>
-                        <div className="mx_RightPanel_headerButton mx_RightPanel_collapsebutton" title="Hide panel" onClick={ this.onCollapseClick }>
+                        <div className="mx_RightPanel_headerButton mx_RightPanel_collapsebutton" title={ _t("Hide panel") } onClick={ this.onCollapseClick }>
                             <TintableSvg src="img/minimise.svg" width="10" height="16"/>
                         </div>
                   </div>;

src/components/structures/RoomDirectory.js

@@ -213,11 +213,11 @@ module.exports = React.createClass({
 
                 var Loader = sdk.getComponent("elements.Spinner");
                 var modal = Modal.createDialog(Loader);
-                var step = _t('remove %(name)s from the directory', {name: name}) + '.';
+                var step = _t('remove %(name)s from the directory.', {name: name});
 
                 MatrixClientPeg.get().setRoomDirectoryVisibility(room.room_id, 'private').then(() => {
                     if (!alias) return;
-                    step = _t('delete the alias') + '.';
+                    step = _t('delete the alias.');
                     return MatrixClientPeg.get().deleteAlias(alias);
                 }).done(() => {
                     modal.close();
@@ -356,7 +356,7 @@ module.exports = React.createClass({
                     var NeedToRegisterDialog = sdk.getComponent("dialogs.NeedToRegisterDialog");
                     Modal.createDialog(NeedToRegisterDialog, {
                         title: _t('Failed to join the room'),
-                        description: _t('This room is inaccessible to guests. You may be able to join if you register') + '.'
+                        description: _t('This room is inaccessible to guests. You may be able to join if you register.')
                     });
                     return;
                 }

src/components/structures/SearchBox.js

@@ -100,13 +100,13 @@ module.exports = React.createClass({
         if (this.props.collapsed) {
             toggleCollapse =
                 <AccessibleButton className="mx_SearchBox_maximise" tabIndex={collapseTabIndex} onClick={ this.onToggleCollapse.bind(this, true) }>
-                    <TintableSvg src="img/maximise.svg" width="10" height="16" alt="Expand panel"/>
+                    <TintableSvg src="img/maximise.svg" width="10" height="16" alt={ _t("Expand panel") }/>
                 </AccessibleButton>
         }
         else {
             toggleCollapse =
                 <AccessibleButton className="mx_SearchBox_minimise" tabIndex={collapseTabIndex} onClick={ this.onToggleCollapse.bind(this, false) }>
-                    <TintableSvg src="img/minimise.svg" width="10" height="16" alt="Collapse panel"/>
+                    <TintableSvg src="img/minimise.svg" width="10" height="16" alt={ _t("Collapse panel") }/>
                 </AccessibleButton>
         }
 

src/i18n/strings/en_EN.json

@@ -1,4 +1,5 @@
 {
+  "<a href=\"http://apple.com/safari\">Safari</a> and <a href=\"http://opera.com\">Opera</a> work too.": "<a href=\"http://apple.com/safari\">Safari</a> and <a href=\"http://opera.com\">Opera</a> work too.",
   "Add an email address above to configure email notifications": "Add an email address above to configure email notifications",
   "Advanced notification settings": "Advanced notification settings",
   "All messages": "All messages",
@@ -48,6 +49,7 @@
   " from room": " from room",
   "Guests can join": "Guests can join",
   "Guest users can't invite users. Please register to invite": "Guest users can't invite users. Please register to invite",
+  "I understand the risks and wish to continue": "I understand the risks and wish to continue",
   "Invite to this room": "Invite to this room",
   "Keywords": "Keywords",
   "Leave": "Leave",
@@ -72,6 +74,7 @@
   "On": "On",
   "Operation failed": "Operation failed",
   "Permalink": "Permalink",
+  "Please install <a href=\"https://www.google.com/chrome\">Chrome</a> or <a href=\"https://getfirefox.com\">Firefox</a> for the best experience.": "Please install <a href=\"https://www.google.com/chrome\">Chrome</a> or <a href=\"https://getfirefox.com\">Firefox</a> for the best experience.",
   "Please Register": "Please Register",
   "powered by Matrix": "powered by Matrix",
   "Quote": "Quote",
@@ -83,11 +86,13 @@
   "Remove from Directory": "Remove from Directory",
   "Resend": "Resend",
   "Riot does not know how to join a room on this network": "Riot does not know how to join a room on this network",
+  "Riot uses many advanced browser features, some of which are not available or experimental in your current browser.": "Riot uses many advanced browser features, some of which are not available or experimental in your current browser.",
   "Room directory": "Room directory",
   "Room not found": "Room not found",
   "Search for a room": "Search for a room",
   "Settings": "Settings",
   "Source URL": "Source URL",
+  "Sorry, your browser is <b>not</b> able to run Riot.": "Sorry, your browser is <b>not</b> able to run Riot.",
   "Start chat": "Start chat",
   "The Home Server may be too old to support third party networks": "The Home Server may be too old to support third party networks",
   "There are advanced notifications which are not shown here": "There are advanced notifications which are not shown here",
@@ -118,5 +123,6 @@
   "Saturday": "Saturday",
   "Today": "Today",
   "Yesterday": "Yesterday",
-  "Welcome page": "Welcome page"
+  "Welcome page": "Welcome page",
+  "With your current browser, the look and feel of the application may be completely incorrect, and some or all features may not function. If you want to try it anyway you can continue, but you are on your own in terms of any issues you may encounter!": "With your current browser, the look and feel of the application may be completely incorrect, and some or all features may not function. If you want to try it anyway you can continue, but you are on your own in terms of any issues you may encounter!"
 }