From 6ef565ef7073e9c28815ca064751f8a974a28f99 Mon Sep 17 00:00:00 2001
From: skirtle <65301168+skirtles-code@users.noreply.github.com>
Date: Sat, 16 Jan 2021 06:01:18 +0000
Subject: [PATCH] docs: refactor the effect on the sponsors and fix a position
 caching bug

---
 src/.vuepress/theme/components/Home.vue | 39 ++++++++++---------------
 1 file changed, 15 insertions(+), 24 deletions(-)

diff --git a/src/.vuepress/theme/components/Home.vue b/src/.vuepress/theme/components/Home.vue
index 730bf5dd16..f28bcde01d 100644
--- a/src/.vuepress/theme/components/Home.vue
+++ b/src/.vuepress/theme/components/Home.vue
@@ -39,7 +39,7 @@
 
     <Content class="theme-default-content custom" />
 
-    <section class="section-sponsors" ref="sponsors">
+    <section class="section-sponsors" :class="{ active: sponsorsActive }" ref="sponsors">
       <div class="inner">
         <PatreonSponsors :sponsors="sponsors" />
         <OpenCollectiveSponsors />
@@ -85,7 +85,8 @@ export default {
   },
 
   data: () => ({
-    sponsors
+    sponsors,
+    sponsorsActive: false
   }),
 
   computed: {
@@ -103,29 +104,19 @@ export default {
   },
 
   mounted() {
-    if (!window) {
-      return
-    }
+    window.addEventListener('scroll', this.onPageScroll)
+  },
 
-    const sponsors = this.$refs.sponsors
-    let sponsorTop = sponsors.offsetTop
-    let sponsorActive = false
-
-    window.addEventListener('resize', () => (sponsorTop = sponsors.offsetTop))
-
-    window.addEventListener('scroll', () => {
-      if (window.pageYOffset > sponsorTop - 100) {
-        if (!sponsorActive) {
-          sponsorActive = true
-          sponsors.classList.add('active')
-        }
-      } else {
-        if (sponsorActive) {
-          sponsorActive = false
-          sponsors.classList.remove('active')
-        }
-      }
-    })
+  beforeDestroy() {
+    window.removeEventListener('scroll', this.onPageScroll)
+  },
+
+  methods: {
+    onPageScroll() {
+      const sponsorTop = this.$refs.sponsors.offsetTop
+
+      this.sponsorsActive = window.pageYOffset > sponsorTop - 100
+    }
   }
 }
 </script>