[FIX] website: prevent to have two modals for Images Wall

Before this commit, when you double-clicked on an image in the Images
Wall block, the modal appeared twice. This commit ensures that for the
block Images Wall, only one modal can be present at a time.

Steps to reproduce the problem:
- Drop the block Images Wall on a page
- Save
- Click twice quickly on the same image

-> Two modals are open (one on top of the other)

task-2937538

closes odoo/odoo#98857

X-original-commit: e21ff31c429a8bc339f527a2e4eacc0f1b2f6d7d
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
This commit is contained in:
Guillaume (gdi)
2022-08-25 12:05:33 +02:00
parent 375f4dff1c
commit 1006cfb47e
@@ -26,6 +26,9 @@ const GalleryWidget = publicWidget.Widget.extend({
* @param {Event} ev
*/
_onClickImg: function (ev) {
if (this.$modal) {
return;
}
var self = this;
var $cur = $(ev.currentTarget);
@@ -43,26 +46,27 @@ const GalleryWidget = publicWidget.Widget.extend({
var $img = ($cur.is('img') === true) ? $cur : $cur.closest('img');
const milliseconds = $cur.closest('.s_image_gallery').data('interval') || false;
var $modal = $(qweb.render('website.gallery.slideshow.lightbox', {
this.$modal = $(qweb.render('website.gallery.slideshow.lightbox', {
images: $images.get(),
index: $images.index($img),
dim: dimensions,
interval: milliseconds || 0,
id: _.uniqueId('slideshow_'),
}));
$modal.on('hidden.bs.modal', function () {
this.$modal.on('hidden.bs.modal', function () {
$(this).hide();
$(this).siblings().filter('.modal-backdrop').remove(); // bootstrap leaves a modal-backdrop
$(this).remove();
self.$modal = undefined;
});
$modal.one('shown.bs.modal', function () {
this.$modal.one('shown.bs.modal', function () {
self.trigger_up('widgets_start_request', {
editableMode: false,
$target: $modal.find('.modal-body.o_slideshow'),
$target: self.$modal.find('.modal-body.o_slideshow'),
});
});
$modal.appendTo(document.body);
const modalBS = new Modal($modal[0], {keyboard: true, backdrop: true});
this.$modal.appendTo(document.body);
const modalBS = new Modal(this.$modal[0], {keyboard: true, backdrop: true});
modalBS.show();
},
});