From f07a157a2a1c02d25edeadb1596f49802c6a8814 Mon Sep 17 00:00:00 2001
From: Book Pauk <bookpauk@gmail.com>
Date: Fri, 6 Nov 2020 01:08:22 +0700
Subject: [PATCH] =?UTF-8?q?=D0=9F=D0=BE=D0=BF=D1=80=D0=B0=D0=B2=D0=BA?=
 =?UTF-8?q?=D0=B0=20=D0=B1=D0=B0=D0=B3=D0=B0=20=D0=BF=D1=80=D0=B8=20resize?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/ExternalLibs/ExternalLibs.vue  | 30 +++++++++++--------
 1 file changed, 18 insertions(+), 12 deletions(-)

diff --git a/client/components/ExternalLibs/ExternalLibs.vue b/client/components/ExternalLibs/ExternalLibs.vue
index bb8c9f3d..5caf4b4b 100644
--- a/client/components/ExternalLibs/ExternalLibs.vue
+++ b/client/components/ExternalLibs/ExternalLibs.vue
@@ -234,7 +234,10 @@ class ExternalLibs extends Vue {
         this.justOpened = true;
         this.$root.addKeyHook(this.keyHook);
 
-        this.$root.$on('resize', this.frameResize);
+        this.$root.$on('resize', async() => {
+            await utils.sleep(200);
+            this.frameResize();
+        });
 
         document.addEventListener('fullscreenchange', () => {
             this.fullScreenActive = (document.fullscreenElement !== null);
@@ -521,18 +524,21 @@ class ExternalLibs extends Vue {
     }
 
     frameResize() {
-        if (this.$refs.frame) {
-            const w = this.$refs.frameBox.offsetWidth;
-            const h = this.$refs.frameBox.offsetHeight;
-            const normalSize = `width: ${w}px; height: ${h}px;`;
-            this.$refs.frameWrap.style = normalSize;
-            if (this.frameScale != 1) {
-                const s = this.frameScale;
-                this.$refs.frame.style = `width: ${w/s}px; height: ${h/s}px; transform: scale(${s}); transform-origin: 0 0;`;
-            } else {
-                this.$refs.frame.style = normalSize;
+        this.$refs.frameWrap.style = 'width: 1px; height: 1px;';
+        this.$nextTick(() => {
+            if (this.$refs.frame) {
+                const w = this.$refs.frameBox.offsetWidth;
+                const h = this.$refs.frameBox.offsetHeight;
+                const normalSize = `width: ${w}px; height: ${h}px;`;
+                this.$refs.frameWrap.style = normalSize;
+                if (this.frameScale != 1) {
+                    const s = this.frameScale;
+                    this.$refs.frame.style = `width: ${w/s}px; height: ${h/s}px; transform: scale(${s}); transform-origin: 0 0;`;
+                } else {
+                    this.$refs.frame.style = normalSize;
+                }
             }
-        }
+        });
     }
 
     changeScale(delta) {