Make all display strings translatable

This patch enables localization of all previously hard-coded display strings.
author: Sami Vänttinen <sami.vanttinen@protonmail.com> 2018-09-30 00:37:16 +0300
committer: Janek Bevendorff <janek@jbev.net> 2018-09-30 00:37:15 +0300
commit: dc4ad0c27d3a2a19725aa9bbd5b16a18ed96d491 (patch)
tree: c994f46f3f27602907c7d35b923f215f0ed9c483 /keepassxc-browser/popups
parent: 0231f2465aa77925af4f8d640aacd7749ef726ea (diff)
6 files changed, 79 insertions, 97 deletions
diff --git a/keepassxc-browser/popups/popup.html b/keepassxc-browser/popups/popup.html
index d049a0a..496bb84 100644
--- a/keepassxc-browser/popups/popup.html
+++ b/keepassxc-browser/popups/popup.html
@@ -1,6 +1,6 @@
 <html>
   <head>
-    <title>KeePassXC - Popup</title>
+    <title data-i18n="popupTitle"></title>
     <meta charset="UTF-8">
     <link rel="stylesheet" href="popup.css" />
     <link rel="stylesheet" href="../options/bootstrap.min.css" />
@@ -14,86 +14,70 @@
   <body>
     <div class="container">
       <div id="settings" class="settings">
-        <button id="btn-options" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-cog"></span> Settings</button>
-        <button id="btn-choose-credential-fields" class="btn btn-sm btn-warning"><span class="glyphicon glyphicon-list-alt"></span> Choose custom credential fields for this page</button>
+        <button id="btn-options" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-cog"></span><span data-i18n="popupSettingsText"/></button>
+        <button id="btn-choose-credential-fields" class="btn btn-sm btn-warning"><span class="glyphicon glyphicon-list-alt"></span><span data-i18n="popupChooseCredentialsText"/></button>
         <button id="lock-database-button" class="btn btn-danger" title="Lock database"><span class="glyphicon glyphicon-lock"></span></button>
 
         <div id="update-available" class="alert alert-danger">
-          You use an old version of KeePassXC.
+          <span data-i18n="popupUpdateAvailable"></span>
           <br />
-          <a target="_blank" class="alert-link" href="https://keepassxc.org/download">Please download the latest version from keepassxc.org</a>.
+          <a target="_blank" class="alert-link" href="https://keepassxc.org/download"><span data-i18n="popupDownloadNewVersion"/></a>.
         </div>
       </div>
 
       <div id="initial-state">
-        <p><img style="margin-right: 1em" src="throbber.gif"/> Checking status...</p>
+        <p><img style="margin-right: 1em" src="throbber.gif"/><span data-i18n="popupCheckingStatus"/></p>
       </div>
 
       <div id="not-configured" style="display: none">
-        <p>
-          KeePassXC-Browser has not been configured.
-          Press the connect button to register and pair with KeePassXC.
-        </p>
+        <p data-i18n="popupNotConfigured"/>
         <div style="text-align: right">
-          <button id="connect-button" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-link"></span> Connect</button>
+          <button id="connect-button" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-link"></span><span data-i18n="popupConnectButton"/></button>
         </div>
       </div>
 
       <div id="need-reconfigure" style="display: none">
-        <p>
-          KeePassXC-Browser has been disconnected from KeePassXC.
-        </p>
-        <code id="need-reconfigure-message"></code>
-        <p>
-          Press the reconnect button to establish a new connection.
+        <p data-i18n="popupNeedReconfigure"/>
+        <p style="margin-left: 1em">
+          <code id="need-reconfigure-message"></code>
         </p>
+        <p data-i18n="popupNeedReconfigureMessage"/>
         <div style="text-align: right">
-          <button id="reconnect-button" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-refresh"></span> Reconnect</button>
+          <button id="reconnect-button" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-refresh"></span><span data-i18n="popupReconnectButton"/></button>
         </div>
       </div>
 
       <div id="configured-not-associated" style="display: none">
-        <p>
-          KeePassXC-Browser has been configured using the identifier
-          <em id="unassociated-identifier"></em> and has not yet
-          connected to KeePassXC.
-        </p>
+        <span data-i18n="popupConfiguredNotAssociated" i18n-placeholder="<span class='bg-warning' id='unassociated-identifier'></span>"></span>
       </div>
 
       <div id="configured-and-associated" style="display: none">
-        <p>
-          KeePassXC-Browser has been configured using the identifier
-          "<em id="associated-identifier"></em>" and is successfully
-          connected to KeePassXC.
-        </p>
+        <span data-i18n="popupConfiguredAndAssociated" i18n-placeholder="<span class='bg-success' id='associated-identifier'></span>"></span>
         <div style="text-align: right">
-            <button id="redetect-fields-button" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-list-alt"></span> Redetect credential fields</button>
+          <button id="redetect-fields-button" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-list-alt"></span><span data-i18n="popupRedetectButton"/></button>
         </div>
       </div>
 
       <div id="error-encountered" style="display: none">
-        <p>
-          KeePassXC-Browser has encountered an error:
-        </p>
+        <p data-i18n="popupErrorEncountered"/>
         <p style="margin-left: 1em">
           <code id="error-message"></code>
         </p>
         <div style="text-align: right">
-          <button id="reload-status-button" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-refresh"></span> Reload</button>
+          <button id="reload-status-button" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-refresh"></span><span data-i18n="popupReloadButton"/></button>
         </div>
       </div>
 
       <div id="database-not-opened" style="display: none">
-        <p>
-          KeePassXC-Browser has encountered an error:
-        </p>
+        <p data-i18n="popupErrorEncountered"/>
         <p style="margin-left: 1em">
           <code id="database-error-message"></code>
         </p>
         <div style="text-align: right">
-          <button id="reopen-database-button" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-lock"></span> Reopen database</button>
+          <button id="reopen-database-button" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-lock"></span><span data-i18n="popupReopenButton"/></button>
         </div>
       </div>
     </div>
+    <script type="text/javascript" src="../translate.js"></script>
   </body>
 </html>
diff --git a/keepassxc-browser/popups/popup_httpauth.html b/keepassxc-browser/popups/popup_httpauth.html
index 0adeec7..2a1c773 100644
--- a/keepassxc-browser/popups/popup_httpauth.html
+++ b/keepassxc-browser/popups/popup_httpauth.html
@@ -14,26 +14,25 @@
   <body>
     <div class="container">
       <div id="settings" class="settings">
-        <button id="btn-options" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-cog"></span> Settings</button>
-        <button id="btn-choose-credential-fields" class="btn btn-sm btn-warning"><span class="glyphicon glyphicon-list-alt"></span> Choose custom credential fields for this page</button>
+        <button id="btn-options" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-cog"></span><span data-i18n="popupSettingsText"/></button>
+        <button id="btn-choose-credential-fields" class="btn btn-sm btn-warning"><span class="glyphicon glyphicon-list-alt"></span><span data-i18n="popupChooseCredentialsText"/></button>
         <button id="lock-database-button" class="btn btn-danger" title="Lock database"><span class="glyphicon glyphicon-lock"></span></button>
 
         <div id="update-available" class="alert alert-danger">
-          You use an old version of KeePassXC.
+          <span data-i18n="popupUpdateAvailable"></span>
           <br />
-          <a target="_blank" class="alert-link" href="https://keepassxc.org/download">Please download the latest version from keepassxc.org</a>.
+          <a target="_blank" class="alert-link" href="https://keepassxc.org/download"><span data-i18n="popupDownloadNewVersion"/></a>.
+        </div>
         </div>
-      </div>
 
       <div class="credentials">
-        <p>
-          Select the login information you would like to get logged in with:
-        </p>
+        <p data-i18n="popupAuthText"></p>
         <div id="login-list" class="list-group"></div>
         <p>
-          <button id="btn-dismiss" class="btn btn-sm btn-danger"><span class="glyphicon glyphicon-remove"></span> Dismiss and show the default authentication dialog</button>
+          <button id="btn-dismiss" class="btn btn-sm btn-danger"><span class="glyphicon glyphicon-remove"></span><span data-i18n="popupButtonDismissHttpAuth"/></button>
         </p>
       </div>
     </div>
+    <script type="text/javascript" src="../translate.js"></script>
   </body>
 </html>
diff --git a/keepassxc-browser/popups/popup_login.html b/keepassxc-browser/popups/popup_login.html
index d484c32..768aff0 100644
--- a/keepassxc-browser/popups/popup_login.html
+++ b/keepassxc-browser/popups/popup_login.html
@@ -14,27 +14,26 @@
   <body>
     <div class="container">
       <div id="settings" class="settings">
-        <button id="btn-options" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-cog"></span> Settings</button>
-        <button id="btn-choose-credential-fields" class="btn btn-sm btn-warning"><span class="glyphicon glyphicon-list-alt"></span> Choose custom credential fields for this page</button>
+        <button id="btn-options" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-cog"></span><span data-i18n="popupSettingsText"/></button>
+        <button id="btn-choose-credential-fields" class="btn btn-sm btn-warning"><span class="glyphicon glyphicon-list-alt"></span><span data-i18n="popupChooseCredentialsText"/></button>
         <button id="lock-database-button" class="btn btn-danger" title="Lock database"><span class="glyphicon glyphicon-lock"></span></button>
 
         <div id="update-available" class="alert alert-danger">
-          You use an old version of KeePassXC.
+          <span data-i18n="popupUpdateAvailable"></span>
           <br />
-          <a target="_blank" class="alert-link" href="https://keepassxc.org/download">Please download the latest version from keepassxc.org</a>.
+          <a target="_blank" class="alert-link" href="https://keepassxc.org/download"><span data-i18n="popupDownloadNewVersion"/></a>.
         </div>
       </div>
 
       <div class="credentials">
-        <p>
-          Select the login information you would like to get entered into the page:
-        </p>
+        <p data-i18n="popupLoginText"></p>
         <div id="filter-block" style="display: none;">
-          <label for="login-filter">Filter:</label>
+          <label for="login-filter" data-i18n="popupFilterText"></label>
           <input type="text" id="login-filter">
         </div>
         <div id="login-list" class="list-group"></div>
       </div>
     </div>
+    <script type="text/javascript" src="../translate.js"></script>
   </body>
 </html>
diff --git a/keepassxc-browser/popups/popup_multiple-fields.html b/keepassxc-browser/popups/popup_multiple-fields.html
index 6678540..b77c611 100644
--- a/keepassxc-browser/popups/popup_multiple-fields.html
+++ b/keepassxc-browser/popups/popup_multiple-fields.html
@@ -1,36 +1,36 @@
 <html>
   <head>
-	<title>KeePassXC-Browser - Popup</title>
-	<meta charset="UTF-8">
-	<link rel="stylesheet" href="popup.css" />
-	<link rel="stylesheet" href="../options/bootstrap.min.css" />
-	<script type="text/javascript" src="../browser-polyfill.min.js"></script>
-	<script type="text/javascript" src="../global.js"></script>
-	<script type="text/javascript" src="../jquery-3.3.1.min.js"></script>
-	<script type="text/javascript" src="../options/bootstrap.min.js" /></script>
-	<script type="text/javascript" src="popup_functions.js"></script>
+    <title>KeePassXC-Browser - Popup</title>
+    <meta charset="UTF-8">
+    <link rel="stylesheet" href="popup.css" />
+    <link rel="stylesheet" href="../options/bootstrap.min.css" />
+    <script type="text/javascript" src="../browser-polyfill.min.js"></script>
+    <script type="text/javascript" src="../global.js"></script>
+    <script type="text/javascript" src="../jquery-3.3.1.min.js"></script>
+    <script type="text/javascript" src="../options/bootstrap.min.js" /></script>
+    <script type="text/javascript" src="popup_functions.js"></script>
   </head>
   <body>
-	<div class="container">
-	  <div id="settings" class="settings">
-		<button id="btn-options" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-cog"></span> Settings</button>
-		<button id="btn-choose-credential-fields" class="btn btn-sm btn-warning"><span class="glyphicon glyphicon-list-alt"></span> Choose custom credential fields for this page</button>
-		<button id="lock-database-button" class="btn btn-danger" title="Lock database"><span class="glyphicon glyphicon-lock"></span></button>
+    <div class="container">
+      <div id="settings" class="settings">
+        <button id="btn-options" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-cog"></span><span data-i18n="popupSettingsText"/></button>
+        <button id="btn-choose-credential-fields" class="btn btn-sm btn-warning"><span class="glyphicon glyphicon-list-alt"></span><span data-i18n="popupChooseCredentialsText"/></button>
+        <button id="lock-database-button" class="btn btn-danger" title="Lock database"><span class="glyphicon glyphicon-lock"></span></button>
 
-		<div id="update-available" class="alert alert-danger">
-		  You use an old version of KeePassXC.
-		  <br />
-		  <a target="_blank" class="alert-link" href="https://keepassxc.org/download">Please download the latest version from keepassxc.org</a>.
-		</div>
-	  </div>
+        <div id="update-available" class="alert alert-danger">
+          <span data-i18n="popupUpdateAvailable"></span>
+          <br />
+          <a target="_blank" class="alert-link" href="https://keepassxc.org/download"><span data-i18n="popupDownloadNewVersion"/></a>.
+        </div>
+      </div>
 
-	  <div>
-		<p>
-		  KeePassXC-Browser found more than one password field on this page. To enter your
-		  logins, right-click on one of the password fields, and choose either the
-		  "<code>Fill User + Pass</code>" or "<code>Fill Pass Only</code>" command.
-		</p>
-	  </div>
-	</div>
+      <div>
+        <p>
+          <span data-i18n="popupMultiplePasswordFields"></span>
+          "<code><span data-i18n="contextMenuFillUsernameAndPassword"></span></code>", "<code><span data-i18n="contextMenuFillPassword"></span></code>"
+        </p>
+      </div>
+    </div>
+    <script type="text/javascript" src="../translate.js"></script>
   </body>
 </html>
diff --git a/keepassxc-browser/popups/popup_remember.html b/keepassxc-browser/popups/popup_remember.html
index 6d367b4..d72e836 100644
--- a/keepassxc-browser/popups/popup_remember.html
+++ b/keepassxc-browser/popups/popup_remember.html
@@ -17,36 +17,36 @@
       .credentials .username-exists {display: none;}
       .small { font-weight: bold; }
       .small .normal { font-weight: normal; }
+      .info { font-weight: normal; }
     </style>
   </head>
   <body>
     <div class="buttons">
       <p>
-        Username or password changed! Save it?
+        <span data-i18n="popupRememberInfoText"></span>
         <br />
-        <span class="small information-url">Url: <span class="normal"></span></span>
+        <span class="small" data-i18n="popupURL"></span><span class="small info information-url"></span>
         <br />
-        <span class="small information-username">Username: <span class="normal"></span></span>
+        <span class="small" data-i18n="popupUsername"></span><span class="small info information-username"></span>
       </p>
       <p>
-        <button id="btn-new" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-pencil"></span> New</button>
-        <button id="btn-update" class="btn btn-sm btn-warning"><span class="glyphicon glyphicon-refresh"></span> Update</button>
-        <button id="btn-dismiss" class="btn btn-sm btn-danger"><span class="glyphicon glyphicon-remove"></span> Dismiss</button>
-        <button id="btn-ignore" class="btn btn-sm btn-default"><span class="glyphicon glyphicon-remove"></span> Never ask for this page</button>
+        <button id="btn-new" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-pencil"></span><span data-i18n="popupButtonNew"></span></button>
+        <button id="btn-update" class="btn btn-sm btn-warning"><span class="glyphicon glyphicon-refresh"></span><span data-i18n="popupButtonUpdate"></span></button>
+        <button id="btn-dismiss" class="btn btn-sm btn-danger"><span class="glyphicon glyphicon-remove"></span><span data-i18n="popupButtonDismiss"></span></button>
+        <button id="btn-ignore" class="btn btn-sm btn-default"><span class="glyphicon glyphicon-remove"></span><span data-i18n="popupButtonIgnore"></span></button> <!--missing-->
       </p>
     </div>
 
     <div class="connected-database">
-      <p>Credentials will be saved in connected database with identifier <em></em>.</p>
+      <p data-i18n="popupRememberSaving" i18n-placeholder="<span></span><em></em>"></p>
     </div>
 
     <div class="credentials">
-      <p class="username-new">The used username <strong></strong> is currently not saved!</p>
-      <p class="username-exists">The credentials with the used username <strong></strong> are marked bold.</p>
-      <p>
-        Please choose the credentials you want to update:
-      </p>
+      <p class="username-new"><span data-i18n="popupRememberNewUsername" i18n-placeholder="<strong></strong>"></span></p>
+      <p class="username-exists"><span data-i18n="popupRememberUsernameExists" i18n-placeholder="<strong></strong>"></span></p>
+      <p data-i18n="popupRememberChooseCredentials"></p>
       <ul id="list"></ul>
     </div>
+    <script type="text/javascript" src="../translate.js"></script>
   </body>
 </html>
diff --git a/keepassxc-browser/popups/popup_remember.js b/keepassxc-browser/popups/popup_remember.js
index fd1b9ca..f189205 100644
--- a/keepassxc-browser/popups/popup_remember.js
+++ b/keepassxc-browser/popups/popup_remember.js
@@ -23,8 +23,8 @@ function _initialize(tab) {
 
     let url = _tab.credentials.url;
     url = (url.length > 50) ? url.substring(0, 50) + '...' : url;
-    $('.information-url:first span:first').text(url);
-    $('.information-username:first span:first').text(_tab.credentials.username);
+    $('.information-url:first').text(url);
+    $('.information-username:first').text(_tab.credentials.username);
 
     $('#btn-new').click(function(e) {
         browser.runtime.sendMessage({
author	Sami Vänttinen <sami.vanttinen@protonmail.com>	2018-09-30 00:37:16 +0300
committer	Janek Bevendorff <janek@jbev.net>	2018-09-30 00:37:15 +0300
commit	dc4ad0c27d3a2a19725aa9bbd5b16a18ed96d491 (patch)
tree	c994f46f3f27602907c7d35b923f215f0ed9c483 /keepassxc-browser/popups
parent	0231f2465aa77925af4f8d640aacd7749ef726ea (diff)