ol-stac and partial stac-js migration #531 #546

Author: m-mohr

README.md

@@ -169,8 +169,8 @@ If you need even more flexibility, you need to dig into the Vue files and their
 ### Basemaps
 
 The file `basemaps.config.js` contains the configuration for the basemaps.
-You can update either just the `BASEMAPS` object or you can write a custom function `configureBasemap` that returns the desired options for [vue2-leaflet](https://vue2-leaflet.netlify.app/).
-[XYZ](https://vue2-leaflet.netlify.app/components/LTileLayer.html#props) and [WMS](https://vue2-leaflet.netlify.app/components/LWMSTileLayer.html#props) basemaps are supported and have different options that you can set.
+You can update either just the `BASEMAPS` object or you can write a custom function `configureBasemap` that returns the desired options for OpenLayers.
+XYZ and WMS basemaps are supported and have different options that you can set.
 
 ### Actions
 

basemaps.config.js

@@ -1,62 +1,69 @@
-import { CRS } from 'leaflet';
 import STAC from './src/models/stac';
 import Utils from './src/utils';
 
 const USGS_ATTRIBUTION = 'USGS Astrogeology';
-const WMS = 'LWMSTileLayer';
-const XYZ = 'LTileLayer';
+const WMS = 'TileWMS';
+const XYZ = 'XYZ';
 
+// All options (except for 'is') follow the OpenLayers options for the respective source class.
 const BASEMAPS = {
-  earth: {
-    url: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
-    name: 'OpenStreetMap',
-    is: XYZ,
-    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright" target="_blank">OpenStreetMap</a> contributors.'
-  },
-  europa: {
-    baseUrl: 'https://planetarymaps.usgs.gov/cgi-bin/mapserv?map=/maps/jupiter/europa_simp_cyl.map',
-    is: WMS,
-    name: 'USGS Europa',
-    attribution: USGS_ATTRIBUTION,
-    crs: CRS.EPSG4326,
-    format: 'image/png',
-    layers: 'GALILEO_VOYAGER'
-  },
-  mars: {
-    baseUrl: 'https://planetarymaps.usgs.gov/cgi-bin/mapserv?map=/maps/mars/mars_simp_cyl.map',
-    is: WMS,
-    name: 'USGS Mars',
-    attribution: USGS_ATTRIBUTION,
-    crs: CRS.EPSG4326,
-    format: 'image/png',
-    layers: 'MDIM21'
-  },
-  moon: {
-    baseUrl: 'https://planetarymaps.usgs.gov/cgi-bin/mapserv?map=/maps/earth/moon_simp_cyl.map',
-    is: WMS,
-    name: 'USGS Moon',
-    attribution: USGS_ATTRIBUTION,
-    crs: CRS.EPSG4326,
-    format: 'image/png',
-    layers: 'LROC_WAC'
-  }
+  earth: [
+    {
+      url: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
+      is: XYZ,
+      title: 'OpenStreetMap',
+      attributions: '&copy; <a href="https://www.openstreetmap.org/copyright" target="_blank">OpenStreetMap</a> contributors.',
+      projection: "EPSG:3857"
+    }
+  ],
+  europa: [
+    {
+      url: 'https://planetarymaps.usgs.gov/cgi-bin/mapserv?map=/maps/jupiter/europa_simp_cyl.map',
+      is: WMS,
+      title: 'USGS Europa',
+      attributions: USGS_ATTRIBUTION,
+      projection: "EPSG:4326",
+      params: {
+        FORMAT: 'image/png',
+        LAYERS: 'GALILEO_VOYAGER'
+      }
+    },
+  ],
+  mars: [
+    {
+      url: 'https://planetarymaps.usgs.gov/cgi-bin/mapserv?map=/maps/mars/mars_simp_cyl.map',
+      is: WMS,
+      title: 'USGS Mars',
+      attributions: USGS_ATTRIBUTION,
+      projection: "EPSG:4326",
+      params: {
+        FORMAT: 'image/png',
+        LAYERS: 'MDIM21'
+      }
+    }
+  ],
+  moon: [
+    {
+      url: 'https://planetarymaps.usgs.gov/cgi-bin/mapserv?map=/maps/earth/moon_simp_cyl.map',
+      is: WMS,
+      title: 'USGS Moon',
+      attributions: USGS_ATTRIBUTION,
+      projection: "EPSG:4326",
+      params: {
+        FORMAT: 'image/png',
+        LAYERS: 'LROC_WAC'
+      }
+    }
+  ],
 };
 
-/**
- * @typedef BasemapOptions
- * @type {Object}
- * @property {string} is Component: LWMSTileLayer or LTileLayer
- * @see https://vue2-leaflet.netlify.app/components/
- */
-
 /**
  * 
  * @param {Object} stac The STAC object
- * @param {Object} map The Leaflet map object
  * @param {Object} i18n Vue I18N object
  * @returns {Array.<BasemapOptions>}
  */
-export default function configureBasemap(stac, map, i18n) {
+export default function configureBasemap(stac, i18n) {
   let targets = ['earth'];
   if (stac instanceof STAC) {
     if (stac.isCollection() && Utils.isObject(stac.summaries) && Array.isArray(stac.summaries['ssys:targets'])) {
@@ -70,5 +77,13 @@ export default function configureBasemap(stac, map, i18n) {
     }
   }
 
-  return targets.map(target => BASEMAPS[target.toLowerCase()]);
+  let layers = [];
+  for (const target of targets) {
+    const maps = BASEMAPS[target.toLowerCase()];
+    if (!Array.isArray(maps)) {
+      continue;
+    }
+    layers = layers.concat(maps);
+  }
+  return layers;
 };

config.js

@@ -25,9 +25,9 @@ module.exports = {
 //      "pt-BR"
     ],
     apiCatalogPriority: null,
-    useTileLayerAsFallback: true,
+    useTileLayerAsFallback: false,
     displayGeoTiffByDefault: false,
-    buildTileUrlTemplate: ({href, asset}) => "https://tiles.rdnt.io/tiles/{z}/{x}/{y}@2x?url=" + encodeURIComponent(href),
+    buildTileUrlTemplate: null,
     stacProxyUrl: null,
     pathPrefix: "/",
     historyMode: "history",
@@ -36,11 +36,9 @@ module.exports = {
     showKeywordsInItemCards: false,
     showKeywordsInCatalogCards: false,
     showThumbnailsAsAssets: false,
-    geoTiffResolution: 128,
     redirectLegacyUrls: false,
     itemsPerPage: 12,
     defaultThumbnailSize: null,
-    maxPreviewsOnMap: 50,
     crossOriginMedia: null,
     requestHeaders: {},
     requestQueryParameters: {},

config.schema.json

@@ -152,12 +152,6 @@
         "boolean"
       ]
     },
-    "geoTiffResolution": {
-      "type": [
-        "integer"
-      ],
-      "minimum": 1
-    },
     "redirectLegacyUrls": {
       "type": [
         "boolean"
@@ -182,12 +176,6 @@
         ]
       }
     },
-    "maxPreviewsOnMap": {
-      "type": [
-        "integer"
-      ],
-      "minimum": 1
-    },
     "crossOriginMedia": {
       "type": [
         "string",

docs/options.md

@@ -35,7 +35,6 @@ The following ways to set config options are possible:
   - [displayGeoTiffByDefault](#displaygeotiffbydefault)
   - [redirectLegacyUrls](#redirectlegacyurls)
   - [itemsPerPage](#itemsperpage)
-  - [maxPreviewsOnMap](#maxpreviewsonmap)
   - [cardViewMode](#cardviewmode)
   - [cardViewSort](#cardviewsort)
   - [showKeywordsInItemCards](#showkeywordsinitemcards)
@@ -237,10 +236,6 @@ If you are updating from on old version of STAC Browser, you can set this option
 
 The number of items requested and shown per page by default. Only applies to APIs that support the `limit` query parameter.
 
-## maxPreviewsOnMap
-
-The maximum number of previews (thumbnails or overviews) of items that will be shown on the map when on Catalog or Collection pages.
-
 ## cardViewMode
 
 The default view mode for lists of catalogs/collections. Either `"list"` or `"cards"` (default).