-
Notifications
You must be signed in to change notification settings - Fork 50
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Updated to use 2 spaces instead of 4
- Loading branch information
1 parent
20d1f48
commit 84df268
Showing
4 changed files
with
807 additions
and
807 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,122 +1,122 @@ | ||
| <template> | ||
| <div> | ||
| <slot | ||
| name="emoji-invoker" | ||
| :events="{ click: (e) => toggle(e) }" | ||
| ></slot> | ||
| <div | ||
| v-if="display.visible" | ||
| v-click-outside="hide" | ||
| > | ||
| <slot | ||
| name="emoji-picker" | ||
| :emojis="emojis" | ||
| :insert="insert" | ||
| :display="display" | ||
| ></slot> | ||
| </div> | ||
| <div> | ||
| <slot | ||
| name="emoji-invoker" | ||
| :events="{ click: (e) => toggle(e) }" | ||
| ></slot> | ||
| <div | ||
| v-if="display.visible" | ||
| v-click-outside="hide" | ||
| > | ||
| <slot | ||
| name="emoji-picker" | ||
| :emojis="emojis" | ||
| :insert="insert" | ||
| :display="display" | ||
| ></slot> | ||
| </div> | ||
| </div> | ||
| </template> | ||
|
|
||
| <script> | ||
| import emojis from '../emojis' | ||
| import emojis from '../emojis' | ||
| export default { | ||
| props: { | ||
| search: { | ||
| type: String, | ||
| required: false, | ||
| default: '', | ||
| }, | ||
| emojiTable: { | ||
| type: Object, | ||
| required: false, | ||
| default() { | ||
| return emojis | ||
| }, | ||
| }, | ||
| export default { | ||
| props: { | ||
| search: { | ||
| type: String, | ||
| required: false, | ||
| default: '', | ||
| }, | ||
| emojiTable: { | ||
| type: Object, | ||
| required: false, | ||
| default() { | ||
| return emojis | ||
| }, | ||
| data() { | ||
| return { | ||
| display: { | ||
| x: 0, | ||
| y: 0, | ||
| visible: false, | ||
| }, | ||
| } | ||
| }, | ||
| }, | ||
| data() { | ||
| return { | ||
| display: { | ||
| x: 0, | ||
| y: 0, | ||
| visible: false, | ||
| }, | ||
| computed: { | ||
| emojis() { | ||
| if (this.search) { | ||
| const obj = {} | ||
| } | ||
| }, | ||
| computed: { | ||
| emojis() { | ||
| if (this.search) { | ||
| const obj = {} | ||
| for (const category in this.emojiTable) { | ||
| obj[category] = {} | ||
| for (const category in this.emojiTable) { | ||
| obj[category] = {} | ||
| for (const emoji in this.emojiTable[category]) { | ||
| if (new RegExp(`.*${this.search}.*`).test(emoji)) { | ||
| obj[category][emoji] = this.emojiTable[category][emoji] | ||
| } | ||
| } | ||
| for (const emoji in this.emojiTable[category]) { | ||
| if (new RegExp(`.*${this.search}.*`).test(emoji)) { | ||
| obj[category][emoji] = this.emojiTable[category][emoji] | ||
| } | ||
| } | ||
| if (Object.keys(obj[category]).length === 0) { | ||
| delete obj[category] | ||
| } | ||
| } | ||
| if (Object.keys(obj[category]).length === 0) { | ||
| delete obj[category] | ||
| } | ||
| } | ||
| return obj | ||
| } | ||
| return obj | ||
| } | ||
| return this.emojiTable | ||
| }, | ||
| }, | ||
| methods: { | ||
| insert(emoji) { | ||
| this.$emit('emoji', emoji) | ||
| }, | ||
| toggle(e) { | ||
| this.display.visible = ! this.display.visible | ||
| this.display.x = e.clientX | ||
| this.display.y = e.clientY | ||
| }, | ||
| hide() { | ||
| this.display.visible = false | ||
| }, | ||
| escape(e) { | ||
| if (this.display.visible === true && e.keyCode === 27) { | ||
| this.display.visible = false | ||
| } | ||
| }, | ||
| }, | ||
| directives: { | ||
| 'click-outside': { | ||
| bind(el, binding, vNode) { | ||
| if (typeof binding.value !== 'function') { | ||
| return | ||
| } | ||
| return this.emojiTable | ||
| }, | ||
| }, | ||
| methods: { | ||
| insert(emoji) { | ||
| this.$emit('emoji', emoji) | ||
| }, | ||
| toggle(e) { | ||
| this.display.visible = ! this.display.visible | ||
| this.display.x = e.clientX | ||
| this.display.y = e.clientY | ||
| }, | ||
| hide() { | ||
| this.display.visible = false | ||
| }, | ||
| escape(e) { | ||
| if (this.display.visible === true && e.keyCode === 27) { | ||
| this.display.visible = false | ||
| } | ||
| }, | ||
| }, | ||
| directives: { | ||
| 'click-outside': { | ||
| bind(el, binding, vNode) { | ||
| if (typeof binding.value !== 'function') { | ||
| return | ||
| } | ||
| const bubble = binding.modifiers.bubble | ||
| const handler = (e) => { | ||
| if (bubble || (! el.contains(e.target) && el !== e.target)) { | ||
| binding.value(e) | ||
| } | ||
| } | ||
| el.__vueClickOutside__ = handler | ||
| document.addEventListener('click', handler) | ||
| }, | ||
| unbind(el, binding) { | ||
| document.removeEventListener('click', el.__vueClickOutside__) | ||
| const bubble = binding.modifiers.bubble | ||
| const handler = (e) => { | ||
| if (bubble || (! el.contains(e.target) && el !== e.target)) { | ||
| binding.value(e) | ||
| } | ||
| } | ||
| el.__vueClickOutside__ = handler | ||
| el.__vueClickOutside__ = null | ||
| }, | ||
| }, | ||
| document.addEventListener('click', handler) | ||
| }, | ||
| mounted() { | ||
| document.addEventListener('keyup', this.escape) | ||
| }, | ||
| destroyed() { | ||
| document.removeEventListener('keyup', this.escape) | ||
| unbind(el, binding) { | ||
| document.removeEventListener('click', el.__vueClickOutside__) | ||
| el.__vueClickOutside__ = null | ||
| }, | ||
| } | ||
| }, | ||
| }, | ||
| mounted() { | ||
| document.addEventListener('keyup', this.escape) | ||
| }, | ||
| destroyed() { | ||
| document.removeEventListener('keyup', this.escape) | ||
| }, | ||
| } | ||
| </script> |
Oops, something went wrong.