[IMP] web: bind colorpicker events in start instead of init

It is more conventional to bind extra events in the `start` of widgets
instead of in their `init`. Indeed, the handlers often make sense only
if the widget is already in the DOM.

Related to task-3332711

Part-of: odoo/odoo#126313
This commit is contained in:
qsm-odoo
2023-06-26 21:09:55 +02:00
parent 18dda9ddb4
commit 10a58341c9
@@ -39,28 +39,6 @@ var ColorpickerWidget = Widget.extend({
this.uniqueId = uniqueId("colorpicker");
this.selectedHexValue = '';
// Needs to be bound on document to work in all possible cases.
const $document = $(
parent.options.ownerDocument ||
(parent.el && parent.el.parentElement && parent.el.ownerDocument)
|| (parent.options && parent.options.$editable && parent.options.$editable[0] && parent.options.$editable[0].ownerDocument)
|| document);
this.throttleOnMouseMove = throttleForAnimation((ev) => {
this._onMouseMovePicker(ev);
this._onMouseMoveSlider(ev);
this._onMouseMoveOpacitySlider(ev);
});
$document.on(`mousemove.${this.uniqueId}`, this.throttleOnMouseMove);
$document.on(`mouseup.${this.uniqueId}`, debounce((ev) => {
if (this.pickerFlag || this.sliderFlag || this.opacitySliderFlag) {
this._colorSelected();
}
this.pickerFlag = false;
this.sliderFlag = false;
this.opacitySliderFlag = false;
}, 10));
this.options = Object.assign({}, options);
},
/**
@@ -100,6 +78,28 @@ var ColorpickerWidget = Widget.extend({
});
resizeObserver.observe(this.el);
// Needs to be bound on document to work in all possible cases.
const parent = this.getParent();
const $document = $(
parent.options.ownerDocument ||
(parent.el && parent.el.parentElement && parent.el.ownerDocument)
|| (parent.options && parent.options.$editable && parent.options.$editable[0] && parent.options.$editable[0].ownerDocument)
|| document);
this.throttleOnMouseMove = throttleForAnimation((ev) => {
this._onMouseMovePicker(ev);
this._onMouseMoveSlider(ev);
this._onMouseMoveOpacitySlider(ev);
});
$document.on(`mousemove.${this.uniqueId}`, this.throttleOnMouseMove);
$document.on(`mouseup.${this.uniqueId}`, debounce((ev) => {
if (this.pickerFlag || this.sliderFlag || this.opacitySliderFlag) {
this._colorSelected();
}
this.pickerFlag = false;
this.sliderFlag = false;
this.opacitySliderFlag = false;
}, 10));
this.previewActive = true;
return this._super.apply(this, arguments);
},