Two small UX fixes

- Don't close the emojis panel after inserting an emoji.
- Focus the message textarea when the emojis panel is opened or closed.

CHANGES.md

@@ -34,6 +34,8 @@
 - Don't hang indefinitely and provide nicer error messages when a connection
   can't be established.
 - Consolidate error and validation reporting on the registration form.
+- Don't close the emojis panel after inserting an emoji.
+- Focus the message textarea when the emojis panel is opened or closed.
 
 ### Technical changes
 - Converse.js now includes a [Virtual DOM](https://github.com/Matt-Esch/virtual-dom)

locale/af/LC_MESSAGES/converse.po

@@ -8,7 +8,7 @@ msgstr ""
 "Project-Id-Version: Converse.js 0.4\n"
 "Report-Msgid-Bugs-To: \n"
 "POT-Creation-Date: 2017-09-24 10:57+0200\n"
-"PO-Revision-Date: 2017-09-24 11:04+0200\n"
+"PO-Revision-Date: 2017-11-12 19:56+0100\n"
 "Last-Translator: JC Brand <jc@opkode.com>\n"
 "Language-Team: Afrikaans <https://hosted.weblate.org/projects/conversejs/"
 "translations/af/>\n"
@@ -230,7 +230,7 @@ msgstr "Hangende kontakte"
 
 #: dist/converse-no-dependencies.js:15199
 msgid "Contact requests"
-msgstr "Kontak versoeke"
+msgstr "Kontakversoeke"
 
 #: dist/converse-no-dependencies.js:15200
 msgid "Ungrouped"

package-lock.json

@@ -1055,9 +1055,9 @@
       }
     },
     "backbone.vdomview": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/backbone.vdomview/-/backbone.vdomview-0.0.1.tgz",
-      "integrity": "sha512-wmOKebp5tKLXFOWVmexDDST93BhmjbjTkssXit/6cmz1+eC3ryMR0azSxIIeJcXF66k3QDJLlgq3oFHmnTU4yw==",
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/backbone.vdomview/-/backbone.vdomview-0.0.2.tgz",
+      "integrity": "sha512-rQtR1DvE6aiSUSa4VbF2jELu+uutBoQ692/W2fdcwd+SyMpG5DumCEIf5mjZG6z0+Fq2TWFM4IPTv1il4iqO6w==",
       "dev": true,
       "requires": {
         "backbone": "1.3.3",

src/converse-chatview.js

@@ -767,7 +767,6 @@
 
                 insertEmoji (ev) {
                     ev.stopPropagation();
-                    this.toggleEmojiMenu();
                     const target = ev.target.nodeName === 'IMG' ? ev.target.parentElement : ev.target;
                     this.insertIntoTextArea(target.getAttribute('data-emoji'));
                 },
@@ -785,12 +784,11 @@
                         document.querySelectorAll('.toolbar-menu'),
                         [this.emoji_picker_view.el]
                     );
-                    utils.slideInAllElements(elements).then(
-                        _.partial(
-                            utils.slideToggleElement,
-                            this.emoji_picker_view.el
-                        )
-                    );
+                    utils.slideInAllElements(elements)
+                        .then(_.partial(
+                                utils.slideToggleElement,
+                                this.emoji_picker_view.el))
+                        .then(this.focus.bind(this));
                 },
 
                 toggleCall (ev) {
@@ -913,7 +911,7 @@
                 },
 
                 focus () {
-                    this.$el.find('.chat-textarea').focus();
+                    this.el.querySelector('.chat-textarea').focus();
                     _converse.emit('chatBoxFocused', this);
                     return this;
                 },

src/converse-rosterview.js

@@ -256,11 +256,11 @@
                 clearFilter (ev) {
                     if (ev && ev.preventDefault) {
                         ev.preventDefault();
-                        $(ev.target).removeClass('x onX').val('');
+                        ev.target.classList.remove('x');
+                        ev.target.classList.remove('onX');
+                        ev.target.value = '';
                     }
-                    this.model.save({
-                        'filter_text': ''
-                    });
+                    this.model.save({'filter_text': ''});
                 }
             });