pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[IMP] web_editor: add support for fixed size SVGs for image shapes

Browse Source 
With this PR's next commits introducing device shapes, it was needed to
have SVGs with a fixed size. Originally the code was created with the
idea that svg will take the size of the image they're going to clip.
This commit introduces a data attribute that allows SVGs to bypass
being resized so that they always keep the same aspect ratio.

task-2666049

Part-of: odoo/odoo#79068
Co-authored-by: Benjamin Vray <bvr@odoo.com>
This commit is contained in:
Arthur Detroux (ard)
2022-03-08 15:54:44 +00:00
committed by qsm-odoo
co-authored by Benjamin Vray
parent c225a837dc
commit 63cf8a693a
1 changed files with 14 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web_editor/static/src/js/editor/snippets.options.js
+14 -3
View File
@@ -5447,6 +5447,7 @@ registry.ImageTools = ImageHandlerOption.extend({
*/
async _writeShape(svgText) {
const img = this._getImg();
const initialImageWidth = img.naturalWidth;
const svg = new DOMParser().parseFromString(svgText, 'image/svg+xml').documentElement;
// We will store the image in base64 inside the SVG.
@@ -5458,9 +5459,19 @@ registry.ImageTools = ImageHandlerOption.extend({
// Force natural width & height (note: loading the original image is
// needed for Safari where natural width & height of SVG does not return
// the correct values).
const originalImage = await loadImage(img.src);
svg.setAttribute('width', originalImage.naturalWidth);
svg.setAttribute('height', originalImage.naturalHeight);
const originalImage = await loadImage(imgDataURL, img);
// If the svg forces the size of the shape we still want to have the resized
// width
if (!svg.dataset.forcedSize) {
svg.setAttribute('width', originalImage.naturalWidth);
svg.setAttribute('height', originalImage.naturalHeight);
} else {
const imageWidth = Math.trunc(img.dataset.resizeWidth || img.dataset.width || initialImageWidth);
const svgAspectRatio = parseInt(svg.getAttribute('width')) / parseInt(svg.getAttribute('height'));
const newHeight = imageWidth / svgAspectRatio;
svg.setAttribute('width', imageWidth);
svg.setAttribute('height', newHeight);
}
// Transform the current SVG in a base64 file to be saved by the server
const blob = new Blob([svg.outerHTML], {
type: 'image/svg+xml',