diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 4813f6f91f..27609ef527 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -433,6 +433,7 @@ listen: "聴く" none: "なし" volume: "音量" details: "詳細" +chooseEmoji: "絵文字を選択" _sfx: note: "ノート" diff --git a/src/client/pages/my-settings/reaction.vue b/src/client/pages/my-settings/reaction.vue index 7ce39380fd..b2df3f0231 100644 --- a/src/client/pages/my-settings/reaction.vue +++ b/src/client/pages/my-settings/reaction.vue @@ -3,13 +3,13 @@ <div class="_title"><fa :icon="faLaugh"/> {{ $t('reaction') }}</div> <div class="_content"> <mk-input v-model="reactions" style="font-family: 'Segoe UI Emoji', 'Noto Color Emoji', Roboto, HelveticaNeue, Arial, sans-serif"> - {{ $t('reaction') }}<template #desc>{{ $t('reactionSettingDescription') }}</template> + {{ $t('reaction') }}<template #desc>{{ $t('reactionSettingDescription') }} <button class="_textButton" @click="chooseEmoji">{{ $t('chooseEmoji') }}</button></template> </mk-input> + <mk-button inline @click="setDefault"><fa :icon="faUndo"/> {{ $t('default') }}</mk-button> </div> <div class="_footer"> <mk-button @click="save()" primary inline :disabled="!changed"><fa :icon="faSave"/> {{ $t('save') }}</mk-button> <mk-button inline @click="preview"><fa :icon="faEye"/> {{ $t('preview') }}</mk-button> - <mk-button inline @click="setDefault"><fa :icon="faUndo"/> {{ $t('default') }}</mk-button> </div> </section> </template> @@ -72,6 +72,15 @@ export default Vue.extend({ setDefault() { this.reactions = '👍❤😆🤔😮🎉💢😥😇🍮'; }, + + async chooseEmoji(ev) { + const vm = this.$root.new(await import('../../components/emoji-picker.vue').then(m => m.default), { + source: ev.currentTarget || ev.target + }).$once('chosen', emoji => { + this.reactions += emoji; + vm.close(); + }); + } } }); </script>