diff options
author | Mark Haines <mark.haines@matrix.org> | 2014-08-26 16:07:05 +0100 |
---|---|---|
committer | Mark Haines <mark.haines@matrix.org> | 2014-08-26 16:07:05 +0100 |
commit | 4b63b06cad3e72e3d3dee66d3d6c7801e4a7abaf (patch) | |
tree | 37b368d6039d986d70f153fb69d6345d1019d64a /webclient/components/utilities | |
parent | fix a few pyflakes errors (diff) | |
parent | Fix pyflakes errors (diff) | |
download | synapse-4b63b06cad3e72e3d3dee66d3d6c7801e4a7abaf.tar.xz |
Merge branch 'develop' into storage_transactions
Conflicts: synapse/api/auth.py synapse/handlers/room.py synapse/storage/__init__.py
Diffstat (limited to 'webclient/components/utilities')
-rw-r--r-- | webclient/components/utilities/utilities-service.js | 110 |
1 files changed, 104 insertions, 6 deletions
diff --git a/webclient/components/utilities/utilities-service.js b/webclient/components/utilities/utilities-service.js index fc0ee580dc..3df2f04458 100644 --- a/webclient/components/utilities/utilities-service.js +++ b/webclient/components/utilities/utilities-service.js @@ -22,8 +22,8 @@ angular.module('mUtilities', []) .service('mUtilities', ['$q', function ($q) { /* - * Gets the size of an image - * @param {File} imageFile the file containing the image + * Get the size of an image + * @param {File|Blob} imageFile the file containing the image * @returns {promise} A promise that will be resolved by an object with 2 members: * width & height */ @@ -38,10 +38,15 @@ angular.module('mUtilities', []) img.src = e.target.result; // Once ready, returns its size - deferred.resolve({ - width: img.width, - height: img.height - }); + img.onload = function() { + deferred.resolve({ + width: img.width, + height: img.height + }); + }; + img.onerror = function(e) { + deferred.reject(e); + }; }; reader.onerror = function(e) { deferred.reject(e); @@ -50,4 +55,97 @@ angular.module('mUtilities', []) return deferred.promise; }; + + /* + * Resize the image to fit in a square of the side maxSize. + * The aspect ratio is kept. The returned image data uses JPEG compression. + * Source: http://hacks.mozilla.org/2011/01/how-to-develop-a-html5-image-uploader/ + * @param {File} imageFile the file containing the image + * @param {Integer} maxSize the max side size + * @returns {promise} A promise that will be resolved by a Blob object containing + * the resized image data + */ + this.resizeImage = function(imageFile, maxSize) { + var self = this; + var deferred = $q.defer(); + + var canvas = document.createElement("canvas"); + + var img = document.createElement("img"); + var reader = new FileReader(); + reader.onload = function(e) { + + img.src = e.target.result; + + // Once ready, returns its size + img.onload = function() { + var ctx = canvas.getContext("2d"); + ctx.drawImage(img, 0, 0); + + var MAX_WIDTH = maxSize; + var MAX_HEIGHT = maxSize; + var width = img.width; + var height = img.height; + + if (width > height) { + if (width > MAX_WIDTH) { + height *= MAX_WIDTH / width; + width = MAX_WIDTH; + } + } else { + if (height > MAX_HEIGHT) { + width *= MAX_HEIGHT / height; + height = MAX_HEIGHT; + } + } + canvas.width = width; + canvas.height = height; + var ctx = canvas.getContext("2d"); + ctx.drawImage(img, 0, 0, width, height); + + // Extract image data in the same format as the original one. + // The 0.7 compression value will work with formats that supports it like JPEG. + var dataUrl = canvas.toDataURL(imageFile.type, 0.7); + deferred.resolve(self.dataURItoBlob(dataUrl)); + }; + img.onerror = function(e) { + deferred.reject(e); + }; + }; + reader.onerror = function(e) { + deferred.reject(e); + }; + reader.readAsDataURL(imageFile); + + return deferred.promise; + }; + + /* + * Convert a dataURI string to a blob + * Source: http://stackoverflow.com/a/17682951 + * @param {String} dataURI the dataURI can be a base64 encoded string or an URL encoded string. + * @returns {Blob} the blob + */ + this.dataURItoBlob = function(dataURI) { + // convert base64 to raw binary data held in a string + // doesn't handle URLEncoded DataURIs + var byteString; + if (dataURI.split(',')[0].indexOf('base64') >= 0) + byteString = atob(dataURI.split(',')[1]); + else + byteString = unescape(dataURI.split(',')[1]); + // separate out the mime component + var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]; + + // write the bytes of the string to an ArrayBuffer + var ab = new ArrayBuffer(byteString.length); + var ia = new Uint8Array(ab); + for (var i = 0; i < byteString.length; i++) { + ia[i] = byteString.charCodeAt(i); + } + + // write the ArrayBuffer to a blob, and you're done + return new Blob([ab],{type: mimeString}); + }; + }]); \ No newline at end of file |