#79 hide/show cursor at leaving/entering document.

artzub · Mar 2, 2023 · 5545bd3 · 5545bd3
1 parent 80134e2
commit 5545bd3
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 0 deletions.
diff --git a/src/shared/components/FocusOverlay/index.jsx b/src/shared/components/FocusOverlay/index.jsx
@@ -184,6 +184,35 @@ const FocusOverlay = ({ globalListener }) => {
     [clickSoundPlay, clickSoundStop, globalListener, hoverSoundPlay, hoverSoundStop],
   );
 
+  useEffect(
+    () => {
+      let isEnter = true;
+      const onDocumentEnter = () => {
+        if (!isEnter) {
+          console.log('show');
+          cursor.show();
+          isEnter = true;
+        }
+      };
+      const onDocumentLeave = () => {
+        if (isEnter) {
+          console.log('hide');
+          cursor.hide();
+          isEnter = false;
+        }
+      };
+
+      document.documentElement?.addEventListener('pointerenter', onDocumentEnter, true);
+      document.documentElement?.addEventListener('pointerleave', onDocumentLeave, true);
+
+      return () => {
+        document.documentElement?.removeEventListener('pointerenter', onDocumentEnter, true);
+        document.documentElement?.removeEventListener('pointerleave', onDocumentLeave, true);
+      };
+    },
+    [],
+  );
+
   return null;
 };
 

diff --git a/src/shared/graphics/Cursor.js b/src/shared/graphics/Cursor.js
@@ -252,6 +252,7 @@ class Cursor extends PIXI.Container {
   show() {
     this.alpha = 0.001;
     this._shadowMain
+      .attr('opacity', this.alpha)
       .transition('fade')
       .duration(duration)
       .attr('opacity', 1);