Avoid sending blur event when navigating the emoji picker

Also, listen to the `focusin` and `focusout` events, since they bubble,
allowing us to listen on the chatbox itself.
This commit is contained in:
JC Brand 2020-02-05 16:06:27 +01:00
parent 6e8a987694
commit 4b3d330190
2 changed files with 12 additions and 4 deletions

View File

@ -318,9 +318,8 @@ converse.plugins.add('converse-chatview', {
'show_toolbar': _converse.show_toolbar,
'unread_msgs': __('You have unread messages')
}));
const textarea = this.el.querySelector('.chat-textarea');
textarea.addEventListener('focus', ev => this.emitFocused(ev));
textarea.addEventListener('blur', ev => this.emitBlurred(ev));
this.el.addEventListener('focusin', ev => this.emitFocused(ev));
this.el.addEventListener('focusout', ev => this.emitBlurred(ev));
this.renderToolbar();
},
@ -1190,7 +1189,7 @@ converse.plugins.add('converse-chatview', {
},
emitBlurred (ev) {
if (this.el.contains(document.activeElement)) {
if (this.el.contains(document.activeElement) || this.el.contains(ev.relatedTarget)) {
// Something else in this chatbox is still focused
return;
}
@ -1204,6 +1203,10 @@ converse.plugins.add('converse-chatview', {
},
emitFocused (ev) {
if (this.el.contains(ev.relatedTarget)) {
// Something else in this chatbox was already focused
return;
}
/**
* Triggered when the focus has been moved to a particular chat.
* @event _converse#chatBoxFocused

View File

@ -180,6 +180,11 @@ converse.plugins.add('converse-emoji-views', {
View.prototype.remove.call(this);
},
afterRender () {
this.initIntersectionObserver();
this.initArrowNavigation();
},
initArrowNavigation () {
if (!this.navigator) {
const default_selector = 'li:not(.hidden):not(.emoji-skintone), .emoji-search';