Home

# Class goog.ui.emoji.EmojiPicker

Creates a new, empty emoji picker. An emoji picker is a grid of emoji, each cell of the grid containing a single emoji. The picker may contain multiple pages of emoji. When a user selects an emoji, by either clicking or pressing enter, the picker fires a goog.ui.Component.EventType.ACTION event with the id. The client listens on this event and in the handler can retrieve the id of the selected emoji and do something with it, for instance, inserting an image tag into a rich text control. An emoji picker does not maintain state. That is, once an emoji is selected, the emoji picker does not remember which emoji was selected. The emoji picker is implemented as a tabpane with each tabpage being a table. Each of the tables are the same size to prevent jittering when switching between pages.

extends goog.ui.Component

Instance Method Summary
| `addEmojiGroup((Element|null|string) title, ?Array.<(Array.<string>|null)> emojiGroup)` Adds a group of emoji to the picker.
| `adjustNumRowsIfNecessary_()` Adjusts the number of rows to be the maximum row count out of all the emoji groups, in order to prevent jitter in switching among the tabs.
| `canDecorate(?Element element) ⇒ boolean` EmojiPickers cannot be used to decorate pre-existing html, since the structure they build is fairly complicated.
| `createDom()` Creates the initial DOM representation for the component. The default implementation is to set this.element_ = div.
| `createEmojiPage_(?Array.<(Array.<string>|null)> emoji, number index) ⇒ ?goog.ui.emoji.EmojiPalette` Creates a page if it has not already been loaded. This has the side effects of setting the load status of the page to true.
| `createPlaceholderEmojiPage_(?Array.<(Array.<string>|null)> emoji) ⇒ ?goog.ui.emoji.EmojiPalette` Creates an emoji page using placeholder emoji pointing to the default img instead of the real emoji. Used for delayed loading.
| `disposeInternal()` Disposes of the component. Calls {@code exitDocument}, which is expected to remove event handlers and clean up the component. Propagates the call to the component's children, if any. Removes the component's DOM from the document unless it was decorated.
| `enterDocument()` Called when the component's element is known to be in the document. Anything using document.getElementById etc. should be done at this stage. If the component contains child components, this call is propagated to its children.
| `exitDocument()` Called by dispose to clean up the elements and listeners created by a component, or by a parent component/application who has removed the component from the document but wants to reuse it later. If the component contains child components, this call is propagated to its children. It should be possible for the component to be rendered again once this method has been called.
| `getActivePage_() ⇒ ?goog.ui.emoji.EmojiPalette`
| `getCssClass() ⇒ string`
| `getNumColumns() ⇒ number` Gets the number of columns per grid in the emoji picker.
| `getNumEmojiGroups() ⇒ number` Returns the number of emoji groups in this picker.
| `getNumRows() ⇒ number` Gets the number of rows per grid in the emoji picker.
| `getPage(number index) ⇒ ?goog.ui.emoji.EmojiPalette` Returns a page from the picker. This should be considered protected, and is ONLY FOR TESTING.
| `getPages() ⇒ ?Array` Returns all the pages from the picker. This should be considered protected, and is ONLY FOR TESTING.
| `getPlaceholderEmoji_(?Array.<(Array.<string>|null)> emoji) ⇒ ?Array.<(Array.<string>|null)>` Returns an array of emoji whose real URLs have been replaced with the default img URL. Used for delayed loading.
| `getSelectedEmoji() ⇒ ?goog.ui.emoji.Emoji` Returns the currently selected emoji from this picker. If the picker is using the URL prefix optimization, allocates a new emoji object with the full URL. This method is meant to be used by clients of the emojipicker, e.g., in a listener on goog.ui.component.EventType.ACTION that wants to use the just-selected emoji.
| `getTabPane() ⇒ ?goog.ui.TabPane` Returns the tabpane if this is a multipage picker. This should be considered protected, and is ONLY FOR TESTING.
| `isFocusable() ⇒ boolean` Returns true if the component is focusable, false otherwise. The default is true. Focusable components always have a tab index and allocate a key handler to handle keyboard events while focused.
| `loadImages()` Causes the emoji imgs to be loaded into the picker. Used for delayed loading. No-op if delayed loading is not set.
| `loadPage_(number index)` Loads a page into the picker if it has not yet been loaded.
| `manuallyLoadAnimatedEmoji()` Used by unittests to manually load the animated emoji for this picker.
| `onEmojiPaletteAction_(?goog.ui.Component.EventType e)` Handles actions from the EmojiPalettes that this picker contains.
| `onPageChanged_(?goog.ui.TabPaneEvent e)` Handles changes in the active page in the tabpane.
| `setAutoSizeByColumnCount(boolean autoSize)` Sets whether to automatically size the emojipicker based on the number of columns and the number of emoji in each group, so as to reduce jitter.
| `setDelayedLoad(boolean shouldDelay)` Sets whether loading of images should be delayed until after dom creation. Thus, this function must be called before {@link #createDom}. If set to true, the client must call {@link #loadImages} when they wish the images to be loaded.
| `setFocusable(boolean focusable)` Sets whether the component is focusable. The default is true. Focusable components always have a tab index and allocate a key handler to handle keyboard events while focused.
| `setManualLoadOfAnimatedEmoji(boolean manual)` Sets whether to require the caller to manually specify when to start loading animated emoji. This is primarily for unittests to be able to test the structure of the emojipicker palettes before and after the animated emoji have been loaded. This only affects sprited emojipickers with sprite data for animated emoji.
| `setNumColumns(number numCols)` Sets the number of columns per grid in the emoji picker. This should only be called before the picker has been rendered.
| `setNumRows(number numRows)` Sets the number of rows per grid in the emoji picker. This should only be called before the picker has been rendered.
| `setProgressiveRender(boolean progressive)` Sets the progressive rendering aspect of this emojipicker. Must be called before createDom to have an effect.
| `setTabLocation(?goog.ui.TabPane.TabLocation tabLocation)` Sets the location of the tabs in relation to the emoji grids. This should only be called before the picker has been rendered.
| `setUrlPrefix(string urlPrefix)` Sets the URL prefix for the emoji URLs.