better handling of unknown files, better upload display

This commit is contained in:
Henry Jameson 2021-06-18 16:11:16 +03:00
parent bfe31e20ea
commit 8bab8658e8
4 changed files with 54 additions and 5 deletions

View file

@ -65,10 +65,11 @@ const Attachment = {
return [ return [
{ {
'-loading': this.loading, '-loading': this.loading,
'-nsfw-placeholder': this.hidden '-nsfw-placeholder': this.hidden,
'-editable': this.edit !== undefined
}, },
'-' + this.type, '-type-' + this.type,
'-' + this.size, this.size && '-size-' + this.size,
`-${this.useContainFit ? 'contain' : 'cover'}-fit` `-${this.useContainFit ? 'contain' : 'cover'}-fit`
] ]
}, },

View file

@ -15,8 +15,37 @@
@click.prevent="" @click.prevent=""
> >
<FAIcon :icon="placeholderIconClass" /> <FAIcon :icon="placeholderIconClass" />
<b>{{ nsfw ? "NSFW / " : "" }}</b>{{ placeholderName }} <b>{{ nsfw ? "NSFW / " : "" }}</b>{{ this.edit ? '' : placeholderName }}
</a> </a>
<div
class="attachment-buttons"
v-if="edit || remove"
>
<button
v-if="remove"
class="button-unstyled attachment-button"
@click.prevent="onRemove"
>
<FAIcon icon="trash-alt" />
</button>
</div>
<div
v-if="size !== 'hide' && !hideDescription && (edit || localDescription)"
class="description-container"
:class="{ '-static': !edit }"
>
<input
v-if="edit"
v-model="localDescription"
type="text"
class="description-field"
:placeholder="$t('post_status.media_description')"
@keydown.enter.prevent=""
>
<p v-else>
{{ localDescription }}
</p>
</div>
</button> </button>
<div <div
class="Attachment" class="Attachment"

View file

@ -38,6 +38,13 @@ const Gallery = {
if (attachment.mimetype.includes('audio')) { if (attachment.mimetype.includes('audio')) {
return [...acc, { audio: true, items: [attachment] }, { items: [] }] return [...acc, { audio: true, items: [attachment] }, { items: [] }]
} }
if (!(
attachment.mimetype.includes('image') ||
attachment.mimetype.includes('video') ||
attachment.mimetype.includes('flash')
)) {
return [...acc, { minimal: true, items: [attachment] }, { items: [] }]
}
const maxPerRow = this.maxPerRow || 3 const maxPerRow = this.maxPerRow || 3
const attachmentsRemaining = this.attachments.length - i + 1 const attachmentsRemaining = this.attachments.length - i + 1
const currentRow = acc[acc.length - 1].items const currentRow = acc[acc.length - 1].items
@ -52,7 +59,15 @@ const Gallery = {
}, },
attachmentsDimensionalScore () { attachmentsDimensionalScore () {
return this.rows.reduce((acc, row) => { return this.rows.reduce((acc, row) => {
return acc + (row.audio ? 0.25 : (1 / (row.items.length + 0.6))) let size = 0
if (row.minimal) {
size += 1 / 8
} else if (row.audio) {
size += 1 / 4
} else {
size += 1 / (row.items.length + 0.6)
}
return acc + size
}, 0) }, 0)
}, },
tooManyAttachments () { tooManyAttachments () {

View file

@ -338,6 +338,10 @@
.post-status-form { .post-status-form {
position: relative; position: relative;
.attachments {
margin-bottom: 0.5em;
}
.form-bottom { .form-bottom {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;