diff options
| -rw-r--r-- | webclient/components/fileUpload/file-upload-service.js | 4 | ||||
| -rw-r--r-- | webclient/components/matrix/matrix-service.js | 4 | ||||
| -rw-r--r-- | webclient/components/utilities/utilities-service.js | 53 | ||||
| -rw-r--r-- | webclient/index.html | 1 | ||||
| -rw-r--r-- | webclient/room/room-controller.js | 44 |
5 files changed, 89 insertions, 17 deletions
diff --git a/webclient/components/fileUpload/file-upload-service.js b/webclient/components/fileUpload/file-upload-service.js index d620e6a4d0..65c24f309c 100644 --- a/webclient/components/fileUpload/file-upload-service.js +++ b/webclient/components/fileUpload/file-upload-service.js @@ -27,10 +27,10 @@ angular.module('mFileUpload', []) * Upload an HTML5 file to a server and returned a promise * that will provide the URL of the uploaded file. */ - this.uploadFile = function(file) { + this.uploadFile = function(file, body) { var deferred = $q.defer(); console.log("Uploading " + file.name + "... to /matrix/content"); - matrixService.uploadContent(file).then( + matrixService.uploadContent(file, body).then( function(response) { var content_url = location.origin + "/matrix/content/" + response.data.content_token; console.log(" -> Successfully uploaded! Available at " + content_url); diff --git a/webclient/components/matrix/matrix-service.js b/webclient/components/matrix/matrix-service.js index 664c5967af..cd37a0c234 100644 --- a/webclient/components/matrix/matrix-service.js +++ b/webclient/components/matrix/matrix-service.js @@ -204,11 +204,11 @@ angular.module('matrixService', []) }, // Send an image message - sendImageMessage: function(room_id, image_url, image_alt, msg_id) { + sendImageMessage: function(room_id, image_url, image_body, msg_id) { var content = { msgtype: "m.image", url: image_url, - body: image_alt + body: image_body }; return this.sendMessage(room_id, msg_id, content); diff --git a/webclient/components/utilities/utilities-service.js b/webclient/components/utilities/utilities-service.js new file mode 100644 index 0000000000..fc0ee580dc --- /dev/null +++ b/webclient/components/utilities/utilities-service.js @@ -0,0 +1,53 @@ +/* + Copyright 2014 matrix.org + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. + */ + +'use strict'; + +/* + * This service contains multipurpose helper functions. + */ +angular.module('mUtilities', []) +.service('mUtilities', ['$q', function ($q) { + /* + * Gets the size of an image + * @param {File} imageFile the file containing the image + * @returns {promise} A promise that will be resolved by an object with 2 members: + * width & height + */ + this.getImageSize = function(imageFile) { + var deferred = $q.defer(); + + // Load the file into an html element + var img = document.createElement("img"); + + var reader = new FileReader(); + reader.onload = function(e) { + img.src = e.target.result; + + // Once ready, returns its size + deferred.resolve({ + width: img.width, + height: img.height + }); + }; + reader.onerror = function(e) { + deferred.reject(e); + }; + reader.readAsDataURL(imageFile); + + return deferred.promise; + }; +}]); \ No newline at end of file diff --git a/webclient/index.html b/webclient/index.html index a7e9cd9341..27d9208193 100644 --- a/webclient/index.html +++ b/webclient/index.html @@ -25,6 +25,7 @@ <script src="components/matrix/event-handler-service.js"></script> <script src="components/fileInput/file-input-directive.js"></script> <script src="components/fileUpload/file-upload-service.js"></script> + <script src="components/utilities/utilities-service.js"></script> </head> <body> diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js index ca6d3d4a3a..558a865f30 100644 --- a/webclient/room/room-controller.js +++ b/webclient/room/room-controller.js @@ -14,9 +14,9 @@ See the License for the specific language governing permissions and limitations under the License. */ -angular.module('RoomController', ['ngSanitize']) -.controller('RoomController', ['$scope', '$http', '$timeout', '$routeParams', '$location', 'matrixService', 'eventStreamService', 'eventHandlerService', 'mFileUpload', - function($scope, $http, $timeout, $routeParams, $location, matrixService, eventStreamService, eventHandlerService, mFileUpload) { +angular.module('RoomController', ['ngSanitize', 'mUtilities']) +.controller('RoomController', ['$scope', '$http', '$timeout', '$routeParams', '$location', 'matrixService', 'eventStreamService', 'eventHandlerService', 'mFileUpload', 'mUtilities', + function($scope, $http, $timeout, $routeParams, $location, matrixService, eventStreamService, eventHandlerService, mFileUpload, mUtilities) { 'use strict'; var MESSAGES_PER_PAGINATION = 30; @@ -366,10 +366,10 @@ angular.module('RoomController', ['ngSanitize']) }); }; - $scope.sendImage = function(url) { + $scope.sendImage = function(url, body) { $scope.state.sending = true; - matrixService.sendImageMessage($scope.room_id, url).then( + matrixService.sendImageMessage($scope.room_id, url, body).then( function() { console.log("Image sent"); $scope.state.sending = false; @@ -386,17 +386,35 @@ angular.module('RoomController', ['ngSanitize']) $scope.state.sending = true; - // 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); + // First, get the image sise + mUtilities.getImageSize($scope.imageFileToSend).then( + function(size) { + + // Upload the image to the Internet + console.log("Uploading image..."); + mFileUpload.uploadFile($scope.imageFileToSend).then( + function(url) { + // Build the image info data + var imageInfo = { + size: $scope.imageFileToSend.size, + mimetype: $scope.imageFileToSend.type, + w: size.width, + h: size.height + }; + + // Then share the URL and the metadata + $scope.sendImage(url, imageInfo); + }, + function(error) { + $scope.feedback = "Can't upload image"; + $scope.state.sending = false; + } + ); }, function(error) { - $scope.feedback = "Can't upload image"; + $scope.feedback = "Can't get selected image size"; $scope.state.sending = false; - } + } ); } }); |