From fe8f8eacf0246c1de36b5d55cc7c4714945bddc5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Mottet=20=28oms=29?= Date: Thu, 23 Sep 2021 10:30:47 +0000 Subject: [PATCH] [FIX] web_editor: fix black line problem for odd width images When adding an odd width images on website, a thin black line is drawn on its right side. The problem comes from the getSourceCanvas of the cropperjs library. A translation is applied followed by an other translation in the opposite direction. However the second translation was not the exact reverse of the first due to a rounding problem. The fix proposed here comes from: https://github.com/fengyuanchen/cropperjs/pull/300/commits/a6481c052cfc93ef14dd95a3bd00142215dda36e task-2652904 closes odoo/odoo#77562 X-original-commit: 53f13979cc363c74a8f4e2cec0d24ca10c6ac11c Signed-off-by: Quentin Smetz (qsm) --- .../web_editor/static/lib/cropperjs/cropper.js | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/addons/web_editor/static/lib/cropperjs/cropper.js b/addons/web_editor/static/lib/cropperjs/cropper.js index b4495132acd..37dad6a8a6b 100644 --- a/addons/web_editor/static/lib/cropperjs/cropper.js +++ b/addons/web_editor/static/lib/cropperjs/cropper.js @@ -945,9 +945,19 @@ context.scale(scaleX, scaleY); context.imageSmoothingEnabled = imageSmoothingEnabled; context.imageSmoothingQuality = imageSmoothingQuality; - context.drawImage.apply(context, [image].concat(_toConsumableArray(params.map(function (param) { - return Math.floor(normalizeDecimalNumber(param)); - })))); + /** + * ODOO FIX START + * + * Canevas is translated and then translated back. For the second translation the + * translation distances were rounded to the nearest integer below when it should + * not since the distances of the first translation are either an integer or the + * half of an integer. + * + * Fix proposed by https://github.com/fengyuanchen/cropperjs/pull/866 + */ + params = params.map(normalizeDecimalNumber); + context.drawImage(image, params[0], params[1], Math.floor(params[2]), Math.floor(params[3])); + // ODOO FIX END context.restore(); return canvas; }