From 6c4d23714a42dd59843a8fb905150eed2d5db29d Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Fri, 18 Oct 2019 15:27:51 -0400
Subject: populate gallery row height without getting width

---
 src/components/gallery/gallery.js | 24 ++----------------------
 1 file changed, 2 insertions(+), 22 deletions(-)

(limited to 'src/components/gallery/gallery.js')

diff --git a/src/components/gallery/gallery.js b/src/components/gallery/gallery.js
index 7f33a81b..3610f53d 100644
--- a/src/components/gallery/gallery.js
+++ b/src/components/gallery/gallery.js
@@ -2,22 +2,12 @@ import Attachment from '../attachment/attachment.vue'
 import { chunk, last, dropRight } from 'lodash'
 
 const Gallery = {
-  data: () => ({
-    width: 500
-  }),
   props: [
     'attachments',
     'nsfw',
     'setMedia'
   ],
   components: { Attachment },
-  mounted () {
-    this.resize()
-    window.addEventListener('resize', this.resize)
-  },
-  destroyed () {
-    window.removeEventListener('resize', this.resize)
-  },
   computed: {
     rows () {
       if (!this.attachments) {
@@ -33,22 +23,12 @@ const Gallery = {
       }
       return rows
     },
-    rowHeight () {
-      return itemsPerRow => ({ 'height': `${(this.width / (itemsPerRow + 0.6))}px` })
+    rowStyle () {
+      return itemsPerRow => ({ 'padding-bottom': `${(100 / (itemsPerRow + 0.6))}%` })
     },
     useContainFit () {
       return this.$store.state.config.useContainFit
     }
-  },
-  methods: {
-    resize () {
-      // Quick optimization to make resizing not always trigger state change,
-      // only update attachment size in 10px steps
-      const width = Math.floor(this.$el.getBoundingClientRect().width / 10) * 10
-      if (this.width !== width) {
-        this.width = width
-      }
-    }
   }
 }
 
-- 
cgit v1.2.3-70-g09d2