diff --git a/src/components/styles/aperture-layer.css b/src/components/styles/aperture-layer.css index 5104873..2ee24c0 100644 --- a/src/components/styles/aperture-layer.css +++ b/src/components/styles/aperture-layer.css @@ -2,5 +2,5 @@ position: absolute; top: 128px; left: 9px; - z-index: 400; + z-index: 1000; } diff --git a/src/components/styles/loading-overlay.css b/src/components/styles/loading-overlay.css index 78a6308..8082018 100644 --- a/src/components/styles/loading-overlay.css +++ b/src/components/styles/loading-overlay.css @@ -1,13 +1,13 @@ .loading-overlay { position: absolute; - height: 100%; - width: 100%; + top: 50%; + right: 50%; z-index: 500; display: flex; justify-content: center; align-items: center; - opacity: 0.4; - background-color: white; + pointer-events: all; + background-color: transparent; } .loaded { diff --git a/src/configs/mapSettings.ts b/src/configs/mapSettings.ts index 2e6036d..92a7beb 100644 --- a/src/configs/mapSettings.ts +++ b/src/configs/mapSettings.ts @@ -8,7 +8,6 @@ export const SERVICE_URL: string = const MERCATOR_MAX_LAT = 85.0511287798066; -export const CAR_BBOX = [-180, -90, 180, 90]; export const MERCATOR_BBOX = [-180, -MERCATOR_MAX_LAT, 180, MERCATOR_MAX_LAT]; export const DEFAULT_INTERNAL_MAP_SETTINGS = { @@ -24,29 +23,42 @@ export const EXTERNAL_DETAILS_ID = 'external-comparison-maps'; export const EXTERNAL_BASELAYERS: ExternalBaselayer[] = [ { - layer_id: 'external-unwise-neo6', - name: 'Legacy Survey | unWISE neo6', + layer_id: 'external-legacy-dr9', + name: 'Legacy Survey | DR9', projection: 'EPSG:3857', - url: 'https://s3.us-west-2.amazonaws.com/unwise-neo6.legacysurvey.org/{z}/{x}/{y}.jpg', + url: 'https://{a-d}.legacysurvey.org/viewer/ls-dr9-mid/1/{z}/{x}/{y}.jpg', extent: transformExtent( [-180, -MERCATOR_MAX_LAT, 180, MERCATOR_MAX_LAT], 'EPSG:4326', 'EPSG:3857' ), - maxZoom: 10, + maxZoom: 16, disabledState: (isFlipped: boolean) => !isFlipped, }, { - layer_id: 'external-unwise-neo4', - name: 'Legacy Survey | unWISE neo4', + layer_id: 'external-unwise-neo11', + name: 'Legacy Survey | unWISE neo11', projection: 'EPSG:3857', - url: 'https://imagine.legacysurvey.org/static/tiles/unwise-neo4/1/{z}/{x}/{y}.jpg', + url: 'https://{a-d}.legacysurvey.org/viewer/unwise-neo11/1/{z}/{x}/{y}.jpg', extent: transformExtent( [-180, -MERCATOR_MAX_LAT, 180, MERCATOR_MAX_LAT], 'EPSG:4326', 'EPSG:3857' ), - maxZoom: 8, + maxZoom: 16, + disabledState: (isFlipped: boolean) => !isFlipped, + }, + { + layer_id: 'external-legacy-vlass', + name: 'Legacy Survey | VLASS 1.2', + projection: 'EPSG:3857', + url: 'https://{a-d}.legacysurvey.org/viewer/vlass1.2/1/{z}/{x}/{y}.jpg', + extent: transformExtent( + [-180, -MERCATOR_MAX_LAT, 180, MERCATOR_MAX_LAT], + 'EPSG:4326', + 'EPSG:3857' + ), + maxZoom: 16, disabledState: (isFlipped: boolean) => !isFlipped, }, ]; diff --git a/src/hooks/useTileLoading.ts b/src/hooks/useTileLoading.ts index bacae55..25baed8 100644 --- a/src/hooks/useTileLoading.ts +++ b/src/hooks/useTileLoading.ts @@ -12,6 +12,13 @@ export function useTileLoading(mapRef: React.RefObject) { let pendingTiles = 0; + function onMoveStart() { + pendingTiles = 0; + setIsLoadingTiles(false); + } + + map.on('movestart', onMoveStart); + function onLoadStart() { pendingTiles++; setIsLoadingTiles(true); @@ -58,6 +65,7 @@ export function useTileLoading(mapRef: React.RefObject) { }); return () => { + map.un('movestart', onMoveStart); map.getLayers().forEach((layer) => { if (layer instanceof TileLayer) unbindSource(layer as TileLayer); }); diff --git a/src/index.css b/src/index.css index c4f60c0..b7cbba4 100644 --- a/src/index.css +++ b/src/index.css @@ -43,6 +43,7 @@ body { .ol-zoom { font-size: 1.5em; + z-index: 1000; } .scale-control {