watcha
/
watcha-synapse
mirror of https://github.com/watcha-fr/synapse
1
1
Fork 0
Code Issues Projects Releases Wiki Activity

Send images with their imageInfo (size, mymetype, width & height)

Browse Source
pull/4/merge
Emmanuel ROHEE 10 years ago
parent da2f5aac0e
commit 6d3391f2f0
5 changed files with 89 additions and 17 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 4
      webclient/components/fileUpload/file-upload-service.js
  2. 4
      webclient/components/matrix/matrix-service.js
  3. 53
      webclient/components/utilities/utilities-service.js
  4. 1
      webclient/index.html
  5. 44
      webclient/room/room-controller.js

4
webclient/components/fileUpload/file-upload-service.js
Unescape View File

@ -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);

4
webclient/components/matrix/matrix-service.js
Unescape View File

@ -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);

53
webclient/components/utilities/utilities-service.js
Unescape View File

@ -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;
};
}]);

1
webclient/index.html
Unescape View File

@ -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>

44
webclient/room/room-controller.js
Unescape View File

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

Write Preview
Loading…
Cancel
Save