diff --git a/CHANGELOG b/CHANGELOG index 67ad4a66..4126850f 100644 --- a/CHANGELOG +++ b/CHANGELOG @@ -1,6 +1,10 @@ All notable changes to this project will be documented in this file. ### Unreleased + + - fix AP resource removal + - improve AP resource UI + ### 1.0 (alpha) This release is a complete rewrite of frontend UI and many internals, main changes are: diff --git a/assets/style.less b/assets/style.less index 4dc453ee..984fe181 100644 --- a/assets/style.less +++ b/assets/style.less @@ -37,6 +37,9 @@ li { .v-dialog { width: 600px; max-width: 800px; + &.v-dialog--fullscreen { + max-width: 100%; + } } .theme--dark.v-list { @@ -116,4 +119,9 @@ li { white-space: nowrap; overflow: hidden; display: block; +} + + +.cursorPointer { + cursor: pointer; } \ No newline at end of file diff --git a/pages/event/_id.vue b/pages/event/_id.vue index 160175ee..daba1346 100644 --- a/pages/event/_id.vue +++ b/pages/event/_id.vue @@ -64,31 +64,33 @@ v-container#event.pa-0.pa-sm-2 //- resources from fediverse #resources.mt-1(v-if='settings.enable_federation') - div.float-right(v-if='!settings.hide_boosts') - small.mr-3 🔖 {{event.likes.length}} - small ✊ {{event.boost.length}}
+ //- div.float-right(v-if='!settings.hide_boosts') + //- small.mr-3 🔖 {{event.likes.length}} + //- small ✊ {{event.boost.length}}
- v-dialog.showResource#resourceDialog(v-model='showResources' fullscreen - width='95vw' + v-dialog(v-model='showResources' + fullscreen destroy-on-close @keydown.native.right='$refs.carousel.next()' @keydown.native.left='$refs.carousel.prev()') - v-carousel(:interval='10000' ref='carousel' arrow='always') - v-carousel-item(v-for='attachment in selectedResource.data.attachment' :key='attachment.url') - v-img(:src='attachment.url') - v-list.mb-1(v-if='settings.enable_resources' v-for='resource in event.resources' dark + v-carousel.pa-5(:interval='10000' ref='carousel' hide-delimiters height='100%' show-arrows-on-over) + v-carousel-item(v-for='attachment in selectedResource.data.attachment' + v-if='isImg(attachment)' + :key='attachment.url') + v-img(:src='attachment.url' contain max-width='100%' max-height='100%') + + v-card#resources.mb-1(v-if='settings.enable_resources' v-for='resource in event.resources' :key='resource.id' :class='{disabled: resource.hidden}') - v-list-item - v-list-title + v-card-subtitle v-menu(v-if='$auth.user && $auth.user.is_admin' offset-y) - template(v-slot:activator="{ on, attrs }") - v-btn.mr-2(v-on='on' v-attrs='attrs' color='primary' small icon outlined) + template(v-slot:activator="{ on }") + v-btn.mr-2(v-on='on' color='primary' small icon) v-icon mdi-dots-vertical v-list v-list-item(v-if='!resource.hidden' @click='hideResource(resource, true)') v-list-item-title mdi-eye-off {{$t('admin.hide_resource')}} v-list-item(v-else @click='hideResource(resource, false)') - v-list-item-title mdi-eye-on {{$t('admin.show_resource')}} + v-list-item-title mdi-eye {{$t('admin.show_resource')}} v-list-item(@click='deleteResource(resource)') v-list-item-title mdi-delete {{$t('admin.delete_resource')}} v-list-item(@click='blockUser(resource)') @@ -97,9 +99,16 @@ v-container#event.pa-0.pa-sm-2 a(:href='resource.data.url || resource.data.context') small {{resource.data.published|dateFormat('ddd, D MMMM HH:mm')}} + v-card-text + div.mt-1(v-html='resource_filter(resource.data.content)') - span.previewImage(@click='showResource(resource)') - img(v-for='img in resource.data.attachment' :src='img.url') + span(v-for='attachment in resource.data.attachment' :key='attachment.url' @click='showResource(resource)') + audio(v-if='isAudio(attachment)' controls) + source(:src='attachment.url') + v-img.cursorPointer(v-if='isImg(attachment)' :src='attachment.url' + max-height="250px" + max-width="250px" + contain :alt='attachment.name') //- Next/prev arrow .text-center.mt-5.mb-5 @@ -243,6 +252,14 @@ export default { window.removeEventListener('keydown', this.keyDown) }, methods: { + isImg (attachment) { + const type = attachment.mediaType.split('/')[0] + return type === 'image' + }, + isAudio (attachment) { + const type = attachment.mediaType.split('/')[0] + return type === 'audio' + }, keyDown (ev) { if (ev.altKey || ev.ctrlKey || ev.metaKey || ev.shiftKey) { return } if (ev.key === 'ArrowRight' && this.event.next) { @@ -255,7 +272,7 @@ export default { showResource (resource) { this.showResources = true this.selectedResource = resource - document.getElementById('resourceDialog').focus() + // document.getElementById('resourceDialog').focus() }, async hideResource (resource, hidden) { await this.$axios.$put(`/resources/${resource.id}`, { hidden })