Merge pull request #39 from spectrachrome/fix-cog-loading

fix: make sure COGs load correctly
geotiffjs · Jan 9, 2025 · b82d6ca · b82d6ca
2 parents bff9875 + ae3a8f9
commit b82d6ca
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 26 deletions.
diff --git a/src/actions/scenes/index.js b/src/actions/scenes/index.js
@@ -93,7 +93,7 @@ export function addSceneFromIndex(url, attribution, pipeline) {
 
       const contentType = headerResponse.headers.get('content-type');
 
-      if (contentType === 'text/html') {
+      if (contentType.includes('text/html')) {
         const relUrl = url.endsWith('/') ? url : url.substring(0, url.lastIndexOf('/'));
         const response = await fetch(url, {});
         const content = await response.text();
@@ -132,7 +132,7 @@ export function addSceneFromIndex(url, attribution, pipeline) {
         dispatch(
           addScene(url, bands, red, green, blue, false, hasOvr, false, attribution, usedPipeline)
         );
-      } else if (contentType === 'image/tiff') {
+      } else if (contentType.includes('image/tiff')) {
         const tiff = await fromUrl(url);
         const image = await tiff.getImage();
 

diff --git a/src/components/mapview.jsx b/src/components/mapview.jsx
@@ -200,7 +200,7 @@ class MapView extends Component {
 
     const epsg = `EPSG:${code}`;
     if (!proj4.defs(epsg)) {
-      const response = await fetch(`//epsg.io/${code}.proj4`);
+      const response = await fetch(`https://epsg.io/${code}.proj4`);
       proj4.defs(epsg, await response.text());
     }
 

diff --git a/src/components/scenes/add.jsx b/src/components/scenes/add.jsx
@@ -49,12 +49,9 @@ class ConnectedAddSceneForm extends Component {
 
   render() {
     const { url } = this.state;
-    const example1Url = 'https://landsat-pds.s3.amazonaws.com/c1/L8/189/027/LC08_L1TP_189027_20170403_20170414_01_T1/index.html';
-    const example2Url = 'https://landsat-pds.s3.amazonaws.com/c1/L8/139/045/LC08_L1TP_139045_20170304_20170316_01_T1/index.html';
-    const example3Url = 'https://s3-us-west-2.amazonaws.com/planet-disaster-data/hurricane-harvey/SkySat_Freeport_s03_20170831T162740Z3.tif';
-    const example3Attribution = 'cc-by-sa, downloaded from https://www.planet.com/disaster/hurricane-harvey-2017-08-28/';
-    const example4Url = 'https://oin-hotosm.s3.amazonaws.com/56f9b5a963ebf4bc00074e70/0/56f9c2d42b67227a79b4faec.tif';
-    const example5Url = 'https://oin-hotosm.s3.amazonaws.com/59c66c5223c8440011d7b1e4/0/7ad397c0-bba2-4f98-a08a-931ec3a6e943.tif';
+    const example1Url = 'https://sentinel-cogs.s3.us-west-2.amazonaws.com/sentinel-s2-l2a-cogs/36/Q/WD/2020/7/S2A_36QWD_20200701_0_L2A/TCI.tif';
+    const example2Url = 'https://oin-hotosm.s3.amazonaws.com/56f9b5a963ebf4bc00074e70/0/56f9c2d42b67227a79b4faec.tif';
+    const example3Url = 'https://oin-hotosm.s3.amazonaws.com/59c66c5223c8440011d7b1e4/0/7ad397c0-bba2-4f98-a08a-931ec3a6e943.tif';
     return (
       <React.Fragment>
         <div className="form-group input-group">
@@ -87,33 +84,19 @@ class ConnectedAddSceneForm extends Component {
                 onClick={() => this.props.addSceneFromIndex(example1Url)}
                 disabled={!this.checkUrl(example1Url) || this.isLoading()}
               >
-                Landsat 8 sample 1
+                Sentinel-2 RGB sample
               </button>
               <button
                 className="btn btn-secondary dropdown-item"
                 onClick={() => this.props.addSceneFromIndex(example2Url)}
                 disabled={!this.checkUrl(example2Url) || this.isLoading()}
-              >
-                Landsat 8 sample 2
-              </button>
-              <button
-                className="btn btn-secondary dropdown-item"
-                onClick={() => this.props.addSceneFromIndex(example3Url, example3Attribution)}
-                disabled={!this.checkUrl(example3Url) || this.isLoading()}
-              >
-                SkySat sample
-              </button>
-              <button
-                className="btn btn-secondary dropdown-item"
-                onClick={() => this.props.addSceneFromIndex(example4Url)}
-                disabled={!this.checkUrl(example4Url) || this.isLoading()}
               >
                 OpenAerialMap sample 1
               </button>
               <button
                 className="btn btn-secondary dropdown-item"
-                onClick={() => this.props.addSceneFromIndex(example5Url)}
-                disabled={!this.checkUrl(example5Url) || this.isLoading()}
+                onClick={() => this.props.addSceneFromIndex(example3Url)}
+                disabled={!this.checkUrl(example3Url) || this.isLoading()}
               >
                 OpenAerialMap sample 2
               </button>