[FIX] website: update modal scrolling behavior after image loading

With commit [1] (and the parent commit here which reviews it), we
move the scrollbar to the modal instead of the website content if the
modal has scrollable content even in the case there is no backdrop. An
exemple would be the cookie bar, configured in popup mode, with a tall
content inside.

This was however not enough: the computation which determines if the
modal should be scrollable or not was not re-done after an image was
loaded. So if the popup was around the height of the window, it could be
smaller than the window's height before images loading and taller after
which would result in having the scrollbar on the body instead of the
scrollable popup.

[1]: https://github.com/odoo/odoo/commit/8f1dd6d6087ad8252d6e7b22d13aad2c4a3f19c6

closes odoo/odoo#84139

X-original-commit: b83b465dd98345afeca3844a4796e4a83d15f72b
Signed-off-by: Romain Derie (rde) <rde@odoo.com>
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
This commit is contained in:
qsm-odoo
2022-02-08 00:07:22 +00:00
parent a0ddaa8931
commit 43ccc78554
@@ -153,6 +153,10 @@ $.fn.modal.Constructor.prototype._showElement = function () {
// opened is a very specific Odoo behavior.
$(this._element).on('content_changed.update_scrollbar', this, _updateScrollbar);
$(window).on('resize.update_scrollbar', this, _updateScrollbar);
this._odooLoadEventCaptureHandler = _.debounce(() => _updateScrollbar({ data: this }, 100));
this._element.addEventListener('load', this._odooLoadEventCaptureHandler, true);
_updateScrollbar({ data: this });
}
};
@@ -168,6 +172,11 @@ $.fn.modal.Constructor.prototype._hideModal = function () {
$(this._element).off('content_changed.update_scrollbar');
$(window).off('resize.update_scrollbar');
if (this._odooLoadEventCaptureHandler) {
this._element.removeEventListener('load', this._odooLoadEventCaptureHandler, true);
delete this._odooLoadEventCaptureHandler;
}
};
const _baseSetScrollbar = $.fn.modal.Constructor.prototype._setScrollbar;