melnary/akkoma-fe
1
0
Fork 0
forked from AkkomaGang/akkoma-fe
Code Pull requests Activity

update flex-grow calculation logic

Browse source
This commit is contained in:
taehoon 2019-10-21 15:13:11 -04:00
parent 0396c6f29d
commit ad04522206
2 changed files with 8 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/components/gallery/gallery.js
View file

@ -1,5 +1,5 @@
import Attachment from '../attachment/attachment.vue' import Attachment from '../attachment/attachment.vue'
import { chunk, last, dropRight } from 'lodash' import { chunk, last, dropRight, sumBy } from 'lodash'
const Gallery = { const Gallery = {
props: [ props: [
@ -39,13 +39,13 @@ const Gallery = {
rowStyle (itemsPerRow) { rowStyle (itemsPerRow) {
return { 'padding-bottom': `${(100 / (itemsPerRow + 0.6))}%` } return { 'padding-bottom': `${(100 / (itemsPerRow + 0.6))}%` }
}, },
itemStyle (id) { itemStyle (id, row) {
const total = sumBy(row, item => this.getAspectRatio(item.id))
return { flexGrow: this.getAspectRatio(id) / total }
},
getAspectRatio (id) {
const size = this.sizes[id] const size = this.sizes[id]
if (size) { return size ? size.width / size.height : 1
return { flex: size.width / size.height }
} else {
return {}
}
} }
} }
} }

2
src/components/gallery/gallery.vue
View file

@ -19,7 +19,7 @@
:attachment="attachment" :attachment="attachment"
:allow-play="false" :allow-play="false"
:natural-size-load="onNaturalSizeLoad.bind(null, attachment.id)" :natural-size-load="onNaturalSizeLoad.bind(null, attachment.id)"
:style="itemStyle(attachment.id)" :style="itemStyle(attachment.id, row)"
/> />
</div> </div>
</div> </div>