Merge pull request #17 from sachaaaaa/lock_input_friend_request

Lock input after friend request is sent

_locales/en/messages.json

@@ -821,6 +821,14 @@
     "message": "Send a message",
     "description": "Placeholder text in the message entry field"
   },
+  "sendMessageDisabled": {
+    "message": "Waiting for friend request approval",
+    "description": "Placeholder text in the message entry field when it is disabled while we are waiting for a friend request approval"
+  },
+  "sendMessageFriendRequest": {
+    "message": "Hi there! This is <insert name here> !",
+    "description": "Placeholder text in the message entry field when it is the first message sent to that contact"
+  },
   "groupMembers": {
     "message": "Group members"
   },

background.html

@@ -127,16 +127,16 @@
             <form class='send clearfix'>
               <div class='attachment-previews'></div>
               <div class='flex'>
-                <button class='emoji'></button>
-                <textarea class='send-message' placeholder='{{ send-message }}' rows='1' dir='auto'></textarea>
+                <button class='emoji' {{#disable-inputs}} disabled="disabled" {{/disable-inputs}}></button>
+                <textarea class='send-message' placeholder='{{ send-message }}' rows='1' dir='auto' {{#disable-inputs}} disabled="disabled" {{/disable-inputs}}></textarea>
                 <div class='capture-audio'>
-                    <button class='microphone'></button>
+                    <button class='microphone' {{#disable-inputs}} disabled="disabled" {{/disable-inputs}}></button>
                 </div>
                 <div class='android-length-warning'>
                     {{ android-length-warning }}
                 </div>
                 <div class='choose-file'>
-                    <button class='paperclip thumbnail'></button>
+                    <button class='paperclip thumbnail' {{#disable-inputs}} disabled="disabled" {{/disable-inputs}}></button>
                     <input type='file' class='file-input'>
                 </div>
               </div>

js/models/conversations.js

@@ -57,6 +57,7 @@
         unreadCount: 0,
         verified: textsecure.storage.protocol.VerifiedStatus.DEFAULT,
         keyExchangeCompleted: false,
+        friendRequestStatus: { allowSending: true, unlockTimestamp: null }
       };
     },
 
@@ -118,6 +119,10 @@
       this.on('read', this.updateAndMerge);
       this.on('expiration-change', this.updateAndMerge);
       this.on('expired', this.onExpired);
+
+      setTimeout(() => {
+        this.setFriendRequestTimer();
+      }, 0);
     },
 
     isMe() {
@@ -367,6 +372,57 @@
       
       this.set({ keyExchangeCompleted: completed });
     },
+    getFriendRequestStatus() {
+      return this.get('friendRequestStatus');
+    },
+    waitingForFriendRequestApproval() {
+      const friendRequestStatus = this.getFriendRequestStatus();
+      if (!friendRequestStatus) {
+        return false;
+      }
+      return !friendRequestStatus.allowSending;
+    },
+    setFriendRequestTimer() {
+      const friendRequestStatus = this.getFriendRequestStatus();
+      if (friendRequestStatus) {
+        if (!friendRequestStatus.allowSending) {
+          const delay = Math.max(friendRequestStatus.unlockTimestamp - Date.now(), 0);
+          setTimeout(() => {
+            this.onFriendRequestTimedOut();
+          }, delay);
+        }
+      }
+    },
+    onFriendRequestAccepted() {
+      this.save({ friendRequestStatus: null })
+      this.trigger('disable:input', false);
+      this.trigger('change:placeholder', 'chat');
+    },
+    onFriendRequestTimedOut() {
+      let friendRequestStatus = this.getFriendRequestStatus();
+      friendRequestStatus.allowSending = true;
+      this.save({ friendRequestStatus })
+      this.trigger('disable:input', false);
+      this.trigger('change:placeholder', 'friend-request');
+    },
+    onFriendRequestSent() {
+      const friendRequestLockDuration = 72; // hours
+
+      let friendRequestStatus = this.getFriendRequestStatus();
+      if (!friendRequestStatus) {
+        friendRequestStatus = {};
+      }
+
+      friendRequestStatus.allowSending = false;
+      const delayMs = 100 * 1000 ;//(60 * 60 * 1000 * friendRequestLockDuration);
+      friendRequestStatus.unlockTimestamp = Date.now() + delayMs;
+      this.trigger('disable:input', true);
+      this.trigger('change:placeholder', 'disabled');
+
+      setTimeout(() => { this.onFriendRequestTimedOut() }, delayMs);
+
+      this.save({ friendRequestStatus })
+    },
     isUnverified() {
       if (this.isPrivate()) {
         const verified = this.get('verified');

js/views/conversation_view.js

@@ -69,8 +69,16 @@
     },
     template: $('#conversation').html(),
     render_attributes() {
+      let sendMessagePlaceholder = 'sendMessageFriendRequest';
+      const sendDisabled = this.model.waitingForFriendRequestApproval();
+      if (sendDisabled) {
+        sendMessagePlaceholder = 'sendMessageDisabled';
+      } else if (this.model.getFriendRequestStatus() === null) {
+        sendMessagePlaceholder = 'sendMessage';
+      }
       return {
-        'send-message': i18n('sendMessage'),
+        'disable-inputs': sendDisabled,
+        'send-message': i18n(sendMessagePlaceholder),
         'android-length-warning': i18n('androidMessageLengthWarning'),
       };
     },
@@ -80,6 +88,8 @@
       this.listenTo(this.model, 'newmessage', this.addMessage);
       this.listenTo(this.model, 'opened', this.onOpened);
       this.listenTo(this.model, 'prune', this.onPrune);
+      this.listenTo(this.model, 'disable:input', this.onDisableInput);
+      this.listenTo(this.model, 'change:placeholder', this.onChangePlaceholder);
       this.listenTo(
         this.model.messageCollection,
         'show-identity',
@@ -275,6 +285,26 @@
       }
     },
 
+    onDisableInput(disable) {
+      this.$('button.emoji, button.microphone, button.paperclip, .send-message').attr('disabled', disable);
+    },
+
+    onChangePlaceholder(type) {
+      let placeholder;
+      switch (type) {
+        case 'friend-request':
+          placeholder = i18n('sendMessageFriendRequest');
+          break;
+        case 'disabled':
+          placeholder = i18n('sendMessageDisabled');
+          break;
+        default:
+          placeholder = i18n('sendMessage');
+          break;
+      }
+      this.$messageField.attr('placeholder', placeholder);
+    },
+
     unload(reason) {
       window.log.info(
         'unloading conversation',

libtextsecure/outgoing_message.js

@@ -369,6 +369,12 @@ OutgoingMessage.prototype = {
   },
 
   sendToNumber(number) {
+    let conversation;
+    try {
+      conversation = ConversationController.get(number);
+    } catch(e) {
+    }
+
     return this.getStaleDeviceIdsForNumber(number).then(updateDevices =>
       this.getKeysForNumber(number, updateDevices)
         .then(async (keysFound) =>  {
@@ -378,9 +384,8 @@ OutgoingMessage.prototype = {
             log.info("Fallback encryption enabled");
             this.fallBackEncryption = true;
             attachPrekeys = true;
-          } else {
+          } else if (conversation) {
             try {
-              const conversation = ConversationController.get(number);
               attachPrekeys = !conversation.isKeyExchangeCompleted();
             } catch(e) {
               // do nothing
@@ -392,6 +397,11 @@ OutgoingMessage.prototype = {
             this.message.preKeyBundleMessage = await libloki.getPreKeyBundleForNumber(number);
           }
         }).then(this.reloadDevicesAndSend(number, true))
+        .then(() => {
+          if (this.fallBackEncryption && conversation) {
+            conversation.onFriendRequestSent();
+          }
+        })
         .catch(error => {
           if (error.message === 'Identity key changed') {
             // eslint-disable-next-line no-param-reassign

stylesheets/_conversation.scss

@@ -285,7 +285,7 @@
     font-family: inherit;
 
     &[disabled='disabled'] {
-      background: transparent;
+      background: $color-light-35;
     }
   }
   .capture-audio {