diff --git a/src/utils/emoji-index/__tests__/nimble-emoji-index.test.js b/src/utils/emoji-index/__tests__/nimble-emoji-index.test.js new file mode 100644 index 0000000..caaafe7 --- /dev/null +++ b/src/utils/emoji-index/__tests__/nimble-emoji-index.test.js @@ -0,0 +1,24 @@ +import NimbleEmojiIndex from '../nimble-emoji-index.js' +import store from '../../store' + +import data from '../../../../data/all' + +const nimbleEmojiIndex = new NimbleEmojiIndex(data); + +function getEmojiData(skinTone) { + store.update({skin: skinTone}) + + return nimbleEmojiIndex.search('thumbsup')[0] +} + +test('should return emojis with skin tone 1', () => { + const skinTone = 1 + const emoji = getEmojiData(skinTone) + expect(emoji.skin).toEqual(skinTone) +}) + +test('should return emojis with skin tone 6', () => { + const skinTone = 6 + const emoji = getEmojiData(skinTone) + expect(emoji.skin).toEqual(skinTone) +}) diff --git a/src/utils/emoji-index/nimble-emoji-index.js b/src/utils/emoji-index/nimble-emoji-index.js index 8b1bdc3..f113198 100644 --- a/src/utils/emoji-index/nimble-emoji-index.js +++ b/src/utils/emoji-index/nimble-emoji-index.js @@ -1,13 +1,15 @@ import { getData, getSanitizedData, intersect } from '..' import { uncompress } from '../data' +import store from '../store' export default class NimbleEmojiIndex { - constructor(data) { + constructor(data, set) { if (data.compressed) { uncompress(data) } this.data = data || {} + this.set = set || null this.originalPool = {} this.index = {} this.emojis = {} @@ -20,7 +22,7 @@ export default class NimbleEmojiIndex { buildIndex() { for (let emoji in this.data.emojis) { let emojiData = this.data.emojis[emoji], - { short_names, emoticons } = emojiData, + { short_names, emoticons, skin_variations } = emojiData, id = short_names[0] if (emoticons) { @@ -33,7 +35,16 @@ export default class NimbleEmojiIndex { }) } - this.emojis[id] = getSanitizedData(id, null, null, this.data) + // If skin variations include them + if (skin_variations) { + this.emojis[id] = {} + for (let skinTone = 1; skinTone <= 6; skinTone++) { + this.emojis[id][skinTone] = getSanitizedData({id, skin: skinTone}, skinTone, this.set, this.data) + } + } else { + this.emojis[id] = getSanitizedData(id, null, this.set, this.data) + } + this.originalPool[id] = emojiData } } @@ -70,6 +81,8 @@ export default class NimbleEmojiIndex { if (this.customEmojisList != custom) this.addCustomToPool(custom, this.originalPool) + const skinTone = store.get('skin') || 1; + maxResults || (maxResults = 75) include || (include = []) exclude || (exclude = []) @@ -79,7 +92,7 @@ export default class NimbleEmojiIndex { if (value.length) { if (value == '-' || value == '-1') { - return [this.emojis['-1']] + return [this.emojis['-1'][skinTone]] } var values = value.toLowerCase().split(/[\s|,|\-|_]+/), @@ -148,7 +161,11 @@ export default class NimbleEmojiIndex { let score = subIndex + 1 if (sub == id) score = 0 - aIndex.results.push(this.emojis[id]) + if (this.emojis[id] && this.emojis[id][skinTone]) { + aIndex.results.push(this.emojis[id][skinTone]) + } else { + aIndex.results.push(this.emojis[id]) + } aIndex.pool[id] = emoji scores[id] = score diff --git a/src/utils/index.js b/src/utils/index.js index 895b98e..45f011d 100644 --- a/src/utils/index.js +++ b/src/utils/index.js @@ -104,7 +104,7 @@ function getData(emoji, skin, set, data) { emojiData.emoticons || (emojiData.emoticons = []) emojiData.variations || (emojiData.variations = []) - if (emojiData.skin_variations && skin > 1 && set) { + if (emojiData.skin_variations && skin > 1) { emojiData = JSON.parse(_JSON.stringify(emojiData)) var skinKey = SKINS[skin - 1], @@ -115,8 +115,9 @@ function getData(emoji, skin, set, data) { } if ( + (set && variationData[`has_img_${set}`] == undefined || - variationData[`has_img_${set}`] + variationData[`has_img_${set}`]) || !set ) { emojiData.skin_tone = skin diff --git a/stories/index.js b/stories/index.js index aed6468..919122d 100644 --- a/stories/index.js +++ b/stories/index.js @@ -11,7 +11,8 @@ import { color, } from '@storybook/addon-knobs' -import { Picker, Emoji, emojiIndex } from '../dist' +import { Picker, Emoji, emojiIndex, NimbleEmojiIndex } from '../dist' +import data from '../data/all.json' import '../css/emoji-mart.css' const SETS = ['apple', 'google', 'twitter', 'emojione', 'messenger', 'facebook'] @@ -214,3 +215,30 @@ storiesOf('Headless Search', module) ) }) + + .add('With skin tone from store', () => { + const nimbleEmojiIndex = new NimbleEmojiIndex(data) + let results = nimbleEmojiIndex.search(text('Search', 'thumbs'), { + custom: CUSTOM_EMOJIS, + }) + if (!results) { + return null + } + + return ( +
+ {results.map((emoji) => { + return ( + + + + ) + })} +
+ ) + })