MDL-71672 atto_emojipicker: Focus the search bar initially

This commit is contained in:
Shamim Rezaie
2021-07-19 16:42:05 +10:00
parent 136312c3ce
commit c47395c1ea
4 changed files with 13 additions and 4 deletions
@@ -24,7 +24,9 @@ YUI.add('moodle-atto_emojipicker-button', function (Y, NAME) {
/**
* @module moodle-atto_emojipicker-button
*/
var COMPONENTNAME = 'atto_emojipicker';
var COMPONENTNAME = 'atto_emojipicker',
EMOJI_PICKER_SEARCH_INPUT = '[data-region="search-input"]';
/**
* Atto text editor emoji picker plugin.
@@ -123,6 +125,7 @@ Y.namespace('M.atto_emojipicker').Button = Y.Base.create('button', Y.M.editor_at
domNode.innerHTML = html;
initialiseEmojiPicker(domNode, this._insertEmoji.bind(this));
this.getDialogue().centerDialogue();
domNode.querySelector(EMOJI_PICKER_SEARCH_INPUT).focus();
}.bind(this));
}.bind(this));
@@ -1 +1 @@
YUI.add("moodle-atto_emojipicker-button",function(e,t){e.namespace("M.atto_emojipicker").Button=e.Base.create("button",e.M.editor_atto.EditorPlugin,[],{_currentSelection:null,initializer:function(){this.get("disabled")||this.addButton({icon:"e/emoticons",callback:this._displayDialogue})},_displayDialogue:function(){this._currentSelection=this.get("host").getSelection(),!1!==this._currentSelection&&this.getDialogue({headerContent:M.util.get_string("emojipicker","atto_emojipicker"),width:"auto",focusAfterHide:!0,additionalBaseClass:"emoji-picker-dialogue"},!0).set("bodyContent",this._getDialogueContent()).show()},_insertEmoji:function(e){var t=this.get("host");this.getDialogue({focusAfterHide:null}).hide(),t.setSelection(this._currentSelection),t.insertContentAtFocusPoint(e),this.markUpdated()},_getDialogueContent:function(){var o=e.Node.create("<div></div>");return require(["core/templates","core/emoji/picker"],function(e,i){e.render("core/emoji/picker",{}).then(function(e){var t=o.getDOMNode();t.innerHTML=e,i(t,this._insertEmoji.bind(this)),this.getDialogue().centerDialogue()}.bind(this))}.bind(this)),o}},{ATTRS:{disabled:{value:!0}}})},"@VERSION@",{requires:["moodle-editor_atto-plugin"]});
YUI.add("moodle-atto_emojipicker-button",function(e,t){e.namespace("M.atto_emojipicker").Button=e.Base.create("button",e.M.editor_atto.EditorPlugin,[],{_currentSelection:null,initializer:function(){this.get("disabled")||this.addButton({icon:"e/emoticons",callback:this._displayDialogue})},_displayDialogue:function(){this._currentSelection=this.get("host").getSelection(),!1!==this._currentSelection&&this.getDialogue({headerContent:M.util.get_string("emojipicker","atto_emojipicker"),width:"auto",focusAfterHide:!0,additionalBaseClass:"emoji-picker-dialogue"},!0).set("bodyContent",this._getDialogueContent()).show()},_insertEmoji:function(e){var t=this.get("host");this.getDialogue({focusAfterHide:null}).hide(),t.setSelection(this._currentSelection),t.insertContentAtFocusPoint(e),this.markUpdated()},_getDialogueContent:function(){var o=e.Node.create("<div></div>");return require(["core/templates","core/emoji/picker"],function(e,i){e.render("core/emoji/picker",{}).then(function(e){var t=o.getDOMNode();t.innerHTML=e,i(t,this._insertEmoji.bind(this)),this.getDialogue().centerDialogue(),t.querySelector('[data-region="search-input"]').focus()}.bind(this))}.bind(this)),o}},{ATTRS:{disabled:{value:!0}}})},"@VERSION@",{requires:["moodle-editor_atto-plugin"]});
@@ -24,7 +24,9 @@ YUI.add('moodle-atto_emojipicker-button', function (Y, NAME) {
/**
* @module moodle-atto_emojipicker-button
*/
var COMPONENTNAME = 'atto_emojipicker';
var COMPONENTNAME = 'atto_emojipicker',
EMOJI_PICKER_SEARCH_INPUT = '[data-region="search-input"]';
/**
* Atto text editor emoji picker plugin.
@@ -123,6 +125,7 @@ Y.namespace('M.atto_emojipicker').Button = Y.Base.create('button', Y.M.editor_at
domNode.innerHTML = html;
initialiseEmojiPicker(domNode, this._insertEmoji.bind(this));
this.getDialogue().centerDialogue();
domNode.querySelector(EMOJI_PICKER_SEARCH_INPUT).focus();
}.bind(this));
}.bind(this));
@@ -22,7 +22,9 @@
/**
* @module moodle-atto_emojipicker-button
*/
var COMPONENTNAME = 'atto_emojipicker';
var COMPONENTNAME = 'atto_emojipicker',
EMOJI_PICKER_SEARCH_INPUT = '[data-region="search-input"]';
/**
* Atto text editor emoji picker plugin.
@@ -121,6 +123,7 @@ Y.namespace('M.atto_emojipicker').Button = Y.Base.create('button', Y.M.editor_at
domNode.innerHTML = html;
initialiseEmojiPicker(domNode, this._insertEmoji.bind(this));
this.getDialogue().centerDialogue();
domNode.querySelector(EMOJI_PICKER_SEARCH_INPUT).focus();
}.bind(this));
}.bind(this));