Merge pull request #522 from theosanderson/fixminimap

Fix issue where you could not pan in the minimap

taxonium_component/src/Deck.jsx

@@ -44,6 +44,8 @@ function Deck({
   deckRef,
   jbrowseRef,
   setAdditionalColorMapping,
+  mouseDownIsMinimap,
+  setMouseDownIsMinimap,
 }) {
   const zoomReset = view.zoomReset;
   const snapshot = useSnapshot(deckRef);
@@ -75,12 +77,13 @@ function Deck({
   );
   const [treenomeReferenceInfo, setTreenomeReferenceInfo] = useState(null);
 
-  const [mouseDownIsMinimap, setMouseDownIsMinimap] = useState(false);
-
   const mouseDownPos = useRef();
 
   const onClickOrMouseMove = useCallback(
     (event) => {
+      if (event._reactName === "onClick") {
+        setMouseDownIsMinimap(false);
+      }
       if (event.buttons === 0 && event._reactName === "onPointerMove") {
         return false;
       }
@@ -136,6 +139,7 @@ function Deck({
       ) {
         onViewStateChange({
           oldViewState: viewState,
+          specialMinimap: true,
           viewState: {
             ...viewState,
             target: [

taxonium_component/src/Taxonium.jsx

@@ -66,10 +66,17 @@ function Taxonium({
 
   const deckRef = useRef();
   const jbrowseRef = useRef();
+  const [mouseDownIsMinimap, setMouseDownIsMinimap] = useState(false);
 
   const [deckSize, setDeckSize] = useState(null);
   const settings = useSettings({ query, updateQuery });
-  const view = useView({ settings, deckSize, deckRef, jbrowseRef });
+  const view = useView({
+    settings,
+    deckSize,
+    deckRef,
+    jbrowseRef,
+    mouseDownIsMinimap,
+  });
 
   const url_on_fail = URL_ON_FAIL ? URL_ON_FAIL : null;
 
@@ -194,6 +201,8 @@ function Taxonium({
             isCurrentlyOutsideBounds={isCurrentlyOutsideBounds}
             treenomeState={treenomeState}
             deckRef={deckRef}
+            mouseDownIsMinimap={mouseDownIsMinimap}
+            setMouseDownIsMinimap={setMouseDownIsMinimap}
             jbrowseRef={jbrowseRef}
             setAdditionalColorMapping={setAdditionalColorMapping}
           />

taxonium_component/src/hooks/useView.jsx

@@ -101,7 +101,13 @@ class MyOrthographicController extends OrthographicController {
   }
 }
 
-const useView = ({ settings, deckSize, deckRef, jbrowseRef }) => {
+const useView = ({
+  settings,
+  deckSize,
+  deckRef,
+  jbrowseRef,
+  mouseDownIsMinimap,
+}) => {
   const [zoomAxis, setZoomAxis] = useState("Y");
   const [xzoom, setXzoom] = useState(window.screen.width < 600 ? -1 : 0);
   globalSetZoomAxis = setZoomAxis;
@@ -232,6 +238,7 @@ const useView = ({ settings, deckSize, deckRef, jbrowseRef }) => {
       oldViewState,
       basicTarget,
       overrideZoomAxis,
+      specialMinimap,
     }) => {
       if (!deckSize) {
         return;
@@ -248,6 +255,10 @@ const useView = ({ settings, deckSize, deckRef, jbrowseRef }) => {
       const newScaleY = 2 ** newViewState.zoom;
       // eslint-disable-line no-unused-vars
 
+      if (mouseDownIsMinimap && !specialMinimap && oldScaleY === newScaleY) {
+        return;
+      }
+
       let newScaleX = 2 ** xzoom;
       if (basicTarget) {
         newViewState.target[0] =