@opengeoweb/core 12.13.0 → 13.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/index.esm.js +100 -140
- package/package.json +12 -12
- package/src/lib/components/EDR/EDRLayerSymbols.stories.d.ts +15 -0
- package/src/lib/components/LayerManager/LayerContainerRow/LayerRow/RenderLayers/RenderEDRLayers.d.ts +4 -2
- package/src/lib/components/MapViewConnect/olMapUtils.d.ts +1 -1
- package/src/lib/components/TimeSliderConnect/TimeSliderConnect.d.ts +1 -1
- package/src/lib/components/TimeSliderConnect/TimeSliderLegendConnect.d.ts +1 -1
- package/src/lib/components/TimeSliderConnect/timesliderUtils.d.ts +1 -1
package/README.md
CHANGED
|
@@ -9,7 +9,7 @@ This library was generated with [Nx](https://nx.dev).
|
|
|
9
9
|
## Installation
|
|
10
10
|
|
|
11
11
|
```
|
|
12
|
-
npm install @opengeoweb/core @opengeoweb/store @opengeoweb/
|
|
12
|
+
npm install @opengeoweb/core @opengeoweb/store @opengeoweb/time-slider
|
|
13
13
|
```
|
|
14
14
|
|
|
15
15
|
## Use
|
|
@@ -25,7 +25,7 @@ import {
|
|
|
25
25
|
CoreThemeStoreProvider,
|
|
26
26
|
} from '@opengeoweb/core';
|
|
27
27
|
import { storeMiddlewares, storeReducerMap } from '@opengeoweb/store';
|
|
28
|
-
import { TimeSliderConnect } from '@opengeoweb/
|
|
28
|
+
import { TimeSliderConnect } from '@opengeoweb/time-slider';
|
|
29
29
|
import { configureStore } from '@reduxjs/toolkit';
|
|
30
30
|
|
|
31
31
|
const store = configureStore({
|
package/index.esm.js
CHANGED
|
@@ -6,8 +6,8 @@ import { safelyInitI18nForTestsAndStories, sharedTranslations, SHARED_NAMESPACE,
|
|
|
6
6
|
import { CollapseSmall, CollapseMedium, CollapseLarge, CollapseWindow, ExpandWindow, LayersAdd, CloudLoading, ColumnCollapsed, ColumnCollapse, Copy, None, FastForward, AutoUpdateActive, Both, Delete, Visibility, VisibilityOff, DragHandle as DragHandle$1, Cached, Add, MapAdd, WorldMapProjection, Overlayers, Layers, ExitDomain, Info, Search, Exclamation, MyLocation, Close, ThemeWrapper, lightTheme, FlagBritain, FlagNetherlands, FlagFinland, FlagNorway } from '@opengeoweb/theme';
|
|
7
7
|
import i18n from 'i18next';
|
|
8
8
|
import { useTranslation, I18nextProvider } from 'react-i18next';
|
|
9
|
-
import {
|
|
10
|
-
import { webmapReactTranslations, WEBMAP_REACT_NAMESPACE, webmapTranslations, WEBMAP_NAMESPACE, LayerInfoButton, LayerInfoDialog, MapControlButton, MapDimensionSelect, dimensionConfig, DimensionSelectDialog, DimensionSelectButton, LegendDialog, LegendButton, MapContext, emptyGeoJSON, MapFeatureClass, setMapCenter, OpenLayersFeatureLayer, OpenLayersMapDraw, getIsInsideAcceptanceTime, OpenLayersLayer, useSetIntervalWhenVisible, openLayersGetMapImageStore, TimeContext, OpenLayersMapView, WMSLayer, genericOpenLayersFeatureStyle, OpenLayersGetFeatureInfo, MapControls, OpenLayersZoomControl, getLayerUpdateInfo, publicLayers } from '@opengeoweb/webmap-react';
|
|
9
|
+
import { TIME_SLIDER_NAMESPACE, timesliderTranslations, defaultTimeSpan, SpeedButton, TimeStepButton, AnimationLengthButton, AnimationLength, TimeSpanButton, secondsPerPxFromCanvasWidth, getNewCenterOfFixedPointZoom, OptionsMenuButton, PlayButton, defaultTimeStep, BackwardForwardStepButton, AutoUpdateButton, NowButton, handleSetNowEvent, TimeSliderButtons, TimeSliderCurrentTimeBox, TimeSliderLegend, onsetNewDateDebounced, defaultSecondsPerPx, moveSelectedTimePx, TimeSlider, getFilteredTime, ControlButtons, OptionsMenu, TimeSliderClock } from '@opengeoweb/time-slider';
|
|
10
|
+
import { webmapReactTranslations, WEBMAP_REACT_NAMESPACE, webmapTranslations, WEBMAP_NAMESPACE, LayerInfoButton, LayerInfoDialog, MapControlButton, MapDimensionSelect, dimensionConfig, DimensionSelectDialog, DimensionSelectButton, LegendDialog, LegendButton, MapContext, emptyGeoJSON, MapFeatureClass, setMapCenter, OpenLayersFeatureLayer, OpenLayersMapDraw, makeTimeList, getIsInsideAcceptanceTime, OpenLayersLayer, useSetIntervalWhenVisible, openLayersGetMapImageStore, TimeContext, OpenLayersMapView, WMSLayer, genericOpenLayersFeatureStyle, OpenLayersGetFeatureInfo, MapControls, OpenLayersZoomControl, getLayerUpdateInfo, publicLayers } from '@opengeoweb/webmap-react';
|
|
11
11
|
import { useDispatch, useSelector, connect, useStore, Provider } from 'react-redux';
|
|
12
12
|
import { ReactSortable } from 'react-sortablejs';
|
|
13
13
|
import Sortable from 'sortablejs';
|
|
@@ -76,7 +76,7 @@ var en = {
|
|
|
76
76
|
"layermanager-header-button-large": "large",
|
|
77
77
|
"layermanager-header-button-dock": "Dock",
|
|
78
78
|
"layermanager-header-button-undock": "Undock",
|
|
79
|
-
"layermanager-EDR
|
|
79
|
+
"layermanager-EDR": "EDR: ",
|
|
80
80
|
"projection-title": "Projection",
|
|
81
81
|
"wms-loader-description": "Please enter a wms server, or select one from the list.",
|
|
82
82
|
"wms-loader-no-data": "No data",
|
|
@@ -699,11 +699,11 @@ var initCoreReactI18n = function initCoreReactI18n() {
|
|
|
699
699
|
ns: SHARED_NAMESPACE,
|
|
700
700
|
translations: sharedTranslations
|
|
701
701
|
}, {
|
|
702
|
-
ns:
|
|
702
|
+
ns: TIME_SLIDER_NAMESPACE,
|
|
703
703
|
translations: timesliderTranslations
|
|
704
704
|
}]);
|
|
705
705
|
};
|
|
706
|
-
var ns = [CORE_NAMESPACE,
|
|
706
|
+
var ns = [CORE_NAMESPACE, TIME_SLIDER_NAMESPACE];
|
|
707
707
|
var useCoreTranslation = function useCoreTranslation() {
|
|
708
708
|
return useTranslation(ns);
|
|
709
709
|
};
|
|
@@ -2461,7 +2461,7 @@ var Accordion = function Accordion(_ref0) {
|
|
|
2461
2461
|
isEDRLayer = _ref0$isEDRLayer === void 0 ? false : _ref0$isEDRLayer;
|
|
2462
2462
|
var _useCoreTranslation3 = useCoreTranslation(),
|
|
2463
2463
|
t = _useCoreTranslation3.t;
|
|
2464
|
-
var displayLayerName = isEDRLayer
|
|
2464
|
+
var displayLayerName = isEDRLayer ? t('layermanager-EDR') + layerName : layerName;
|
|
2465
2465
|
return jsx(CustomAccordion, {
|
|
2466
2466
|
className: "medium-layermanager",
|
|
2467
2467
|
defaultExpanded: false,
|
|
@@ -2832,10 +2832,12 @@ var getRenderEDRLayersValues = function getRenderEDRLayersValues(selectedParams,
|
|
|
2832
2832
|
};
|
|
2833
2833
|
};
|
|
2834
2834
|
var RenderEDRLayers = function RenderEDRLayers(_ref) {
|
|
2835
|
-
var
|
|
2835
|
+
var onChangeLayerOptions = _ref.onChangeLayerOptions,
|
|
2836
2836
|
selectedParams = _ref.selectedParams,
|
|
2837
2837
|
_ref$layers = _ref.layers,
|
|
2838
2838
|
layers = _ref$layers === void 0 ? [] : _ref$layers,
|
|
2839
|
+
layerName = _ref.layerName,
|
|
2840
|
+
collectionId = _ref.collectionId,
|
|
2839
2841
|
_ref$isEnabled = _ref.isEnabled,
|
|
2840
2842
|
isEnabled = _ref$isEnabled === void 0 ? true : _ref$isEnabled,
|
|
2841
2843
|
tooltipPrefix = _ref.tooltipPrefix,
|
|
@@ -2849,10 +2851,13 @@ var RenderEDRLayers = function RenderEDRLayers(_ref) {
|
|
|
2849
2851
|
var selectLayer = function selectLayer(event) {
|
|
2850
2852
|
event.stopPropagation();
|
|
2851
2853
|
// Ensure after deselecting all, the empty value gets removed
|
|
2852
|
-
var
|
|
2854
|
+
var parameterNames = event.target.value.filter(function (param) {
|
|
2853
2855
|
return param !== '';
|
|
2854
2856
|
});
|
|
2855
|
-
|
|
2857
|
+
onChangeLayerOptions({
|
|
2858
|
+
collectionId: collectionId,
|
|
2859
|
+
parameterNames: parameterNames
|
|
2860
|
+
});
|
|
2856
2861
|
};
|
|
2857
2862
|
var _getRenderEDRLayersVa = getRenderEDRLayersValues(selectedParams, layers),
|
|
2858
2863
|
currentValues = _getRenderEDRLayersVa.currentValues,
|
|
@@ -2862,7 +2867,7 @@ var RenderEDRLayers = function RenderEDRLayers(_ref) {
|
|
|
2862
2867
|
value: layer.name
|
|
2863
2868
|
};
|
|
2864
2869
|
});
|
|
2865
|
-
var
|
|
2870
|
+
var edrText = t('layermanager-EDR');
|
|
2866
2871
|
var tooltipNames = currentValues.map(function (value) {
|
|
2867
2872
|
var layer = extendedLayers.find(function (layer) {
|
|
2868
2873
|
return value === layer.name;
|
|
@@ -2886,14 +2891,8 @@ var RenderEDRLayers = function RenderEDRLayers(_ref) {
|
|
|
2886
2891
|
onChange: selectLayer,
|
|
2887
2892
|
skipLocalStyling: skipLocalStyling,
|
|
2888
2893
|
multiple: true,
|
|
2889
|
-
renderValue: function renderValue(
|
|
2890
|
-
|
|
2891
|
-
var layer = extendedLayers.find(function (layer) {
|
|
2892
|
-
return layer.name === currentValues[0];
|
|
2893
|
-
});
|
|
2894
|
-
return (layer == null ? void 0 : layer.title) || (layer == null ? void 0 : layer.name) || 'Param';
|
|
2895
|
-
}
|
|
2896
|
-
return multiParamText;
|
|
2894
|
+
renderValue: function renderValue() {
|
|
2895
|
+
return edrText + layerName;
|
|
2897
2896
|
},
|
|
2898
2897
|
children: [jsx(MenuItem, {
|
|
2899
2898
|
disabled: true,
|
|
@@ -2927,6 +2926,9 @@ var RenderLayersConnect = function RenderLayersConnect(_ref) {
|
|
|
2927
2926
|
var layerName = useSelector(function (store) {
|
|
2928
2927
|
return layerSelectors.getLayerName(store, layerId);
|
|
2929
2928
|
});
|
|
2929
|
+
var layerDisplayName = useSelector(function (store) {
|
|
2930
|
+
return layerSelectors.getLayerDisplayName(store, layerId);
|
|
2931
|
+
});
|
|
2930
2932
|
var layerType = useSelector(function (store) {
|
|
2931
2933
|
return layerSelectors.getLayerType(store, layerId);
|
|
2932
2934
|
});
|
|
@@ -2939,6 +2941,9 @@ var RenderLayersConnect = function RenderLayersConnect(_ref) {
|
|
|
2939
2941
|
var service = useSelector(function (store) {
|
|
2940
2942
|
return serviceSelectors.getServiceByUrl(store, layerService);
|
|
2941
2943
|
});
|
|
2944
|
+
var layerOptions = useSelector(function (store) {
|
|
2945
|
+
return layerSelectors.getLayerOptions(store, layerId);
|
|
2946
|
+
});
|
|
2942
2947
|
var serviceSetLayers = React.useCallback(function (payload) {
|
|
2943
2948
|
dispatch(serviceActions.serviceSetLayers(payload));
|
|
2944
2949
|
}, [dispatch]);
|
|
@@ -2997,15 +3002,29 @@ var RenderLayersConnect = function RenderLayersConnect(_ref) {
|
|
|
2997
3002
|
origin: layerTypes.LayerActionOrigin.layerManager
|
|
2998
3003
|
}));
|
|
2999
3004
|
}, [dispatch, mapId]);
|
|
3000
|
-
|
|
3001
|
-
var
|
|
3005
|
+
var layerChangeOptions = React.useCallback(function (_ref4) {
|
|
3006
|
+
var layerId = _ref4.layerId,
|
|
3007
|
+
options = _ref4.options;
|
|
3008
|
+
return dispatch(layerActions.layerChangeOptions({
|
|
3009
|
+
layerId: layerId,
|
|
3010
|
+
options: options,
|
|
3011
|
+
mapId: mapId,
|
|
3012
|
+
origin: layerTypes.LayerActionOrigin.layerManager
|
|
3013
|
+
}));
|
|
3014
|
+
}, [dispatch, mapId]);
|
|
3015
|
+
if (layerType === LayerType.edrFeatureLayer) {
|
|
3016
|
+
var _layerOptions$paramet;
|
|
3017
|
+
var selectedParams = (_layerOptions$paramet = layerOptions == null ? void 0 : layerOptions.parameterNames) != null ? _layerOptions$paramet : [];
|
|
3018
|
+
var collectionId = (layerOptions == null ? void 0 : layerOptions.collectionId) || '';
|
|
3002
3019
|
return jsx(RenderEDRLayers, {
|
|
3003
3020
|
layers: layers,
|
|
3021
|
+
layerName: layerDisplayName,
|
|
3022
|
+
collectionId: collectionId,
|
|
3004
3023
|
selectedParams: selectedParams,
|
|
3005
|
-
|
|
3006
|
-
|
|
3024
|
+
onChangeLayerOptions: function onChangeLayerOptions(options) {
|
|
3025
|
+
layerChangeOptions({
|
|
3007
3026
|
layerId: layerId,
|
|
3008
|
-
|
|
3027
|
+
options: options
|
|
3009
3028
|
});
|
|
3010
3029
|
},
|
|
3011
3030
|
isEnabled: isLayerEnabled,
|
|
@@ -3303,24 +3322,11 @@ var MissingDataConnect = function MissingDataConnect(_ref) {
|
|
|
3303
3322
|
var layerIsInsideAcceptanceTime = useSelector(function (store) {
|
|
3304
3323
|
return layerSelectors.getLayerIsInsideAcceptanceTime(store, layerId, mapId);
|
|
3305
3324
|
});
|
|
3306
|
-
var
|
|
3307
|
-
return layerSelectors.
|
|
3308
|
-
});
|
|
3309
|
-
var layerType = useSelector(function (store) {
|
|
3310
|
-
return layerSelectors.getLayerType(store, layerId);
|
|
3325
|
+
var isLayerMissing = useSelector(function (store) {
|
|
3326
|
+
return layerSelectors.getIsLayerMissing(store, layerId);
|
|
3311
3327
|
});
|
|
3312
|
-
var layerService = useSelector(function (store) {
|
|
3313
|
-
return layerSelectors.getLayerService(store, layerId);
|
|
3314
|
-
});
|
|
3315
|
-
var serviceLayer = useSelector(function (store) {
|
|
3316
|
-
return serviceSelectors.getLayerFromService(store, layerService, layerName, layerType === LayerType.edrLayer);
|
|
3317
|
-
});
|
|
3318
|
-
var layerStatus = useSelector(function (store) {
|
|
3319
|
-
return layerSelectors.getLayerStatus(store, layerId);
|
|
3320
|
-
});
|
|
3321
|
-
var layerIsMissingOnServer = !serviceLayer || layerStatus === layerTypes.LayerStatus.error;
|
|
3322
3328
|
return jsx(MissingData, {
|
|
3323
|
-
layerIsInsideAcceptanceTime:
|
|
3329
|
+
layerIsInsideAcceptanceTime: isLayerMissing ? 'outside' : layerIsInsideAcceptanceTime
|
|
3324
3330
|
});
|
|
3325
3331
|
};
|
|
3326
3332
|
|
|
@@ -3445,45 +3451,32 @@ var LayerRowConnect = /*#__PURE__*/React.memo(function (_ref) {
|
|
|
3445
3451
|
var layerName = useSelector(function (store) {
|
|
3446
3452
|
return layerSelectors.getLayerName(store, layerId);
|
|
3447
3453
|
});
|
|
3454
|
+
var layerDisplayName = useSelector(function (store) {
|
|
3455
|
+
return layerSelectors.getLayerDisplayName(store, layerId);
|
|
3456
|
+
});
|
|
3448
3457
|
var layerType = useSelector(function (store) {
|
|
3449
3458
|
return layerSelectors.getLayerType(store, layerId);
|
|
3450
3459
|
});
|
|
3451
|
-
var isEDRLayer = layerType === LayerType.
|
|
3460
|
+
var isEDRLayer = layerType === LayerType.edrFeatureLayer;
|
|
3452
3461
|
var layerServiceUrl = useSelector(function (store) {
|
|
3453
3462
|
return layerSelectors.getLayerService(store, layerId);
|
|
3454
3463
|
});
|
|
3455
|
-
var
|
|
3456
|
-
return
|
|
3457
|
-
});
|
|
3458
|
-
var layerStatus = useSelector(function (store) {
|
|
3459
|
-
return layerSelectors.getLayerStatus(store, layerId);
|
|
3460
|
-
});
|
|
3461
|
-
var currentlySelectedLayer = useSelector(function (store) {
|
|
3462
|
-
return layerSelectors.getLayerByIdWithoutTimeDimension(store, layerId);
|
|
3464
|
+
var isLayerMissing = useSelector(function (store) {
|
|
3465
|
+
return layerSelectors.getIsLayerMissing(store, layerId);
|
|
3463
3466
|
});
|
|
3464
|
-
var layerWithAllData = useSelector(function (store) {
|
|
3465
|
-
return serviceSelectors.getLayerFromService(store, currentlySelectedLayer == null ? void 0 : currentlySelectedLayer.service, currentlySelectedLayer == null ? void 0 : currentlySelectedLayer.name);
|
|
3466
|
-
});
|
|
3467
|
-
var currentService = useSelector(function (store) {
|
|
3468
|
-
return serviceSelectors.getServiceByUrl(store, layerServiceUrl);
|
|
3469
|
-
});
|
|
3470
|
-
// Ensure that for an EDR layer, we send over the entire layerName if there are multiple params selected
|
|
3471
|
-
// If only one param selected, send over the title from the service
|
|
3472
|
-
var layerNameForEDRLayer = layerName != null && layerName.includes(',') ? layerName : serviceLayer == null ? void 0 : serviceLayer.title;
|
|
3473
|
-
var fullLayerName = isEDRLayer ? layerNameForEDRLayer : serviceLayer == null ? void 0 : serviceLayer.title;
|
|
3474
3467
|
renderCounter.count(LayerRowConnect.name);
|
|
3475
3468
|
return jsx(LayerRow, {
|
|
3476
3469
|
isEnabled: isEnabled,
|
|
3477
3470
|
mapId: mapId,
|
|
3478
3471
|
layerId: layerId,
|
|
3479
|
-
isLayerMissing:
|
|
3480
|
-
layerName:
|
|
3472
|
+
isLayerMissing: isLayerMissing,
|
|
3473
|
+
layerName: layerDisplayName,
|
|
3481
3474
|
isEDRLayer: isEDRLayer,
|
|
3482
3475
|
layerEnableLayout: jsx(EnableLayerConnect, {
|
|
3483
3476
|
layerId: layerId,
|
|
3484
3477
|
mapId: mapId,
|
|
3485
3478
|
isEnabled: isEnabled,
|
|
3486
|
-
layerName:
|
|
3479
|
+
layerName: layerDisplayName,
|
|
3487
3480
|
icon: isEnabled ? settings == null || (_settings$enableLayer = settings.enableLayer) == null ? void 0 : _settings$enableLayer.enabledIcon : settings == null || (_settings$enableLayer2 = settings.enableLayer) == null ? void 0 : _settings$enableLayer2.disabledIcon,
|
|
3488
3481
|
tooltipTitle: isEnabled ? settings == null || (_settings$enableLayer3 = settings.enableLayer) == null ? void 0 : _settings$enableLayer3.enabledTooltipTitle : settings == null || (_settings$enableLayer4 = settings.enableLayer) == null ? void 0 : _settings$enableLayer4.disabledTooltipTitle
|
|
3489
3482
|
}),
|
|
@@ -3527,10 +3520,10 @@ var LayerRowConnect = /*#__PURE__*/React.memo(function (_ref) {
|
|
|
3527
3520
|
layerId: layerId
|
|
3528
3521
|
}, settings == null ? void 0 : settings.deleteLayer)),
|
|
3529
3522
|
layerShowLayerInfoLayout: jsx(LayerInfoButtonConnect, {
|
|
3530
|
-
isLayerMissing:
|
|
3523
|
+
isLayerMissing: isLayerMissing,
|
|
3531
3524
|
mapId: mapId,
|
|
3532
|
-
serviceUrl:
|
|
3533
|
-
layerName:
|
|
3525
|
+
serviceUrl: layerServiceUrl,
|
|
3526
|
+
layerName: layerName
|
|
3534
3527
|
}),
|
|
3535
3528
|
layerMenuLayout: jsx(LayerManagerMenuButtonConnect, Object.assign({
|
|
3536
3529
|
mapId: mapId,
|
|
@@ -5720,6 +5713,11 @@ var AnimationLengthButtonConnect = function AnimationLengthButtonConnect(_ref) {
|
|
|
5720
5713
|
var animationEndTime = dateUtils.dateToIsoString(dateUtils.add(dateUtils.utc(selectedAnimationStartTime), {
|
|
5721
5714
|
minutes: length
|
|
5722
5715
|
}));
|
|
5716
|
+
dispatch(mapActions.setAnimationStartTime({
|
|
5717
|
+
mapId: mapId,
|
|
5718
|
+
animationStartTime: selectedAnimationStartTime || dateUtils.dateToIsoString(dateUtils.utc()),
|
|
5719
|
+
origin: mapEnums.MapActionOrigin.map
|
|
5720
|
+
}));
|
|
5723
5721
|
dispatch(mapActions.setAnimationEndTime({
|
|
5724
5722
|
mapId: mapId,
|
|
5725
5723
|
animationEndTime: animationEndTime || dateUtils.dateToIsoString(dateUtils.utc()),
|
|
@@ -5787,10 +5785,6 @@ var TimeSpanButtonConnect = function TimeSpanButtonConnect(_ref) {
|
|
|
5787
5785
|
var newSecondsPerPx = secondsPerPxFromCanvasWidth(timeSliderWidth, spanInSeconds);
|
|
5788
5786
|
var newCenterTime = getNewCenterOfFixedPointZoom(selectedTime, secondsPerPx, newSecondsPerPx, centerTime);
|
|
5789
5787
|
if (spanInSeconds !== undefined && newCenterTime !== undefined && newSecondsPerPx !== undefined) {
|
|
5790
|
-
dispatch(mapActions.setTimeSliderSecondsPerPx({
|
|
5791
|
-
mapId: mapId,
|
|
5792
|
-
timeSliderSecondsPerPx: newSecondsPerPx
|
|
5793
|
-
}));
|
|
5794
5788
|
dispatch(mapActions.setTimeSliderSpan({
|
|
5795
5789
|
mapId: mapId,
|
|
5796
5790
|
timeSliderSpan: spanInSeconds,
|
|
@@ -5960,7 +5954,9 @@ var NowButtonConnect = function NowButtonConnect(_ref) {
|
|
|
5960
5954
|
dispatch(genericActions.setTime({
|
|
5961
5955
|
sourceId: sourceId,
|
|
5962
5956
|
origin: 'NowButtonConnect, 140',
|
|
5963
|
-
value:
|
|
5957
|
+
value: {
|
|
5958
|
+
currentTime: handleDateUtilsISOString(newDate)
|
|
5959
|
+
}
|
|
5964
5960
|
}));
|
|
5965
5961
|
};
|
|
5966
5962
|
var onSetCenterTime = function onSetCenterTime(newTime) {
|
|
@@ -6165,16 +6161,6 @@ var TimeSliderLegendConnect = function TimeSliderLegendConnect(_ref) {
|
|
|
6165
6161
|
timeSliderCenterTime: newTime
|
|
6166
6162
|
}));
|
|
6167
6163
|
},
|
|
6168
|
-
onZoom: function onZoom(newSecondsPerPx, newCenterTime) {
|
|
6169
|
-
dispatch(mapActions.setTimeSliderSecondsPerPx({
|
|
6170
|
-
mapId: mapId,
|
|
6171
|
-
timeSliderSecondsPerPx: newSecondsPerPx
|
|
6172
|
-
}));
|
|
6173
|
-
dispatch(mapActions.setTimeSliderCenterTime({
|
|
6174
|
-
mapId: mapId,
|
|
6175
|
-
timeSliderCenterTime: newCenterTime
|
|
6176
|
-
}));
|
|
6177
|
-
},
|
|
6178
6164
|
onSetAnimationStartTime: function onSetAnimationStartTime(animationStartTime) {
|
|
6179
6165
|
dispatch(mapActions.setAnimationStartTime({
|
|
6180
6166
|
mapId: mapId,
|
|
@@ -6195,14 +6181,6 @@ var TimeSliderLegendConnect = function TimeSliderLegendConnect(_ref) {
|
|
|
6195
6181
|
mapId: mapId,
|
|
6196
6182
|
timeSliderWidth: newWidth
|
|
6197
6183
|
}));
|
|
6198
|
-
var spanInSeconds = secondsPerPx * storeWidth;
|
|
6199
|
-
var newSecondsPerPx = secondsPerPxFromCanvasWidth(newWidth, spanInSeconds);
|
|
6200
|
-
if (newSecondsPerPx !== undefined) {
|
|
6201
|
-
dispatch(mapActions.setTimeSliderSecondsPerPx({
|
|
6202
|
-
mapId: mapId,
|
|
6203
|
-
timeSliderSecondsPerPx: newSecondsPerPx
|
|
6204
|
-
}));
|
|
6205
|
-
}
|
|
6206
6184
|
}
|
|
6207
6185
|
},
|
|
6208
6186
|
adjustSelectedTimeOnWheel: adjustSelectedTimeOnWheel
|
|
@@ -6259,14 +6237,12 @@ var useUpdateTimeSpan = function useUpdateTimeSpan(mapId, myOnSetTimeSliderSpan)
|
|
|
6259
6237
|
var isAnimating = useSelector(function (store) {
|
|
6260
6238
|
return mapSelectors.isAnimating(store, mapId);
|
|
6261
6239
|
});
|
|
6262
|
-
var updateTimeSliderSpan = function
|
|
6263
|
-
|
|
6264
|
-
|
|
6265
|
-
|
|
6266
|
-
myOnSetTimeSliderSpan(spanInSeconds, newCenterTime, newSecondsPerPx);
|
|
6267
|
-
}
|
|
6240
|
+
var updateTimeSliderSpan = React.useCallback(function (spanInSeconds, newCenterTime) {
|
|
6241
|
+
// Do not dispatch actions if values are the same
|
|
6242
|
+
if (spanInSeconds !== undefined && newCenterTime !== undefined && (currentTimeSpan !== spanInSeconds || centerTime !== newCenterTime)) {
|
|
6243
|
+
myOnSetTimeSliderSpan(spanInSeconds, newCenterTime);
|
|
6268
6244
|
}
|
|
6269
|
-
};
|
|
6245
|
+
}, [centerTime, currentTimeSpan, myOnSetTimeSliderSpan]);
|
|
6270
6246
|
React.useEffect(function () {
|
|
6271
6247
|
if (isTimeSpanAuto && autoTimeStepLayerId && activeLayerTimeDimension && !isAnimating) {
|
|
6272
6248
|
var _getTimeBounds = getTimeBounds([activeLayerTimeDimension]),
|
|
@@ -6275,14 +6251,12 @@ var useUpdateTimeSpan = function useUpdateTimeSpan(mapId, myOnSetTimeSliderSpan)
|
|
|
6275
6251
|
var minimumStartTime = selectedTime - 24 * 3600;
|
|
6276
6252
|
var slicedStartTime = startTime < minimumStartTime ? minimumStartTime : startTime;
|
|
6277
6253
|
var spanInSeconds = endTime - slicedStartTime;
|
|
6278
|
-
var newSecondsPerPx = secondsPerPxFromCanvasWidth(timeSliderWidth, spanInSeconds);
|
|
6279
6254
|
var newCenterTime = (slicedStartTime + endTime) / 2;
|
|
6280
|
-
updateTimeSliderSpan(spanInSeconds, newCenterTime
|
|
6255
|
+
updateTimeSliderSpan(spanInSeconds, newCenterTime);
|
|
6281
6256
|
} else {
|
|
6282
6257
|
var _spanInSeconds = currentTimeSpan || defaultTimeSpan;
|
|
6283
|
-
var
|
|
6284
|
-
|
|
6285
|
-
updateTimeSliderSpan(_spanInSeconds, _newCenterTime, _newSecondsPerPx);
|
|
6258
|
+
var _newCenterTime = getNewCenterOfFixedPointZoom(selectedTime, secondsPerPx, secondsPerPxFromCanvasWidth(timeSliderWidth, _spanInSeconds), centerTime);
|
|
6259
|
+
updateTimeSliderSpan(_spanInSeconds, _newCenterTime);
|
|
6286
6260
|
}
|
|
6287
6261
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
6288
6262
|
}, [autoTimeStepLayerId, isTimeSpanAuto, mapId, activeLayerTimeDimension == null ? void 0 : activeLayerTimeDimension.name]);
|
|
@@ -6330,19 +6304,11 @@ var TimeSliderConnect = function TimeSliderConnect(_ref) {
|
|
|
6330
6304
|
origin: mapEnums.MapActionOrigin.map
|
|
6331
6305
|
}));
|
|
6332
6306
|
}, [dispatch, mapId]);
|
|
6333
|
-
var onSetTimeSliderSpan = React.useCallback(function (newSpan
|
|
6334
|
-
dispatch(mapActions.setTimeSliderSecondsPerPx({
|
|
6335
|
-
mapId: mapId,
|
|
6336
|
-
timeSliderSecondsPerPx: newSecondsPerPx
|
|
6337
|
-
}));
|
|
6307
|
+
var onSetTimeSliderSpan = React.useCallback(function (newSpan) {
|
|
6338
6308
|
dispatch(mapActions.setTimeSliderSpan({
|
|
6339
6309
|
mapId: mapId,
|
|
6340
6310
|
timeSliderSpan: newSpan
|
|
6341
6311
|
}));
|
|
6342
|
-
dispatch(mapActions.setTimeSliderCenterTime({
|
|
6343
|
-
mapId: mapId,
|
|
6344
|
-
timeSliderCenterTime: newCenterTime
|
|
6345
|
-
}));
|
|
6346
6312
|
}, [dispatch, mapId]);
|
|
6347
6313
|
var timeStep = useSelector(function (store) {
|
|
6348
6314
|
return mapSelectors.getMapTimeStep(store, mapId);
|
|
@@ -6384,7 +6350,9 @@ var TimeSliderConnect = function TimeSliderConnect(_ref) {
|
|
|
6384
6350
|
dispatch(genericActions.setTime({
|
|
6385
6351
|
sourceId: sourceId,
|
|
6386
6352
|
origin: 'TimeSliderConnect',
|
|
6387
|
-
value:
|
|
6353
|
+
value: {
|
|
6354
|
+
currentTime: handleDateUtilsISOString(newDate)
|
|
6355
|
+
}
|
|
6388
6356
|
}));
|
|
6389
6357
|
}, [dispatch, isAnimating, mapId, sourceId]);
|
|
6390
6358
|
// Update local state when time is updated outside of this component, e.g. during animation or syncgroups
|
|
@@ -7586,32 +7554,27 @@ var OpenLayersFeatureLayerConnect = function OpenLayersFeatureLayerConnect(_ref)
|
|
|
7586
7554
|
* Copyright 2025 - Finnish Meteorological Institute (FMI)
|
|
7587
7555
|
* Copyright 2025 - The Norwegian Meteorological Institute (MET Norway)
|
|
7588
7556
|
* */
|
|
7589
|
-
var makePrefetchTimeSpan = function makePrefetchTimeSpan(timeSliderStartCenterEndTime,
|
|
7590
|
-
var timeSliderTimeStepInS = timeSliderStartCenterEndTime.step * 60;
|
|
7591
|
-
var
|
|
7592
|
-
var
|
|
7593
|
-
|
|
7594
|
-
var prefetchEnd = isAnimating ? animationTimeEndInS : timeSliderStartCenterEndTime.end;
|
|
7595
|
-
if (!prefetchStart || !prefetchEnd) {
|
|
7557
|
+
var makePrefetchTimeSpan = function makePrefetchTimeSpan(timeSliderStartCenterEndTime, isAnimating, prefetchList) {
|
|
7558
|
+
var timeSliderTimeStepInS = timeSliderStartCenterEndTime.step * 60 * 1000;
|
|
7559
|
+
var prefetchStart = timeSliderStartCenterEndTime.start * 1000;
|
|
7560
|
+
var prefetchEnd = timeSliderStartCenterEndTime.end * 1000;
|
|
7561
|
+
if (isAnimating || !prefetchStart || !prefetchEnd) {
|
|
7596
7562
|
return {
|
|
7597
|
-
|
|
7598
|
-
|
|
7599
|
-
end: 0,
|
|
7600
|
-
step: 0
|
|
7601
|
-
},
|
|
7602
|
-
isAnimating: isAnimating
|
|
7563
|
+
isAnimating: isAnimating,
|
|
7564
|
+
prefetchList: prefetchList
|
|
7603
7565
|
};
|
|
7604
7566
|
}
|
|
7605
7567
|
var roundStart = Math.round(prefetchStart / timeSliderTimeStepInS) * timeSliderTimeStepInS;
|
|
7606
|
-
var roundEnd = Math.round(prefetchEnd / timeSliderTimeStepInS) * timeSliderTimeStepInS;
|
|
7568
|
+
var roundEnd = Math.round(prefetchEnd / timeSliderTimeStepInS) * timeSliderTimeStepInS + timeSliderTimeStepInS;
|
|
7569
|
+
var timeSpanList = makeTimeList({
|
|
7570
|
+
start: roundStart,
|
|
7571
|
+
end: roundEnd,
|
|
7572
|
+
step: timeSliderTimeStepInS
|
|
7573
|
+
});
|
|
7607
7574
|
// eslint-disable-next-line no-constant-condition
|
|
7608
7575
|
return {
|
|
7609
|
-
|
|
7610
|
-
|
|
7611
|
-
end: roundEnd * 1000,
|
|
7612
|
-
step: timeSliderTimeStepInS * 1000
|
|
7613
|
-
},
|
|
7614
|
-
isAnimating: isAnimating
|
|
7576
|
+
isAnimating: isAnimating,
|
|
7577
|
+
prefetchList: timeSpanList
|
|
7615
7578
|
};
|
|
7616
7579
|
};
|
|
7617
7580
|
var makeLayerInfoPayload = function makeLayerInfoPayload(payload, mapDimensions, mapId) {
|
|
@@ -7820,7 +7783,7 @@ var useGetOpenLayersView = function useGetOpenLayersView(mapId, store) {
|
|
|
7820
7783
|
* @param {object} [controls.zoomControls] **optional** controls: object - toggle the map controls, zoomControls defaults to true
|
|
7821
7784
|
*/
|
|
7822
7785
|
var OlMapViewConnect = function OlMapViewConnect(_ref) {
|
|
7823
|
-
var _featureProperties$va;
|
|
7786
|
+
var _useSelector2, _featureProperties$va;
|
|
7824
7787
|
var mapId = _ref.mapId,
|
|
7825
7788
|
children = _ref.children,
|
|
7826
7789
|
_ref$controls = _ref.controls,
|
|
@@ -7917,16 +7880,10 @@ var OlMapViewConnect = function OlMapViewConnect(_ref) {
|
|
|
7917
7880
|
var timeSliderStartCenterEndTime = useSelector(function (store) {
|
|
7918
7881
|
return mapSelectors.getMapTimeSliderStartCenterEndAndStep(store, mapId);
|
|
7919
7882
|
});
|
|
7920
|
-
var animationStartTime = useSelector(function (store) {
|
|
7921
|
-
return mapSelectors.getAnimationStartTime(store, mapId);
|
|
7922
|
-
});
|
|
7923
|
-
var animationEndTime = useSelector(function (store) {
|
|
7924
|
-
return mapSelectors.getAnimationEndTime(store, mapId);
|
|
7925
|
-
});
|
|
7926
7883
|
var isTimeScrollingEnabled = useSelector(syncGroupsSelectors.isTimeScrollingEnabled);
|
|
7927
|
-
var isAnimating = useSelector(function (store) {
|
|
7928
|
-
return mapSelectors.
|
|
7929
|
-
});
|
|
7884
|
+
var isAnimating = (_useSelector2 = useSelector(function (store) {
|
|
7885
|
+
return mapSelectors.linkedMapAnimationInfo(store, mapId);
|
|
7886
|
+
})) == null ? void 0 : _useSelector2.isAnimating;
|
|
7930
7887
|
var dispatch = useDispatch();
|
|
7931
7888
|
var updateLayerInformation = React.useCallback(function (payload) {
|
|
7932
7889
|
var _payload$layerDimensi, _payload$layerDimensi2;
|
|
@@ -7999,6 +7956,9 @@ var OlMapViewConnect = function OlMapViewConnect(_ref) {
|
|
|
7999
7956
|
var isActiveWindowId = useSelector(function (store) {
|
|
8000
7957
|
return uiSelectors.getIsActiveWindowId(store, mapId);
|
|
8001
7958
|
});
|
|
7959
|
+
var animationList = useSelector(function (store) {
|
|
7960
|
+
return mapSelectors.getAnimationListAsEpochTimes(store, mapId);
|
|
7961
|
+
});
|
|
8002
7962
|
React.useEffect(function () {
|
|
8003
7963
|
registerMap({
|
|
8004
7964
|
mapId: mapId
|
|
@@ -8085,7 +8045,7 @@ var OlMapViewConnect = function OlMapViewConnect(_ref) {
|
|
|
8085
8045
|
}
|
|
8086
8046
|
}));
|
|
8087
8047
|
}, [hoverId, previousHoverId, hoverLinkedFeature, featureProperties, linkedPanelId, dispatch]);
|
|
8088
|
-
var prefetchTimespan = makePrefetchTimeSpan(timeSliderStartCenterEndTime,
|
|
8048
|
+
var prefetchTimespan = makePrefetchTimeSpan(timeSliderStartCenterEndTime, isAnimating, animationList);
|
|
8089
8049
|
var layerIds = mapLayerIds.join();
|
|
8090
8050
|
var refetchLayers = React.useCallback(function () {
|
|
8091
8051
|
mapLayerIds == null || mapLayerIds.forEach(/*#__PURE__*/function () {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@opengeoweb/core",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "13.0.0",
|
|
4
4
|
"description": "GeoWeb Core library for the opengeoweb project",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"repository": {
|
|
@@ -8,22 +8,22 @@
|
|
|
8
8
|
"url": "git@gitlab.com:opengeoweb/opengeoweb.git"
|
|
9
9
|
},
|
|
10
10
|
"dependencies": {
|
|
11
|
-
"@opengeoweb/shared": "
|
|
11
|
+
"@opengeoweb/shared": "13.0.0",
|
|
12
12
|
"react-redux": "^9.2.0",
|
|
13
|
-
"@opengeoweb/store": "
|
|
14
|
-
"@opengeoweb/
|
|
13
|
+
"@opengeoweb/store": "13.0.0",
|
|
14
|
+
"@opengeoweb/time-slider": "13.0.0",
|
|
15
15
|
"@reduxjs/toolkit": "^2.6.1",
|
|
16
|
-
"@opengeoweb/webmap-react": "
|
|
17
|
-
"@opengeoweb/webmap": "
|
|
18
|
-
"@opengeoweb/theme": "
|
|
16
|
+
"@opengeoweb/webmap-react": "13.0.0",
|
|
17
|
+
"@opengeoweb/webmap": "13.0.0",
|
|
18
|
+
"@opengeoweb/theme": "13.0.0",
|
|
19
19
|
"axios": "^1.7.7",
|
|
20
|
-
"@opengeoweb/layer-select": "
|
|
20
|
+
"@opengeoweb/layer-select": "13.0.0",
|
|
21
21
|
"lodash": "^4.17.21",
|
|
22
22
|
"ol": "^10.4.0",
|
|
23
23
|
"react-sortablejs": "^6.1.4",
|
|
24
24
|
"sortablejs": "^1.15.1",
|
|
25
|
-
"@mui/system": "^7.3.
|
|
26
|
-
"@opengeoweb/snackbar": "
|
|
25
|
+
"@mui/system": "^7.3.2",
|
|
26
|
+
"@opengeoweb/snackbar": "13.0.0",
|
|
27
27
|
"react-router-dom": "^6.21.0",
|
|
28
28
|
"react-draggable": "^4.4.6",
|
|
29
29
|
"i18next": "^25.0.1",
|
|
@@ -31,8 +31,8 @@
|
|
|
31
31
|
"dompurify": "^3.0.6",
|
|
32
32
|
"@mui/material": "^7.0.1",
|
|
33
33
|
"@sentry/react": "^8.34.0",
|
|
34
|
-
"@tanstack/react-query": "^5.
|
|
35
|
-
"@opengeoweb/api": "
|
|
34
|
+
"@tanstack/react-query": "^5.85.5",
|
|
35
|
+
"@opengeoweb/api": "13.0.0",
|
|
36
36
|
"@types/geojson": "^7946.0.14"
|
|
37
37
|
},
|
|
38
38
|
"peerDependencies": {
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { TimeAwareEDRLocationLayer } from '@opengeoweb/webmap-react';
|
|
3
|
+
import type { Meta } from '@storybook/react-webpack5';
|
|
4
|
+
declare const meta: Meta<typeof TimeAwareEDRLocationLayer>;
|
|
5
|
+
export default meta;
|
|
6
|
+
export declare const EDRLayerSymbols: {
|
|
7
|
+
(): React.ReactElement;
|
|
8
|
+
parameters: {
|
|
9
|
+
msw: {
|
|
10
|
+
handlers: {
|
|
11
|
+
locations: import("msw").HttpHandler[];
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
};
|
|
15
|
+
};
|
package/src/lib/components/LayerManager/LayerContainerRow/LayerRow/RenderLayers/RenderEDRLayers.d.ts
CHANGED
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { LayerProps } from '@opengeoweb/webmap';
|
|
2
|
+
import { EDRFeatureLayerOptions, LayerProps } from '@opengeoweb/webmap';
|
|
3
3
|
export interface RenderEDRLayersProps {
|
|
4
|
-
|
|
4
|
+
onChangeLayerOptions: (options: EDRFeatureLayerOptions) => void;
|
|
5
5
|
selectedParams: string[];
|
|
6
6
|
layers: LayerProps[];
|
|
7
|
+
layerName: string;
|
|
8
|
+
collectionId: string;
|
|
7
9
|
isEnabled?: boolean;
|
|
8
10
|
tooltipPrefix?: string;
|
|
9
11
|
skipLocalStyling?: boolean;
|
|
@@ -2,7 +2,7 @@ import { TimeSliderStartCenterEndTime } from '@opengeoweb/store';
|
|
|
2
2
|
import { Dimension } from '@opengeoweb/webmap';
|
|
3
3
|
import { MapLocation, OnInitializeLayerProps, TimeContextType, UpdateLayerInfoPayload } from '@opengeoweb/webmap-react';
|
|
4
4
|
import { Feature, View } from 'ol';
|
|
5
|
-
export declare const makePrefetchTimeSpan: (timeSliderStartCenterEndTime: TimeSliderStartCenterEndTime,
|
|
5
|
+
export declare const makePrefetchTimeSpan: (timeSliderStartCenterEndTime: TimeSliderStartCenterEndTime, isAnimating: boolean, prefetchList: number[]) => TimeContextType;
|
|
6
6
|
export declare const makeLayerInfoPayload: (payload: OnInitializeLayerProps, mapDimensions: Dimension[], mapId: string) => UpdateLayerInfoPayload;
|
|
7
7
|
export declare const getCenterOfLinkedFeature: (feature: Feature | undefined, srs: string) => MapLocation | null;
|
|
8
8
|
interface UseFitAndHighlightWarningFeatureOptions {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
export declare const useUpdateTimestep: (mapId: string) => void;
|
|
3
|
-
export declare const useUpdateTimeSpan: (mapId: string, myOnSetTimeSliderSpan: (newSpan: number, newCenterTime: number
|
|
3
|
+
export declare const useUpdateTimeSpan: (mapId: string, myOnSetTimeSliderSpan: (newSpan: number, newCenterTime: number) => void) => void;
|
|
4
4
|
interface TimeSliderConnectProps {
|
|
5
5
|
sourceId: string;
|
|
6
6
|
mapId: string;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
interface TimeSliderLegendConnectProps {
|
|
3
3
|
mapId: string;
|
|
4
|
-
onSetTimeSliderSpan?: (newSpan: number, newCenterTime: number
|
|
4
|
+
onSetTimeSliderSpan?: (newSpan: number, newCenterTime: number) => void;
|
|
5
5
|
unfilteredSelectedTime: number;
|
|
6
6
|
setUnfilteredSelectedTime: (unfilteredSelectedTime: number) => void;
|
|
7
7
|
mapWindowRef?: React.MutableRefObject<HTMLElement | null>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { mapTypes } from '@opengeoweb/store';
|
|
2
|
-
import { TimeBounds } from '@opengeoweb/
|
|
2
|
+
import { TimeBounds } from '@opengeoweb/time-slider';
|
|
3
3
|
/**
|
|
4
4
|
* Returns time bounds from the given dimension. If no time dimension given, current time is returned as default
|
|
5
5
|
*/
|