Merge pull request #416 from EarthyScience/jp/camera-tweaks

Tweaked camera in Flat-map

Author: TheJeran

src/components/plots/Plot.tsx

@@ -28,9 +28,10 @@ const TransectNotice = () =>{
 }
 
 const Orbiter = ({isFlat} : {isFlat  : boolean}) =>{
-  const {resetCamera, useOrtho} = usePlotStore(useShallow(state => ({
+  const {resetCamera, useOrtho, displaceSurface} = usePlotStore(useShallow(state => ({
       resetCamera: state.resetCamera,
-      useOrtho: state.useOrtho
+      useOrtho: state.useOrtho,
+      displaceSurface: state.displaceSurface
     })))
   const orbitRef = useRef<OrbitControlsImpl | null>(null)
   const hasMounted = useRef(false);
@@ -117,7 +118,7 @@ const Orbiter = ({isFlat} : {isFlat  : boolean}) =>{
   return (
     <OrbitControls 
       ref={orbitRef} 
-      enableRotate={!isFlat || !useOrtho} 
+      enableRotate={!isFlat || !useOrtho || !displaceSurface} 
       enablePan={true} 
       maxDistance={50}
       minZoom={1} 

src/components/ui/MainPanel/AdjustPlot.tsx

@@ -326,17 +326,19 @@ const PointOptions = () =>{
 
 const FlatOptions = () =>{
   const {displacement, displaceSurface, offsetNegatives,
-    setDisplacement, setDisplaceSurface, setOffsetNegatives} = usePlotStore(useShallow(state=> ({
+    setDisplacement, setDisplaceSurface, setOffsetNegatives,
+    setResetCamera} = usePlotStore(useShallow(state=> ({
       displacement: state.displacement, displaceSurface: state.displaceSurface,
       offsetNegatives: state.offsetNegatives, setDisplacement: state.setDisplacement,
-      setDisplaceSurface: state.setDisplaceSurface, setOffsetNegatives: state.setOffsetNegatives
+      setDisplaceSurface: state.setDisplaceSurface, setOffsetNegatives: state.setOffsetNegatives,
+      setResetCamera: state.setResetCamera
   })))
    return(
    <>
    <div className='grid gap-2 mb-2'>
     <div 
       className='relative w-full text-center h-10 bg-primary rounded-full cursor-pointer mb-2 flex items-center justify-between px-4'
-      onClick={() => {setDisplaceSurface(!displaceSurface);}}  
+      onClick={() => {if (!displaceSurface){setResetCamera(!usePlotStore.getState().resetCamera)}; setDisplaceSurface(!displaceSurface); }}  
     >
       <span className={`z-10 font-semibold transition-colors ${displaceSurface ? 'text-primary' : 'text-secondary'}`}>
         Flat

src/components/ui/MainPanel/PlayButton.tsx

@@ -198,8 +198,7 @@ const PlayInterFace = ({visible, setKeepOpen}:{visible : boolean, setKeepOpen: R
           <Button
             variant='secondary'
             size='sm'
-            className='cursor-pointer'
-            disabled={zSlice[0] === 0}
+            className={`cursor-pointer ${zSlice[0] === 0 ? "invisible" : null}`}
             onClick={() => {
               setZSlice([Math.max(zSlice[0] - chunkTimeLength, 0), zSlice[1]])
               setKeepOpen(true)
@@ -214,11 +213,10 @@ const PlayInterFace = ({visible, setKeepOpen}:{visible : boolean, setKeepOpen: R
 
           <div className='text-xs sm:text-sm text-center'>{currentLabel}</div>
 
-          <Button
+           <Button
             variant='secondary'
             size='sm'
-            className='cursor-pointer'
-            disabled={!zSlice[1] || zSlice[1] === timeLength}
+            className={`cursor-pointer ${!zSlice[1] || zSlice[1] === timeLength? "invisible" : null}`}
             onClick={() => {
               if (zSlice[1] === null) return
               setZSlice([zSlice[0], Math.min(zSlice[1] + chunkTimeLength, timeLength)])
@@ -234,14 +232,14 @@ const PlayInterFace = ({visible, setKeepOpen}:{visible : boolean, setKeepOpen: R
         </div>
 
         {/* VISUALIZER */}
-        <ChunkVisualizer
+        {(sliceDist < timeLength) && <ChunkVisualizer
           zSlice={zSlice}
           timeLength={timeLength}
           chunkWidth={chunkDivWidth}
           showPrev={showPrevChunk}
           showNext={showNextChunk}
           animProg={animProg}
-        />
+        />}
 
         {/* SLIDER */}
         <div className='flex items-center gap-1 w-full'>