b66564a30d
* upstream/develop: (89 commits) remove needless ref show preview popover when hover numbered replies refactor conditions do not make too many nested div add fetchStatus action refactor status loading logic split status preview popover into a separate component uninstall mobile-detect library listen both events minor css fix restrict distance at top side only set different trigger event in desktop and mobile by default fix eslint warnings fix popper go behind the top bar migrate Popper to v-popover fix popper go behind the top bar fix eslint warnings reset font-size to normal text size using rem use top placement by default hide status preview popper when hover popper content ...
54 lines
1.3 KiB
JavaScript
54 lines
1.3 KiB
JavaScript
import Attachment from '../attachment/attachment.vue'
|
|
import { chunk, last, dropRight, sumBy } from 'lodash'
|
|
|
|
const Gallery = {
|
|
props: [
|
|
'attachments',
|
|
'nsfw',
|
|
'setMedia'
|
|
],
|
|
data () {
|
|
return {
|
|
sizes: {}
|
|
}
|
|
},
|
|
components: { Attachment },
|
|
computed: {
|
|
rows () {
|
|
if (!this.attachments) {
|
|
return []
|
|
}
|
|
const rows = chunk(this.attachments, 3)
|
|
if (last(rows).length === 1 && rows.length > 1) {
|
|
// if 1 attachment on last row -> add it to the previous row instead
|
|
const lastAttachment = last(rows)[0]
|
|
const allButLastRow = dropRight(rows)
|
|
last(allButLastRow).push(lastAttachment)
|
|
return allButLastRow
|
|
}
|
|
return rows
|
|
},
|
|
useContainFit () {
|
|
return this.$store.getters.mergedConfig.useContainFit
|
|
}
|
|
},
|
|
methods: {
|
|
onNaturalSizeLoad (id, size) {
|
|
this.$set(this.sizes, id, size)
|
|
},
|
|
rowStyle (itemsPerRow) {
|
|
return { 'padding-bottom': `${(100 / (itemsPerRow + 0.6))}%` }
|
|
},
|
|
itemStyle (id, row) {
|
|
const total = sumBy(row, item => this.getAspectRatio(item.id))
|
|
return { flex: `${this.getAspectRatio(id) / total} 1 0%` }
|
|
},
|
|
getAspectRatio (id) {
|
|
const size = this.sizes[id]
|
|
return size ? size.width / size.height : 1
|
|
}
|
|
}
|
|
}
|
|
|
|
export default Gallery
|