From ad0452220619960f4f19c4557691d2f8f3438df9 Mon Sep 17 00:00:00 2001
From: taehoon
Date: Mon, 21 Oct 2019 15:13:11 -0400
Subject: [PATCH] update flex-grow calculation logic
---
src/components/gallery/gallery.js | 14 +++++++-------
src/components/gallery/gallery.vue | 2 +-
2 files changed, 8 insertions(+), 8 deletions(-)
diff --git a/src/components/gallery/gallery.js b/src/components/gallery/gallery.js
index e8cbb526..4037da98 100644
--- a/src/components/gallery/gallery.js
+++ b/src/components/gallery/gallery.js
@@ -1,5 +1,5 @@
import Attachment from '../attachment/attachment.vue'
-import { chunk, last, dropRight } from 'lodash'
+import { chunk, last, dropRight, sumBy } from 'lodash'
const Gallery = {
props: [
@@ -39,13 +39,13 @@ const Gallery = {
rowStyle (itemsPerRow) {
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]
- if (size) {
- return { flex: size.width / size.height }
- } else {
- return {}
- }
+ return size ? size.width / size.height : 1
}
}
}
diff --git a/src/components/gallery/gallery.vue b/src/components/gallery/gallery.vue
index 803ec471..7abc2161 100644
--- a/src/components/gallery/gallery.vue
+++ b/src/components/gallery/gallery.vue
@@ -19,7 +19,7 @@
:attachment="attachment"
:allow-play="false"
:natural-size-load="onNaturalSizeLoad.bind(null, attachment.id)"
- :style="itemStyle(attachment.id)"
+ :style="itemStyle(attachment.id, row)"
/>