From 1d67b47142dc214a4553f79bd50f8a127e2c81b0 Mon Sep 17 00:00:00 2001 From: Benjamin Vray Date: Wed, 1 Jul 2020 12:32:33 +0000 Subject: [PATCH] [FIX] website_animate: fix "rotate in down" animations The animations "Rotate In-Down-Left" and "Rotate In-Down-Right" were not done correctly because we were trying to get the position of the element (by not taking CSS transforms into calculations) via the matrix of the css transform and it does not work if there is a transform-origin on the element. task-2215118 closes odoo/design-themes#46 X-original-commit: ad7389630c152dae6e01acc14e2a891c867858a5 Signed-off-by: Quentin Smetz (qsm) --- .../static/src/js/o_animate.frontend.js | 17 +++++++++++++---- 1 file changed, 13 insertions(+), 4 deletions(-) diff --git a/website_animate/static/src/js/o_animate.frontend.js b/website_animate/static/src/js/o_animate.frontend.js index 2588ec363..8623baa09 100644 --- a/website_animate/static/src/js/o_animate.frontend.js +++ b/website_animate/static/src/js/o_animate.frontend.js @@ -52,10 +52,8 @@ var WebsiteAnimate = { var state = $el.css("animation-play-state"); // We need to offset for the change in position from some animation - // So we get the top value of the transform matrix - var transformMatrix = $el.css('transform').replace(/[^0-9\-.,]/g, '').split(','); - var transformOffset = transformMatrix[13] || transformMatrix[5]; - var elTop = $el.offset().top - transformOffset; + // So we get the top value by not taking CSS transforms into calculations + var elTop = self.getElementOffsetTop($el[0]); var visible = windowBottom > (elTop + elOffset) && windowTop < (elTop + elHeight - elOffset); @@ -104,6 +102,17 @@ var WebsiteAnimate = { }); }); }, + + // Get element top offset by not taking CSS transforms into calculations + getElementOffsetTop: function (el) { + // Loop through the DOM tree and add its parent's offset to get page offset + var top = 0; + do { + top += el.offsetTop || 0; + el = el.offsetParent; + } while (el); + return top; + }, }; publicWidget.registry.WebsiteAnimate = publicWidget.Widget.extend({