v1.0.3

Author: illarionov-company

lib/the-supersonic-plugin-for-scroll-based-animation.iife.js

@@ -8,6 +8,7 @@ var TheSuperSonicPluginForScrollBasedAnimation = function() {
   "use strict";
   const Globals = {
     scroll: 0,
+    screenHeight: 0,
     rafActive: true,
     rafId: 0,
     renderedInitially: false,
@@ -337,7 +338,7 @@ var TheSuperSonicPluginForScrollBasedAnimation = function() {
       this.start.updateLimits();
       this.end.updateLimits();
       if (this.end.top < this.start.top)
-        this.end.top += window.innerHeight;
+        this.end.top += Globals.screenHeight;
       this.helper.updateLimits();
       for (let property of this.properties) {
         property.updateLimits();
@@ -404,9 +405,9 @@ var TheSuperSonicPluginForScrollBasedAnimation = function() {
       this.domElement = domElement;
     }
     updateLimits() {
-      this.top = this.domElement.getBoundingClientRect().top + Globals.scroll;
+      this.top = ~~this.domElement.getBoundingClientRect().top + Globals.scroll;
       if (this.edge === "bottom")
-        this.top -= window.innerHeight;
+        this.top -= Globals.screenHeight;
     }
   }
   const _DriverHelper = class {
@@ -427,9 +428,9 @@ var TheSuperSonicPluginForScrollBasedAnimation = function() {
       let top = this.driver.start.top;
       let end = this.driver.end.top;
       if (this.driver.start.edge === "bottom")
-        top += window.innerHeight;
+        top += Globals.screenHeight;
       if (this.driver.end.edge === "bottom")
-        end += window.innerHeight;
+        end += Globals.screenHeight;
       this.domElement.style.setProperty("top", top + "px");
       this.domElement.style.setProperty("height", end - top + "px");
     }
@@ -478,7 +479,7 @@ var TheSuperSonicPluginForScrollBasedAnimation = function() {
   class TheSuperSonicPluginForScrollBasedAnimation2 {
     constructor(config) {
       __publicField(this, "observer", null);
-      __publicField(this, "resizeWrapper", null);
+      __publicField(this, "onResize", null);
       var _a;
       Globals.initConfig(config);
       this.initInstances();
@@ -526,40 +527,47 @@ var TheSuperSonicPluginForScrollBasedAnimation = function() {
       }
     }
     updateLimits() {
+      this.updateScreenHeight();
       this.updateScroll();
       Driver.updateLimits();
       if (Globals.config.hooks.onUpdateLimits)
         Globals.config.hooks.onUpdateLimits();
     }
     updateScroll() {
-      Globals.scroll = window.pageYOffset || window.scrollY || document.documentElement.scrollTop || document.body.scrollTop;
+      Globals.scroll = window.scrollY || window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
+    }
+    updateScreenHeight() {
+      const styles = {
+        position: "absolute",
+        left: "0",
+        top: "0",
+        height: "100vh",
+        width: "1px",
+        zIndex: "-1",
+        visibility: "hidden"
+      };
+      let helper = document.createElement("div");
+      for (let property in styles) {
+        helper.style.setProperty(property, styles[property]);
+      }
+      document.body.appendChild(helper);
+      Globals.screenHeight = helper.clientHeight;
+      helper.remove();
     }
     addEventListeners() {
-      this.resizeWrapper = debounce(() => {
+      this.onResize = () => {
         this.updateLimits();
         this.render({ useActiveDrivers: false });
-      });
-      window.addEventListener("resize", this.onResize.bind(this));
+      };
+      window.addEventListener("resize", this.onResize);
     }
     removeEventListeners() {
       window.removeEventListener("resize", this.onResize);
     }
-    onResize() {
-      this.resizeWrapper();
-    }
   }
   __publicField(TheSuperSonicPluginForScrollBasedAnimation2, "Driver", Driver);
   __publicField(TheSuperSonicPluginForScrollBasedAnimation2, "Property", Property);
   __publicField(TheSuperSonicPluginForScrollBasedAnimation2, "Element", Element);
   __publicField(TheSuperSonicPluginForScrollBasedAnimation2, "Globals", Globals);
-  function debounce(func) {
-    let timer;
-    return () => {
-      clearTimeout(timer);
-      timer = setTimeout(() => {
-        func.apply(this);
-      }, 500);
-    };
-  }
   return TheSuperSonicPluginForScrollBasedAnimation2;
 }();