[to squash?] Improve raf encapsulation

dream-ellie · Jul 19, 2020 · 545f5f1 · 545f5f1
1 parent d6f096b
commit 545f5f1
Show file tree

Hide file tree

Showing 4 changed files with 58 additions and 55 deletions.
diff --git a/lib/anime.es.js b/lib/anime.es.js
@@ -850,9 +850,10 @@ function createNewInstance(params) {
 // Core
 
 var activeInstances = [];
-var raf;
 
 var engine = (function () {
+  var raf;
+
   function play() {
     if (!raf && !isDocumentHidden() && activeInstances.length > 0) {
       raf = requestAnimationFrame(step);
@@ -876,30 +877,30 @@ var engine = (function () {
     }
     raf = i > 0 ? requestAnimationFrame(step) : undefined;
   }
+
+  function handleVisibilityChange() {
+    if (isDocumentHidden()) {
+      // suspend ticks
+      raf = cancelAnimationFrame(raf);
+    } else { // is back to active tab
+      // first adjust animations to consider the time that ticks were suspended
+      activeInstances.forEach(
+        function (instance) { return instance ._onDocumentVisibility(); }
+      );
+      engine();
+    }
+  }
+  if (typeof document !== 'undefined') {
+    document.addEventListener('visibilitychange', handleVisibilityChange);
+  }
+
   return play;
 })();
 
 function isDocumentHidden() {
   return !!document && document.hidden;
 }
 
-function handleVisibilityChange() {
-  if (isDocumentHidden()) {
-    // suspend ticks
-    raf = cancelAnimationFrame(raf);
-  } else { // is back to active tab
-    // first adjust animations to consider the time that ticks were suspended
-    activeInstances.forEach(
-      function (instance) { return instance._onDocumentVisibility(); }
-    );
-    engine();
-  }
-}
-
-if (typeof document !== 'undefined') {
-  document.addEventListener('visibilitychange', handleVisibilityChange);
-}
-
 // Public Instance
 
 function anime(params) {

diff --git a/lib/anime.js b/lib/anime.js
@@ -852,9 +852,10 @@ function createNewInstance(params) {
 // Core
 
 var activeInstances = [];
-var raf;
 
 var engine = (function () {
+  var raf;
+
   function play() {
     if (!raf && !isDocumentHidden() && activeInstances.length > 0) {
       raf = requestAnimationFrame(step);
@@ -878,30 +879,30 @@ var engine = (function () {
     }
     raf = i > 0 ? requestAnimationFrame(step) : undefined;
   }
+
+  function handleVisibilityChange() {
+    if (isDocumentHidden()) {
+      // suspend ticks
+      raf = cancelAnimationFrame(raf);
+    } else { // is back to active tab
+      // first adjust animations to consider the time that ticks were suspended
+      activeInstances.forEach(
+        function (instance) { return instance ._onDocumentVisibility(); }
+      );
+      engine();
+    }
+  }
+  if (typeof document !== 'undefined') {
+    document.addEventListener('visibilitychange', handleVisibilityChange);
+  }
+
   return play;
 })();
 
 function isDocumentHidden() {
   return !!document && document.hidden;
 }
 
-function handleVisibilityChange() {
-  if (isDocumentHidden()) {
-    // suspend ticks
-    raf = cancelAnimationFrame(raf);
-  } else { // is back to active tab
-    // first adjust animations to consider the time that ticks were suspended
-    activeInstances.forEach(
-      function (instance) { return instance._onDocumentVisibility(); }
-    );
-    engine();
-  }
-}
-
-if (typeof document !== 'undefined') {
-  document.addEventListener('visibilitychange', handleVisibilityChange);
-}
-
 // Public Instance
 
 function anime(params) {

diff --git a/lib/anime.min.js b/lib/anime.min.js
diff --git a/src/index.js b/src/index.js
@@ -834,9 +834,10 @@ function createNewInstance(params) {
 // Core
 
 let activeInstances = [];
-let raf;
 
 const engine = (() => {
+  let raf;
+
   function play() {
     if (!raf && !isDocumentHidden() && activeInstances.length > 0) {
       raf = requestAnimationFrame(step);
@@ -860,30 +861,30 @@ const engine = (() => {
     }
     raf = i > 0 ? requestAnimationFrame(step) : undefined;
   }
+
+  function handleVisibilityChange() {
+    if (isDocumentHidden()) {
+      // suspend ticks
+      raf = cancelAnimationFrame(raf);
+    } else { // is back to active tab
+      // first adjust animations to consider the time that ticks were suspended
+      activeInstances.forEach(
+        instance => instance ._onDocumentVisibility()
+      );
+      engine();
+    }
+  }
+  if (typeof document !== 'undefined') {
+    document.addEventListener('visibilitychange', handleVisibilityChange);
+  }
+
   return play;
 })();
 
 function isDocumentHidden() {
   return !!document && document.hidden;
 }
 
-function handleVisibilityChange() {
-  if (isDocumentHidden()) {
-    // suspend ticks
-    raf = cancelAnimationFrame(raf);
-  } else { // is back to active tab
-    // first adjust animations to consider the time that ticks were suspended
-    activeInstances.forEach(
-      instance => instance._onDocumentVisibility()
-    );
-    engine();
-  }
-}
-
-if (typeof document !== 'undefined') {
-  document.addEventListener('visibilitychange', handleVisibilityChange);
-}
-
 // Public Instance
 
 function anime(params = {}) {