Allow generating mnemonic for different languages.

background.html

@@ -625,6 +625,12 @@
               </br>
               They can be used to restore your account if you lose access or migrate to a new device.
             </div>
+            <div class='standalone-register-language'>
+              <span>Language:</span>
+              <div class='select-container'>
+                <select id='mnemonic-display-language'></select>
+              </div>
+            </div>
             <div id='mnemonic-display' />
             <div class='standalone-register-buttons'>
               <a class='button' id='generate-mnemonic'>Generate Seed</a>

js/views/standalone_registration_view.js

@@ -29,14 +29,12 @@
 
       this.onGenerateMnemonic();
 
-      window.mnemonic.get_languages().forEach(language => {
+      const options = window.mnemonic.get_languages().map(language => {
-        this.$('#mnemonic-language').append(
+        const text = language.charAt(0).toUpperCase() + language.slice(1);
-          $('<option>', {
+        return `<option value="${language}">${text}</option>`;
-            value: language,
-            text: language.charAt(0).toUpperCase() + language.slice(1),
-          })
-        );
       });
+      this.$('#mnemonic-language').append(options);
+      this.$('#mnemonic-display-language').append(options);
     },
     events: {
       'validation input.number': 'onValidation',
@@ -47,6 +45,7 @@
       'click #register-mnemonic': 'registerWithMnemonic',
       'change #mnemonic': 'onChangeMnemonic',
       'click #generate-mnemonic': 'onGenerateMnemonic',
+      'change #mnemonic-display-language': 'onGenerateMnemonic',
       'click #copy-mnemonic': 'onCopyMnemonic',
       'click .section-toggle': 'toggleSection',
     },
@@ -78,7 +77,8 @@
       this.$('#status').html('');
     },
     async onGenerateMnemonic() {
-      const mnemonic = await this.accountManager.generateMnemonic();
+      const language = this.$('#mnemonic-display-language').val();
+      const mnemonic = await this.accountManager.generateMnemonic(language);
       this.$('#mnemonic-display').text(mnemonic)
     },
     onCopyMnemonic() {

libtextsecure/account_manager.js

@@ -446,10 +446,10 @@
         );
       });
     },
-    async generateMnemonic() {
+    async generateMnemonic(language = 'english') {
       const keys = await libsignal.KeyHelper.generateIdentityKeyPair();
       const hex = StringView.arrayBufferToHex(keys.privKey);
-      return mnemonic.mn_encode(hex);
+      return mnemonic.mn_encode(hex, language);
     },
     async registrationDone(number, profileName) {
       window.log.info('registration done');

stylesheets/_global.scss

@@ -904,6 +904,17 @@ textarea {
     margin: 0px 8px;
   }
 
+  .standalone-register-language {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-top: 2em;
+
+    span {
+      margin-right: 8px;
+    }
+  }
+
   .display-name-header {
     margin-bottom: 8px;
     font-size: 14px;