Allow user to set display name when registering.

background.html

@@ -161,7 +161,7 @@
       {{ #title }}
         <h4>{{ title }}</h4>
       {{ /title }}
-      <input type='text' name='name' class='name' placeholder='Type a name' autofocus maxlength="25">
+      <input type='text' name='name' class='name' placeholder='Type a name' autofocus maxlength='25'>
       {{ #message }}
         <div class='message'>{{ message }}</div>
       {{ /message }}
@@ -594,6 +594,9 @@
         <div class='step-body'>
           <div class='header'>Create your Loki Messenger Account</div>
 
+          <input class='form-control' type='text' id='display-name' placeholder='Display Name (optional)' autocomplete='off' spellcheck='false' maxlength='25'>
+
+          <hr>
           <input class='form-control' type='text' id='mnemonic' placeholder='Mnemonic' autocomplete='off' spellcheck='false'>
 
           <select id='mnemonic-language'></select>
@@ -603,7 +606,7 @@
           </div>
           <div id='error' class='collapse'></div>
           <div id=status></div>
-
+          <hr>
         </div>
         <div class='nav'>
           <a class='button' id='register' data-loading-text='Please wait...'>Register</a>

js/background.js

@@ -579,27 +579,15 @@
           message: window.i18n('editProfileDisplayNameWarning'),
           nickname: displayName,
           onOk: async (newName) => {
-            // Update our profiles accordingly'
+            await storage.setProfileName(newName);
-            const trimmed = newName && newName.trim();
-
-            // If we get an empty name then unset the name property
-            // Otherwise update it
-            const newProfile = profile || {};
-            if (_.isEmpty(trimmed)) {
-              delete newProfile.name;
-            } else {
-              newProfile.name = {
-                displayName: trimmed,
-              }
-            }
-
-            await storage.saveLocalProfile(newProfile);
             appView.inboxView.trigger('updateProfile');
 
             // Update the conversation if we have it
             const conversation = ConversationController.get(ourNumber);
-            if (conversation)
+            if (conversation) {
+              const newProfile = storage.getLocalProfile();
               conversation.setProfile(newProfile);
+            }
           },
         })
       }

js/models/profile.js

@@ -16,6 +16,25 @@
     return profile;
   }
 
+  storage.setProfileName = async (newName) => {
+    // Update our profiles accordingly'
+    const trimmed = newName && newName.trim();
+
+    // If we get an empty name then unset the name property
+    // Otherwise update it
+    const profile = storage.getLocalProfile();
+    const newProfile = profile || {};
+    if (_.isEmpty(trimmed)) {
+      delete newProfile.name;
+    } else {
+      newProfile.name = {
+        displayName: trimmed,
+      }
+    }
+
+    await storage.saveLocalProfile(newProfile);
+  }
+
   storage.saveLocalProfile = async (profile) => {
     const storedProfile = storage.get(PROFILE_ID, null);
 

js/views/standalone_registration_view.js

@@ -1,4 +1,4 @@
-/* global Whisper, $, getAccountManager, textsecure */
+/* global Whisper, $, getAccountManager, textsecure, storage, ConversationController */
 
 /* eslint-disable more/no-then */
 
@@ -47,7 +47,17 @@
       this.accountManager
         .registerSingleDevice(
           this.$('#mnemonic').val(),
-          this.$('#mnemonic-language').val()
+          this.$('#mnemonic-language').val(),
+          async (pubKey) => {
+            await storage.setProfileName(this.$('#display-name').val());
+
+            // Update the conversation if we have it
+            const conversation = ConversationController.get(pubKey);
+            if (conversation) {
+              const newProfile = storage.getLocalProfile();
+              conversation.setProfile(newProfile);
+            }
+          }
         )
         .then(() => {
           this.$el.trigger('openInbox');

libtextsecure/account_manager.js

@@ -49,7 +49,7 @@
     requestSMSVerification(number) {
       // return this.server.requestVerificationSMS(number);
     },
-    registerSingleDevice(mnemonic, mnemonicLanguage) {
+    registerSingleDevice(mnemonic, mnemonicLanguage, callback) {
       const createAccount = this.createAccount.bind(this);
       const clearSessionsAndPreKeys = this.clearSessionsAndPreKeys.bind(this);
       const generateKeys = this.generateKeys.bind(this, 0);
@@ -77,7 +77,8 @@
               .then(confirmKeys)
               .then(() => {
                 const pubKeyString = StringView.arrayBufferToHex(identityKeyPair.pubKey);
-                registrationDone(pubKeyString)
+                registrationDone(pubKeyString);
+                callback(pubKeyString);
               });
           }
         )

stylesheets/_global.scss

@@ -647,6 +647,10 @@ textarea {
     max-width: 35em;
   }
 
+  #display-name {
+    margin-bottom: 12px;
+  }
+
   .inner {
     display: flex;
     align-items: center;