Added another button to upload and send an image.

The text input and its send button for sending an image URL will be removed once we have a true upload image service

2 files changed, 20 insertions, 2 deletions

diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js

index 30f66de458..5ea01d7641 100644
--- a/webclient/room/room-controller.js
+++ b/webclient/room/room-controller.js
@@ -402,6 +402,23 @@ angular.module('RoomController', ['ngSanitize'])
             });
     };
     
+    $scope.imageFileToSend;
+    $scope.$watch("imageFileToSend", function(newValue, oldValue) {
+        if ($scope.imageFileToSend) {
+            // First download the image to the Internet
+            console.log("Uploading image...");
+            mFileUpload.uploadFile($scope.imageFileToSend).then(
+                function(url) {
+                    // Then share the URL
+                    $scope.sendImage(url);
+                },
+                function(error) {
+                    $scope.feedback = "Can't upload image";
+                } 
+            );
+        }
+    });
+    
     $scope.loadMoreHistory = function() {
         paginate(MESSAGES_PER_PAGINATION);
     };
diff --git a/webclient/room/room.html b/webclient/room/room.html

index 7ec2c7cdc7..0f01b94c39 100644
--- a/webclient/room/room.html
+++ b/webclient/room/room.html
@@ -75,9 +75,10 @@
                         <input id="mainInput" ng-model="imageURLToSend" ng-enter="sendImage()" placeholder="Image URL"/>
                     </td>
                     <td  width="100px">
-                        <button ng-click="sendImage(imageURLToSend)">Send Image</button>
+                        <button ng-click="sendImage(imageURLToSend)">Send URL</button>
                     </td>
-                    <td>
+                    <td width="100px">
+                        <button m-file-input="imageFileToSend">Send Image</button>
                     </td>
                 </tr>
             </table>