From 3f23aecd10e570f78b4142687a9a3fa349c13018 Mon Sep 17 00:00:00 2001 From: Shpuld Shpuldson Date: Tue, 23 Feb 2021 10:00:23 +0200 Subject: add sensitive by default option --- src/components/post_status_form/post_status_form.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'src/components/post_status_form') diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js index 4148381c..e540654b 100644 --- a/src/components/post_status_form/post_status_form.js +++ b/src/components/post_status_form/post_status_form.js @@ -115,7 +115,7 @@ const PostStatusForm = { ? this.copyMessageScope : this.$store.state.users.currentUser.default_scope - const { postContentType: contentType } = this.$store.getters.mergedConfig + const { postContentType: contentType, sensitiveByDefault } = this.$store.getters.mergedConfig return { dropFiles: [], @@ -126,7 +126,7 @@ const PostStatusForm = { newStatus: { spoilerText: this.subject || '', status: statusText, - nsfw: false, + nsfw: !!sensitiveByDefault, files: [], poll: {}, mediaDescriptions: {}, -- cgit v1.2.3-70-g09d2 From c6d4c20982261b55b16dda59c3e657eb1feb0041 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 11 Mar 2021 16:11:44 +0200 Subject: Made Select component to make using styled selects easier --- src/App.scss | 34 +--------- src/components/font_control/font_control.js | 12 ++-- src/components/font_control/font_control.vue | 32 ++++------ .../interface_language_switcher.vue | 41 +++++------- src/components/poll/poll_form.js | 6 +- src/components/poll/poll_form.vue | 51 ++++++--------- .../post_status_form/post_status_form.js | 4 +- .../post_status_form/post_status_form.vue | 31 ++++------ src/components/select/select.vue | 67 ++++++++++++++++++++ .../settings_modal/tabs/filtering_tab.js | 12 +--- .../settings_modal/tabs/filtering_tab.vue | 38 ++++++------ src/components/settings_modal/tabs/general_tab.js | 6 +- src/components/settings_modal/tabs/general_tab.vue | 72 ++++++++-------------- .../settings_modal/tabs/theme_tab/theme_tab.js | 12 +--- .../settings_modal/tabs/theme_tab/theme_tab.vue | 70 ++++++++------------- src/components/shadow_control/shadow_control.js | 4 +- src/components/shadow_control/shadow_control.vue | 32 ++++------ src/components/user_card/user_card.js | 6 +- src/components/user_card/user_card.vue | 27 +++----- 19 files changed, 240 insertions(+), 317 deletions(-) create mode 100644 src/components/select/select.vue (limited to 'src/components/post_status_form') diff --git a/src/App.scss b/src/App.scss index 90d083bb..77f2ea79 100644 --- a/src/App.scss +++ b/src/App.scss @@ -187,7 +187,7 @@ a { } } -input, textarea, .select, .input { +input, textarea, .input { &.unstyled { border-radius: 0; @@ -217,11 +217,7 @@ input, textarea, .select, .input { hyphens: none; padding: 8px .5em; - &.select { - padding: 0; - } - - &:disabled, &[disabled=disabled] { + &:disabled, &[disabled=disabled], &.disabled { cursor: not-allowed; opacity: 0.5; } @@ -239,25 +235,6 @@ input, textarea, .select, .input { pointer-events: none; } - select { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - background: transparent; - border: none; - color: $fallback--text; - color: var(--inputText, --text, $fallback--text); - margin: 0; - padding: 0 2em 0 .2em; - font-family: sans-serif; - font-family: var(--inputFont, sans-serif); - font-size: 14px; - width: 100%; - z-index: 1; - height: 28px; - line-height: 16px; - } - &[type=range] { background: none; border: none; @@ -809,13 +786,6 @@ nav { } } -.select-multiple { - display: flex; - .option-list { - margin: 0; - padding-left: .5em; - } -} .setting-list, .option-list{ list-style-type: none; diff --git a/src/components/font_control/font_control.js b/src/components/font_control/font_control.js index 6274780b..137ef9c0 100644 --- a/src/components/font_control/font_control.js +++ b/src/components/font_control/font_control.js @@ -1,14 +1,10 @@ import { set } from 'vue' -import { library } from '@fortawesome/fontawesome-svg-core' -import { - faChevronDown -} from '@fortawesome/free-solid-svg-icons' - -library.add( - faChevronDown -) +import Select from '../select/select.vue' export default { + components: { + Select + }, props: [ 'name', 'label', 'value', 'fallback', 'options', 'no-inherit' ], diff --git a/src/components/font_control/font_control.vue b/src/components/font_control/font_control.vue index dd117ec0..996ff92c 100644 --- a/src/components/font_control/font_control.vue +++ b/src/components/font_control/font_control.vue @@ -22,30 +22,20 @@ class="opt-l" :for="name + '-o'" /> - + {{ option === 'custom' ? $t('settings.style.fonts.custom') : option }} + + {{ $t('settings.interfaceLanguage') }} - + {{ lang.name }} + + @@ -32,16 +23,12 @@ import languagesObject from '../../i18n/messages' import localeService from '../../services/locale/locale.service.js' import ISO6391 from 'iso-639-1' import _ from 'lodash' -import { library } from '@fortawesome/fontawesome-svg-core' -import { - faChevronDown -} from '@fortawesome/free-solid-svg-icons' - -library.add( - faChevronDown -) +import Select from '../select/select.vue' export default { + components: { + Select + }, computed: { languages () { return _.map(languagesObject.languages, (code) => ({ code: code, name: this.getLanguageName(code) })).sort((a, b) => a.name.localeCompare(b.name)) diff --git a/src/components/poll/poll_form.js b/src/components/poll/poll_form.js index 1f8df3f9..e30645c3 100644 --- a/src/components/poll/poll_form.js +++ b/src/components/poll/poll_form.js @@ -1,19 +1,21 @@ import * as DateUtils from 'src/services/date_utils/date_utils.js' import { uniq } from 'lodash' import { library } from '@fortawesome/fontawesome-svg-core' +import Select from '../select/select.vue' import { faTimes, - faChevronDown, faPlus } from '@fortawesome/free-solid-svg-icons' library.add( faTimes, - faChevronDown, faPlus ) export default { + components: { + Select + }, name: 'PollForm', props: ['visible'], data: () => ({ diff --git a/src/components/poll/poll_form.vue b/src/components/poll/poll_form.vue index c4403210..f10d1550 100644 --- a/src/components/poll/poll_form.vue +++ b/src/components/poll/poll_form.vue @@ -46,23 +46,13 @@ class="poll-type" :title="$t('polls.type')" > - + + +
- + {{ $t(`time.${unit}_short`, ['']) }} + +
diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js index e540654b..5342894f 100644 --- a/src/components/post_status_form/post_status_form.js +++ b/src/components/post_status_form/post_status_form.js @@ -11,10 +11,10 @@ import { reject, map, uniqBy, debounce } from 'lodash' import suggestor from '../emoji_input/suggestor.js' import { mapGetters, mapState } from 'vuex' import Checkbox from '../checkbox/checkbox.vue' +import Select from '../select/select.vue' import { library } from '@fortawesome/fontawesome-svg-core' import { - faChevronDown, faSmileBeam, faPollH, faUpload, @@ -24,7 +24,6 @@ import { } from '@fortawesome/free-solid-svg-icons' library.add( - faChevronDown, faSmileBeam, faPollH, faUpload, @@ -84,6 +83,7 @@ const PostStatusForm = { PollForm, ScopeSelector, Checkbox, + Select, Attachment, StatusContent }, diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue index 73f6a4f1..cc4f6251 100644 --- a/src/components/post_status_form/post_status_form.vue +++ b/src/components/post_status_form/post_status_form.vue @@ -189,28 +189,19 @@ v-if="postFormats.length > 1" class="text-format" > - + {{ $t(`post_status.content_type["${postFormat}"]`) }} + +
+ + + + + + diff --git a/src/components/settings_modal/tabs/filtering_tab.js b/src/components/settings_modal/tabs/filtering_tab.js index 6e95f7af..89199d85 100644 --- a/src/components/settings_modal/tabs/filtering_tab.js +++ b/src/components/settings_modal/tabs/filtering_tab.js @@ -1,15 +1,8 @@ import { filter, trim } from 'lodash' import BooleanSetting from '../helpers/boolean_setting.vue' +import Select from '../../select/select.vue' import SharedComputedObject from '../helpers/shared_computed_object.js' -import { library } from '@fortawesome/fontawesome-svg-core' -import { - faChevronDown -} from '@fortawesome/free-solid-svg-icons' - -library.add( - faChevronDown -) const FilteringTab = { data () { @@ -18,7 +11,8 @@ const FilteringTab = { } }, components: { - BooleanSetting + BooleanSetting, + Select }, computed: { ...SharedComputedObject(), diff --git a/src/components/settings_modal/tabs/filtering_tab.vue b/src/components/settings_modal/tabs/filtering_tab.vue index 402c2a4a..4023fbe2 100644 --- a/src/components/settings_modal/tabs/filtering_tab.vue +++ b/src/components/settings_modal/tabs/filtering_tab.vue @@ -38,26 +38,17 @@
{{ $t('settings.replies_in_timeline') }} - + + + +
@@ -88,3 +79,12 @@
+ diff --git a/src/components/settings_modal/tabs/general_tab.js b/src/components/settings_modal/tabs/general_tab.js index 2db523be..03648d0b 100644 --- a/src/components/settings_modal/tabs/general_tab.js +++ b/src/components/settings_modal/tabs/general_tab.js @@ -1,15 +1,14 @@ import BooleanSetting from '../helpers/boolean_setting.vue' +import Select from '../../select/select.vue' import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue' import SharedComputedObject from '../helpers/shared_computed_object.js' import { library } from '@fortawesome/fontawesome-svg-core' import { - faChevronDown, faGlobe } from '@fortawesome/free-solid-svg-icons' library.add( - faChevronDown, faGlobe ) @@ -27,7 +26,8 @@ const GeneralTab = { }, components: { BooleanSetting, - InterfaceLanguageSwitcher + InterfaceLanguageSwitcher, + Select }, computed: { postFormats () { diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue index 9228c78e..a0413cfa 100644 --- a/src/components/settings_modal/tabs/general_tab.vue +++ b/src/components/settings_modal/tabs/general_tab.vue @@ -87,59 +87,41 @@
  • {{ $t('settings.subject_line_behavior') }} - + + + +
  • {{ $t('settings.post_status_content_type') }} - + {{ $t(`post_status.content_type["${postFormat}"]`) }} + {{ postContentTypeDefaultValue === postFormat ? $t('settings.instance_default_simple') : '' }} + +
  • diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.js b/src/components/settings_modal/tabs/theme_tab/theme_tab.js index 6cf75fe7..73068e19 100644 --- a/src/components/settings_modal/tabs/theme_tab/theme_tab.js +++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.js @@ -33,16 +33,9 @@ import ContrastRatio from 'src/components/contrast_ratio/contrast_ratio.vue' import TabSwitcher from 'src/components/tab_switcher/tab_switcher.js' import ExportImport from 'src/components/export_import/export_import.vue' import Checkbox from 'src/components/checkbox/checkbox.vue' +import Select from 'src/components/select/select.vue' import Preview from './preview.vue' -import { library } from '@fortawesome/fontawesome-svg-core' -import { - faChevronDown -} from '@fortawesome/free-solid-svg-icons' - -library.add( - faChevronDown -) // List of color values used in v1 const v1OnlyNames = [ @@ -384,7 +377,8 @@ export default { TabSwitcher, Preview, ExportImport, - Checkbox + Checkbox, + Select }, methods: { loadTheme ( diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue index b8add42f..2b4b8ba0 100644 --- a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue +++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue @@ -59,32 +59,23 @@ @@ -902,28 +893,19 @@
    {{ $t('settings.style.shadows.component') }} - + {{ $t('settings.style.shadows.components.' + shadow) }} + +
    Date: Mon, 15 Mar 2021 13:28:33 +0300 Subject: Use more specific button titles instead of general.submit - "Post" for post submission (we already had the button title be "Posting" when the post was being sent, so there was a weird inconsistency) - "Register" for registration submission - "Save changes" for usages in settings --- src/components/password_reset/password_reset.vue | 2 +- src/components/post_status_form/post_status_form.vue | 4 ++-- src/components/registration/registration.vue | 2 +- src/components/settings_modal/tabs/notifications_tab.vue | 2 +- src/components/settings_modal/tabs/profile_tab.vue | 6 +++--- src/components/settings_modal/tabs/security_tab/security_tab.vue | 6 +++--- src/i18n/en.json | 3 +++ 7 files changed, 14 insertions(+), 11 deletions(-) (limited to 'src/components/post_status_form') diff --git a/src/components/password_reset/password_reset.vue b/src/components/password_reset/password_reset.vue index a931cb5a..3ffa5425 100644 --- a/src/components/password_reset/password_reset.vue +++ b/src/components/password_reset/password_reset.vue @@ -53,7 +53,7 @@ type="submit" class="btn button-default btn-block" > - {{ $t('general.submit') }} + {{ $t('settings.save') }}
    diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue index 73f6a4f1..6b490aee 100644 --- a/src/components/post_status_form/post_status_form.vue +++ b/src/components/post_status_form/post_status_form.vue @@ -272,7 +272,7 @@ disabled class="btn button-default" > - {{ $t('general.submit') }} + {{ $t('post_status.post') }}
    - {{ $t('general.submit') }} + {{ $t('registration.register') }}
    diff --git a/src/components/settings_modal/tabs/notifications_tab.vue b/src/components/settings_modal/tabs/notifications_tab.vue index 8f8fe48e..7e0568ea 100644 --- a/src/components/settings_modal/tabs/notifications_tab.vue +++ b/src/components/settings_modal/tabs/notifications_tab.vue @@ -24,7 +24,7 @@ class="btn button-default" @click="updateNotificationSettings" > - {{ $t('general.submit') }} + {{ $t('settings.save') }} diff --git a/src/components/settings_modal/tabs/profile_tab.vue b/src/components/settings_modal/tabs/profile_tab.vue index 175a0219..bb3c301d 100644 --- a/src/components/settings_modal/tabs/profile_tab.vue +++ b/src/components/settings_modal/tabs/profile_tab.vue @@ -153,7 +153,7 @@ class="btn button-default" @click="updateProfile" > - {{ $t('general.submit') }} + {{ $t('settings.save') }}
    @@ -227,7 +227,7 @@ class="btn button-default" @click="submitBanner(banner)" > - {{ $t('general.submit') }} + {{ $t('settings.save') }}
    @@ -266,7 +266,7 @@ class="btn button-default" @click="submitBackground(background)" > - {{ $t('general.submit') }} + {{ $t('settings.save') }}
    diff --git a/src/components/settings_modal/tabs/security_tab/security_tab.vue b/src/components/settings_modal/tabs/security_tab/security_tab.vue index 56bea1f4..275d4616 100644 --- a/src/components/settings_modal/tabs/security_tab/security_tab.vue +++ b/src/components/settings_modal/tabs/security_tab/security_tab.vue @@ -22,7 +22,7 @@ class="btn button-default" @click="changeEmail" > - {{ $t('general.submit') }} + {{ $t('settings.save') }}

    {{ $t('settings.changed_email') }} @@ -60,7 +60,7 @@ class="btn button-default" @click="changePassword" > - {{ $t('general.submit') }} + {{ $t('settings.save') }}

    {{ $t('settings.changed_password') }} @@ -133,7 +133,7 @@ class="btn button-default" @click="confirmDelete" > - {{ $t('general.submit') }} + {{ $t('settings.save') }} diff --git a/src/i18n/en.json b/src/i18n/en.json index b3d8cd49..1ea27e26 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -201,6 +201,7 @@ "direct_warning_to_all": "This post will be visible to all the mentioned users.", "direct_warning_to_first_only": "This post will only be visible to the mentioned users at the beginning of the message.", "posting": "Posting", + "post": "Post", "preview": "Preview", "preview_empty": "Empty", "empty_status_error": "Can't post an empty status with no files", @@ -231,6 +232,7 @@ "bio_placeholder": "e.g.\nHi, I'm Lain.\nI’m an anime girl living in suburban Japan. You may know me from the Wired.", "reason": "Reason to register", "reason_placeholder": "This instance approves registrations manually.\nLet the administration know why you want to register.", + "register": "Register", "validations": { "username_required": "cannot be left blank", "fullname_required": "cannot be left blank", @@ -250,6 +252,7 @@ }, "settings": { "app_name": "App name", + "save": "Save changes", "security": "Security", "setting_changed": "Setting is different from default", "enter_current_password_to_confirm": "Enter your current password to confirm your identity", -- cgit v1.2.3-70-g09d2 From f15599e6e57477131ba5592e2874916ed1da06e2 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Fri, 18 Jun 2021 02:04:01 +0300 Subject: gallery in post status form! --- src/components/attachment/attachment.js | 30 ++- src/components/attachment/attachment.vue | 279 ++++++++++++--------- src/components/gallery/gallery.js | 38 +-- src/components/gallery/gallery.vue | 9 +- .../post_status_form/post_status_form.js | 8 +- .../post_status_form/post_status_form.vue | 57 ++--- 6 files changed, 228 insertions(+), 193 deletions(-) (limited to 'src/components/post_status_form') diff --git a/src/components/attachment/attachment.js b/src/components/attachment/attachment.js index 3ea96a7a..a80c5c2e 100644 --- a/src/components/attachment/attachment.js +++ b/src/components/attachment/attachment.js @@ -13,7 +13,9 @@ import { faPlayCircle, faTimes, faStop, - faSearchPlus + faSearchPlus, + faTrashAlt, + faPencilAlt } from '@fortawesome/free-solid-svg-icons' library.add( @@ -24,19 +26,25 @@ library.add( faPlayCircle, faTimes, faStop, - faSearchPlus + faSearchPlus, + faTrashAlt, + faPencilAlt ) const Attachment = { props: [ 'attachment', + 'description', + 'hideDescription', 'nsfw', 'size', 'setMedia', - 'naturalSizeLoad' + 'remove', + 'edit' ], data () { return { + localDescription: this.description || this.attachment.description, nsfwImage: this.$store.state.instance.nsfwCensorImage || nsfwImage, hideNsfwLocal: this.$store.getters.mergedConfig.hideNsfw, preloadImage: this.$store.getters.mergedConfig.preloadImage, @@ -93,9 +101,6 @@ const Attachment = { isEmpty () { return (this.type === 'html' && !this.attachment.oembed) || this.type === 'unknown' }, - isSmall () { - return this.size === 'small' - }, useModal () { const modalTypes = this.size === 'hide' ? ['image', 'video', 'audio'] : this.mergedConfig.playVideosInModal @@ -105,6 +110,11 @@ const Attachment = { }, ...mapGetters(['mergedConfig']) }, + watch: { + localDescription (newVal) { + this.onEdit(newVal) + } + }, methods: { linkClicked ({ target }) { if (target.tagName === 'A') { @@ -121,6 +131,12 @@ const Attachment = { this.$emit('setMedia') this.$store.dispatch('setCurrentMedia', this.attachment) }, + onEdit (event) { + console.log('ONEDIT', event) + this.edit && this.edit(this.attachment, event) + }, + onRemove () { + this.remove && this.remove(this.attachment) }, stopFlash () { this.$refs.flash.closePlayer() @@ -154,7 +170,7 @@ const Attachment = { onImageLoad (image) { const width = image.naturalWidth const height = image.naturalHeight - this.naturalSizeLoad && this.naturalSizeLoad({ width, height }) + this.$emit('naturalSizeLoad', { id: this.attachment.id, width, height }) } } } diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue index fe9e9398..9b1e83a7 100644 --- a/src/components/attachment/attachment.vue +++ b/src/components/attachment/attachment.vue @@ -12,151 +12,180 @@ :href="attachment.url" :alt="attachment.description" :title="attachment.description" + @click.prevent="" > {{ nsfw ? "NSFW / " : "" }}{{ placeholderName }}

    - - - -
    - - - -
    - - - - + :title="attachment.description" + @click.prevent.stop="toggleHidden" + > + + + +
    + + + + +
    - - - - + + + - - + + + + + + + -
    - -
    -
    - -

    {{ attachment.oembed.title }}

    -
    - +
    + +
    +
    + +

    {{ attachment.oembed.title }}

    +
    + +
    -
    - + + +
    +
    - - + +

    + {{ localDescription }} +

    +
    diff --git a/src/components/gallery/gallery.js b/src/components/gallery/gallery.js index 134ea77e..cca67dbd 100644 --- a/src/components/gallery/gallery.js +++ b/src/components/gallery/gallery.js @@ -4,9 +4,15 @@ import { sumBy } from 'lodash' const Gallery = { props: [ 'attachments', + 'limitRows', + 'descriptions', 'nsfw', 'setMedia', - 'size' + 'size', + 'editable', + 'removeAttachment', + 'editAttachment', + 'maxPerRow' ], data () { return { @@ -20,24 +26,19 @@ const Gallery = { if (!this.attachments) { return [] } - console.log(this.size) if (this.size === 'hide') { return this.attachments.map(item => ({ minimal: true, items: [item] })) } const rows = this.attachments.reduce((acc, attachment, i) => { + if (this.size === 'small' && acc.length === 2) return acc if (attachment.mimetype.includes('audio')) { return [...acc, { audio: true, items: [attachment] }, { items: [] }] } - const maxPerRow = 3 - const attachmentsRemaining = this.attachments.length - i - 1 + const maxPerRow = this.maxPerRow || 3 + const attachmentsRemaining = this.attachments.length - i + 1 const currentRow = acc[acc.length - 1].items - if ( - currentRow.length <= maxPerRow || - attachmentsRemaining === 1 - ) { - currentRow.push(attachment) - } - if (currentRow.length === maxPerRow && attachmentsRemaining > 1) { + currentRow.push(attachment) + if (currentRow.length >= maxPerRow && attachmentsRemaining > maxPerRow) { return [...acc, { items: [] }] } else { return acc @@ -51,7 +52,9 @@ const Gallery = { }, 0) }, tooManyAttachments () { - if (this.size === 'hide') { + if (this.editable || this.size === 'small') { + return false + } else if (this.size === 'hide') { return this.attachments.length > 8 } else { return this.attachmentsDimensionalScore > 1 @@ -59,8 +62,8 @@ const Gallery = { } }, methods: { - onNaturalSizeLoad (id, size) { - this.$set(this.sizes, id, size) + onNaturalSizeLoad ({ id, width, height }) { + this.$set(this.sizes, id, { width, height }) }, rowStyle (row) { if (row.audio) { @@ -81,8 +84,11 @@ const Gallery = { this.hidingLong = event }, openGallery () { - this.setMedia() - this.$store.dispatch('setCurrent', this.attachments[0]) + this.$store.dispatch('setMedia', this.attachments) + this.$store.dispatch('setCurrentMedia', this.attachments[0]) + }, + onMedia () { + this.$store.dispatch('setMedia', this.attachments) } } } diff --git a/src/components/gallery/gallery.vue b/src/components/gallery/gallery.vue index 8e08e514..cedf64d3 100644 --- a/src/components/gallery/gallery.vue +++ b/src/components/gallery/gallery.vue @@ -17,13 +17,18 @@ v-for="attachment in row.items" class="gallery-item" :key="attachment.id" - :set-media="setMedia" :nsfw="nsfw" :attachment="attachment" :allow-play="false" :size="size" - :natural-size-load="onNaturalSizeLoad.bind(null, attachment.id)" + :editable="editable" + :remove="removeAttachment" + :edit="editAttachment" + :description="descriptions && descriptions[attachment.id]" + :hideDescription="tooManyAttachments && hidingLong" :style="itemStyle(attachment.id, row.items)" + @setMedia="onMedia" + @naturalSizeLoad="onNaturalSizeLoad" />
    diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js index 5342894f..1a12db9c 100644 --- a/src/components/post_status_form/post_status_form.js +++ b/src/components/post_status_form/post_status_form.js @@ -4,6 +4,7 @@ import ScopeSelector from '../scope_selector/scope_selector.vue' import EmojiInput from '../emoji_input/emoji_input.vue' import PollForm from '../poll/poll_form.vue' import Attachment from '../attachment/attachment.vue' +import Gallery from 'src/components/gallery/gallery.vue' import StatusContent from '../status_content/status_content.vue' import fileTypeService from '../../services/file_type/file_type.service.js' import { findOffset } from '../../services/offset_finder/offset_finder.service.js' @@ -85,7 +86,8 @@ const PostStatusForm = { Checkbox, Select, Attachment, - StatusContent + StatusContent, + Gallery }, mounted () { this.updateIdempotencyKey() @@ -388,6 +390,10 @@ const PostStatusForm = { this.newStatus.files.splice(index, 1) this.$emit('resize') }, + editAttachment (fileInfo, newText) { + console.log(fileInfo, newText) + this.newStatus.mediaDescriptions[fileInfo.id] = newText + }, uploadFailed (errString, templateArgs) { templateArgs = templateArgs || {} this.error = this.$t('upload.error.base') + ' ' + this.$t('upload.error.' + errString, templateArgs) diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue index fbda41d6..c6f84a4b 100644 --- a/src/components/post_status_form/post_status_form.vue +++ b/src/components/post_status_form/post_status_form.vue @@ -287,32 +287,21 @@ @click="clearError" /> -
    -
    - - - -
    -
    +
    video { - line-height: 0; - max-height: 200px; - max-width: 100%; -} -- cgit v1.2.3-70-g09d2 From f35c090caaccf272c12358a2a02df71b9212d16c Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Fri, 18 Jun 2021 02:27:32 +0300 Subject: merged in compact notifs and improved upon it --- src/components/gallery/gallery.js | 10 +++++++--- src/components/gallery/gallery.vue | 2 +- src/components/post_status_form/post_status_form.vue | 1 - src/components/status_body/status_body.scss | 2 +- src/components/status_body/status_body.vue | 5 ++++- src/components/status_content/status_content.vue | 1 + 6 files changed, 14 insertions(+), 7 deletions(-) (limited to 'src/components/post_status_form') diff --git a/src/components/gallery/gallery.js b/src/components/gallery/gallery.js index cca67dbd..ab13f698 100644 --- a/src/components/gallery/gallery.js +++ b/src/components/gallery/gallery.js @@ -6,6 +6,7 @@ const Gallery = { 'attachments', 'limitRows', 'descriptions', + 'limit', 'nsfw', 'setMedia', 'size', @@ -26,11 +27,14 @@ const Gallery = { if (!this.attachments) { return [] } + console.log(this.limit) + const attachments = this.limit > 0 + ? this.attachments.slice(0, this.limit) + : this.attachments if (this.size === 'hide') { - return this.attachments.map(item => ({ minimal: true, items: [item] })) + return attachments.map(item => ({ minimal: true, items: [item] })) } - const rows = this.attachments.reduce((acc, attachment, i) => { - if (this.size === 'small' && acc.length === 2) return acc + const rows = attachments.reduce((acc, attachment, i) => { if (attachment.mimetype.includes('audio')) { return [...acc, { audio: true, items: [attachment] }, { items: [] }] } diff --git a/src/components/gallery/gallery.vue b/src/components/gallery/gallery.vue index cedf64d3..a1f1c26c 100644 --- a/src/components/gallery/gallery.vue +++ b/src/components/gallery/gallery.vue @@ -25,7 +25,7 @@ :remove="removeAttachment" :edit="editAttachment" :description="descriptions && descriptions[attachment.id]" - :hideDescription="tooManyAttachments && hidingLong" + :hideDescription="size === 'small' || tooManyAttachments && hidingLong" :style="itemStyle(attachment.id, row.items)" @setMedia="onMedia" @naturalSizeLoad="onNaturalSizeLoad" diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue index c6f84a4b..88ca4c9c 100644 --- a/src/components/post_status_form/post_status_form.vue +++ b/src/components/post_status_form/post_status_form.vue @@ -298,7 +298,6 @@ :editable="true" :editAttachment="editAttachment" :removeAttachment="removeMediaFile" - size="small" @play="$emit('mediaplay', attachment.id)" @pause="$emit('mediapause', attachment.id)" /> diff --git a/src/components/status_body/status_body.scss b/src/components/status_body/status_body.scss index 516ced9d..5be21171 100644 --- a/src/components/status_body/status_body.scss +++ b/src/components/status_body/status_body.scss @@ -151,7 +151,7 @@ .attachments { margin-top: 0; - flex: 1 1 auto; + flex: 1 1 0; min-width: 5em; height: 100%; } diff --git a/src/components/status_body/status_body.vue b/src/components/status_body/status_body.vue index 2be46303..3eb13ce2 100644 --- a/src/components/status_body/status_body.vue +++ b/src/components/status_body/status_body.vue @@ -1,5 +1,8 @@