RCM-ARD release (#158)

* Only load localstate if params are not included in url request

* Clear all params other than organizations

* Update localStorage.ts

* Removed if statement to force filter reset if url params are provided

* Update localStorage.ts

* Update localStorage.ts

* Update localStorage.ts

* Update localStorage.ts

* Update thumbnail-config.json to use different api endpoint which better supports binary formats

* Initial commit for RCM-ARD

* Fixing logic to enable the loading of COG from rcm-ard collection

* debug for rcm-ard

* typo

* Improve readability of imageUrls variable and add application/geotiff

* typo

* c;ode cleanup to determine if thumnail png or COG geotiff should be loaded

* set max to 98th percentile to improve shading for rcm-ard

* Invalidate localstorage after 5 minutes instead of checking params in url

* Adjust padding to account for left search panel

* Use longitude offset based on zoom level

* add debug code

* set new time for session after session expiry

* bug fixes to localstorage

* Update geosearch.tsx

* adjust longitude offset

* Update geosearch.tsx

* Update geosearch.tsx

* use getBoundsZoom to calculate best zoom level

* Update geosearch.tsx

* fix bug related to console output

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Removes bbox when paging. Zoom to extent of canada before zoom/panning

* Create reset to initial map function

* debug map reset

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Update geosearch.tsx

* Add tooltip for rcm-ard in en/fr

* Set min zoom to 4 to improve stability of the app

* refactor display of eo and thumbnails on search page

* Change default text

* minor fixes

* change rcm-ard polarization to new format

* For colour ramp use 98th percentile instead of max

* Change to draw bbox if tiling fails

src/common/map.ts

@@ -14,7 +14,7 @@ const lccMapOptionsParam: MapOptions = {
 // Web Mercator map options
 const wmMapOptionsParam: MapOptions = {
     zoomFactor: 5,
-    minZoom: 2,
+    minZoom: 4,
     maxZooom: 19,
     maxBounds: new LatLngBounds({ lat: -89.999, lng: -180 }, { lat: 89.999, lng: 180 }),
     maxBoundsViscosity: 0.0,

src/components/search/data-collection-option.json

@@ -6,5 +6,9 @@
     {
         "label": "datacollection.SENTINEL1",
         "value": "sentinel-1"
+    },
+    {
+        "label": "datacollection.RCM-ARD",
+        "value": "rcm-ard"
     }
 ]

src/components/search/metadatapage.jsx

@@ -170,43 +170,63 @@ const MetaDataPage = (props) => {
                     setSimilarRecords(sims);
                     setShowSimilarRecords(sims.slice(0, 5));
                 }
-                if(res.options){                
-                    const imageUrls=res.options.filter(o=>o.url && o.url!==null && o.description && o.description.en && (o.description.en.toLowerCase().indexOf("data;tiff;")>=0||o.description.en.toLowerCase().indexOf("image/tiff")>=0
-                    ||o.description.en.toLowerCase().indexOf("thumbnail;png")>=0 
-                    ||o.description.en.toLowerCase().indexOf("image/png")>=0
-                    ||o.description.en.toLowerCase().indexOf("thumbnail;jpeg")>=0 
-                    ||o.description.en.toLowerCase().indexOf("image/jpeg")>=0));
+                if(res.options){
+                    const imageUrls = res.options.filter(o => 
+                    o.url && o.url !== null &&
+                    o.description && o.description.en &&
+                    (
+                        o.description.en.toLowerCase().indexOf("data;tiff;") >= 0 ||
+                        o.description.en.toLowerCase().indexOf("image/tiff") >= 0 ||
+                        o.description.en.toLowerCase().indexOf("thumbnail;png") >= 0 ||
+                        o.description.en.toLowerCase().indexOf("image/png") >= 0 ||
+                        o.description.en.toLowerCase().indexOf("thumbnail;jpeg") >= 0 ||
+                        o.description.en.toLowerCase().indexOf("image/jpeg") >= 0 ||
+                        o.description.en.toLowerCase().indexOf("application/geotiff") >= 0
+                    )
+                    );
                     let url;
-                    const isSentinel1=imageUrls.length>0 && res.sourceSystemName.toLowerCase().indexOf("eodms")>=0 && res.eoCollection==='sentinel-1' && thumbnailConfig['eodms_use_image'];
+                    const isSentinel1=imageUrls.length>0 && res.sourceSystemName.toLowerCase().indexOf("ccmeo-eodms")>=0 && res.eoCollection==='sentinel-1' && thumbnailConfig['eodms_use_image'];
+                    const isRCMARD=imageUrls.length>0 && res.sourceSystemName.toLowerCase().indexOf("ccmeo-eodms")>=0 && res.eoCollection==='rcm-ard';
+                    const isDatacube=imageUrls.length>0 && res.sourceSystemName.toLowerCase().indexOf("ccmeo-datacube")>=0;
                     if (isSentinel1) setTileServiceUrl(null);
-                    const hasImage=imageUrls.length>0 && res.keywords.toLowerCase().indexOf("stac")>=0;                            
-                    if(imageUrls.length>0){
+                    const hasImage=imageUrls.length>0 && res.keywords.toLowerCase().indexOf("stac")>=0;
+                    if (isSentinel1 && imageUrls.length > 0) {
+                        // Set URL to load the thumbnail image
                         let thumbnail_correction = thumbnailConfig['thumbnail_correction_proxy_dev'];
                         let orbitDirection = res.eoFilters[0]?.orbitState;
-                        //console.log(orbitDirection);
-                        url=thumbnail_correction + imageUrls[0].url + "&side=" + orbitDirection;
-                        //handling if image is type tiff
-                        let imgUrlsTIFF=imageUrls.filter(o=>o.description.en.toLowerCase().indexOf("data;tiff;")>=0||o.description.en.toLowerCase().indexOf("image/tiff")>=0);
-                        if(imgUrlsTIFF.length>0){
-                            url=imgUrlsTIFF[0].url;
-                        }
+                        url = thumbnail_correction + imageUrls[0].url + "&side=" + orbitDirection;
                     }
-
-                    if(!isSentinel1 && hasImage){
+                    else if ((isRCMARD || isDatacube) && imageUrls.length > 0) {
+                        // Set URL to load the COG geotiff
+                        let imgUrlsTIFF = imageUrls.filter(o => (
+                            o.description.en.toLowerCase().indexOf("data;tiff;") >= 0 || 
+                            o.description.en.toLowerCase().indexOf("image/tiff") >= 0 ||
+                            o.description.en.toLowerCase().indexOf("application/geotiff") >= 0
+                        ));
 
+                        if (imgUrlsTIFF.length > 0) {
+                            url = imgUrlsTIFF[0].url;
+                        }
+                    }
+                    console.log(imageUrls);
+                    console.log(isRCMARD);
+                    console.log(isDatacube);
+                    console.log(hasImage);
+                    if((isRCMARD || isDatacube) && hasImage){
+                        console.log("trying to load tile");
                         axios.get(`${EnvGlobals.COG_TILEJSON_URL}`, {params: {url}}).then((res)=>{
-                            //console.log(res);
+                            console.log(res);
                             const centers=res.data.center;
                             setCogCenter(new LatLng(centers[1], centers[0]));
                             setCogZoom(centers[2]);
                             const imageBounds = L.latLngBounds([[res.data.bounds[3], res.data.bounds[2]],[res.data.bounds[1], res.data.bounds[0]]]);
                             setCogBounds(imageBounds);
                             axios.get(`${EnvGlobals.COG_STATISTICS_URL}`, {params: {url, unscale: 'false', resampling:'nearest', max_size: '1024', categorical: 'false'}}).then((res2)=>{
-                                //console.log(res2);
+                                console.log(res2);
                                 const min=res2.data.b1.min;
-                                const max=res2.data.b1.max;                                                              
+                                const max=res2.data.b1.percentile_98;
                                 setTileServiceUrl(`${EnvGlobals.COG_TILESERVICE_URL}?url=${url}&resampling_method=nearest&bidx=1&rescale=${min}%2C${max}`);
-                                setLoading1(false);                                                            
+                                setLoading1(false);
                             });
                         }).catch(err=>{
                             //console.log('tilejson', err);
@@ -437,12 +457,20 @@ const MetaDataPage = (props) => {
                                     const desc = option.description[language].split(";");
                                     return { name: option.name[language], type: desc[0], format: desc[1], language: t(`page.${desc[2].toLowerCase().replace(',', '')}`), url: option.url };
                                 });
-                            const imageUrls=formattedOption.filter(o=>o.url && o.url!==null && o.description && o.description.en && (o.description.en.toLowerCase().indexOf("data;tiff;")>=0
-                            ||o.description.en.toLowerCase().indexOf("image/tiff")>=0
-                            ||o.description.en.toLowerCase().indexOf("thumbnail;png")>=0
-                            ||o.description.en.toLowerCase().indexOf("image/png")>=0
-                            ||o.description.en.toLowerCase().indexOf("thumbnail;jpeg")>=0
-                            ||o.description.en.toLowerCase().indexOf("image/jpeg")>=0));
+
+                            const imageUrls = formattedOption.filter(o => 
+                                o.url && o.url !== null &&
+                                o.description && o.description.en &&
+                                (
+                                    o.description.en.toLowerCase().indexOf("data;tiff;") >= 0 ||
+                                    o.description.en.toLowerCase().indexOf("image/tiff") >= 0 ||
+                                    o.description.en.toLowerCase().indexOf("thumbnail;png") >= 0 ||
+                                    o.description.en.toLowerCase().indexOf("image/png") >= 0 ||
+                                    o.description.en.toLowerCase().indexOf("thumbnail;jpeg") >= 0 ||
+                                    o.description.en.toLowerCase().indexOf("image/jpeg") >= 0 ||
+                                    o.description.en.toLowerCase().indexOf("application/geotiff") >= 0
+                                )
+                            );
                             let url;                            
                             const isSentinel1=imageUrls.length>0 && result.sourceSystemName==='ccmeo-eodms' && result.eoCollection==='sentinel-1' && thumbnailConfig['eodms_use_image'];
                             const hasImage=imageUrls.length>0 && result.keywords.toLowerCase().indexOf("stac")>=0;                            
@@ -848,7 +876,7 @@ const MetaDataPage = (props) => {
                                                             <ImageOverlay
                                                                 url={url}
                                                                 bounds={bounds}
-                                                                opacity={1}
+                                                                opacity={0.75}
                                                                 zIndex={10}
                                                                 />
                                                         </MapContainer>}                                                        

src/components/search/polarization-option-rcm-ard.json

@@ -0,0 +1,14 @@
+[
+    {
+        "label": "polarization.DEFAULT",
+        "value": ""
+    },
+    {
+        "label": "polarization.CHCV",
+        "value": "CH + CV"
+    },
+    {
+        "label": "polarization.HHHV",
+        "value": "HH + HV"
+    }
+]

src/components/search/polarization-option-sentinel-1.json

@@ -0,0 +1,38 @@
+[
+    {
+        "label": "polarization.DEFAULT",
+        "value": ""
+    },
+    {
+        "label": "polarization.VV",
+        "value": "VV"
+    },
+    {
+        "label": "polarization.VVVH",
+        "value": "VV + VH"
+    },
+    {
+        "label": "polarization.HH",
+        "value": "HH"
+    },
+    {
+        "label": "polarization.HHHV",
+        "value": "HH + HV"
+    },
+    {
+        "label": "polarization.HHHVVHVV",
+        "value": "HH + HV + VH + VV"
+    },
+    {
+        "label": "polarization.HHVV",
+        "value": "HH + VV"
+    },
+    {
+        "label": "polarization.HV",
+        "value": "HV"
+    },
+    {
+        "label": "polarization.VH",
+        "value": "VH"
+    }
+]

src/components/searchfilter/eo-filter.scss

@@ -6,4 +6,7 @@
 }
 .sentinel-1 {
     padding-left: 10px;
-}
+}
+.rcm-ard {
+    padding-left: 10px;
+}

src/components/searchfilter/eo-filter.tsx

@@ -2,7 +2,8 @@ import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import dataCollectionOptions from '../search/data-collection-option.json';
 import orbitOptions from '../search/orbit-direction-option.json';
-import polarizationOptions from '../search/polarization-option.json';
+import polarizationOptionsSentinel from '../search/polarization-option-sentinel-1.json';
+import polarizationOptionsRCMARD from '../search/polarization-option-rcm-ard.json';
 import DropdownSelection from './dropdown-selection';
 import './eo-filter.scss';
 
@@ -47,7 +48,7 @@ export default function EoSearchFilter(props: EoSearchProps): JSX.Element {
            { dataCollection === 'sentinel-1' && (<div className="sentinel-1">
             <DropdownSelection  
                 label="filter.label.eofilter.polarization"
-                options={polarizationOptions}
+                options={polarizationOptionsSentinel}
                 labelClassName="dropdown-select-label"
                 selectClassName="dropdown-select"
                 optionClassName="dropdown-select-option"
@@ -56,7 +57,34 @@ export default function EoSearchFilter(props: EoSearchProps): JSX.Element {
                 onSelect={handlePolarizationChange}
                 tooltip
                 tooltipTitle='filter.label.eofilter.polarization-tooltip'
+            />
+            <DropdownSelection
+                label="filter.label.eofilter.orbit"
+                options={orbitOptions}
+                labelClassName="dropdown-select-label"
+                selectClassName="dropdown-select"
+                optionClassName="dropdown-select-option"
+                iconClassName="dropdown-select-icon"
+                defaultValue={orbit}
+                onSelect={handleOrbitChange}
+                tooltip
+                tooltipTitle='filter.label.eofilter.orbit-tooltip'
             />  
+            </div>
+           ) }
+           { dataCollection === 'rcm-ard' && (<div className="rcm-ard">
+            <DropdownSelection  
+                label="filter.label.eofilter.polarization"
+                options={polarizationOptionsRCMARD}
+                labelClassName="dropdown-select-label"
+                selectClassName="dropdown-select"
+                optionClassName="dropdown-select-option"
+                iconClassName="dropdown-select-icon"
+                defaultValue={polarization}
+                onSelect={handlePolarizationChange}
+                tooltip
+                tooltipTitle='filter.label.eofilter.polarization-tooltip'
+            />
             <DropdownSelection
                 label="filter.label.eofilter.orbit"
                 options={orbitOptions}

src/locales/en-CA/translation.json

@@ -117,7 +117,8 @@
                 "data-collection-tooltip":"",
                 "polarization-tooltip":"Determines with which polarisation the data was acquired. The first letter indicates the polarisation when sending the signal, the second letter when receiving the signal, e.g., HV = horizontal polarisation when sending the signal and vertical polarisation when receiving. <br/>Data can be acquired in single polarisation HH (SH) or VV (SV) or in dual polarisation HH&HV (DH) or VV&VH (DV), depending on the instrument mode. <br/>SM, IW and EW can be acquired in single or dual polarisation. WV can only be acquired in single polarisation.",
                 "orbit-tooltip":"Determines whether the data was recorded during a descending orbit (flight direction: north - south) or an ascending orbit (flight direction: south - north).",
-                "sentinel-1-tooltip":"<Strong>Sentinel-1</Strong> provides all-weather, day and night radar imagery for land and ocean services. <br/>EO Browser provides data acquired in Interferometric Wide Swath (IW) and Extra Wide Swath (EW) modes processed to Level-1 Ground Range Detected (GRD)."
+                "sentinel-1-tooltip":"<Strong>Sentinel-1</Strong> provides all-weather, day and night radar imagery for land and ocean services. <br/>EO Browser provides data acquired in Interferometric Wide Swath (IW) and Extra Wide Swath (EW) modes processed to Level-1 Ground Range Detected (GRD).",
+                "rcm-ard-tooltip":"<Strong>Radarsat Constellation Mission (RCM) - Analysis Ready Data (ARD) </Strong> includes a trio of Earth observation satellites, capable of scanning Earth day or night and in any weather conditions. The three-satellite configuration allows for daily revisits of Canada's vast territory and maritime approaches, as well as daily access to 90% of the world's surface and the Arctic up to four times a day."
             }
         }
     },
@@ -292,25 +293,27 @@
         "NU": "Nunavut",
         "NT": "Northwest Territories",
         "YT": "Yukon",
-        "DEFAULT": "Please select one"
+        "DEFAULT": "Show all"
     },
     "datacollection": {
-        "DEFAULT": "Please select one",
-        "SENTINEL1": "Sentinel-1"
+        "DEFAULT": "Show all",
+        "SENTINEL1": "Sentinel-1",
+        "RCM-ARD": "Radarsat Constellation Mission (RCM) - Analysis Ready Data (ARD)"
     },
     "polarization": {
-        "DEFAULT": "Please select one",
+        "DEFAULT": "Show all",
         "VV": "VV",
         "VVVH": "VV+VH",
         "HH": "HH",
         "HHHV": "HH+HV",
         "HHHVVHVV":"HH+HV+VH+VV",
         "HHVV":"HH+VV",
         "HV": "HV",
-        "VH": "VH"
+        "VH": "VH",
+        "CHCV": "CH+CV"
     },
     "orbit": {
-        "DEFAULT": "Please select one",
+        "DEFAULT": "Show all",
         "ASC": "Ascending",
         "DESC": "Descending"
     },

src/locales/fr-CA/translation.json

@@ -117,7 +117,8 @@
                 "data-collection-tooltip":"",
                 "polarization-tooltip":"Détermine la polarisation avec laquelle les données ont été acquises. La première lettre indique la polarisation lors de l'envoi du signal, la deuxième lettre lors de la réception du signal, par exemple, HV = polarisation horizontale lors de l'envoi du signal et polarisation verticale lors de la réception.<br/>Les données peuvent être acquises en polarisation simple HH (SH) ou VV (SV) ou en polarisation double HH&HV (DH) ou VV&VH (DV), selon le mode de l'instrument.<br/>SM, IW et EW peuvent être acquis en polarisation simple ou double. WV ne peut être acquis qu'en polarisation simple.",
                 "orbit-tooltip":"Détermine si les données ont été enregistrées sur une orbite descendante (direction de déplacement : nord - sud) ou une orbite ascendante (direction de déplacement : sud - nord).",
-                "sentinel-1-tooltip":"<strong>Sentinel-1</strong> fournit des images radar de jour et de nuit, par tous les temps, pour les services terrestres et océaniques. EO Browser fournit des données acquises en mode interférométrique Wide Swath (IW) et Extra Wide Swath (EW), traitées en niveau 1 de détection de la portée au sol (GRD). traitées en niveau 1 Ground Range Detected (GRD)."
+                "sentinel-1-tooltip":"<strong>Sentinel-1</strong> fournit des images radar de jour et de nuit, par tous les temps, pour les services terrestres et océaniques. EO Browser fournit des données acquises en mode interférométrique Wide Swath (IW) et Extra Wide Swath (EW), traitées en niveau 1 de détection de la portée au sol (GRD). traitées en niveau 1 Ground Range Detected (GRD).",
+                "rcm-ard-tooltip":"<strong>Mission de la Constellation RADARSAT (MCR) - données prêtes à l'analyse (DPA)</strong> Les trois satellites d'observation de la Terre identiques balaient la Terre jour et nuit, quelles que soient les conditions météorologiques. La configuration à trois satellites permet des réobservations journalières du vaste territoire et des approches maritimes du Canada ainsi qu'un accès à 90 % de la surface terrestre tous les jours et à l'Arctique jusqu'à quatre fois par jour."
             }
         }
     },
@@ -292,25 +293,27 @@
         "NU": "Nunavut",
         "NT": "Territoires du Nord-Ouest",
         "YT": "Yukon",
-        "DEFAULT": "Sélectionnez une option"
+        "DEFAULT": "Tout afficher"
     },
     "datacollection": {
-        "DEFAULT": "Sélectionnez une option",
-        "SENTINEL1": "Sentinel-1"
+        "DEFAULT": "Tout afficher",
+        "SENTINEL1": "Sentinel-1",
+        "RCM-ARD": "Mission de la Constellation RADARSAT (MCR) - données prêtes à l'analyse (DPA)"
     },
     "polarization": {
-        "DEFAULT": "Sélectionnez une option",
+        "DEFAULT": "Tout afficher",
         "VV": "VV",
         "VVVH": "VV+VH",
         "HH": "HH",
         "HHHV": "HH+HV",
         "HHHVVHVV":"HH+HV+VH+VV",
         "HHVV":"HH+VV",
         "HV": "HV",
-        "VH": "VH"
+        "VH": "VH",
+        "CHCV": "CH+CV"
     },
     "orbit": {
-        "DEFAULT": "Sélectionnez une option",
+        "DEFAULT": "Tout afficher",
         "ASC": "ascendante",
         "DESC": "descendante"
     },