@bpd-library/components 1.3.2-beta.7 → 1.3.2-beta.8
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/dist/atoms/form-elements/range-slider/range-slider.d.ts +4 -1
- package/dist/atoms/form-elements/range-slider/range-slider.js +11 -4
- package/dist/atoms/form-elements/range-slider/range-slider.js.map +1 -1
- package/dist/atoms/form-elements/utilities/range-slider.js +49 -11
- package/dist/atoms/form-elements/utilities/range-slider.js.map +1 -1
- package/dist/esm/atoms/button/button.js +33 -0
- package/dist/esm/atoms/button/button.js.map +1 -0
- package/dist/esm/atoms/col/col.js +22 -0
- package/dist/esm/atoms/col/col.js.map +1 -0
- package/dist/esm/atoms/container/container.js +6 -0
- package/dist/esm/atoms/container/container.js.map +1 -0
- package/dist/esm/atoms/form-elements/range-slider/range-slider.js +21 -0
- package/dist/esm/atoms/form-elements/range-slider/range-slider.js.map +1 -0
- package/dist/esm/atoms/form-elements/utilities/range-slider.js +100 -0
- package/dist/esm/atoms/form-elements/utilities/range-slider.js.map +1 -0
- package/dist/esm/atoms/image/image.js +18 -0
- package/dist/esm/atoms/image/image.js.map +1 -0
- package/dist/esm/atoms/image/utilities/create-image-url.js +15 -0
- package/dist/esm/atoms/image/utilities/create-image-url.js.map +1 -0
- package/dist/esm/atoms/row/row.js +6 -0
- package/dist/esm/atoms/row/row.js.map +1 -0
- package/dist/esm/atoms/svg/svg.js +25 -0
- package/dist/esm/atoms/svg/svg.js.map +1 -0
- package/dist/esm/index.js +14 -0
- package/dist/esm/index.js.map +1 -0
- package/dist/esm/molecules/infobox/infobox.js +20 -0
- package/dist/esm/molecules/infobox/infobox.js.map +1 -0
- package/dist/esm/molecules/map/map.js +256 -0
- package/dist/esm/molecules/map/map.js.map +1 -0
- package/dist/esm/molecules/map/store/map/store.js +150 -0
- package/dist/esm/molecules/map/store/map/store.js.map +1 -0
- package/dist/esm/molecules/map/utilities/fit-bounds.js +4 -0
- package/dist/esm/molecules/map/utilities/fit-bounds.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/add-data.js +54 -0
- package/dist/esm/molecules/map/utilities/mapbox/add-data.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/center.js +15 -0
- package/dist/esm/molecules/map/utilities/mapbox/center.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/constants.js +5 -0
- package/dist/esm/molecules/map/utilities/mapbox/constants.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/index.js +3 -0
- package/dist/esm/molecules/map/utilities/mapbox/index.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/mapbox.js +27 -0
- package/dist/esm/molecules/map/utilities/mapbox/mapbox.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/parse-feature-properties.js +18 -0
- package/dist/esm/molecules/map/utilities/mapbox/parse-feature-properties.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/pointers/setup-pointers.js +151 -0
- package/dist/esm/molecules/map/utilities/mapbox/pointers/setup-pointers.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/feature-state.js +11 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/feature-state.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/geojson.js +10 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/geojson.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/interaction.js +34 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/interaction.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/layer.js +110 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/layer.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/raster.js +43 -0
- package/dist/esm/molecules/map/utilities/mapbox/raster.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/search/alternative-city-suggestions.js +27 -0
- package/dist/esm/molecules/map/utilities/mapbox/search/alternative-city-suggestions.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/search/search.js +174 -0
- package/dist/esm/molecules/map/utilities/mapbox/search/search.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/tooltip.js +26 -0
- package/dist/esm/molecules/map/utilities/mapbox/tooltip.js.map +1 -0
- package/dist/esm/molecules/tooltip/tooltip.js +14 -0
- package/dist/esm/molecules/tooltip/tooltip.js.map +1 -0
- package/dist/esm/node_modules/tslib/tslib.es6.js +24 -0
- package/dist/esm/node_modules/tslib/tslib.es6.js.map +1 -0
- package/dist/lib/atoms/button/button.js +31 -0
- package/dist/lib/atoms/button/button.js.map +1 -0
- package/dist/lib/atoms/button/index.js +2 -0
- package/dist/lib/atoms/button/index.js.map +1 -0
- package/dist/lib/atoms/col/col.js +19 -0
- package/dist/lib/atoms/col/col.js.map +1 -0
- package/dist/lib/atoms/container/container.js +3 -0
- package/dist/lib/atoms/container/container.js.map +1 -0
- package/dist/lib/atoms/form-elements/range-slider/range-slider.js +18 -0
- package/dist/lib/atoms/form-elements/range-slider/range-slider.js.map +1 -0
- package/dist/lib/atoms/form-elements/utilities/range-slider.js +97 -0
- package/dist/lib/atoms/form-elements/utilities/range-slider.js.map +1 -0
- package/dist/lib/atoms/image/image.js +15 -0
- package/dist/lib/atoms/image/image.js.map +1 -0
- package/dist/lib/atoms/image/index.js +2 -0
- package/dist/lib/atoms/image/index.js.map +1 -0
- package/dist/lib/atoms/image/utilities/create-image-url.js +14 -0
- package/dist/lib/atoms/image/utilities/create-image-url.js.map +1 -0
- package/dist/lib/atoms/image/utilities/detect-responsive-images.js +24 -0
- package/dist/lib/atoms/image/utilities/detect-responsive-images.js.map +1 -0
- package/dist/lib/atoms/image/utilities/image.js +86 -0
- package/dist/lib/atoms/image/utilities/image.js.map +1 -0
- package/dist/lib/atoms/image/utilities/object-fit.js +35 -0
- package/dist/lib/atoms/image/utilities/object-fit.js.map +1 -0
- package/dist/lib/atoms/row/row.js +3 -0
- package/dist/lib/atoms/row/row.js.map +1 -0
- package/dist/lib/atoms/svg/svg.js +23 -0
- package/dist/lib/atoms/svg/svg.js.map +1 -0
- package/dist/lib/index.js +12 -0
- package/dist/lib/index.js.map +1 -0
- package/dist/lib/molecules/infobox/index.js +2 -0
- package/dist/lib/molecules/infobox/index.js.map +1 -0
- package/dist/lib/molecules/infobox/infobox.js +17 -0
- package/dist/lib/molecules/infobox/infobox.js.map +1 -0
- package/dist/lib/molecules/map/hooks/use-style-loaded.js +14 -0
- package/dist/lib/molecules/map/hooks/use-style-loaded.js.map +1 -0
- package/dist/lib/molecules/map/index.js +4 -0
- package/dist/lib/molecules/map/index.js.map +1 -0
- package/dist/lib/molecules/map/map.js +256 -0
- package/dist/lib/molecules/map/map.js.map +1 -0
- package/dist/lib/molecules/map/store/map/index.js +2 -0
- package/dist/lib/molecules/map/store/map/index.js.map +1 -0
- package/dist/lib/molecules/map/store/map/store.js +147 -0
- package/dist/lib/molecules/map/store/map/store.js.map +1 -0
- package/dist/lib/molecules/map/storybook/themes.js +54 -0
- package/dist/lib/molecules/map/storybook/themes.js.map +1 -0
- package/dist/lib/molecules/map/utilities/fit-bounds.js +2 -0
- package/dist/lib/molecules/map/utilities/fit-bounds.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/add-data.js +52 -0
- package/dist/lib/molecules/map/utilities/mapbox/add-data.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/center.js +13 -0
- package/dist/lib/molecules/map/utilities/mapbox/center.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/constants.js +3 -0
- package/dist/lib/molecules/map/utilities/mapbox/constants.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/index.js +3 -0
- package/dist/lib/molecules/map/utilities/mapbox/index.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/mapbox.js +25 -0
- package/dist/lib/molecules/map/utilities/mapbox/mapbox.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/parse-feature-properties.js +16 -0
- package/dist/lib/molecules/map/utilities/mapbox/parse-feature-properties.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/pointers/setup-pointers.js +151 -0
- package/dist/lib/molecules/map/utilities/mapbox/pointers/setup-pointers.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/feature-state.js +10 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/feature-state.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/geojson.js +9 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/geojson.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/interaction.js +32 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/interaction.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/layer.js +109 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/layer.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/raster.js +42 -0
- package/dist/lib/molecules/map/utilities/mapbox/raster.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/search/alternative-city-suggestions.js +26 -0
- package/dist/lib/molecules/map/utilities/mapbox/search/alternative-city-suggestions.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/search/search.js +172 -0
- package/dist/lib/molecules/map/utilities/mapbox/search/search.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/tooltip.js +24 -0
- package/dist/lib/molecules/map/utilities/mapbox/tooltip.js.map +1 -0
- package/dist/lib/molecules/tooltip/index.js +2 -0
- package/dist/lib/molecules/tooltip/index.js.map +1 -0
- package/dist/lib/molecules/tooltip/tooltip.js +11 -0
- package/dist/lib/molecules/tooltip/tooltip.js.map +1 -0
- package/dist/molecules/map/store/map/store.d.ts +7 -1
- package/dist/molecules/map/store/map/store.js +32 -0
- package/dist/molecules/map/store/map/store.js.map +1 -1
- package/dist/types/atoms/button/button.d.ts +17 -0
- package/dist/types/atoms/button/index.d.ts +1 -0
- package/dist/types/atoms/col/col.d.ts +11 -0
- package/dist/types/atoms/container/container.d.ts +6 -0
- package/dist/types/atoms/form-elements/range-slider/range-slider.d.ts +11 -0
- package/dist/types/atoms/form-elements/utilities/range-slider.d.ts +7 -0
- package/dist/types/atoms/image/image.d.ts +14 -0
- package/dist/types/atoms/image/index.d.ts +1 -0
- package/dist/types/atoms/image/utilities/create-image-url.d.ts +6 -0
- package/dist/types/atoms/image/utilities/detect-responsive-images.d.ts +7 -0
- package/dist/types/atoms/image/utilities/image.d.ts +18 -0
- package/dist/types/atoms/image/utilities/object-fit.d.ts +7 -0
- package/dist/types/atoms/row/row.d.ts +6 -0
- package/dist/types/atoms/svg/svg.d.ts +4 -0
- package/dist/types/index.d.ts +11 -0
- package/dist/types/molecules/infobox/index.d.ts +1 -0
- package/dist/types/molecules/infobox/infobox.d.ts +7 -0
- package/dist/types/molecules/map/hooks/use-style-loaded.d.ts +2 -0
- package/dist/types/molecules/map/index.d.ts +3 -0
- package/dist/types/molecules/map/map.d.ts +2 -0
- package/dist/types/molecules/map/store/map/index.d.ts +1 -0
- package/dist/types/molecules/map/store/map/store.d.ts +60 -0
- package/dist/types/molecules/map/storybook/themes.d.ts +3 -0
- package/dist/types/molecules/map/utilities/fit-bounds.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/add-data.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/center.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/constants.d.ts +2 -0
- package/dist/types/molecules/map/utilities/mapbox/index.d.ts +2 -0
- package/dist/types/molecules/map/utilities/mapbox/mapbox.d.ts +16 -0
- package/dist/types/molecules/map/utilities/mapbox/parse-feature-properties.d.ts +6 -0
- package/dist/types/molecules/map/utilities/mapbox/pointers/setup-pointers.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/polygons/feature-state.d.ts +2 -0
- package/dist/types/molecules/map/utilities/mapbox/polygons/geojson.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/polygons/interaction.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/polygons/layer.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/raster.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/search/alternative-city-suggestions.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/search/search.d.ts +4 -0
- package/dist/types/molecules/map/utilities/mapbox/tooltip.d.ts +4 -0
- package/dist/types/molecules/tooltip/index.d.ts +1 -0
- package/dist/types/molecules/tooltip/tooltip.d.ts +7 -0
- package/package.json +4 -4
|
@@ -0,0 +1,256 @@
|
|
|
1
|
+
import { defineElement, useProp, useElement, onDidLoad } from '@atomify/hooks';
|
|
2
|
+
import { h, Fragment } from '@atomify/jsx';
|
|
3
|
+
import { detectTouch, calculateMapDataBoundingBox, expandBoundingBox, calculateMapDataCenter, getCountryBoundingBox, functionIsTrue } from '@bpd-library/utilities';
|
|
4
|
+
import MapboxLanguage from '@mapbox/mapbox-gl-language';
|
|
5
|
+
import mapboxgl from 'mapbox-gl';
|
|
6
|
+
import { Button } from '../../atoms/button/button.js';
|
|
7
|
+
import { Infobox } from '../infobox/infobox.js';
|
|
8
|
+
import { setMapInstance, mapStore, clearHover } from './store/map/store.js';
|
|
9
|
+
import mapbox from './utilities/mapbox/mapbox.js';
|
|
10
|
+
|
|
11
|
+
const DEFAULT_OPTIONS = {
|
|
12
|
+
zoomButtons: true,
|
|
13
|
+
mobileToggle: false,
|
|
14
|
+
tooltipMode: 'hover',
|
|
15
|
+
openInTab: false,
|
|
16
|
+
autoOpenUrl: true,
|
|
17
|
+
language: window.__ENVIRONMENT_DETAILS__.language || 'nl',
|
|
18
|
+
searchCountryIsoCodes: ['nl', 'de'],
|
|
19
|
+
};
|
|
20
|
+
const CONTAINER_VISIBLE = 'map--is-visible';
|
|
21
|
+
const MOBILE_TOGGLE_CLASS = 'map--mobile-toggle';
|
|
22
|
+
const MAP_HOVERING_CLASS = 'map--hovering';
|
|
23
|
+
const POINTER_FOCUS_CLASS = 'map__pointer--focus';
|
|
24
|
+
const Map = () => {
|
|
25
|
+
let [options] = useProp('options', {});
|
|
26
|
+
const [theme] = useProp('theme');
|
|
27
|
+
const container = useElement('[js-hook-map-container]');
|
|
28
|
+
const infoboxWrapper = useElement('[js-hook-infobox-wrapper]');
|
|
29
|
+
const element = useElement('[js-hook-map]');
|
|
30
|
+
let map;
|
|
31
|
+
let mapboxHelpers;
|
|
32
|
+
onDidLoad(async () => {
|
|
33
|
+
if (options.mobileToggle)
|
|
34
|
+
element.current.classList.add(MOBILE_TOGGLE_CLASS);
|
|
35
|
+
options = Object.assign(Object.assign({}, DEFAULT_OPTIONS), options);
|
|
36
|
+
map = createMapboxInstance();
|
|
37
|
+
mapboxHelpers = mapbox(map, options, theme);
|
|
38
|
+
setMapInstance(map);
|
|
39
|
+
await setupMapbox();
|
|
40
|
+
subscribe();
|
|
41
|
+
if (options.search)
|
|
42
|
+
options.search.forEach((e) => mapboxHelpers.search(e));
|
|
43
|
+
});
|
|
44
|
+
function subscribe() {
|
|
45
|
+
const { filter, data } = mapStore.getState();
|
|
46
|
+
const { addData } = mapboxHelpers;
|
|
47
|
+
addData(filter ? filter : data);
|
|
48
|
+
mapStore.subscribe(({ data }) => addData(data), ['data']);
|
|
49
|
+
mapStore.subscribe(handleHover, ['hover']);
|
|
50
|
+
mapStore.subscribe(handleClick, ['click']);
|
|
51
|
+
mapStore.subscribe(handleFocus, ['focus']);
|
|
52
|
+
mapStore.subscribe(({ filter, data }) => addData(filter ? filter : data), ['filter']);
|
|
53
|
+
mapStore.subscribe(({ layerRasterSettings }) => layerRasterSettings && mapboxHelpers.raster(layerRasterSettings), ['layerRasterSettings']);
|
|
54
|
+
}
|
|
55
|
+
function handleHover({ hover }) {
|
|
56
|
+
const { current, previous } = hover;
|
|
57
|
+
const canvasStyle = map.getCanvas().style;
|
|
58
|
+
const { setFeatureState, addTooltip, removeTooltip } = mapboxHelpers;
|
|
59
|
+
if (options.tooltipMode === 'hover') {
|
|
60
|
+
if ((current === null || current === void 0 ? void 0 : current.tooltip) && !detectTouch.touch)
|
|
61
|
+
addTooltip(current.coordinates, current);
|
|
62
|
+
if (!current && !detectTouch.touch)
|
|
63
|
+
removeTooltip();
|
|
64
|
+
}
|
|
65
|
+
if (hasHoverTheme()) {
|
|
66
|
+
if (current)
|
|
67
|
+
setFeatureState(current.variant, current.id, 'hover', true);
|
|
68
|
+
if (previous)
|
|
69
|
+
setFeatureState(previous.variant, previous.id, 'hover', false);
|
|
70
|
+
}
|
|
71
|
+
canvasStyle.cursor = current ? 'pointer' : '';
|
|
72
|
+
}
|
|
73
|
+
function handleClick({ click }) {
|
|
74
|
+
if (!click)
|
|
75
|
+
return;
|
|
76
|
+
const { addTooltip } = mapboxHelpers;
|
|
77
|
+
const { infobox, coordinates, tooltip, url } = click;
|
|
78
|
+
clearHover();
|
|
79
|
+
if (options.tooltipMode === 'click' && tooltip) {
|
|
80
|
+
addTooltip(coordinates, click);
|
|
81
|
+
}
|
|
82
|
+
if (options.tooltipMode === 'hover') {
|
|
83
|
+
if (url && !detectTouch.touch && options.autoOpenUrl) {
|
|
84
|
+
window.open(url, options.openInTab ? '_blank' : '_self');
|
|
85
|
+
}
|
|
86
|
+
else if ((url && tooltip) || (detectTouch.touch && !url && tooltip)) {
|
|
87
|
+
addTooltip(coordinates, click);
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
if (infobox) {
|
|
91
|
+
showInfobox(infobox);
|
|
92
|
+
}
|
|
93
|
+
else {
|
|
94
|
+
clearInfobox();
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
function handleFocus({ focus }) {
|
|
98
|
+
const { current, previous, options } = focus;
|
|
99
|
+
const { setFeatureState, center, addTooltip, removeTooltip } = mapboxHelpers;
|
|
100
|
+
if (previous) {
|
|
101
|
+
previous.forEach(({ id, variant }) => {
|
|
102
|
+
if (hasHoverTheme())
|
|
103
|
+
setFeatureState(variant, id, 'focus', false);
|
|
104
|
+
pointerFocusToggle(id, 'remove');
|
|
105
|
+
});
|
|
106
|
+
}
|
|
107
|
+
if (current) {
|
|
108
|
+
current.forEach((item) => {
|
|
109
|
+
const { variant, id, coordinates, tooltip } = item;
|
|
110
|
+
function handleTooltip() {
|
|
111
|
+
const showTooltip = (options === null || options === void 0 ? void 0 : options.toggleTooltip) && tooltip;
|
|
112
|
+
if (theme.polygon || pointerExists(id)) {
|
|
113
|
+
if (showTooltip)
|
|
114
|
+
addTooltip(coordinates, item);
|
|
115
|
+
pointerFocusToggle(id, 'add');
|
|
116
|
+
}
|
|
117
|
+
}
|
|
118
|
+
if (theme.polygon) {
|
|
119
|
+
if (hasHoverTheme())
|
|
120
|
+
setFeatureState(variant, id, 'focus', true);
|
|
121
|
+
}
|
|
122
|
+
if (pointerExists(id)) {
|
|
123
|
+
handleTooltip();
|
|
124
|
+
}
|
|
125
|
+
else {
|
|
126
|
+
map.once('idle', handleTooltip);
|
|
127
|
+
}
|
|
128
|
+
});
|
|
129
|
+
if (options === null || options === void 0 ? void 0 : options.zoom) {
|
|
130
|
+
let bounds = calculateMapDataBoundingBox(current);
|
|
131
|
+
bounds = expandBoundingBox(bounds, 0.05);
|
|
132
|
+
map.fitBounds(bounds);
|
|
133
|
+
}
|
|
134
|
+
else if (!(options === null || options === void 0 ? void 0 : options.static)) {
|
|
135
|
+
center([[calculateMapDataCenter(current)]]);
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
else {
|
|
139
|
+
removeTooltip();
|
|
140
|
+
}
|
|
141
|
+
}
|
|
142
|
+
function pointerFocusToggle(id, action) {
|
|
143
|
+
const pointer = getPointerElementById(id);
|
|
144
|
+
if (pointer) {
|
|
145
|
+
pointer.classList[action](POINTER_FOCUS_CLASS);
|
|
146
|
+
element.current.classList[action](MAP_HOVERING_CLASS);
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
function showInfobox(infobox) {
|
|
150
|
+
clearInfobox();
|
|
151
|
+
infoboxWrapper.current.appendChild(h(Infobox, Object.assign({}, infobox, { onClose: clearInfobox, openInTab: options.openInTab })));
|
|
152
|
+
}
|
|
153
|
+
function clearInfobox() {
|
|
154
|
+
infoboxWrapper.current.innerHTML = '';
|
|
155
|
+
}
|
|
156
|
+
function toggleMap() {
|
|
157
|
+
element.current.classList.toggle(CONTAINER_VISIBLE);
|
|
158
|
+
map.resize();
|
|
159
|
+
}
|
|
160
|
+
function hasHoverTheme() {
|
|
161
|
+
return theme.polygon && theme.polygon.settings[0].hover;
|
|
162
|
+
}
|
|
163
|
+
function createMapboxInstance() {
|
|
164
|
+
mapboxgl.accessToken = window.__ENVIRONMENT_DETAILS__.mapbox.accessToken;
|
|
165
|
+
const mapboxOptions = {
|
|
166
|
+
container: container.current,
|
|
167
|
+
style: `mapbox://styles/${window.__ENVIRONMENT_DETAILS__.mapbox.style}`,
|
|
168
|
+
minZoom: 4,
|
|
169
|
+
maxZoom: 30,
|
|
170
|
+
dragPan: true,
|
|
171
|
+
scrollZoom: false,
|
|
172
|
+
};
|
|
173
|
+
if (options.center)
|
|
174
|
+
mapboxOptions.center = options.center;
|
|
175
|
+
if (options.zoom)
|
|
176
|
+
mapboxOptions.zoom = options.zoom;
|
|
177
|
+
if (options.boundingBox)
|
|
178
|
+
mapboxOptions.bounds = options.boundingBox;
|
|
179
|
+
if (!options.zoom && !options.center && !options.boundingBox) {
|
|
180
|
+
mapboxOptions.bounds = getCountryBoundingBox(['nl']);
|
|
181
|
+
}
|
|
182
|
+
return new mapboxgl.Map(mapboxOptions);
|
|
183
|
+
}
|
|
184
|
+
function getMapboxLanguageString() {
|
|
185
|
+
let language;
|
|
186
|
+
if (options.language) {
|
|
187
|
+
language = options.language.substr(0, 2);
|
|
188
|
+
}
|
|
189
|
+
language = !language || language === 'nl' ? 'mul' : language;
|
|
190
|
+
return language;
|
|
191
|
+
}
|
|
192
|
+
async function setupMapbox() {
|
|
193
|
+
const { raster, geojson, layer, interaction, setupPointers } = mapboxHelpers;
|
|
194
|
+
await functionIsTrue(() => map.isStyleLoaded());
|
|
195
|
+
const languageControl = new MapboxLanguage({
|
|
196
|
+
defaultLanguage: getMapboxLanguageString(),
|
|
197
|
+
});
|
|
198
|
+
map.addControl(languageControl);
|
|
199
|
+
const optionsLayerRaster = options.layerRaster
|
|
200
|
+
? { layerRaster: options.layerRaster }
|
|
201
|
+
: undefined;
|
|
202
|
+
const storeLayerRaster = mapStore.getState().layerRasterSettings;
|
|
203
|
+
if (optionsLayerRaster) {
|
|
204
|
+
raster(optionsLayerRaster);
|
|
205
|
+
}
|
|
206
|
+
else if (storeLayerRaster) {
|
|
207
|
+
raster(storeLayerRaster);
|
|
208
|
+
}
|
|
209
|
+
if (theme.polygon) {
|
|
210
|
+
theme.polygon.settings.forEach((setting) => {
|
|
211
|
+
geojson(setting);
|
|
212
|
+
layer(setting);
|
|
213
|
+
interaction(setting);
|
|
214
|
+
});
|
|
215
|
+
}
|
|
216
|
+
if (theme.pointer) {
|
|
217
|
+
setupPointers(element.current);
|
|
218
|
+
}
|
|
219
|
+
map.resize();
|
|
220
|
+
}
|
|
221
|
+
function getPointerElementById(id) {
|
|
222
|
+
return element.current.querySelector(`#pointer-${id}`);
|
|
223
|
+
}
|
|
224
|
+
function pointerExists(id) {
|
|
225
|
+
return !!getPointerElementById(id);
|
|
226
|
+
}
|
|
227
|
+
return (h(Fragment, null,
|
|
228
|
+
h("div", { class: "c-map", "js-hook-map": true },
|
|
229
|
+
h("div", { className: "map__container", "js-hook-map-container": true },
|
|
230
|
+
options.zoomButtons && (h("div", { class: "map__navigation" },
|
|
231
|
+
h("button", { class: "map__button", onClick: () => map.zoomIn() },
|
|
232
|
+
h("bpd-svg", { name: "icons-plus" })),
|
|
233
|
+
h("button", { class: "map__button", onClick: () => map.zoomOut() },
|
|
234
|
+
h("span", { class: "map__minus" })))),
|
|
235
|
+
options.mobileToggle && (h("button", { type: "button", class: "map__close", onClick: toggleMap },
|
|
236
|
+
h("bpd-svg", { name: "icons-close" }))),
|
|
237
|
+
h("div", { class: "map__infobox-wrapper", "js-hook-infobox-wrapper": true }))),
|
|
238
|
+
options.mobileToggle && (h(Fragment, null,
|
|
239
|
+
h(Button, { variant: "bg", label: options.mobileToggleLabel || 'Toon kaart', classes: "map__open", onClick: toggleMap })))));
|
|
240
|
+
};
|
|
241
|
+
Map.props = {
|
|
242
|
+
options: {
|
|
243
|
+
type: Object,
|
|
244
|
+
},
|
|
245
|
+
theme: {
|
|
246
|
+
type: Object,
|
|
247
|
+
required: true,
|
|
248
|
+
},
|
|
249
|
+
zoomButtons: {
|
|
250
|
+
type: Boolean,
|
|
251
|
+
},
|
|
252
|
+
};
|
|
253
|
+
defineElement('bpd-map', Map);
|
|
254
|
+
|
|
255
|
+
export { Map };
|
|
256
|
+
//# sourceMappingURL=map.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"map.js","sources":["../../../../src/molecules/map/map.tsx"],"sourcesContent":["import { defineElement, FC, onDidLoad, useElement, useProp } from '@atomify/hooks';\nimport { Fragment, h } from '@atomify/jsx';\nimport { MapInfobox, MapOptions, MapSearchOptions, MapTheme } from '@bpd-library/types';\nimport {\n calculateMapDataBoundingBox,\n calculateMapDataCenter,\n detectTouch,\n expandBoundingBox,\n functionIsTrue,\n getCountryBoundingBox,\n} from '@bpd-library/utilities';\nimport MapboxLanguage from '@mapbox/mapbox-gl-language';\nimport mapboxgl from 'mapbox-gl';\n\nimport { Button } from '../../atoms/button';\nimport { Infobox } from '../infobox';\nimport { clearHover, MapState, mapStore, setMapInstance } from './store/map';\nimport mapbox from './utilities/mapbox';\n\nconst DEFAULT_OPTIONS: MapOptions = {\n zoomButtons: true,\n mobileToggle: false,\n tooltipMode: 'hover',\n openInTab: false,\n autoOpenUrl: true,\n language: window.__ENVIRONMENT_DETAILS__.language || 'nl',\n searchCountryIsoCodes: ['nl', 'de'],\n};\n\nconst CONTAINER_VISIBLE = 'map--is-visible';\nconst MOBILE_TOGGLE_CLASS = 'map--mobile-toggle';\nconst MAP_HOVERING_CLASS = 'map--hovering';\nconst POINTER_FOCUS_CLASS = 'map__pointer--focus';\n\nexport const Map: FC = () => {\n let [options] = useProp<MapOptions>('options', {});\n const [theme] = useProp<MapTheme>('theme');\n const container = useElement<HTMLDivElement>('[js-hook-map-container]');\n const infoboxWrapper = useElement<HTMLDivElement>('[js-hook-infobox-wrapper]');\n const element = useElement<HTMLDivElement>('[js-hook-map]');\n\n let map: mapboxgl.Map;\n let mapboxHelpers: ReturnType<typeof mapbox>;\n let focusTimeout: ReturnType<typeof setTimeout> | undefined;\n\n onDidLoad(async () => {\n if (options.mobileToggle) element.current!.classList.add(MOBILE_TOGGLE_CLASS);\n options = { ...DEFAULT_OPTIONS, ...options };\n\n map = createMapboxInstance();\n mapboxHelpers = mapbox(map, options, theme);\n setMapInstance(map);\n\n await setupMapbox();\n\n subscribe();\n\n if (options.search)\n options.search.forEach((e: MapSearchOptions) => mapboxHelpers.search(e));\n });\n\n function subscribe() {\n const { filter, data } = mapStore.getState();\n const { addData } = mapboxHelpers;\n\n addData(filter ? filter : data);\n\n mapStore.subscribe(({ data }) => addData(data), ['data']);\n mapStore.subscribe(handleHover, ['hover']);\n mapStore.subscribe(handleClick, ['click']);\n mapStore.subscribe(handleFocus, ['focus']);\n mapStore.subscribe(({ filter, data }) => addData(filter ? filter : data), ['filter']);\n mapStore.subscribe(\n ({ layerRasterSettings }) =>\n layerRasterSettings && mapboxHelpers.raster(layerRasterSettings),\n ['layerRasterSettings'],\n );\n }\n\n function handleHover({ hover }: MapState) {\n const { current, previous } = hover;\n const canvasStyle = map.getCanvas().style;\n const { setFeatureState, addTooltip, removeTooltip } = mapboxHelpers;\n\n /*\n Add / Remove tooltip\n */\n if (options.tooltipMode === 'hover') {\n if (current?.tooltip && !detectTouch.touch) addTooltip(current.coordinates, current);\n if (!current && !detectTouch.touch) removeTooltip();\n }\n\n /*\n Set hover state\n */\n if (hasHoverTheme()) {\n if (current) setFeatureState(current.variant, current.id, 'hover', true);\n if (previous) setFeatureState(previous.variant, previous.id, 'hover', false);\n }\n\n canvasStyle.cursor = current ? 'pointer' : '';\n }\n\n function handleClick({ click }: MapState) {\n if (!click) return;\n\n const { addTooltip } = mapboxHelpers;\n const { infobox, coordinates, tooltip, url } = click;\n\n clearHover();\n\n if (options.tooltipMode === 'click' && tooltip) {\n addTooltip(coordinates, click);\n }\n\n if (options.tooltipMode === 'hover') {\n if (url && !detectTouch.touch && options.autoOpenUrl) {\n window.open(url, options.openInTab ? '_blank' : '_self');\n } else if ((url && tooltip) || (detectTouch.touch && !url && tooltip)) {\n addTooltip(coordinates, click);\n }\n }\n\n if (infobox) {\n showInfobox(infobox);\n } else {\n clearInfobox();\n }\n }\n\n function handleFocus({ focus }: MapState) {\n const { current, previous, options } = focus;\n const { setFeatureState, center, addTooltip, removeTooltip } = mapboxHelpers;\n\n if (focusTimeout) clearTimeout(focusTimeout);\n\n if (previous) {\n previous.forEach(({ id, variant }) => {\n if (hasHoverTheme()) setFeatureState(variant, id, 'focus', false);\n pointerFocusToggle(id, 'remove');\n });\n }\n\n if (current) {\n current.forEach((item) => {\n const { variant, id, coordinates, tooltip } = item;\n\n function handleTooltip() {\n const showTooltip = options?.toggleTooltip && tooltip;\n\n if (theme.polygon || pointerExists(id)) {\n if (showTooltip) addTooltip(coordinates, item);\n\n pointerFocusToggle(id, 'add');\n }\n }\n\n if (theme.polygon) {\n if (hasHoverTheme()) setFeatureState(variant, id, 'focus', true);\n }\n\n if (pointerExists(id)) {\n handleTooltip();\n } else {\n /*\n If a pointer doesn't exist, it means it's inside a cluster or outside of the view.\n When the map is idle, all newly centered pointers are drawn and the tooltip can be shown. (if not in a cluster)\n */\n map.once('idle', handleTooltip);\n }\n });\n\n if (options?.zoom) {\n let bounds = calculateMapDataBoundingBox(current);\n bounds = expandBoundingBox(bounds, 0.05);\n\n map.fitBounds(bounds);\n } else if (!options?.static) {\n center([[calculateMapDataCenter(current)]]);\n }\n } else {\n removeTooltip();\n }\n }\n\n function pointerFocusToggle(id: string, action: 'add' | 'remove') {\n const pointer = getPointerElementById(id);\n\n if (pointer) {\n pointer.classList[action](POINTER_FOCUS_CLASS);\n element.current!.classList[action](MAP_HOVERING_CLASS);\n }\n }\n\n function showInfobox(infobox: MapInfobox) {\n clearInfobox();\n infoboxWrapper.current!.appendChild(\n <Infobox {...infobox} onClose={clearInfobox} openInTab={options.openInTab} />,\n );\n }\n\n function clearInfobox() {\n infoboxWrapper.current!.innerHTML = '';\n }\n\n function toggleMap() {\n element.current!.classList.toggle(CONTAINER_VISIBLE);\n map.resize();\n }\n\n function hasHoverTheme() {\n return theme.polygon && theme.polygon.settings[0].hover;\n }\n\n function createMapboxInstance() {\n mapboxgl.accessToken = window.__ENVIRONMENT_DETAILS__.mapbox.accessToken;\n\n const mapboxOptions: mapboxgl.MapboxOptions = {\n container: container.current!,\n style: `mapbox://styles/${window.__ENVIRONMENT_DETAILS__.mapbox.style}`,\n minZoom: 4,\n maxZoom: 30,\n dragPan: true,\n scrollZoom: false,\n };\n\n if (options.center) mapboxOptions.center = options.center;\n if (options.zoom) mapboxOptions.zoom = options.zoom;\n if (options.boundingBox) mapboxOptions.bounds = options.boundingBox;\n\n if (!options.zoom && !options.center && !options.boundingBox) {\n mapboxOptions.bounds = getCountryBoundingBox(['nl']);\n }\n\n return new mapboxgl.Map(mapboxOptions);\n }\n\n function getMapboxLanguageString(): string {\n let language: string | undefined;\n\n // If language could be nl-NL etc., make sure to strip first two characters\n if (options.language) {\n language = options.language.substr(0, 2);\n }\n\n // nl is not supported, use multilanguage instead\n language = !language || language === 'nl' ? 'mul' : language;\n\n return language;\n }\n\n async function setupMapbox() {\n const { raster, geojson, layer, interaction, setupPointers } = mapboxHelpers;\n\n await functionIsTrue(() => map.isStyleLoaded());\n\n // Setup Mapbox Language\n const languageControl = new MapboxLanguage({\n defaultLanguage: getMapboxLanguageString(),\n });\n map.addControl(languageControl);\n\n // Setup Layer Raster\n // Layer raster can be set via the store and options attribute\n const optionsLayerRaster = options.layerRaster\n ? { layerRaster: options.layerRaster }\n : undefined;\n const storeLayerRaster = mapStore.getState().layerRasterSettings;\n\n if (optionsLayerRaster) {\n raster(optionsLayerRaster);\n } else if (storeLayerRaster) {\n raster(storeLayerRaster);\n }\n\n // Setup in case of polygons\n if (theme.polygon) {\n theme.polygon.settings.forEach((setting) => {\n geojson(setting);\n layer(setting);\n interaction(setting);\n });\n }\n\n // Setup in case of pointers\n if (theme.pointer) {\n setupPointers(element.current!);\n }\n\n map.resize();\n }\n\n function getPointerElementById(id: string) {\n return element.current!.querySelector(`#pointer-${id}`);\n }\n\n function pointerExists(id: string) {\n return !!getPointerElementById(id);\n }\n\n return (\n <Fragment>\n <div class=\"c-map\" js-hook-map>\n <div className=\"map__container\" js-hook-map-container>\n {options.zoomButtons && (\n <div class=\"map__navigation\">\n <button class=\"map__button\" onClick={() => map.zoomIn()}>\n <bpd-svg name=\"icons-plus\"></bpd-svg>\n </button>\n <button class=\"map__button\" onClick={() => map.zoomOut()}>\n <span class=\"map__minus\"></span>\n </button>\n </div>\n )}\n\n {options.mobileToggle && (\n <button type=\"button\" class=\"map__close\" onClick={toggleMap}>\n <bpd-svg name=\"icons-close\" />\n </button>\n )}\n\n <div class=\"map__infobox-wrapper\" js-hook-infobox-wrapper></div>\n </div>\n </div>\n\n {options.mobileToggle && (\n <Fragment>\n <Button\n variant=\"bg\"\n label={options.mobileToggleLabel || 'Toon kaart'}\n classes=\"map__open\"\n onClick={toggleMap}></Button>\n </Fragment>\n )}\n </Fragment>\n );\n};\n\nMap.props = {\n options: {\n type: Object,\n },\n theme: {\n type: Object,\n required: true,\n },\n zoomButtons: {\n type: Boolean,\n },\n};\n\ndefineElement('bpd-map', Map);\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,150 @@
|
|
|
1
|
+
import { createStore } from '@atomify/kit';
|
|
2
|
+
|
|
3
|
+
const initialState = {
|
|
4
|
+
data: [],
|
|
5
|
+
hover: {},
|
|
6
|
+
focus: {},
|
|
7
|
+
searchIsMoving: false,
|
|
8
|
+
};
|
|
9
|
+
const UPDATE_MAP_DATA = 'updateMapData';
|
|
10
|
+
const UPDATE_HOVER = 'updateHover';
|
|
11
|
+
const CLEAR_HOVER = 'clearHover';
|
|
12
|
+
const UPDATE_CLICK = 'updateClick';
|
|
13
|
+
const SET_FOCUS = 'setFocus';
|
|
14
|
+
const CLEAR_FOCUS = 'clearFocus';
|
|
15
|
+
const UPDATE_SEARCH_RESULT = 'updateSearchResult';
|
|
16
|
+
const CLEAR_SEARCH_RESULT = 'clearSearchResult';
|
|
17
|
+
const UPDATE_SEARCH_IS_MOVING = 'updateSearchIsMoving';
|
|
18
|
+
const SET_FILTER = 'setFilter';
|
|
19
|
+
const CLEAR_FILTER = 'clearFilter';
|
|
20
|
+
const SET_MAP_INSTANCE = 'setMapInstance';
|
|
21
|
+
const SET_LAYER_RASTER = 'SET_LAYER_RASTER';
|
|
22
|
+
const MANUAL_SEARCH = 'manualSearch';
|
|
23
|
+
const actions = {
|
|
24
|
+
[UPDATE_MAP_DATA]: (state, data) => {
|
|
25
|
+
state.data = data;
|
|
26
|
+
return state;
|
|
27
|
+
},
|
|
28
|
+
[UPDATE_HOVER]: (state, hover) => {
|
|
29
|
+
state.hover = {
|
|
30
|
+
current: hover,
|
|
31
|
+
previous: state.hover.current,
|
|
32
|
+
};
|
|
33
|
+
return state;
|
|
34
|
+
},
|
|
35
|
+
[CLEAR_HOVER]: (state) => {
|
|
36
|
+
state.hover = {
|
|
37
|
+
current: undefined,
|
|
38
|
+
previous: state.hover.current,
|
|
39
|
+
};
|
|
40
|
+
return state;
|
|
41
|
+
},
|
|
42
|
+
[UPDATE_CLICK]: (state, click) => {
|
|
43
|
+
state.click = Object.assign({}, click);
|
|
44
|
+
return state;
|
|
45
|
+
},
|
|
46
|
+
[SET_FOCUS]: (state, { ids, options }) => {
|
|
47
|
+
var _a;
|
|
48
|
+
const dataItems = state.data.filter(({ id }) => ids.indexOf(id) > -1);
|
|
49
|
+
if (dataItems.length) {
|
|
50
|
+
state.focus = {
|
|
51
|
+
current: dataItems,
|
|
52
|
+
previous: (_a = state.focus) === null || _a === void 0 ? void 0 : _a.current,
|
|
53
|
+
options,
|
|
54
|
+
};
|
|
55
|
+
}
|
|
56
|
+
return state;
|
|
57
|
+
},
|
|
58
|
+
[CLEAR_FOCUS]: (state) => {
|
|
59
|
+
state.focus = {
|
|
60
|
+
current: undefined,
|
|
61
|
+
previous: state.focus.current,
|
|
62
|
+
};
|
|
63
|
+
return state;
|
|
64
|
+
},
|
|
65
|
+
[UPDATE_SEARCH_RESULT]: (state, searchResult) => {
|
|
66
|
+
state.searchResult = searchResult;
|
|
67
|
+
return state;
|
|
68
|
+
},
|
|
69
|
+
[CLEAR_SEARCH_RESULT]: (state) => {
|
|
70
|
+
state.searchResult = undefined;
|
|
71
|
+
return state;
|
|
72
|
+
},
|
|
73
|
+
[SET_FILTER]: (state, data) => {
|
|
74
|
+
state.filter = data;
|
|
75
|
+
return state;
|
|
76
|
+
},
|
|
77
|
+
[CLEAR_FILTER]: (state) => {
|
|
78
|
+
state.filter = undefined;
|
|
79
|
+
return state;
|
|
80
|
+
},
|
|
81
|
+
[SET_MAP_INSTANCE]: (state, mapInstance) => {
|
|
82
|
+
state.mapInstance = mapInstance;
|
|
83
|
+
return state;
|
|
84
|
+
},
|
|
85
|
+
[MANUAL_SEARCH]: (state, query) => {
|
|
86
|
+
state.manualSearch = query;
|
|
87
|
+
return state;
|
|
88
|
+
},
|
|
89
|
+
[UPDATE_SEARCH_IS_MOVING]: (state, searchIsMoving) => {
|
|
90
|
+
state.searchIsMoving = searchIsMoving;
|
|
91
|
+
return state;
|
|
92
|
+
},
|
|
93
|
+
[SET_LAYER_RASTER]: (state, layerRasterSettings) => {
|
|
94
|
+
state.layerRasterSettings = layerRasterSettings;
|
|
95
|
+
return state;
|
|
96
|
+
},
|
|
97
|
+
};
|
|
98
|
+
const mapStore = createStore({
|
|
99
|
+
initialState,
|
|
100
|
+
actions: actions,
|
|
101
|
+
});
|
|
102
|
+
const updateMapData = (data) => {
|
|
103
|
+
mapStore.dispatch(UPDATE_MAP_DATA, data);
|
|
104
|
+
};
|
|
105
|
+
const clearHover = () => {
|
|
106
|
+
mapStore.dispatch(CLEAR_HOVER);
|
|
107
|
+
};
|
|
108
|
+
const updateHover = (hover) => {
|
|
109
|
+
mapStore.dispatch(UPDATE_HOVER, hover);
|
|
110
|
+
};
|
|
111
|
+
const updateClick = (click) => {
|
|
112
|
+
mapStore.dispatch(UPDATE_CLICK, click);
|
|
113
|
+
};
|
|
114
|
+
const setFocus = (ids, options = {}) => {
|
|
115
|
+
mapStore.dispatch(SET_FOCUS, { ids, options });
|
|
116
|
+
};
|
|
117
|
+
const clearFocus = () => {
|
|
118
|
+
mapStore.dispatch(CLEAR_FOCUS);
|
|
119
|
+
};
|
|
120
|
+
const updateSearchResult = (searchResult) => {
|
|
121
|
+
mapStore.dispatch(UPDATE_SEARCH_RESULT, searchResult);
|
|
122
|
+
};
|
|
123
|
+
const clearSearchResult = () => {
|
|
124
|
+
mapStore.dispatch(CLEAR_SEARCH_RESULT);
|
|
125
|
+
};
|
|
126
|
+
const setFilter = (data) => {
|
|
127
|
+
mapStore.dispatch(SET_FILTER, data);
|
|
128
|
+
};
|
|
129
|
+
const clearFilter = () => {
|
|
130
|
+
mapStore.dispatch(CLEAR_FILTER);
|
|
131
|
+
};
|
|
132
|
+
const setMapInstance = (mapInstance) => {
|
|
133
|
+
mapStore.dispatch(SET_MAP_INSTANCE, mapInstance);
|
|
134
|
+
};
|
|
135
|
+
const manualSearch = (query) => {
|
|
136
|
+
mapStore.dispatch(MANUAL_SEARCH, query);
|
|
137
|
+
};
|
|
138
|
+
const updateSearchIsMoving = (isMoving) => {
|
|
139
|
+
mapStore.dispatch(UPDATE_SEARCH_IS_MOVING, isMoving);
|
|
140
|
+
};
|
|
141
|
+
const setLayerRaster = (layerRasterSettings) => {
|
|
142
|
+
mapStore.dispatch(SET_LAYER_RASTER, layerRasterSettings);
|
|
143
|
+
};
|
|
144
|
+
const getMapboxData = () => mapStore.getState().data;
|
|
145
|
+
const getHover = () => mapStore.getState().hover;
|
|
146
|
+
const getMapInstance = () => mapStore.getState().mapInstance;
|
|
147
|
+
const getSearchIsMoving = () => mapStore.getState().searchIsMoving;
|
|
148
|
+
|
|
149
|
+
export { clearFilter, clearFocus, clearHover, clearSearchResult, getHover, getMapInstance, getMapboxData, getSearchIsMoving, manualSearch, mapStore, setFilter, setFocus, setLayerRaster, setMapInstance, updateClick, updateHover, updateMapData, updateSearchIsMoving, updateSearchResult };
|
|
150
|
+
//# sourceMappingURL=store.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"store.js","sources":["../../../../../../src/molecules/map/store/map/store.ts"],"sourcesContent":["import { createStore } from '@atomify/kit';\nimport { BoundingBox, MapDataItem } from '@bpd-library/types';\n\nexport type SearchResult = {\n items: MapDataItem[];\n result: any;\n originalBoundingBox?: BoundingBox;\n expandedBoundingBox?: BoundingBox;\n};\n\ninterface MapFocusOptions {\n zoom?: boolean;\n toggleTooltip?: boolean;\n static?: boolean;\n}\n\nexport interface MapLayerRasterSettings {\n layerRaster: string;\n minzoom?: number;\n maxzoom?: number;\n}\n\nexport interface MapState {\n data: MapDataItem[];\n mapInstance?: mapboxgl.Map;\n hover: {\n current?: MapDataItem;\n previous?: MapDataItem;\n };\n filter?: MapDataItem[];\n click?: MapDataItem;\n focus: {\n current?: MapDataItem[];\n previous?: MapDataItem[];\n options?: MapFocusOptions;\n };\n searchResult?: SearchResult;\n searchIsMoving: boolean;\n manualSearch?: string;\n layerRasterSettings?: MapLayerRasterSettings;\n}\n\nconst initialState: MapState = {\n data: [],\n hover: {},\n focus: {},\n searchIsMoving: false,\n};\n\nconst UPDATE_MAP_DATA = 'updateMapData';\nconst UPDATE_HOVER = 'updateHover';\nconst CLEAR_HOVER = 'clearHover';\nconst UPDATE_CLICK = 'updateClick';\nconst SET_FOCUS = 'setFocus';\nconst CLEAR_FOCUS = 'clearFocus';\nconst UPDATE_SEARCH_RESULT = 'updateSearchResult';\nconst CLEAR_SEARCH_RESULT = 'clearSearchResult';\nconst UPDATE_SEARCH_IS_MOVING = 'updateSearchIsMoving';\nconst SET_FILTER = 'setFilter';\nconst CLEAR_FILTER = 'clearFilter';\nconst SET_MAP_INSTANCE = 'setMapInstance';\nconst SET_LAYER_RASTER = 'SET_LAYER_RASTER';\nconst MANUAL_SEARCH = 'manualSearch';\n\nconst actions = {\n [UPDATE_MAP_DATA]: (state: MapState, data: MapDataItem[]) => {\n state.data = data;\n return state;\n },\n [UPDATE_HOVER]: (state: MapState, hover: MapDataItem) => {\n state.hover = {\n current: hover,\n previous: state.hover.current,\n };\n\n return state;\n },\n [CLEAR_HOVER]: (state: MapState) => {\n state.hover = {\n current: undefined,\n previous: state.hover.current,\n };\n\n return state;\n },\n [UPDATE_CLICK]: (state: MapState, click: MapDataItem) => {\n state.click = { ...click };\n return state;\n },\n [SET_FOCUS]: (\n state: MapState,\n { ids, options }: { ids: string[]; options: MapFocusOptions },\n ) => {\n const dataItems = state.data.filter(({ id }) => ids.indexOf(id) > -1);\n\n if (dataItems.length) {\n state.focus = {\n current: dataItems,\n previous: state.focus?.current,\n options,\n };\n }\n\n return state;\n },\n [CLEAR_FOCUS]: (state: MapState) => {\n state.focus = {\n current: undefined,\n previous: state.focus.current,\n };\n\n return state;\n },\n [UPDATE_SEARCH_RESULT]: (state: MapState, searchResult: SearchResult) => {\n state.searchResult = searchResult;\n return state;\n },\n [CLEAR_SEARCH_RESULT]: (state: MapState) => {\n state.searchResult = undefined;\n return state;\n },\n [SET_FILTER]: (state: MapState, data: MapDataItem[]) => {\n state.filter = data;\n return state;\n },\n [CLEAR_FILTER]: (state: MapState) => {\n state.filter = undefined;\n return state;\n },\n [SET_MAP_INSTANCE]: (state: MapState, mapInstance: mapboxgl.Map) => {\n state.mapInstance = mapInstance;\n return state;\n },\n [MANUAL_SEARCH]: (state: MapState, query: string) => {\n state.manualSearch = query;\n return state;\n },\n [UPDATE_SEARCH_IS_MOVING]: (state: MapState, searchIsMoving: boolean) => {\n state.searchIsMoving = searchIsMoving;\n return state;\n },\n [SET_LAYER_RASTER]: (state: MapState, layerRasterSettings: MapLayerRasterSettings) => {\n state.layerRasterSettings = layerRasterSettings;\n return state;\n },\n};\n\nexport const mapStore = createStore<MapState>({\n initialState,\n actions: actions as any,\n});\n\n/*\n Setters\n*/\nexport const updateMapData = (data: MapDataItem[]) => {\n mapStore.dispatch(UPDATE_MAP_DATA, data);\n};\n\nexport const clearHover = () => {\n mapStore.dispatch(CLEAR_HOVER);\n};\n\nexport const updateHover = (hover: MapDataItem) => {\n mapStore.dispatch(UPDATE_HOVER, hover);\n};\n\nexport const updateClick = (click: MapDataItem) => {\n mapStore.dispatch(UPDATE_CLICK, click);\n};\n\nexport const setFocus = (ids: string[], options: MapFocusOptions = {}) => {\n mapStore.dispatch(SET_FOCUS, { ids, options });\n};\n\nexport const clearFocus = () => {\n mapStore.dispatch(CLEAR_FOCUS);\n};\n\nexport const updateSearchResult = (searchResult: SearchResult) => {\n mapStore.dispatch(UPDATE_SEARCH_RESULT, searchResult);\n};\n\nexport const clearSearchResult = () => {\n mapStore.dispatch(CLEAR_SEARCH_RESULT);\n};\n\nexport const setFilter = (data: MapDataItem[]) => {\n mapStore.dispatch(SET_FILTER, data);\n};\n\nexport const clearFilter = () => {\n mapStore.dispatch(CLEAR_FILTER);\n};\n\nexport const setMapInstance = (mapInstance: mapboxgl.Map) => {\n mapStore.dispatch(SET_MAP_INSTANCE, mapInstance);\n};\n\nexport const manualSearch = (query: string) => {\n mapStore.dispatch(MANUAL_SEARCH, query);\n};\n\nexport const updateSearchIsMoving = (isMoving: boolean) => {\n mapStore.dispatch(UPDATE_SEARCH_IS_MOVING, isMoving);\n};\n\nexport const setLayerRaster = (layerRasterSettings: MapLayerRasterSettings) => {\n mapStore.dispatch(SET_LAYER_RASTER, layerRasterSettings);\n};\n\n/*\n Getters\n*/\nexport const getMapboxData = () => mapStore.getState().data;\nexport const getHover = () => mapStore.getState().hover;\nexport const getMapInstance = () => mapStore.getState().mapInstance;\nexport const getSearchIsMoving = () => mapStore.getState().searchIsMoving;\n"],"names":[],"mappings":";;AA0CA,MAAM,YAAY,GAAa;IAC3B,IAAI,EAAE,EAAE;IACR,KAAK,EAAE,EAAE;IACT,KAAK,EAAE,EAAE;IACT,cAAc,EAAE,KAAK;CACxB,CAAC;AAEF,MAAM,eAAe,GAAG,eAAe,CAAC;AACxC,MAAM,YAAY,GAAG,aAAa,CAAC;AACnC,MAAM,WAAW,GAAG,YAAY,CAAC;AACjC,MAAM,YAAY,GAAG,aAAa,CAAC;AACnC,MAAM,SAAS,GAAG,UAAU,CAAC;AAC7B,MAAM,WAAW,GAAG,YAAY,CAAC;AACjC,MAAM,oBAAoB,GAAG,oBAAoB,CAAC;AAClD,MAAM,mBAAmB,GAAG,mBAAmB,CAAC;AAChD,MAAM,uBAAuB,GAAG,sBAAsB,CAAC;AACvD,MAAM,UAAU,GAAG,WAAW,CAAC;AAC/B,MAAM,YAAY,GAAG,aAAa,CAAC;AACnC,MAAM,gBAAgB,GAAG,gBAAgB,CAAC;AAC1C,MAAM,gBAAgB,GAAG,kBAAkB,CAAC;AAC5C,MAAM,aAAa,GAAG,cAAc,CAAC;AAErC,MAAM,OAAO,GAAG;IACZ,CAAC,eAAe,GAAG,CAAC,KAAe,EAAE,IAAmB;QACpD,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC;QAClB,OAAO,KAAK,CAAC;KAChB;IACD,CAAC,YAAY,GAAG,CAAC,KAAe,EAAE,KAAkB;QAChD,KAAK,CAAC,KAAK,GAAG;YACV,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO;SAChC,CAAC;QAEF,OAAO,KAAK,CAAC;KAChB;IACD,CAAC,WAAW,GAAG,CAAC,KAAe;QAC3B,KAAK,CAAC,KAAK,GAAG;YACV,OAAO,EAAE,SAAS;YAClB,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO;SAChC,CAAC;QAEF,OAAO,KAAK,CAAC;KAChB;IACD,CAAC,YAAY,GAAG,CAAC,KAAe,EAAE,KAAkB;QAChD,KAAK,CAAC,KAAK,qBAAQ,KAAK,CAAE,CAAC;QAC3B,OAAO,KAAK,CAAC;KAChB;IACD,CAAC,SAAS,GAAG,CACT,KAAe,EACf,EAAE,GAAG,EAAE,OAAO,EAA+C;;QAE7D,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;QAEtE,IAAI,SAAS,CAAC,MAAM,EAAE;YAClB,KAAK,CAAC,KAAK,GAAG;gBACV,OAAO,EAAE,SAAS;gBAClB,QAAQ,QAAE,KAAK,CAAC,KAAK,0CAAE,OAAO;gBAC9B,OAAO;aACV,CAAC;SACL;QAED,OAAO,KAAK,CAAC;KAChB;IACD,CAAC,WAAW,GAAG,CAAC,KAAe;QAC3B,KAAK,CAAC,KAAK,GAAG;YACV,OAAO,EAAE,SAAS;YAClB,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO;SAChC,CAAC;QAEF,OAAO,KAAK,CAAC;KAChB;IACD,CAAC,oBAAoB,GAAG,CAAC,KAAe,EAAE,YAA0B;QAChE,KAAK,CAAC,YAAY,GAAG,YAAY,CAAC;QAClC,OAAO,KAAK,CAAC;KAChB;IACD,CAAC,mBAAmB,GAAG,CAAC,KAAe;QACnC,KAAK,CAAC,YAAY,GAAG,SAAS,CAAC;QAC/B,OAAO,KAAK,CAAC;KAChB;IACD,CAAC,UAAU,GAAG,CAAC,KAAe,EAAE,IAAmB;QAC/C,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC;QACpB,OAAO,KAAK,CAAC;KAChB;IACD,CAAC,YAAY,GAAG,CAAC,KAAe;QAC5B,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC;QACzB,OAAO,KAAK,CAAC;KAChB;IACD,CAAC,gBAAgB,GAAG,CAAC,KAAe,EAAE,WAAyB;QAC3D,KAAK,CAAC,WAAW,GAAG,WAAW,CAAC;QAChC,OAAO,KAAK,CAAC;KAChB;IACD,CAAC,aAAa,GAAG,CAAC,KAAe,EAAE,KAAa;QAC5C,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC;QAC3B,OAAO,KAAK,CAAC;KAChB;IACD,CAAC,uBAAuB,GAAG,CAAC,KAAe,EAAE,cAAuB;QAChE,KAAK,CAAC,cAAc,GAAG,cAAc,CAAC;QACtC,OAAO,KAAK,CAAC;KAChB;IACD,CAAC,gBAAgB,GAAG,CAAC,KAAe,EAAE,mBAA2C;QAC7E,KAAK,CAAC,mBAAmB,GAAG,mBAAmB,CAAC;QAChD,OAAO,KAAK,CAAC;KAChB;CACJ,CAAC;MAEW,QAAQ,GAAG,WAAW,CAAW;IAC1C,YAAY;IACZ,OAAO,EAAE,OAAc;CAC1B,EAAE;MAKU,aAAa,GAAG,CAAC,IAAmB;IAC7C,QAAQ,CAAC,QAAQ,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC;AAC7C,EAAE;MAEW,UAAU,GAAG;IACtB,QAAQ,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;AACnC,EAAE;MAEW,WAAW,GAAG,CAAC,KAAkB;IAC1C,QAAQ,CAAC,QAAQ,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC;AAC3C,EAAE;MAEW,WAAW,GAAG,CAAC,KAAkB;IAC1C,QAAQ,CAAC,QAAQ,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC;AAC3C,EAAE;MAEW,QAAQ,GAAG,CAAC,GAAa,EAAE,UAA2B,EAAE;IACjE,QAAQ,CAAC,QAAQ,CAAC,SAAS,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE,CAAC,CAAC;AACnD,EAAE;MAEW,UAAU,GAAG;IACtB,QAAQ,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;AACnC,EAAE;MAEW,kBAAkB,GAAG,CAAC,YAA0B;IACzD,QAAQ,CAAC,QAAQ,CAAC,oBAAoB,EAAE,YAAY,CAAC,CAAC;AAC1D,EAAE;MAEW,iBAAiB,GAAG;IAC7B,QAAQ,CAAC,QAAQ,CAAC,mBAAmB,CAAC,CAAC;AAC3C,EAAE;MAEW,SAAS,GAAG,CAAC,IAAmB;IACzC,QAAQ,CAAC,QAAQ,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;AACxC,EAAE;MAEW,WAAW,GAAG;IACvB,QAAQ,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;AACpC,EAAE;MAEW,cAAc,GAAG,CAAC,WAAyB;IACpD,QAAQ,CAAC,QAAQ,CAAC,gBAAgB,EAAE,WAAW,CAAC,CAAC;AACrD,EAAE;MAEW,YAAY,GAAG,CAAC,KAAa;IACtC,QAAQ,CAAC,QAAQ,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC;AAC5C,EAAE;MAEW,oBAAoB,GAAG,CAAC,QAAiB;IAClD,QAAQ,CAAC,QAAQ,CAAC,uBAAuB,EAAE,QAAQ,CAAC,CAAC;AACzD,EAAE;MAEW,cAAc,GAAG,CAAC,mBAA2C;IACtE,QAAQ,CAAC,QAAQ,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,CAAC;AAC7D,EAAE;MAKW,aAAa,GAAG,MAAM,QAAQ,CAAC,QAAQ,EAAE,CAAC,KAAK;MAC/C,QAAQ,GAAG,MAAM,QAAQ,CAAC,QAAQ,EAAE,CAAC,MAAM;MAC3C,cAAc,GAAG,MAAM,QAAQ,CAAC,QAAQ,EAAE,CAAC,YAAY;MACvD,iBAAiB,GAAG,MAAM,QAAQ,CAAC,QAAQ,EAAE,CAAC;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fit-bounds.js","sources":["../../../../../src/molecules/map/utilities/fit-bounds.ts"],"sourcesContent":["import { BoundingBox } from '@bpd-library/types';\n\nexport const fitBounds = (map: mapboxgl.Map, boundingBox: BoundingBox) =>\n map.fitBounds(boundingBox);\n"],"names":[],"mappings":"MAEa,SAAS,GAAG,CAAC,GAAiB,EAAE,WAAwB,KACjE,GAAG,CAAC,SAAS,CAAC,WAAW;;;;"}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import { calculateCenter, functionIsTrue } from '@bpd-library/utilities';
|
|
2
|
+
|
|
3
|
+
const variants = [];
|
|
4
|
+
const isPointerVariant = (variant, theme) => {
|
|
5
|
+
var _a;
|
|
6
|
+
return !!((_a = theme.pointer) === null || _a === void 0 ? void 0 : _a.settings.find((pointerTheme) => pointerTheme.variant === variant));
|
|
7
|
+
};
|
|
8
|
+
const addData = async (map, data, theme) => {
|
|
9
|
+
const features = {};
|
|
10
|
+
variants.forEach((variant) => (features[variant] = []));
|
|
11
|
+
data.forEach((item) => {
|
|
12
|
+
const { variant } = item;
|
|
13
|
+
if (variants.indexOf(variant) < 0) {
|
|
14
|
+
variants.push(variant);
|
|
15
|
+
features[variant] = [];
|
|
16
|
+
}
|
|
17
|
+
if (isPointerVariant(variant, theme)) {
|
|
18
|
+
features[variant].push({
|
|
19
|
+
type: 'Feature',
|
|
20
|
+
geometry: {
|
|
21
|
+
coordinates: calculateCenter(item.coordinates),
|
|
22
|
+
type: 'Point',
|
|
23
|
+
},
|
|
24
|
+
properties: Object.assign({}, item),
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
else {
|
|
28
|
+
item.coordinates.forEach((coordinate) => {
|
|
29
|
+
features[variant].push({
|
|
30
|
+
type: 'Feature',
|
|
31
|
+
geometry: {
|
|
32
|
+
coordinates: [coordinate],
|
|
33
|
+
type: 'Polygon',
|
|
34
|
+
},
|
|
35
|
+
properties: Object.assign({}, item),
|
|
36
|
+
});
|
|
37
|
+
});
|
|
38
|
+
}
|
|
39
|
+
});
|
|
40
|
+
await functionIsTrue(() => map.isStyleLoaded() && map.isSourceLoaded);
|
|
41
|
+
Object.keys(features).forEach((variant) => {
|
|
42
|
+
const variantFeatures = features[variant];
|
|
43
|
+
const source = map.getSource(variant);
|
|
44
|
+
if (source) {
|
|
45
|
+
source.setData({
|
|
46
|
+
type: 'FeatureCollection',
|
|
47
|
+
features: variantFeatures,
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
});
|
|
51
|
+
};
|
|
52
|
+
|
|
53
|
+
export { addData as default };
|
|
54
|
+
//# sourceMappingURL=add-data.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"add-data.js","sources":["../../../../../../src/molecules/map/utilities/mapbox/add-data.ts"],"sourcesContent":["import { MapData, MapTheme } from '@bpd-library/types';\nimport { calculateCenter, functionIsTrue } from '@bpd-library/utilities';\n\nconst variants: string[] = [];\n\nconst isPointerVariant = (variant: string, theme: MapTheme) => {\n return !!theme.pointer?.settings.find((pointerTheme) => pointerTheme.variant === variant);\n};\n\nconst addData = async (map: mapboxgl.Map, data: MapData, theme: MapTheme) => {\n const features: { [variant: string]: GeoJSON.Feature[] } = {};\n\n /*\n Create empty arrays for previously set variants,\n this will make sure old variants will be removed.\n */\n variants.forEach((variant) => (features[variant] = []));\n\n /*\n Construct GeoJSON Features\n */\n data.forEach((item) => {\n const { variant } = item;\n\n if (variants.indexOf(variant) < 0) {\n variants.push(variant);\n features[variant] = [];\n }\n\n if (isPointerVariant(variant, theme)) {\n features[variant].push({\n type: 'Feature',\n geometry: {\n coordinates: calculateCenter(item.coordinates),\n type: 'Point',\n },\n properties: {\n ...item,\n },\n });\n } else {\n item.coordinates.forEach((coordinate) => {\n features[variant].push({\n type: 'Feature',\n geometry: {\n coordinates: [coordinate],\n type: 'Polygon',\n },\n properties: {\n ...item,\n },\n });\n });\n }\n });\n\n /*\n Update layer with features\n */\n await functionIsTrue(() => map.isStyleLoaded() && map.isSourceLoaded);\n\n Object.keys(features).forEach((variant) => {\n const variantFeatures = features[variant];\n\n const source = map.getSource(variant) as mapboxgl.GeoJSONSource | undefined;\n\n if (source) {\n source.setData({\n type: 'FeatureCollection',\n features: variantFeatures,\n });\n }\n });\n};\n\nexport default addData;\n"],"names":[],"mappings":";;AAGA,MAAM,QAAQ,GAAa,EAAE,CAAC;AAE9B,MAAM,gBAAgB,GAAG,CAAC,OAAe,EAAE,KAAe;;IACtD,OAAO,CAAC,QAAC,KAAK,CAAC,OAAO,0CAAE,QAAQ,CAAC,IAAI,CAAC,CAAC,YAAY,KAAK,YAAY,CAAC,OAAO,KAAK,OAAO,EAAC,CAAC;AAC9F,CAAC,CAAC;MAEI,OAAO,GAAG,OAAO,GAAiB,EAAE,IAAa,EAAE,KAAe;IACpE,MAAM,QAAQ,GAA6C,EAAE,CAAC;IAM9D,QAAQ,CAAC,OAAO,CAAC,CAAC,OAAO,MAAM,QAAQ,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;IAKxD,IAAI,CAAC,OAAO,CAAC,CAAC,IAAI;QACd,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC;QAEzB,IAAI,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;YAC/B,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACvB,QAAQ,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC;SAC1B;QAED,IAAI,gBAAgB,CAAC,OAAO,EAAE,KAAK,CAAC,EAAE;YAClC,QAAQ,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC;gBACnB,IAAI,EAAE,SAAS;gBACf,QAAQ,EAAE;oBACN,WAAW,EAAE,eAAe,CAAC,IAAI,CAAC,WAAW,CAAC;oBAC9C,IAAI,EAAE,OAAO;iBAChB;gBACD,UAAU,oBACH,IAAI,CACV;aACJ,CAAC,CAAC;SACN;aAAM;YACH,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,UAAU;gBAChC,QAAQ,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC;oBACnB,IAAI,EAAE,SAAS;oBACf,QAAQ,EAAE;wBACN,WAAW,EAAE,CAAC,UAAU,CAAC;wBACzB,IAAI,EAAE,SAAS;qBAClB;oBACD,UAAU,oBACH,IAAI,CACV;iBACJ,CAAC,CAAC;aACN,CAAC,CAAC;SACN;KACJ,CAAC,CAAC;IAKH,MAAM,cAAc,CAAC,MAAM,GAAG,CAAC,aAAa,EAAE,IAAI,GAAG,CAAC,cAAc,CAAC,CAAC;IAEtE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,OAAO;QAClC,MAAM,eAAe,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC;QAE1C,MAAM,MAAM,GAAG,GAAG,CAAC,SAAS,CAAC,OAAO,CAAuC,CAAC;QAE5E,IAAI,MAAM,EAAE;YACR,MAAM,CAAC,OAAO,CAAC;gBACX,IAAI,EAAE,mBAAmB;gBACzB,QAAQ,EAAE,eAAe;aAC5B,CAAC,CAAC;SACN;KACJ,CAAC,CAAC;AACP;;;;"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { calculateCenter } from '@bpd-library/utilities';
|
|
2
|
+
import { MAP_FLY_EASING_FUNCTION, MAP_FLY_DURATION } from './constants.js';
|
|
3
|
+
|
|
4
|
+
const center = (map, coordinates) => {
|
|
5
|
+
const center = calculateCenter(coordinates);
|
|
6
|
+
map.flyTo({
|
|
7
|
+
center,
|
|
8
|
+
curve: 0,
|
|
9
|
+
easing: MAP_FLY_EASING_FUNCTION,
|
|
10
|
+
duration: MAP_FLY_DURATION,
|
|
11
|
+
});
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
export { center as default };
|
|
15
|
+
//# sourceMappingURL=center.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"center.js","sources":["../../../../../../src/molecules/map/utilities/mapbox/center.ts"],"sourcesContent":["import { Coordinates } from '@bpd-library/types';\nimport { calculateCenter } from '@bpd-library/utilities';\n\nimport { MAP_FLY_DURATION, MAP_FLY_EASING_FUNCTION } from './constants';\n\nconst center = (map: mapboxgl.Map, coordinates: Coordinates) => {\n const center = calculateCenter(coordinates);\n\n map.flyTo({\n center,\n curve: 0,\n easing: MAP_FLY_EASING_FUNCTION,\n duration: MAP_FLY_DURATION,\n });\n};\n\nexport default center;\n"],"names":[],"mappings":";;;MAKM,MAAM,GAAG,CAAC,GAAiB,EAAE,WAAwB;IACvD,MAAM,MAAM,GAAG,eAAe,CAAC,WAAW,CAAC,CAAC;IAE5C,GAAG,CAAC,KAAK,CAAC;QACN,MAAM;QACN,KAAK,EAAE,CAAC;QACR,MAAM,EAAE,uBAAuB;QAC/B,QAAQ,EAAE,gBAAgB;KAC7B,CAAC,CAAC;AACP;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constants.js","sources":["../../../../../../src/molecules/map/utilities/mapbox/constants.ts"],"sourcesContent":["export const MAP_FLY_DURATION = 1000;\nexport const MAP_FLY_EASING_FUNCTION = (t: number) =>\n t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1;\n"],"names":[],"mappings":"MAAa,gBAAgB,GAAG,KAAK;MACxB,uBAAuB,GAAG,CAAC,CAAS,KAC7C,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import addData from './add-data.js';
|
|
2
|
+
import center from './center.js';
|
|
3
|
+
import setupPointers from './pointers/setup-pointers.js';
|
|
4
|
+
import setFeatureState from './polygons/feature-state.js';
|
|
5
|
+
import geojson from './polygons/geojson.js';
|
|
6
|
+
import interaction from './polygons/interaction.js';
|
|
7
|
+
import layer from './polygons/layer.js';
|
|
8
|
+
import raster from './raster.js';
|
|
9
|
+
import search from './search/search.js';
|
|
10
|
+
import { addTooltip, removeTooltip } from './tooltip.js';
|
|
11
|
+
|
|
12
|
+
const mapbox = (map, options, theme) => ({
|
|
13
|
+
raster: (settings) => raster(map, settings),
|
|
14
|
+
geojson: (setting) => geojson(map, setting),
|
|
15
|
+
layer: (setting) => layer(map, setting),
|
|
16
|
+
interaction: (setting) => interaction(map, setting),
|
|
17
|
+
center: (coordinates) => center(map, coordinates),
|
|
18
|
+
setupPointers: (element) => setupPointers(map, theme, element),
|
|
19
|
+
addData: (data) => addData(map, data, theme),
|
|
20
|
+
addTooltip: (coordinates, mapDataItem) => addTooltip(map, coordinates, mapDataItem, options.openInTab),
|
|
21
|
+
removeTooltip,
|
|
22
|
+
setFeatureState: (variant, id, type, hover) => setFeatureState(map, variant, id, type, hover),
|
|
23
|
+
search: (searchOptions) => search(map, searchOptions, options),
|
|
24
|
+
});
|
|
25
|
+
|
|
26
|
+
export { mapbox as default };
|
|
27
|
+
//# sourceMappingURL=mapbox.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"mapbox.js","sources":["../../../../../../src/molecules/map/utilities/mapbox/mapbox.ts"],"sourcesContent":["import {\n Coordinates,\n MapData,\n MapDataItem,\n MapOptions,\n MapSearchOptions,\n MapTheme,\n PolygonThemeSetting,\n} from '@bpd-library/types';\n\nimport { MapLayerRasterSettings } from '../../store/map';\nimport addData from './add-data';\nimport center from './center';\nimport setupPointers from './pointers/setup-pointers';\nimport setFeatureState from './polygons/feature-state';\nimport geojson from './polygons/geojson';\nimport interaction from './polygons/interaction';\nimport layer from './polygons/layer';\nimport raster from './raster';\nimport search from './search/search';\nimport { addTooltip, removeTooltip } from './tooltip';\n\nconst mapbox = (map: mapboxgl.Map, options: MapOptions, theme: MapTheme) => ({\n raster: (settings: MapLayerRasterSettings) => raster(map, settings),\n geojson: (setting: PolygonThemeSetting) => geojson(map, setting),\n layer: (setting: PolygonThemeSetting) => layer(map, setting),\n interaction: (setting: PolygonThemeSetting) => interaction(map, setting),\n center: (coordinates: Coordinates) => center(map, coordinates),\n setupPointers: (element: HTMLElement) => setupPointers(map, theme, element),\n addData: (data: MapData) => addData(map, data, theme),\n addTooltip: (coordinates: Coordinates, mapDataItem: MapDataItem) =>\n addTooltip(map, coordinates, mapDataItem, options.openInTab),\n removeTooltip,\n setFeatureState: (variant: string, id: string, type: 'hover' | 'focus', hover: boolean) =>\n setFeatureState(map, variant, id, type, hover),\n search: (searchOptions: MapSearchOptions) => search(map, searchOptions, options),\n});\n\nexport default mapbox;\n"],"names":[],"mappings":";;;;;;;;;;;MAsBM,MAAM,GAAG,CAAC,GAAiB,EAAE,OAAmB,EAAE,KAAe,MAAM;IACzE,MAAM,EAAE,CAAC,QAAgC,KAAK,MAAM,CAAC,GAAG,EAAE,QAAQ,CAAC;IACnE,OAAO,EAAE,CAAC,OAA4B,KAAK,OAAO,CAAC,GAAG,EAAE,OAAO,CAAC;IAChE,KAAK,EAAE,CAAC,OAA4B,KAAK,KAAK,CAAC,GAAG,EAAE,OAAO,CAAC;IAC5D,WAAW,EAAE,CAAC,OAA4B,KAAK,WAAW,CAAC,GAAG,EAAE,OAAO,CAAC;IACxE,MAAM,EAAE,CAAC,WAAwB,KAAK,MAAM,CAAC,GAAG,EAAE,WAAW,CAAC;IAC9D,aAAa,EAAE,CAAC,OAAoB,KAAK,aAAa,CAAC,GAAG,EAAE,KAAK,EAAE,OAAO,CAAC;IAC3E,OAAO,EAAE,CAAC,IAAa,KAAK,OAAO,CAAC,GAAG,EAAE,IAAI,EAAE,KAAK,CAAC;IACrD,UAAU,EAAE,CAAC,WAAwB,EAAE,WAAwB,KAC3D,UAAU,CAAC,GAAG,EAAE,WAAW,EAAE,WAAW,EAAE,OAAO,CAAC,SAAS,CAAC;IAChE,aAAa;IACb,eAAe,EAAE,CAAC,OAAe,EAAE,EAAU,EAAE,IAAuB,EAAE,KAAc,KAClF,eAAe,CAAC,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC;IAClD,MAAM,EAAE,CAAC,aAA+B,KAAK,MAAM,CAAC,GAAG,EAAE,aAAa,EAAE,OAAO,CAAC;CACnF;;;;"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
const parseFeatureProperties = (obj) => {
|
|
2
|
+
const safeJSONParse = (str) => {
|
|
3
|
+
try {
|
|
4
|
+
return JSON.parse(str);
|
|
5
|
+
}
|
|
6
|
+
catch (e) {
|
|
7
|
+
return false;
|
|
8
|
+
}
|
|
9
|
+
};
|
|
10
|
+
Object.keys(obj).forEach(key => {
|
|
11
|
+
const parsedJSON = safeJSONParse(obj[key]);
|
|
12
|
+
obj[key] = parsedJSON || obj[key];
|
|
13
|
+
});
|
|
14
|
+
return obj;
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
export { parseFeatureProperties };
|
|
18
|
+
//# sourceMappingURL=parse-feature-properties.js.map
|