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;
- }
+ }
);
}
});
|