add more ways to set description

This commit is contained in:
Shpuld Shpuldson 2020-07-07 09:07:20 +03:00
parent d55c09df18
commit b4709f93d4
4 changed files with 71 additions and 34 deletions

View file

@ -6,7 +6,7 @@ import PollForm from '../poll/poll_form.vue'
import Attachment from '../attachment/attachment.vue' import Attachment from '../attachment/attachment.vue'
import fileTypeService from '../../services/file_type/file_type.service.js' import fileTypeService from '../../services/file_type/file_type.service.js'
import { findOffset } from '../../services/offset_finder/offset_finder.service.js' import { findOffset } from '../../services/offset_finder/offset_finder.service.js'
import { reject, map, uniqBy } from 'lodash' import { reject, map, uniqBy, debounce } from 'lodash'
import suggestor from '../emoji_input/suggestor.js' import suggestor from '../emoji_input/suggestor.js'
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import Checkbox from '../checkbox/checkbox.vue' import Checkbox from '../checkbox/checkbox.vue'
@ -169,7 +169,7 @@ const PostStatusForm = {
...mapGetters(['mergedConfig']) ...mapGetters(['mergedConfig'])
}, },
methods: { methods: {
postStatus (newStatus) { async postStatus (newStatus) {
if (this.posting) { return } if (this.posting) { return }
if (this.submitDisabled) { return } if (this.submitDisabled) { return }
@ -187,24 +187,26 @@ const PostStatusForm = {
} }
this.posting = true this.posting = true
statusPoster.postStatus({
await this.setAllMediaDescriptions()
const data = await statusPoster.postStatus({
status: newStatus.status, status: newStatus.status,
spoilerText: newStatus.spoilerText || null, spoilerText: newStatus.spoilerText || null,
visibility: newStatus.visibility, visibility: newStatus.visibility,
sensitive: newStatus.nsfw, sensitive: newStatus.nsfw,
media: newStatus.files, media: newStatus.files,
mediaDescriptions: newStatus.mediaDescriptions || {},
store: this.$store, store: this.$store,
inReplyToStatusId: this.replyTo, inReplyToStatusId: this.replyTo,
contentType: newStatus.contentType, contentType: newStatus.contentType,
poll poll
}).then((data) => { })
if (!data.error) { if (!data.error) {
this.newStatus = { this.newStatus = {
status: '', status: '',
spoilerText: '', spoilerText: '',
files: [], files: [],
mediaDescriptions: {},
visibility: newStatus.visibility, visibility: newStatus.visibility,
contentType: newStatus.contentType, contentType: newStatus.contentType,
poll: {} poll: {}
@ -220,8 +222,8 @@ const PostStatusForm = {
} else { } else {
this.error = data.error this.error = data.error
} }
this.posting = false this.posting = false
})
}, },
addMediaFile (fileInfo) { addMediaFile (fileInfo) {
this.newStatus.files.push(fileInfo) this.newStatus.files.push(fileInfo)
@ -393,6 +395,23 @@ const PostStatusForm = {
}, },
dismissScopeNotice () { dismissScopeNotice () {
this.$store.dispatch('setOption', { name: 'hideScopeNotice', value: true }) this.$store.dispatch('setOption', { name: 'hideScopeNotice', value: true })
},
debounceSendDescription: debounce(function (id, description) {
statusPoster.setMediaDescription({ store: this.$store, id, description })
}, 500),
updateMediaDescription (fileId, e) {
const description = e.target.value
this.newStatus.mediaDescriptions[fileId] = description
this.debounceSendDescription(fileId, description)
},
setMediaDescription (id) {
const description = this.newStatus.mediaDescriptions[id]
if (!description || description.trim() === '') return
return statusPoster.setMediaDescription({ store: this.$store, id, description })
},
setAllMediaDescriptions () {
const ids = this.newStatus.files.map(file => file.id)
return Promise.all(ids.map(id => this.setMediaDescription(id)))
} }
} }
} }

View file

@ -255,6 +255,7 @@
v-model="newStatus.mediaDescriptions[file.id]" v-model="newStatus.mediaDescriptions[file.id]"
type="text" type="text"
:placeholder="$t('post_status.media_description')" :placeholder="$t('post_status.media_description')"
@blur="setMediaDescription(file.id)"
@keydown.enter.prevent="" @keydown.enter.prevent=""
> >
</div> </div>

View file

@ -645,8 +645,7 @@ const postStatus = ({
poll, poll,
mediaIds = [], mediaIds = [],
inReplyToStatusId, inReplyToStatusId,
contentType, contentType
mediaDescriptions
}) => { }) => {
const form = new FormData() const form = new FormData()
const pollOptions = poll.options || [] const pollOptions = poll.options || []
@ -673,7 +672,6 @@ const postStatus = ({
form.append('poll[options][]', option) form.append('poll[options][]', option)
}) })
} }
form.append('descriptions', JSON.stringify(mediaDescriptions))
if (inReplyToStatusId) { if (inReplyToStatusId) {
form.append('in_reply_to_id', inReplyToStatusId) form.append('in_reply_to_id', inReplyToStatusId)
} }
@ -712,6 +710,17 @@ const uploadMedia = ({ formData, credentials }) => {
.then((data) => parseAttachment(data)) .then((data) => parseAttachment(data))
} }
const setMediaDescription = ({ id, description, credentials }) => {
return promisedRequest({
url: `${MASTODON_MEDIA_UPLOAD_URL}/${id}`,
method: 'PUT',
headers: authHeaders(credentials),
payload: {
description
}
}).then((data) => parseAttachment(data))
}
const importBlocks = ({ file, credentials }) => { const importBlocks = ({ file, credentials }) => {
const formData = new FormData() const formData = new FormData()
formData.append('list', file) formData.append('list', file)
@ -1181,6 +1190,7 @@ const apiService = {
postStatus, postStatus,
deleteStatus, deleteStatus,
uploadMedia, uploadMedia,
setMediaDescription,
fetchMutes, fetchMutes,
muteUser, muteUser,
unmuteUser, unmuteUser,

View file

@ -1,7 +1,7 @@
import { map } from 'lodash' import { map } from 'lodash'
import apiService from '../api/api.service.js' import apiService from '../api/api.service.js'
const postStatus = ({ store, status, spoilerText, visibility, sensitive, poll, media = [], inReplyToStatusId = undefined, contentType = 'text/plain', mediaDescriptions = {} }) => { const postStatus = ({ store, status, spoilerText, visibility, sensitive, poll, media = [], inReplyToStatusId = undefined, contentType = 'text/plain' }) => {
const mediaIds = map(media, 'id') const mediaIds = map(media, 'id')
return apiService.postStatus({ return apiService.postStatus({
@ -13,8 +13,8 @@ const postStatus = ({ store, status, spoilerText, visibility, sensitive, poll, m
mediaIds, mediaIds,
inReplyToStatusId, inReplyToStatusId,
contentType, contentType,
poll, poll
mediaDescriptions }) })
.then((data) => { .then((data) => {
if (!data.error) { if (!data.error) {
store.dispatch('addNewStatuses', { store.dispatch('addNewStatuses', {
@ -39,9 +39,16 @@ const uploadMedia = ({ store, formData }) => {
return apiService.uploadMedia({ credentials, formData }) return apiService.uploadMedia({ credentials, formData })
} }
const setMediaDescription = ({ store, id, description }) => {
const credentials = store.state.users.currentUser.credentials
return apiService.setMediaDescription({ credentials, id, description })
}
const statusPosterService = { const statusPosterService = {
postStatus, postStatus,
uploadMedia uploadMedia,
setMediaDescription
} }
export default statusPosterService export default statusPosterService