up

Author: sirmmo

src/app/components/Map/TWLSample.tsx

@@ -65,19 +65,22 @@ export const TWLSample = (props: any) => {
         const y = url.searchParams.get('year');
         if (y) {
           setTimeout(() => {
-            setCurrYear(parseInt(y), mode);
+            setCurrYear(parseInt(y), data);
           }, 1250);
         }
       }
     }
   }, [tLayer]);
 
-  const setCurrYear = (yr, mode = 'forecast') => {
+  const setCurrYear = (yr, data = 'forecast') => {
     const date = new Date();
-    if (getCY() !== (yr + (mode === 'forecast' ? 0 : 1)).toString()) {
+    if (
+      getCY() !== (yr + (data === 'forecast' ? 0 : 1)).toString() &&
+      getCY() != yr.toString()
+    ) {
       setTimeout(() => {
         console.log('setting current year from Leaflet Timedmension:', yr);
-        date.setFullYear(yr + (mode === 'forecast' ? 0 : 1));
+        date.setFullYear(yr + (data === 'forecast' ? 0 : 1));
         setCurrentYear(yr);
         setCY(yr);
         setYearSet(true);
@@ -107,7 +110,7 @@ export const TWLSample = (props: any) => {
       }
 
       // @ts-ignore
-      map.timeDimension.on('timeloading', data => {
+      map.timeDimension.on('timeloading', cdata => {
         const url = new URL(window.location.href);
         if (
           url.searchParams.has('op') &&
@@ -116,8 +119,8 @@ export const TWLSample = (props: any) => {
           setIsSh(true);
         } else {
           if (!yearSet) {
-            let dt = new Date(+data.time).getFullYear();
-            setCurrYear(dt, mode);
+            let dt = new Date(+cdata.time).getFullYear();
+            setCurrYear(dt, data);
           }
           //setTimeout(() => {
           //  let layers = document.getElementsByClassName('leaflet-layer');

src/app/components/MapSearch/index.tsx

@@ -452,26 +452,28 @@ export const MapPopup: React.FunctionComponent<MapPopupProps> = props => {
     }
   }, [timeserie, baseYear]);
 
-  //@ts-ignore
-  map.timeDimension.on('timeloading', data => {
-    if (baseYear) {
-      let dt = new Date(+data.time).getFullYear();
-      if (getCY() !== dt.toString()) {
-        console.log(dt);
-        setOTsIndex(tsIndex);
-        const index = dt - baseYear;
-        setTsIndex(index);
+  useEffect(() => {
+    //@ts-ignore
+    map.timeDimension.on('timeloading', data => {
+      if (baseYear) {
+        let dt = new Date(+data.time).getFullYear();
+        if (getCY() !== dt.toString()) {
+          console.log(dt);
+          setOTsIndex(tsIndex);
+          const index = dt - baseYear;
+          setTsIndex(index);
 
-        let url = new URL(window.location.href);
-        if (url.searchParams.has('year')) {
-          url.searchParams.set('year', dt.toString());
-        } else {
-          url.searchParams.append('year', dt.toString());
+          let url = new URL(window.location.href);
+          if (url.searchParams.has('year')) {
+            url.searchParams.set('year', dt.toString());
+          } else {
+            url.searchParams.append('year', dt.toString());
+          }
+          window.history.pushState(null, '', url.toString());
         }
-        window.history.pushState(null, '', url.toString());
       }
-    }
-  });
+    });
+  }, []);
 
   useEffect(() => {
     let ctt = timeserie[tsIndex]?.datetime;