From 1bae4c4f831541ea0e8f09c5a04a07c5290debae Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Mon, 30 Jul 2018 14:44:17 +0200 Subject: [PATCH] [Glitch] Resize images by area instead of fixed dimensions Port WebUI part of 0fb0037ca7ea9910b490818a1cc13f4005ba6134 to glitch-soc --- .../flavours/glitch/util/resize_image.js | 18 ++++-------------- 1 file changed, 4 insertions(+), 14 deletions(-) diff --git a/app/javascript/flavours/glitch/util/resize_image.js b/app/javascript/flavours/glitch/util/resize_image.js index 279a858cad..d1608094f7 100644 --- a/app/javascript/flavours/glitch/util/resize_image.js +++ b/app/javascript/flavours/glitch/util/resize_image.js @@ -1,6 +1,6 @@ import EXIF from 'exif-js'; -const MAX_IMAGE_DIMENSION = 1280; +const MAX_IMAGE_PIXELS = 1638400; // 1280x1280px const getImageUrl = inputFile => new Promise((resolve, reject) => { if (window.URL && URL.createObjectURL) { @@ -73,18 +73,8 @@ const processImage = (img, { width, height, orientation, type = 'image/png' }) = const resizeImage = (img, type = 'image/png') => new Promise((resolve, reject) => { const { width, height } = img; - let newWidth, newHeight; - - if (width > height) { - newHeight = height * MAX_IMAGE_DIMENSION / width; - newWidth = MAX_IMAGE_DIMENSION; - } else if (height > width) { - newWidth = width * MAX_IMAGE_DIMENSION / height; - newHeight = MAX_IMAGE_DIMENSION; - } else { - newWidth = MAX_IMAGE_DIMENSION; - newHeight = MAX_IMAGE_DIMENSION; - } + const newWidth = Math.round(Math.sqrt(MAX_IMAGE_PIXELS * (width / height))); + const newHeight = Math.round(Math.sqrt(MAX_IMAGE_PIXELS * (height / width))); getOrientation(img, type) .then(orientation => processImage(img, { @@ -104,7 +94,7 @@ export default inputFile => new Promise((resolve, reject) => { } loadImage(inputFile).then(img => { - if (img.width < MAX_IMAGE_DIMENSION && img.height < MAX_IMAGE_DIMENSION) { + if (img.width * img.height < MAX_IMAGE_PIXELS) { resolve(inputFile); return; }