disable scroll conditionally

HoldemPokerTools · Dec 30, 2020 · 65f50ae · 65f50ae
1 parent 2810779
commit 65f50ae
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/src/HandMatrix.css b/src/HandMatrix.css
@@ -5,6 +5,9 @@
   -khtml-user-select: none; /* Konqueror HTML */
   -moz-user-select: none; /* Firefox */
   -ms-user-select: none; /* Internet Explorer/Edge */
+}
+
+.hand-matrix.no-scroll {
   touch-action: none;
 }
 
@@ -22,12 +25,15 @@
 .hand-matrix-cell {
   border: 1px solid grey;
   display: inline-block;
-  touch-action: none;
   font-size: 1rem;
   width: 7.691%;
   overflow: hidden;
 }
 
+.hand-matrix.no-scroll .hand-matrix-cell{
+  touch-action: none;
+}
+
 @media screen and (max-width: 992px) {
   .hand-matrix-cell {
     font-size: 0.85em;

diff --git a/src/HandMatrix.js b/src/HandMatrix.js
@@ -139,10 +139,11 @@ function HandMatrix({
 
   return (
     <div
-      className={`hand-matrix ${onSelect || onPointerDown ? "selectable" : "unselectable"}`}
+      className={`hand-matrix ${onPointerEnter || onPointerMove ? "no-scroll" : ""} ${onSelect || onPointerDown ? "selectable" : "unselectable"}`}
       onClick={comboEventDispatcher(onSelect)}
       onPointerUp={comboEventDispatcher(onPointerUp)}
       onPointerDown={comboEventDispatcher(onPointerDown)}
+      onPointerLeave={comboEventDispatcher(onPointerUp)}
       onPointerMove={comboEventDispatcher((combo) => {
         onPointerMove && onPointerMove(combo);
         if (combo !== currentlyPointingAt) {