make line sizes match for errors/loading and statuses, make X hitbox bigger, remove attachments, add shorter custom message for empty status preview. fix auto update triggering

This commit is contained in:
Shpuld Shpuldson 2020-06-28 15:43:08 +03:00
parent 3c47036101
commit ed5b36f751
3 changed files with 21 additions and 20 deletions

View File

@ -170,6 +170,9 @@ const PostStatusForm = {
showPreview () { showPreview () {
return !!this.preview || this.previewLoading return !!this.preview || this.previewLoading
}, },
emptyStatus () {
return this.newStatus.status === '' && this.newStatus.files.length === 0
},
...mapGetters(['mergedConfig']) ...mapGetters(['mergedConfig'])
}, },
watch: { watch: {
@ -185,13 +188,10 @@ const PostStatusForm = {
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 === '') {
if (this.newStatus.files.length === 0) {
this.error = 'Cannot post an empty status with no files' 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) {
@ -236,13 +236,19 @@ const PostStatusForm = {
}) })
}, },
previewStatus (newStatus) { previewStatus (newStatus) {
if (this.emptyStatus) {
this.preview = { error: this.$t('status.preview_empty') }
this.previewLoading = false
return
}
this.previewLoading = true this.previewLoading = true
statusPoster.postStatus({ 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: [],
store: this.$store, store: this.$store,
inReplyToStatusId: this.replyTo, inReplyToStatusId: this.replyTo,
contentType: newStatus.contentType, contentType: newStatus.contentType,
@ -267,6 +273,7 @@ const PostStatusForm = {
this.previewStatus(newStatus) this.previewStatus(newStatus)
}, 750), }, 750),
autoPreview () { autoPreview () {
if (!this.preview) return
this.previewLoading = true this.previewLoading = true
this.debouncePreviewStatus(this.newStatus) this.debouncePreviewStatus(this.newStatus)
}, },
@ -276,12 +283,10 @@ const PostStatusForm = {
}, },
addMediaFile (fileInfo) { addMediaFile (fileInfo) {
this.newStatus.files.push(fileInfo) this.newStatus.files.push(fileInfo)
this.autoPreview()
}, },
removeMediaFile (fileInfo) { removeMediaFile (fileInfo) {
let index = this.newStatus.files.indexOf(fileInfo) let index = this.newStatus.files.indexOf(fileInfo)
this.newStatus.files.splice(index, 1) this.newStatus.files.splice(index, 1)
this.autoPreview()
}, },
uploadFailed (errString, templateArgs) { uploadFailed (errString, templateArgs) {
templateArgs = templateArgs || {} templateArgs = templateArgs || {}

View File

@ -35,12 +35,10 @@
v-if="previewLoading" v-if="previewLoading"
class="icon-spin3 animate-spin" class="icon-spin3 animate-spin"
/> />
<a <i
class="preview-close" class="preview-close icon-cancel"
@click.stop.prevent="closePreview" @click.stop.prevent="closePreview"
> />
<i class="icon-cancel" />
</a>
</span> </span>
<div <div
v-if="!preview" v-if="!preview"
@ -392,11 +390,7 @@
} }
.preview-close { .preview-close {
margin-left: 0.5em; padding-left: 0.5em;
}
.preview-update {
cursor: pointer;
} }
.preview-error { .preview-error {
@ -411,6 +405,8 @@
border-radius: $fallback--tooltipRadius; border-radius: $fallback--tooltipRadius;
border-radius: var(--tooltipRadius, $fallback--tooltipRadius); border-radius: var(--tooltipRadius, $fallback--tooltipRadius);
padding: 0.5em; padding: 0.5em;
margin: 0;
line-height: 1.4em;
} }
.text-format { .text-format {

View File

@ -639,7 +639,7 @@
"thread_muted_and_words": ", has words:", "thread_muted_and_words": ", has words:",
"preview": "Preview", "preview": "Preview",
"status_preview": "Status preview", "status_preview": "Status preview",
"preview_update": "Update" "preview_empty": "Empty"
}, },
"user_card": { "user_card": {
"approve": "Approve", "approve": "Approve",