Add form for entering or changing emoji pack metadata
This commit is contained in:
parent
30a1a25ff7
commit
932d20cfc6
4 changed files with 58 additions and 133 deletions
|
@ -323,7 +323,14 @@ export default {
|
|||
packs: 'Packs',
|
||||
remotePacks: 'Remote packs',
|
||||
remoteInstanceAddress: 'Remote instance address',
|
||||
refreshRemote: 'Refresh remote packs'
|
||||
refreshRemote: 'Refresh remote packs',
|
||||
sharePack: 'Share pack',
|
||||
homepage: 'Homepage',
|
||||
description: 'Description',
|
||||
license: 'License',
|
||||
fallbackSrc: 'Fallback source',
|
||||
fallbackSrcSha: 'Fallback source SHA',
|
||||
savePackMetadata: 'Save pack metadata'
|
||||
},
|
||||
invites: {
|
||||
inviteTokens: 'Invite tokens',
|
||||
|
|
|
@ -1,111 +1,56 @@
|
|||
<template>
|
||||
<div>
|
||||
<h2>{{ name }}</h2>
|
||||
|
||||
<prop-editing-row name="Share pack">
|
||||
<el-switch v-model="share" :disabled="!isLocal" />
|
||||
</prop-editing-row>
|
||||
<prop-editing-row name="Homepage">
|
||||
<el-input v-if="isLocal" v-model="homepage" />
|
||||
<el-input v-else :value="homepage" />
|
||||
</prop-editing-row>
|
||||
<prop-editing-row name="Description">
|
||||
<el-input v-if="isLocal" :rows="2" v-model="description" type="textarea" />
|
||||
<el-input v-else :rows="2" :value="description" type="textarea" />
|
||||
</prop-editing-row>
|
||||
<prop-editing-row name="License">
|
||||
<el-input v-if="isLocal" v-model="license" />
|
||||
<el-input v-else :value="license" />
|
||||
</prop-editing-row>
|
||||
<prop-editing-row name="Fallback source">
|
||||
<el-input v-if="isLocal" v-model="fallbackSrc" />
|
||||
<el-input v-else :value="fallbackSrc" />
|
||||
</prop-editing-row>
|
||||
|
||||
<prop-editing-row v-if="fallbackSrc && fallbackSrc.trim() !== ''" name="Fallback source SHA">
|
||||
{{ pack.pack["fallback-src-sha256"] }}
|
||||
</prop-editing-row>
|
||||
|
||||
<el-button v-if="isLocal" type="success" @click="savePackMetadata">Save pack metadata</el-button>
|
||||
|
||||
<el-collapse v-model="shownPackEmoji" class="contents-collapse">
|
||||
<el-collapse-item :name="name" title="Show pack contents">
|
||||
<new-emoji-uploader v-if="isLocal" :pack-name="name" class="new-emoji-uploader" />
|
||||
|
||||
<h4>Manage existing emoji</h4>
|
||||
|
||||
<single-emoji-editor
|
||||
v-for="(file, ename) in pack.files"
|
||||
:key="ename"
|
||||
:host="host"
|
||||
:pack-name="name"
|
||||
:name="ename"
|
||||
:file="file"
|
||||
:is-local="isLocal" />
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
|
||||
<div v-if="!isLocal" class="shared-pack-dl-box">
|
||||
<div>
|
||||
This will download the "{{ name }}" pack to the current instance under the name
|
||||
"{{ downloadSharedAs.trim() === '' ? name : downloadSharedAs }}" (can be changed below).
|
||||
It will then be usable and shareable from the current instance.
|
||||
</div>
|
||||
|
||||
<el-button type="primary" @click="downloadFromInstance">
|
||||
Download shared pack to current instance
|
||||
</el-button>
|
||||
|
||||
<el-input v-model="downloadSharedAs" class="dl-as-input" placeholder="Download as (optional)" />
|
||||
</div>
|
||||
|
||||
<el-link
|
||||
v-if="pack.pack['can-download']"
|
||||
:href="`//${host}/api/pleroma/emoji/packs/${name}/download_shared`"
|
||||
type="primary"
|
||||
target="_blank">
|
||||
Download pack archive
|
||||
</el-link>
|
||||
|
||||
<div v-if="isLocal" class="pack-actions">
|
||||
<el-button type="danger" @click="deletePack">
|
||||
Delete the local pack
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-collapse-item :title="name" :name="name">
|
||||
<el-form label-width="120px" size="small">
|
||||
<el-form-item :label="$t('settings.sharePack')">
|
||||
<el-switch v-model="share" :disabled="!isLocal" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('settings.homepage')">
|
||||
<el-input v-if="isLocal" v-model="homepage" />
|
||||
<el-input v-else :value="homepage" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('settings.description')">
|
||||
<el-input v-if="isLocal" v-model="description" type="textarea" />
|
||||
<el-input v-else :value="description" type="textarea" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('settings.license')">
|
||||
<el-input v-if="isLocal" v-model="license" />
|
||||
<el-input v-else :value="license" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('settings.fallbackSrc')">
|
||||
<el-input v-if="isLocal" v-model="fallbackSrc" />
|
||||
<el-input v-else :value="fallbackSrc" />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
v-if="fallbackSrc && fallbackSrc.trim() !== ''"
|
||||
:label="$t('settings.fallbackSrcSha')">
|
||||
{{ pack.pack["fallback-src-sha256"] }}
|
||||
</el-form-item>
|
||||
<el-form-item class="save-pack-button">
|
||||
<el-button v-if="isLocal" type="primary" @click="savePackMetadata">{{ $t('settings.savePackMetadata') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-collapse-item>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.shared-pack-dl-box {
|
||||
margin: 1em;
|
||||
}
|
||||
|
||||
.dl-as-input {
|
||||
margin: 1em;
|
||||
max-width: 30%;
|
||||
}
|
||||
|
||||
.contents-collapse {
|
||||
margin: 1em;
|
||||
}
|
||||
|
||||
.pack-actions {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
.new-emoji-uploader {
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
.el-collapse-item__content {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.el-collapse-item__header {
|
||||
height: 36px;
|
||||
}
|
||||
.emoji-pack-card {
|
||||
margin-top: 5px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import PropEditingRow from './PropertyEditingRow.vue'
|
||||
import SingleEmojiEditor from './SingleEmojiEditor.vue'
|
||||
import NewEmojiUploader from './NewEmojiUploader.vue'
|
||||
|
||||
export default {
|
||||
|
||||
components: { PropEditingRow, SingleEmojiEditor, NewEmojiUploader },
|
||||
components: { SingleEmojiEditor, NewEmojiUploader },
|
||||
props: {
|
||||
name: {
|
||||
type: String,
|
||||
|
|
|
@ -1,27 +0,0 @@
|
|||
<template>
|
||||
<el-row :gutter="20" class="prop-row">
|
||||
<el-col :span="4">
|
||||
<b>{{ name }}</b>
|
||||
</el-col>
|
||||
<el-col :span="10">
|
||||
<slot/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.prop-row {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
name: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
|
@ -24,11 +24,10 @@
|
|||
</el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="localPacks.length > 0" :label="$t('settings.packs')">
|
||||
<div v-for="(pack, name) in localPacks" :key="name">
|
||||
<el-form-item v-if="Object.keys(localPacks).length > 0" :label="$t('settings.packs')">
|
||||
<el-collapse v-for="(pack, name) in localPacks" :key="name" v-model="activeLocalPack">
|
||||
<emoji-pack :name="name" :pack="pack" :host="$store.getters.authHost" :is-local="true" />
|
||||
<el-divider />
|
||||
</div>
|
||||
</el-collapse>
|
||||
</el-form-item>
|
||||
<div class="line"/>
|
||||
<el-form-item :label="$t('settings.remotePacks')">
|
||||
|
@ -44,11 +43,10 @@
|
|||
</el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="remotePacks.length > 0" :label="$t('settings.packs')">
|
||||
<div v-for="(pack, name) in remotePacks" :key="name">
|
||||
<el-form-item v-if="Object.keys(remotePacks).length > 0" :label="$t('settings.packs')">
|
||||
<el-collapse v-for="(pack, name) in remotePacks" :key="name" v-model="activeRemotePack">
|
||||
<emoji-pack :name="name" :pack="pack" :host="$store.getters.authHost" :is-local="true" />
|
||||
<el-divider />
|
||||
</div>
|
||||
</el-collapse>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
|
@ -62,7 +60,9 @@ export default {
|
|||
data() {
|
||||
return {
|
||||
remoteInstanceAddress: '',
|
||||
newPackName: ''
|
||||
newPackName: '',
|
||||
activeLocalPack: '',
|
||||
activeRemotePack: ''
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
|
Loading…
Reference in a new issue