|
|
@ -3,9 +3,10 @@ import MediaUpload from '../media_upload/media_upload.vue'
|
|
|
|
import ScopeSelector from '../scope_selector/scope_selector.vue'
|
|
|
|
import ScopeSelector from '../scope_selector/scope_selector.vue'
|
|
|
|
import EmojiInput from '../emoji_input/emoji_input.vue'
|
|
|
|
import EmojiInput from '../emoji_input/emoji_input.vue'
|
|
|
|
import PollForm from '../poll/poll_form.vue'
|
|
|
|
import PollForm from '../poll/poll_form.vue'
|
|
|
|
|
|
|
|
import StatusContent from '../status_content/status_content.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'
|
|
|
@ -38,7 +39,8 @@ const PostStatusForm = {
|
|
|
|
EmojiInput,
|
|
|
|
EmojiInput,
|
|
|
|
PollForm,
|
|
|
|
PollForm,
|
|
|
|
ScopeSelector,
|
|
|
|
ScopeSelector,
|
|
|
|
Checkbox
|
|
|
|
Checkbox,
|
|
|
|
|
|
|
|
StatusContent
|
|
|
|
},
|
|
|
|
},
|
|
|
|
mounted () {
|
|
|
|
mounted () {
|
|
|
|
this.resize(this.$refs.textarea)
|
|
|
|
this.resize(this.$refs.textarea)
|
|
|
@ -84,7 +86,9 @@ const PostStatusForm = {
|
|
|
|
caret: 0,
|
|
|
|
caret: 0,
|
|
|
|
pollFormVisible: false,
|
|
|
|
pollFormVisible: false,
|
|
|
|
showDropIcon: 'hide',
|
|
|
|
showDropIcon: 'hide',
|
|
|
|
dropStopTimeout: null
|
|
|
|
dropStopTimeout: null,
|
|
|
|
|
|
|
|
preview: null,
|
|
|
|
|
|
|
|
previewLoading: false
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
|
|
computed: {
|
|
|
|
computed: {
|
|
|
@ -163,19 +167,30 @@ const PostStatusForm = {
|
|
|
|
this.newStatus.poll &&
|
|
|
|
this.newStatus.poll &&
|
|
|
|
this.newStatus.poll.error
|
|
|
|
this.newStatus.poll.error
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
showPreview () {
|
|
|
|
|
|
|
|
return !!this.preview || this.previewLoading
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
emptyStatus () {
|
|
|
|
|
|
|
|
return this.newStatus.status.trim() === '' && this.newStatus.files.length === 0
|
|
|
|
|
|
|
|
},
|
|
|
|
...mapGetters(['mergedConfig'])
|
|
|
|
...mapGetters(['mergedConfig'])
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
watch: {
|
|
|
|
|
|
|
|
'newStatus.contentType': function () {
|
|
|
|
|
|
|
|
this.autoPreview()
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
'newStatus.spoilerText': function () {
|
|
|
|
|
|
|
|
this.autoPreview()
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
methods: {
|
|
|
|
postStatus (newStatus) {
|
|
|
|
postStatus (newStatus) {
|
|
|
|
if (this.posting) { return }
|
|
|
|
if (this.posting) { return }
|
|
|
|
if (this.submitDisabled) { return }
|
|
|
|
if (this.submitDisabled) { return }
|
|
|
|
|
|
|
|
if (this.emptyStatus) {
|
|
|
|
if (this.newStatus.status === '') {
|
|
|
|
this.error = this.$t('post_status.empty_status_error')
|
|
|
|
if (this.newStatus.files.length === 0) {
|
|
|
|
|
|
|
|
this.error = 'Cannot post an empty status with no files'
|
|
|
|
|
|
|
|
return
|
|
|
|
return
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const poll = this.pollFormVisible ? this.newStatus.poll : {}
|
|
|
|
const poll = this.pollFormVisible ? this.newStatus.poll : {}
|
|
|
|
if (this.pollContentError) {
|
|
|
|
if (this.pollContentError) {
|
|
|
@ -212,12 +227,64 @@ const PostStatusForm = {
|
|
|
|
el.style.height = 'auto'
|
|
|
|
el.style.height = 'auto'
|
|
|
|
el.style.height = undefined
|
|
|
|
el.style.height = undefined
|
|
|
|
this.error = null
|
|
|
|
this.error = null
|
|
|
|
|
|
|
|
this.previewStatus()
|
|
|
|
} else {
|
|
|
|
} else {
|
|
|
|
this.error = data.error
|
|
|
|
this.error = data.error
|
|
|
|
}
|
|
|
|
}
|
|
|
|
this.posting = false
|
|
|
|
this.posting = false
|
|
|
|
})
|
|
|
|
})
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
previewStatus () {
|
|
|
|
|
|
|
|
if (this.emptyStatus && this.newStatus.spoilerText.trim() === '') {
|
|
|
|
|
|
|
|
this.preview = { error: this.$t('post_status.preview_empty') }
|
|
|
|
|
|
|
|
this.previewLoading = false
|
|
|
|
|
|
|
|
return
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
const newStatus = this.newStatus
|
|
|
|
|
|
|
|
this.previewLoading = true
|
|
|
|
|
|
|
|
statusPoster.postStatus({
|
|
|
|
|
|
|
|
status: newStatus.status,
|
|
|
|
|
|
|
|
spoilerText: newStatus.spoilerText || null,
|
|
|
|
|
|
|
|
visibility: newStatus.visibility,
|
|
|
|
|
|
|
|
sensitive: newStatus.nsfw,
|
|
|
|
|
|
|
|
media: [],
|
|
|
|
|
|
|
|
store: this.$store,
|
|
|
|
|
|
|
|
inReplyToStatusId: this.replyTo,
|
|
|
|
|
|
|
|
contentType: newStatus.contentType,
|
|
|
|
|
|
|
|
poll: {},
|
|
|
|
|
|
|
|
preview: true
|
|
|
|
|
|
|
|
}).then((data) => {
|
|
|
|
|
|
|
|
// Don't apply preview if not loading, because it means
|
|
|
|
|
|
|
|
// user has closed the preview manually.
|
|
|
|
|
|
|
|
if (!this.previewLoading) return
|
|
|
|
|
|
|
|
if (!data.error) {
|
|
|
|
|
|
|
|
this.preview = data
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
this.preview = { error: data.error }
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}).catch((error) => {
|
|
|
|
|
|
|
|
this.preview = { error }
|
|
|
|
|
|
|
|
}).finally(() => {
|
|
|
|
|
|
|
|
this.previewLoading = false
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
debouncePreviewStatus: debounce(function () { this.previewStatus() }, 500),
|
|
|
|
|
|
|
|
autoPreview () {
|
|
|
|
|
|
|
|
if (!this.preview) return
|
|
|
|
|
|
|
|
this.previewLoading = true
|
|
|
|
|
|
|
|
this.debouncePreviewStatus()
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
closePreview () {
|
|
|
|
|
|
|
|
this.preview = null
|
|
|
|
|
|
|
|
this.previewLoading = false
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
togglePreview () {
|
|
|
|
|
|
|
|
if (this.showPreview) {
|
|
|
|
|
|
|
|
this.closePreview()
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
this.previewStatus()
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
addMediaFile (fileInfo) {
|
|
|
|
addMediaFile (fileInfo) {
|
|
|
|
this.newStatus.files.push(fileInfo)
|
|
|
|
this.newStatus.files.push(fileInfo)
|
|
|
|
},
|
|
|
|
},
|
|
|
@ -239,6 +306,7 @@ const PostStatusForm = {
|
|
|
|
return fileTypeService.fileType(fileInfo.mimetype)
|
|
|
|
return fileTypeService.fileType(fileInfo.mimetype)
|
|
|
|
},
|
|
|
|
},
|
|
|
|
paste (e) {
|
|
|
|
paste (e) {
|
|
|
|
|
|
|
|
this.autoPreview()
|
|
|
|
this.resize(e)
|
|
|
|
this.resize(e)
|
|
|
|
if (e.clipboardData.files.length > 0) {
|
|
|
|
if (e.clipboardData.files.length > 0) {
|
|
|
|
// prevent pasting of file as text
|
|
|
|
// prevent pasting of file as text
|
|
|
@ -273,6 +341,7 @@ const PostStatusForm = {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
|
|
onEmojiInputInput (e) {
|
|
|
|
onEmojiInputInput (e) {
|
|
|
|
|
|
|
|
this.autoPreview()
|
|
|
|
this.$nextTick(() => {
|
|
|
|
this.$nextTick(() => {
|
|
|
|
this.resize(this.$refs['textarea'])
|
|
|
|
this.resize(this.$refs['textarea'])
|
|
|
|
})
|
|
|
|
})
|
|
|
|