From 80689deffd80509f2c040a1452068448d3e2c523 Mon Sep 17 00:00:00 2001 From: Alexandru Artimon Date: Mon, 15 Jul 2024 18:39:38 +0000 Subject: [PATCH 1/2] HDX-9946 - Limit or auto optimize images that go on the carousel --- .../hdx_theme/fanstatic/admin/carousel.js | 33 +++++++++++++++++-- 1 file changed, 31 insertions(+), 2 deletions(-) diff --git a/ckanext-hdx_theme/ckanext/hdx_theme/fanstatic/admin/carousel.js b/ckanext-hdx_theme/ckanext/hdx_theme/fanstatic/admin/carousel.js index fe18a09512..247af25ceb 100644 --- a/ckanext-hdx_theme/ckanext/hdx_theme/fanstatic/admin/carousel.js +++ b/ckanext-hdx_theme/ckanext/hdx_theme/fanstatic/admin/carousel.js @@ -80,11 +80,40 @@ return this; }, - onFieldEdit: function(e) { + _getImageWidth: async function(file) { + let promise = new Promise((resolve, reject) => { + const reader = new FileReader(); + reader.onload = function(e) { + const img = new Image(); + img.onload = function() { + resolve(img.width); + }; + img.onerror = function() { + reject('Failed to load the image.'); + }; + img.src = e.target.result; + }; + reader.onerror = function() { + reject('Failed to read the file.'); + }; + reader.readAsDataURL(file); + }); + let width = await promise; + return width; + }, + onFieldEdit: async function(e) { var value = e.target.value; if (e.target.type === "file"){ value = e.target.files[0]; - this.model.set('graphic_upload_preview', URL.createObjectURL(value)); + width = await this._getImageWidth(value); + const urlParams = new URLSearchParams(window.location.search); + const overrideImageContraints = urlParams.get('overrideImage'); + if ((overrideImageContraints != "true") && (value.size > 50000 || (width != 550 && width != 275))) { + alert("Please keep files under 50KB and width at either 275px or 550px!"); + value = null; + } else { + this.model.set('graphic_upload_preview', URL.createObjectURL(value)); + } } this.model.set(e.target.name, value); this.render(); From 48d61142f42bc878db5d01a67abdf71825566099 Mon Sep 17 00:00:00 2001 From: Alexandru Artimon Date: Wed, 17 Jul 2024 15:35:22 +0000 Subject: [PATCH 2/2] HDX-9946 - Limit or auto optimize images that go on the carousel --- .../ckanext/hdx_theme/fanstatic/admin/carousel.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/ckanext-hdx_theme/ckanext/hdx_theme/fanstatic/admin/carousel.js b/ckanext-hdx_theme/ckanext/hdx_theme/fanstatic/admin/carousel.js index 247af25ceb..849b96a813 100644 --- a/ckanext-hdx_theme/ckanext/hdx_theme/fanstatic/admin/carousel.js +++ b/ckanext-hdx_theme/ckanext/hdx_theme/fanstatic/admin/carousel.js @@ -108,8 +108,8 @@ width = await this._getImageWidth(value); const urlParams = new URLSearchParams(window.location.search); const overrideImageContraints = urlParams.get('overrideImage'); - if ((overrideImageContraints != "true") && (value.size > 50000 || (width != 550 && width != 275))) { - alert("Please keep files under 50KB and width at either 275px or 550px!"); + if ((overrideImageContraints != "true") && (value.size > 50000 || width != 550)) { + alert("Please keep files under 50KB and width at 550px!"); value = null; } else { this.model.set('graphic_upload_preview', URL.createObjectURL(value));