From 3751379f1e9a4c215fb6eb898b4ccc67659b9ace Mon Sep 17 00:00:00 2001 From: stephanchrst Date: Tue, 10 May 2022 21:51:50 +0700 Subject: initial commit 2 --- .../components/emojis_popover/emojis_popover.js | 78 ++++++++++++++++++++++ .../components/emojis_popover/emojis_popover.scss | 22 ++++++ .../components/emojis_popover/emojis_popover.xml | 14 ++++ 3 files changed, 114 insertions(+) create mode 100644 addons/mail/static/src/components/emojis_popover/emojis_popover.js create mode 100644 addons/mail/static/src/components/emojis_popover/emojis_popover.scss create mode 100644 addons/mail/static/src/components/emojis_popover/emojis_popover.xml (limited to 'addons/mail/static/src/components/emojis_popover') diff --git a/addons/mail/static/src/components/emojis_popover/emojis_popover.js b/addons/mail/static/src/components/emojis_popover/emojis_popover.js new file mode 100644 index 00000000..a312eed4 --- /dev/null +++ b/addons/mail/static/src/components/emojis_popover/emojis_popover.js @@ -0,0 +1,78 @@ +odoo.define('mail/static/src/components/emojis_popover/emojis_popover.js', function (require) { +'use strict'; + +const emojis = require('mail.emojis'); +const useShouldUpdateBasedOnProps = require('mail/static/src/component_hooks/use_should_update_based_on_props/use_should_update_based_on_props.js'); +const useUpdate = require('mail/static/src/component_hooks/use_update/use_update.js'); + +const { Component } = owl; + +class EmojisPopover extends Component { + + /** + * @param {...any} args + */ + constructor(...args) { + super(...args); + this.emojis = emojis; + useShouldUpdateBasedOnProps(); + useUpdate({ func: () => this._update() }); + } + + //-------------------------------------------------------------------------- + // Private + //-------------------------------------------------------------------------- + + /** + * @private + */ + _update() { + this.trigger('o-popover-compute'); + } + + //-------------------------------------------------------------------------- + // Public + //-------------------------------------------------------------------------- + + close() { + this.trigger('o-popover-close'); + } + + /** + * Returns whether the given node is self or a children of self. + * + * @param {Node} node + * @returns {boolean} + */ + contains(node) { + if (!this.el) { + return false; + } + return this.el.contains(node); + } + + //-------------------------------------------------------------------------- + // Handlers + //-------------------------------------------------------------------------- + + /** + * @private + * @param {MouseEvent} ev + */ + _onClickEmoji(ev) { + this.close(); + this.trigger('o-emoji-selection', { + unicode: ev.currentTarget.dataset.unicode, + }); + } + +} + +Object.assign(EmojisPopover, { + props: {}, + template: 'mail.EmojisPopover', +}); + +return EmojisPopover; + +}); diff --git a/addons/mail/static/src/components/emojis_popover/emojis_popover.scss b/addons/mail/static/src/components/emojis_popover/emojis_popover.scss new file mode 100644 index 00000000..3a4559ae --- /dev/null +++ b/addons/mail/static/src/components/emojis_popover/emojis_popover.scss @@ -0,0 +1,22 @@ +// ------------------------------------------------------------------ +// Layout +// ------------------------------------------------------------------ + +.o_EmojisPopover { + display: flex; + flex-flow: row wrap; + max-width: 200px; +} + +.o_EmojisPopover_emoji { + font-size: 1.1em; + margin: 3px; +} + +// ------------------------------------------------------------------ +// Style +// ------------------------------------------------------------------ + +.o_EmojisPopover_emoji { + cursor: pointer; +} diff --git a/addons/mail/static/src/components/emojis_popover/emojis_popover.xml b/addons/mail/static/src/components/emojis_popover/emojis_popover.xml new file mode 100644 index 00000000..cac840bb --- /dev/null +++ b/addons/mail/static/src/components/emojis_popover/emojis_popover.xml @@ -0,0 +1,14 @@ + + + + +
+ + + + + +
+
+ +
-- cgit v1.2.3