[IMP] web_editor: show drag & drop tooltip helper faster

Before this commit, if the user mousedown a snippet, it would start a
timer of 1500 ms and a the end of the timer, it would show a tooltip to
help the user indicating him that he should drag & drop and not click.
The drag & drop code would (sort of) stop that timer if a drag was
detected, to not show the tooltip if the user is correctly drag &
dropping.

But it feels weird, as when you fail to realize you should drag & drop
but click instead, you only have the hint 1.5s later.
Some internal people would actually use triple click on snippet when
trying to show this tooltip, because it's probably not easy to figure
exactly what the trigger is.

The change is then made to show the tooltip directly on mouseup.
If the drag & drop code did not indicate that a drag happened, we can
safely assume it was a simple click and not a drag.

closes odoo/odoo#112666

X-original-commit: 00becd38ac5f43e2586b258d01c7af2825f75ddc
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
This commit is contained in:
Romain Derie
2023-02-14 17:09:50 +01:00
parent 8926efac19
commit 2461cbddb5
@@ -1689,6 +1689,7 @@ var SnippetsMenu = Widget.extend({
'click #snippet_custom .o_rename_btn': '_onRenameBtnClick',
'click #snippet_custom .o_delete_btn': '_onDeleteBtnClick',
'mousedown': '_onMouseDown',
'mouseup': '_onMouseUp',
'input .o_snippet_search_filter_input': '_onSnippetSearchInput',
'click .o_snippet_search_filter_reset': '_onSnippetSearchResetClick',
'click .o_we_website_top_actions button[data-action=save]': '_onSaveRequest',
@@ -3813,9 +3814,13 @@ var SnippetsMenu = Widget.extend({
clearTimeout(enableTimeoutID);
reenable();
});
},
/**
* @private
*/
_onMouseUp(ev) {
const snippetEl = ev.target.closest('.oe_snippet');
if (snippetEl && !snippetEl.querySelector('.o_we_already_dragging')) {
if (snippetEl) {
this._showSnippetTooltip($(snippetEl));
}
},
@@ -3824,26 +3829,24 @@ var SnippetsMenu = Widget.extend({
* If in the meantime the user has started to drag the snippet, it won't be
* shown.
*
* TODO: remove delay param in master
*
* @private
* @param {jQuery} $snippet
* @param {Number} [delay=1500]
*/
_showSnippetTooltip($snippet, delay = 1500) {
this.__showSnippetTooltip = true;
setTimeout(() => {
if (this.__showSnippetTooltip) {
$snippet.tooltip('show');
this._hideSnippetTooltips(1500);
}
}, delay);
this.$snippets.not($snippet).tooltip('hide');
$snippet.tooltip('show');
this._hideSnippetTooltips(1500);
},
/**
* @private
* @param {Number} [delay=0]
*/
_hideSnippetTooltips(delay = 0) {
this.__showSnippetTooltip = false;
setTimeout(() => {
clearTimeout(this.__hideSnippetTooltipTimeout);
this.__hideSnippetTooltipTimeout = setTimeout(() => {
this.$snippets.tooltip('hide');
}, delay);
},