To apply a shape on image, we use its base64 string as source on the
<image/> of the shape svg file. Then, the svg is used as source on the
targeted DOM element (<img/> on snippet).
When the targeted image is an animated GIF, the behaviour is different:
CHROME:
- The animation works correctly.
SAFARI & FF:
- The GIF animation is lost (only on non-animated shapes). The animation
works correctly on the svg file but once it is used as src of <img/> tag,
the animation is lost.
The goal of this commit is to fix this behaviour by forcing the
animation on SVG content.
task-2679905
closesodoo/odoo#108229
X-original-commit: 996acc3977de0346a45da328f42583b4366d1d47
Signed-off-by: Vray Benjamin (bvr) <bvr@odoo.com>
*: tools
The ImageOptimizer option can now set shapes on images to use those
shapes as clip path and background. It uses a flexible path so that the
shape will always fit the image proportionally. We also added an html
file alongside a javascript file to semi-convert the shape from
illustrator into a usable shape for this usecase (the clip path must
have values between one and zero therefore we must do some computation
before the shape is ready to use).
Thanks to Samuel for this specific shape-converter tool and other
technical points about svgs and clip-paths.
Thanks to Mehdi for remaining development post-testing and post-reviews
and for the many fixes.
Thanks to Brieuc for the actual shape SVG files.
Part of https://github.com/odoo/odoo/pull/69179
task-2327045
closesodoo/odoo#69179
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
Co-authored-by: xO-Tx <mou@odoo.com>
Co-authored-by: Brieuc-brd <brd@odoo.com>
Co-authored-by: Samuel Degueldre <sad@odoo.com>