diff --git a/src/components/settings_modal/admin_tabs/emoji_tab.js b/src/components/settings_modal/admin_tabs/emoji_tab.js new file mode 100644 index 0000000000..f9d3b24e0c --- /dev/null +++ b/src/components/settings_modal/admin_tabs/emoji_tab.js @@ -0,0 +1,62 @@ +import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx' +import StringSetting from '../helpers/string_setting.vue' +import Checkbox from 'components/checkbox/checkbox.vue' +import StillImage from 'components/still-image/still-image.vue' + +const EmojiTab = { + components: { + TabSwitcher, + StringSetting, + Checkbox, + StillImage + }, + + data () { + return { + knownPacks: { }, + editedParts: { } + } + }, + + methods: { + reloadEmoji () { + this.$store.state.api.backendInteractor.reloadEmoji() + }, + importFromFS () { + this.$store.state.api.backendInteractor.importEmojiFromFS() + }, + emojiAddr (packName, name) { + return `${this.$store.state.instance.server}/emoji/${encodeURIComponent(packName)}/${name}` + }, + editEmoji (packName, shortcode) { + if (this.editedParts[packName] === undefined) { this.editedParts[packName] = {} } + + this.editedParts[packName][shortcode] = { + shortcode, file: this.knownPacks[packName].files[shortcode] + } + }, + saveEditedEmoji (packName, shortcode) { + const edited = this.editedParts[packName][shortcode] + + this.$store.state.api.backendInteractor.updateEmojiFile( + { packName, shortcode, newShortcode: edited.shortcode, newFilename: edited.file, force: false } + ).then(resp => + resp.ok ? resp.json() : resp.text().then(respText => Promise.reject(respText)) + ).then(resp => { + this.knownPacks[packName].files = resp + delete this.editedParts[packName][shortcode] + }) + } + }, + + mounted () { + this.$store.state.api.backendInteractor.listEmojiPacks() + .then(data => data.json()) + .then(packData => { + this.knownPacks = packData.packs + console.log(this.knownPacks) + }) + } +} + +export default EmojiTab diff --git a/src/components/settings_modal/admin_tabs/emoji_tab.scss b/src/components/settings_modal/admin_tabs/emoji_tab.scss new file mode 100644 index 0000000000..397580af40 --- /dev/null +++ b/src/components/settings_modal/admin_tabs/emoji_tab.scss @@ -0,0 +1,24 @@ +.emoji-tab { + .btn-group .btn { + margin-left: 0.5em; + } + + .pack-info-wrapper { + margin-top: 1em; + } + + .emoji-info-input { + width: 100%; + } + + .emoji-data-input { + width: 40%; + margin-left: 0.5em; + margin-right: 0.5em; + } + + .emoji { + width: 32px; + height: 32px; + } +} diff --git a/src/components/settings_modal/admin_tabs/emoji_tab.vue b/src/components/settings_modal/admin_tabs/emoji_tab.vue new file mode 100644 index 0000000000..699e4afe6c --- /dev/null +++ b/src/components/settings_modal/admin_tabs/emoji_tab.vue @@ -0,0 +1,93 @@ +