@bpd-library/components 1.6.1-beta.0 → 2.0.1-beta.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/dist/molecules/map/storybook/themes.js.map +1 -1
- package/dist/molecules/map/utilities/mapbox/parse-feature-properties.d.ts +1 -6
- package/dist/molecules/map/utilities/mapbox/parse-feature-properties.js +6 -4
- package/dist/molecules/map/utilities/mapbox/parse-feature-properties.js.map +1 -1
- package/dist/molecules/map/utilities/mapbox/pointers/setup-pointers.js +31 -26
- package/dist/molecules/map/utilities/mapbox/pointers/setup-pointers.js.map +1 -1
- package/dist/molecules/map/utilities/mapbox/polygons/interaction.js +2 -2
- package/dist/molecules/map/utilities/mapbox/polygons/interaction.js.map +1 -1
- package/dist/molecules/map/utilities/mapbox/polygons/layer.js +3 -1
- package/dist/molecules/map/utilities/mapbox/polygons/layer.js.map +1 -1
- package/package.json +4 -4
- package/dist/molecules/map/utilities/blocklist.d.ts +0 -9
- package/dist/molecules/map/utilities/blocklist.js +0 -9
- package/dist/molecules/map/utilities/blocklist.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"themes.js","sourceRoot":"","sources":["../../../../src/molecules/map/storybook/themes.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAGjC,MAAM,KAAK,GAAa;IACpB,OAAO,EAAE;QACL,QAAQ,EAAE;YACN;gBACI,OAAO,EAAE,YAAY;gBACrB,MAAM,EAAE;oBACJ,IAAI,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC;oBACtB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;gBACD,KAAK,EAAE;oBACH,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;oBAClB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;aACJ;YACD;gBACI,OAAO,EAAE,YAAY;gBACrB,MAAM,EAAE;oBACJ,IAAI,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC;oBACtB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;gBACD,KAAK,EAAE;oBACH,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;oBAClB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;aACJ;SACJ;KACJ;IACD,OAAO,EAAE;QACL,QAAQ,EAAE;YACN;gBACI,OAAO,EAAE,YAAY;gBACrB,aAAa,EAAE,GAAG,EAAE,CAAC,CACjB,WACI,KAAK,EAAE;wBACH,KAAK,EAAE,MAAM;wBACb,MAAM,EAAE,MAAM;wBACd,eAAe,EAAE,KAAK;wBACtB,kBAAkB,EAAE,OAAO;qBAC9B,
|
|
1
|
+
{"version":3,"file":"themes.js","sourceRoot":"","sources":["../../../../src/molecules/map/storybook/themes.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAGjC,MAAM,KAAK,GAAa;IACpB,OAAO,EAAE;QACL,QAAQ,EAAE;YACN;gBACI,OAAO,EAAE,YAAY;gBACrB,MAAM,EAAE;oBACJ,IAAI,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC;oBACtB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;gBACD,KAAK,EAAE;oBACH,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;oBAClB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;aACJ;YACD;gBACI,OAAO,EAAE,YAAY;gBACrB,MAAM,EAAE;oBACJ,IAAI,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC;oBACtB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;gBACD,KAAK,EAAE;oBACH,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;oBAClB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;aACJ;SACJ;KACJ;IACD,OAAO,EAAE;QACL,QAAQ,EAAE;YACN;gBACI,OAAO,EAAE,YAAY;gBACrB,aAAa,EAAE,GAAG,EAAE,CAAC,CACjB,WACI,KAAK,EAAE;wBACH,KAAK,EAAE,MAAM;wBACb,MAAM,EAAE,MAAM;wBACd,eAAe,EAAE,KAAK;wBACtB,kBAAkB,EAAE,OAAO;qBAC9B,GACH,CACL;aACJ;YACD;gBACI,OAAO,EAAE,YAAY;gBACrB,aAAa,EAAE,GAAG,EAAE,CAAC,CACjB,WACI,KAAK,EAAE;wBACH,KAAK,EAAE,MAAM;wBACb,MAAM,EAAE,MAAM;wBACd,eAAe,EAAE,KAAK;wBACtB,kBAAkB,EAAE,KAAK;qBAC5B,GACH,CACL;aACJ;SACJ;QACD,OAAO,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,gBAAO,KAAK,CAAQ;KACnD;CACJ,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import { h } from '@atomify/jsx';\nimport { MapTheme } from '@bpd-library/types';\n\nconst THEME: MapTheme = {\n polygon: {\n settings: [\n {\n variant: 'bouwnummer',\n normal: {\n fill: [255, 0, 0, 0.5],\n stroke: [255, 255, 255, 1],\n },\n hover: {\n fill: [0, 0, 0, 1],\n stroke: [255, 255, 255, 1],\n },\n },\n {\n variant: 'woningtype',\n normal: {\n fill: [0, 255, 0, 0.5],\n stroke: [255, 255, 255, 1],\n },\n hover: {\n fill: [0, 0, 0, 1],\n stroke: [255, 255, 255, 1],\n },\n },\n ],\n },\n pointer: {\n settings: [\n {\n variant: 'bouwnummer',\n createElement: () => (\n <div\n style={{\n width: '40px',\n height: '40px',\n 'border-radius': '50%',\n 'background-color': 'green',\n }}\n />\n ),\n },\n {\n variant: 'woningtype',\n createElement: () => (\n <div\n style={{\n width: '40px',\n height: '40px',\n 'border-radius': '50%',\n 'background-color': 'red',\n }}\n />\n ),\n },\n ],\n cluster: (total: number) => <span>{total}</span>,\n },\n};\n\nexport default THEME;\n"]}
|
|
@@ -1,6 +1 @@
|
|
|
1
|
-
export declare
|
|
2
|
-
[key: string]: string;
|
|
3
|
-
};
|
|
4
|
-
export declare const parseFeatureProperties: (obj: FeatureProperties) => {
|
|
5
|
-
[key: string]: any;
|
|
6
|
-
};
|
|
1
|
+
export declare const parseFeatureProperties: <T extends Record<string, any>>(obj: Record<string, string> | null) => T | null;
|
|
@@ -7,10 +7,12 @@ export const parseFeatureProperties = (obj) => {
|
|
|
7
7
|
return false;
|
|
8
8
|
}
|
|
9
9
|
};
|
|
10
|
-
|
|
10
|
+
if (!obj)
|
|
11
|
+
return null;
|
|
12
|
+
return Object.keys(obj).reduce((acc, key) => {
|
|
11
13
|
const parsedJSON = safeJSONParse(obj[key]);
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
14
|
+
acc[key] = parsedJSON || obj[key];
|
|
15
|
+
return acc;
|
|
16
|
+
}, {});
|
|
15
17
|
};
|
|
16
18
|
//# sourceMappingURL=parse-feature-properties.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"parse-feature-properties.js","sourceRoot":"","sources":["../../../../../src/molecules/map/utilities/mapbox/parse-feature-properties.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"parse-feature-properties.js","sourceRoot":"","sources":["../../../../../src/molecules/map/utilities/mapbox/parse-feature-properties.ts"],"names":[],"mappings":"AAUA,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAClC,GAAkC,EAC1B,EAAE;IACV,MAAM,aAAa,GAAG,CAAC,GAAW,EAAE,EAAE;QAClC,IAAI;YACA,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;SAC1B;QAAC,OAAO,CAAC,EAAE;YACR,OAAO,KAAK,CAAC;SAChB;IACL,CAAC,CAAC;IAEF,IAAI,CAAC,GAAG;QAAE,OAAO,IAAI,CAAC;IAEtB,OAAO,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,MAAM,CAAI,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE;QAC3C,MAAM,UAAU,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;QAC3C,GAAG,CAAC,GAAc,CAAC,GAAG,UAAU,IAAI,GAAG,CAAC,GAAG,CAAC,CAAC;QAE7C,OAAO,GAAG,CAAC;IACf,CAAC,EAAE,EAAO,CAAC,CAAC;AAChB,CAAC,CAAC","sourcesContent":["/**\n * This function will parse the passed object and cast it to a type.\n * It is very much expected that the caller knows the expected return type\n * and that the passed object has the correct shape.\n *\n * Otherwise it may cause runtime errors since typescript will think\n * that everything is okay with the returned object and will allow\n * non-optional access to required fields.\n * @param obj\n */\nexport const parseFeatureProperties = <T extends Record<string, any>>(\n obj: Record<string, string> | null,\n): T | null => {\n const safeJSONParse = (str: string) => {\n try {\n return JSON.parse(str);\n } catch (e) {\n return false;\n }\n };\n\n if (!obj) return null;\n\n return Object.keys(obj).reduce<T>((acc, key) => {\n const parsedJSON = safeJSONParse(obj[key]);\n acc[key as keyof T] = parsedJSON || obj[key];\n\n return acc;\n }, {} as T);\n};\n"]}
|
|
@@ -67,7 +67,7 @@ const setupPointers = (map, theme, element) => {
|
|
|
67
67
|
clusterChildren = clusterChildren === null || clusterChildren === void 0 ? void 0 : clusterChildren.filter(Boolean);
|
|
68
68
|
cluster.getElement().dataset.children = String(clusterChildren);
|
|
69
69
|
}
|
|
70
|
-
function addCluster(clus,
|
|
70
|
+
function addCluster(clus, setting) {
|
|
71
71
|
const { properties, geometry } = clus;
|
|
72
72
|
const { coordinates } = geometry;
|
|
73
73
|
const { cluster_id: id, point_count: count } = properties;
|
|
@@ -75,28 +75,30 @@ const setupPointers = (map, theme, element) => {
|
|
|
75
75
|
if (id && count) {
|
|
76
76
|
cluster = clusters.cache[id];
|
|
77
77
|
if (!cluster) {
|
|
78
|
+
const onCLick = () => {
|
|
79
|
+
element.classList.remove(MAP_HOVER_CLASS);
|
|
80
|
+
const source = map.getSource(setting.variant);
|
|
81
|
+
source.getClusterExpansionZoom(id, (err, zoom) => {
|
|
82
|
+
if (err)
|
|
83
|
+
return;
|
|
84
|
+
map.easeTo({
|
|
85
|
+
center: coordinates,
|
|
86
|
+
zoom,
|
|
87
|
+
duration: MAP_FLY_DURATION,
|
|
88
|
+
easing: MAP_FLY_EASING_FUNCTION,
|
|
89
|
+
});
|
|
90
|
+
});
|
|
91
|
+
};
|
|
78
92
|
cluster = new Marker({
|
|
79
93
|
element: (h("button", { id: id, class: "map__cluster", onMouseenter: () => {
|
|
80
94
|
element.classList.add(MAP_HOVER_CLASS);
|
|
81
95
|
}, onMouseleave: () => {
|
|
82
96
|
element.classList.remove(MAP_HOVER_CLASS);
|
|
83
|
-
}, onClick: ()
|
|
84
|
-
element.classList.remove(MAP_HOVER_CLASS);
|
|
85
|
-
map.getSource(variant).getClusterExpansionZoom(id, (err, zoom) => {
|
|
86
|
-
if (err)
|
|
87
|
-
return;
|
|
88
|
-
map.easeTo({
|
|
89
|
-
center: coordinates,
|
|
90
|
-
zoom,
|
|
91
|
-
duration: MAP_FLY_DURATION,
|
|
92
|
-
easing: MAP_FLY_EASING_FUNCTION,
|
|
93
|
-
});
|
|
94
|
-
});
|
|
95
|
-
} }, pointerTheme.cluster(count))),
|
|
97
|
+
}, onClick: onCLick }, pointerTheme.cluster(count))),
|
|
96
98
|
}).setLngLat(coordinates);
|
|
97
99
|
clusters.cache[id] = cluster;
|
|
98
100
|
}
|
|
99
|
-
const clusterSource = map.getSource(variant);
|
|
101
|
+
const clusterSource = map.getSource(setting.variant);
|
|
100
102
|
const config = {
|
|
101
103
|
cluster,
|
|
102
104
|
clusterSource,
|
|
@@ -108,27 +110,30 @@ const setupPointers = (map, theme, element) => {
|
|
|
108
110
|
}
|
|
109
111
|
return [cluster, id];
|
|
110
112
|
}
|
|
111
|
-
function addPointer({ properties,
|
|
113
|
+
function addPointer({ properties }, setting) {
|
|
114
|
+
var _a, _b;
|
|
112
115
|
const mapDataItem = parseFeatureProperties(properties);
|
|
113
|
-
|
|
114
|
-
const setting = pointerTheme.settings.find((setting) => setting.variant === variant);
|
|
115
|
-
if (!setting)
|
|
116
|
+
if (!mapDataItem)
|
|
116
117
|
return [undefined, undefined];
|
|
118
|
+
const { id, coordinates } = mapDataItem;
|
|
117
119
|
let pointer = pointers.cache[id];
|
|
118
120
|
const center = calculateCenter(coordinates);
|
|
119
121
|
if (!pointer) {
|
|
122
|
+
const Tag = ((_a = setting.baseElementOptions) === null || _a === void 0 ? void 0 : _a.tag) || 'button';
|
|
120
123
|
pointer = new Marker({
|
|
121
124
|
anchor: 'center',
|
|
122
|
-
element: (h(
|
|
125
|
+
element: (h(Tag, Object.assign({ id: `pointer-${id}`, onMouseenter: () => {
|
|
123
126
|
element.classList.add(MAP_HOVER_CLASS);
|
|
124
127
|
updateHover(mapDataItem);
|
|
125
128
|
}, onMouseleave: () => {
|
|
126
129
|
element.classList.remove(MAP_HOVER_CLASS);
|
|
127
130
|
clearHover();
|
|
128
|
-
},
|
|
131
|
+
} }, (!((_b = setting.baseElementOptions) === null || _b === void 0 ? void 0 : _b.disableClickEvent) && {
|
|
132
|
+
onClick(e) {
|
|
129
133
|
e.stopPropagation();
|
|
130
134
|
updateClick(mapDataItem);
|
|
131
|
-
},
|
|
135
|
+
},
|
|
136
|
+
}), { class: `map__pointer${setting.disablePointerEvents ? ' map__pointer--disabled' : ''}` }), setting.createElement(mapDataItem))),
|
|
132
137
|
}).setLngLat(center);
|
|
133
138
|
pointers.cache[id] = pointer;
|
|
134
139
|
}
|
|
@@ -140,17 +145,17 @@ const setupPointers = (map, theme, element) => {
|
|
|
140
145
|
var _a;
|
|
141
146
|
const newClusters = {};
|
|
142
147
|
const newPointers = {};
|
|
143
|
-
(_a = theme.pointer) === null || _a === void 0 ? void 0 : _a.settings.forEach((
|
|
144
|
-
const features = map.querySourceFeatures(variant);
|
|
148
|
+
(_a = theme.pointer) === null || _a === void 0 ? void 0 : _a.settings.forEach((setting) => {
|
|
149
|
+
const features = map.querySourceFeatures(setting.variant);
|
|
145
150
|
features.forEach((feature) => {
|
|
146
151
|
const { properties } = feature;
|
|
147
152
|
if (properties === null || properties === void 0 ? void 0 : properties.cluster) {
|
|
148
|
-
const [cluster, id] = addCluster(feature,
|
|
153
|
+
const [cluster, id] = addCluster(feature, setting);
|
|
149
154
|
if (cluster && id)
|
|
150
155
|
newClusters[id] = cluster;
|
|
151
156
|
}
|
|
152
157
|
else {
|
|
153
|
-
const [pointer, id] = addPointer(feature);
|
|
158
|
+
const [pointer, id] = addPointer(feature, setting);
|
|
154
159
|
if (pointer && id)
|
|
155
160
|
newPointers[id] = pointer;
|
|
156
161
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"setup-pointers.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/pointers/setup-pointers.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@atomify/jsx';\nimport { MapDataItem, MapTheme } from '@bpd-library/types';\nimport { calculateCenter, throttle } from '@bpd-library/utilities';\nimport { GeoJSONSource, LngLatLike, Marker } from 'mapbox-gl';\n\nimport { clearHover, updateClick, updateHover } from '../../../store';\nimport { MAP_FLY_DURATION, MAP_FLY_EASING_FUNCTION } from '../constants';\nimport { FeatureProperties, parseFeatureProperties } from '../parse-feature-properties';\n\ntype MapMarkers = { [key: string]: mapboxgl.Marker };\n\ntype MarkerObject = {\n cache: MapMarkers;\n onScreen: MapMarkers;\n};\n\ninterface ClusterChildren {\n cluster: Marker;\n clusterSource: GeoJSONSource;\n clusterId: number;\n}\n\ninterface MarkersToCluster {\n cluster: Marker;\n features: GeoJSON.Feature<GeoJSON.Geometry, GeoJSON.GeoJsonProperties>[];\n}\n\nconst MAP_HOVER_CLASS = 'map--hovering';\nconst POINTER_FADEOUT_DURATION = 300;\n\nconst setupPointers = (map: mapboxgl.Map, theme: MapTheme, element: HTMLElement) => {\n const { pointer: pointerTheme } = theme;\n const clusters: MarkerObject = { cache: {}, onScreen: {} };\n const pointers: MarkerObject = { cache: {}, onScreen: {} };\n const sourceNames: string[] = [];\n\n init();\n\n function init() {\n theme.pointer?.settings.forEach(({ variant, minzoom, maxzoom }) => {\n sourceNames.push(variant);\n\n map.addSource(variant, {\n type: 'geojson',\n data: { type: 'FeatureCollection', features: [] },\n cluster: true,\n clusterRadius: 50,\n clusterMaxZoom: 8,\n promoteId: 'id',\n });\n\n const layerSettings: mapboxgl.AnyLayer | mapboxgl.CustomLayerInterface = {\n id: variant,\n type: 'circle',\n source: variant,\n filter: ['!=', 'cluster', true],\n paint: {\n 'circle-opacity': 0,\n },\n };\n\n if (minzoom) layerSettings.minzoom = minzoom;\n if (maxzoom) layerSettings.maxzoom = maxzoom;\n\n map.addLayer(layerSettings);\n });\n\n bindEvents();\n }\n\n function bindEvents() {\n map.on('render', throttle(updateMarkers, 200));\n }\n\n function setClusterChildrenData({ cluster, clusterSource, clusterId }: ClusterChildren) {\n clusterSource?.getClusterChildren(clusterId!, (_, features) => {\n const markersLength = features[0].properties?.point_count;\n const OFFSET = 0;\n\n clusterSource.getClusterLeaves(clusterId, markersLength, OFFSET, (_, features) => {\n const config: MarkersToCluster = {\n cluster,\n features,\n };\n addMarkersToCluster(config);\n });\n });\n }\n\n function addMarkersToCluster({ cluster, features }: MarkersToCluster) {\n let clusterChildren: string[];\n\n clusterChildren = features.map((feature: any) => {\n return feature.properties?.id;\n });\n\n clusterChildren = clusterChildren?.filter(Boolean);\n cluster!.getElement().dataset.children = String(clusterChildren);\n }\n\n function addCluster(\n clus: GeoJSON.Feature,\n variant: string,\n ): [mapboxgl.Marker | undefined, number | undefined] {\n const { properties, geometry } = clus;\n const { coordinates } = geometry as GeoJSON.Point;\n const { cluster_id: id, point_count: count } = properties as {\n cluster_id?: number;\n point_count?: number;\n };\n\n let cluster: mapboxgl.Marker | undefined;\n\n if (id && count) {\n cluster = clusters.cache[id];\n if (!cluster) {\n cluster = new Marker({\n element: (\n <button\n id={id}\n class=\"map__cluster\"\n onMouseenter={() => {\n element.classList.add(MAP_HOVER_CLASS);\n }}\n onMouseleave={() => {\n element.classList.remove(MAP_HOVER_CLASS);\n }}\n onClick={() => {\n element.classList.remove(MAP_HOVER_CLASS);\n\n (map.getSource(variant) as GeoJSONSource).getClusterExpansionZoom(\n id,\n (err, zoom) => {\n if (err) return;\n\n map.easeTo({\n center: coordinates as LngLatLike,\n zoom,\n duration: MAP_FLY_DURATION,\n easing: MAP_FLY_EASING_FUNCTION,\n });\n },\n );\n }}>\n {pointerTheme!.cluster(count)}\n </button>\n ),\n }).setLngLat(coordinates as LngLatLike);\n\n clusters.cache[id] = cluster;\n }\n const clusterSource = map.getSource(variant) as GeoJSONSource;\n const config: ClusterChildren = {\n cluster,\n clusterSource,\n clusterId: id,\n };\n\n setClusterChildrenData(config);\n\n if (!clusters.onScreen[id]) cluster?.addTo(map);\n }\n\n return [cluster, id];\n }\n\n function addPointer({\n properties,\n }: GeoJSON.Feature): [mapboxgl.Marker | undefined, string | undefined] {\n const mapDataItem = parseFeatureProperties(properties as FeatureProperties) as MapDataItem;\n const { id, variant, coordinates } = mapDataItem;\n const setting = pointerTheme!.settings.find((setting) => setting.variant === variant);\n\n if (!setting) return [undefined, undefined];\n\n let pointer: mapboxgl.Marker | undefined = pointers.cache[id];\n const center = calculateCenter(coordinates);\n\n if (!pointer) {\n pointer = new Marker({\n anchor: 'center',\n element: (\n <button\n id={`pointer-${id}`}\n onMouseenter={() => {\n element.classList.add(MAP_HOVER_CLASS);\n updateHover(mapDataItem);\n }}\n onMouseleave={() => {\n element.classList.remove(MAP_HOVER_CLASS);\n clearHover();\n }}\n onClick={(e: Event) => {\n e.stopPropagation();\n updateClick(mapDataItem);\n }}\n class={`map__pointer${\n setting.disablePointerEvents ? ' map__pointer--disabled' : ''\n }`}>\n {setting.createElement(mapDataItem)}\n </button>\n ),\n }).setLngLat(center);\n\n pointers.cache[id] = pointer;\n }\n\n if (!pointers.onScreen[id]) pointer.addTo(map);\n\n return [pointer, id];\n }\n\n function updateMarkers() {\n const newClusters: MapMarkers = {};\n const newPointers: MapMarkers = {};\n\n theme.pointer?.settings.forEach(({ variant }) => {\n const features = map.querySourceFeatures(variant);\n\n features.forEach((feature) => {\n const { properties } = feature;\n\n if (properties?.cluster) {\n const [cluster, id] = addCluster(feature, variant);\n\n if (cluster && id) newClusters[id] = cluster;\n } else {\n const [pointer, id] = addPointer(feature);\n\n if (pointer && id) newPointers[id] = pointer;\n }\n });\n });\n\n Object.keys(clusters.onScreen).forEach((id) => {\n if (!newClusters[id]) clusters.onScreen[id].remove();\n });\n\n Object.keys(pointers.onScreen).forEach((id) => {\n if (!newPointers[id]) {\n fadeoutPointer(pointers.onScreen[id]);\n }\n });\n\n clusters.onScreen = newClusters;\n pointers.onScreen = newPointers;\n }\n\n function fadeoutPointer(pointer: mapboxgl.Marker) {\n const pointerElement = pointer.getElement();\n\n pointerElement.classList.add('map__pointer--fadeout');\n\n setTimeout(() => {\n pointer.remove();\n\n pointerElement.classList.remove('map__pointer--fadeout');\n }, POINTER_FADEOUT_DURATION);\n }\n};\n\nexport default setupPointers;\n"]}
|
|
1
|
+
{"version":3,"file":"setup-pointers.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/pointers/setup-pointers.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAEjC,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AACnE,OAAO,EAA6B,MAAM,EAAE,MAAM,WAAW,CAAC;AAE9D,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AACtE,OAAO,EAAE,gBAAgB,EAAE,uBAAuB,EAAE,MAAM,cAAc,CAAC;AACzE,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAoBrE,MAAM,eAAe,GAAG,eAAe,CAAC;AACxC,MAAM,wBAAwB,GAAG,GAAG,CAAC;AAErC,MAAM,aAAa,GAAG,CAAC,GAAiB,EAAE,KAAe,EAAE,OAAoB,EAAE,EAAE;IAC/E,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,GAAG,KAAK,CAAC;IACxC,MAAM,QAAQ,GAAiB,EAAE,KAAK,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC;IAC3D,MAAM,QAAQ,GAAiB,EAAE,KAAK,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC;IAC3D,MAAM,WAAW,GAAa,EAAE,CAAC;IAEjC,IAAI,EAAE,CAAC;IAEP,SAAS,IAAI;;QACT,MAAA,KAAK,CAAC,OAAO,0CAAE,QAAQ,CAAC,OAAO,CAAC,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE;YAC9D,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YAE1B,GAAG,CAAC,SAAS,CAAC,OAAO,EAAE;gBACnB,IAAI,EAAE,SAAS;gBACf,IAAI,EAAE,EAAE,IAAI,EAAE,mBAAmB,EAAE,QAAQ,EAAE,EAAE,EAAE;gBACjD,OAAO,EAAE,IAAI;gBACb,aAAa,EAAE,EAAE;gBACjB,cAAc,EAAE,CAAC;gBACjB,SAAS,EAAE,IAAI;aAClB,CAAC,CAAC;YAEH,MAAM,aAAa,GAAsD;gBACrE,EAAE,EAAE,OAAO;gBACX,IAAI,EAAE,QAAQ;gBACd,MAAM,EAAE,OAAO;gBACf,MAAM,EAAE,CAAC,IAAI,EAAE,SAAS,EAAE,IAAI,CAAC;gBAC/B,KAAK,EAAE;oBACH,gBAAgB,EAAE,CAAC;iBACtB;aACJ,CAAC;YAEF,IAAI,OAAO;gBAAE,aAAa,CAAC,OAAO,GAAG,OAAO,CAAC;YAC7C,IAAI,OAAO;gBAAE,aAAa,CAAC,OAAO,GAAG,OAAO,CAAC;YAE7C,GAAG,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;QAChC,CAAC,EAAE;QAEH,UAAU,EAAE,CAAC;IACjB,CAAC;IAED,SAAS,UAAU;QACf,GAAG,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,aAAa,EAAE,GAAG,CAAC,CAAC,CAAC;IACnD,CAAC;IAED,SAAS,sBAAsB,CAAC,EAAE,OAAO,EAAE,aAAa,EAAE,SAAS,EAAmB;QAClF,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,kBAAkB,CAAC,SAAU,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE;;YAC1D,MAAM,aAAa,SAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,UAAU,0CAAE,WAAW,CAAC;YAC1D,MAAM,MAAM,GAAG,CAAC,CAAC;YAEjB,aAAa,CAAC,gBAAgB,CAAC,SAAS,EAAE,aAAa,EAAE,MAAM,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE;gBAC7E,MAAM,MAAM,GAAqB;oBAC7B,OAAO;oBACP,QAAQ;iBACX,CAAC;gBACF,mBAAmB,CAAC,MAAM,CAAC,CAAC;YAChC,CAAC,CAAC,CAAC;QACP,CAAC,EAAE;IACP,CAAC;IAED,SAAS,mBAAmB,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAoB;QAChE,IAAI,eAAyB,CAAC;QAE9B,eAAe,GAAG,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAY,EAAE,EAAE;;YAC5C,aAAO,OAAO,CAAC,UAAU,0CAAE,EAAE,CAAC;QAClC,CAAC,CAAC,CAAC;QAEH,eAAe,GAAG,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,MAAM,CAAC,OAAO,CAAC,CAAC;QACnD,OAAO,CAAC,UAAU,EAAE,CAAC,OAAO,CAAC,QAAQ,GAAG,MAAM,CAAC,eAAe,CAAC,CAAC;IACpE,CAAC;IAED,SAAS,UAAU,CACf,IAAqB,EACrB,OAA4B;QAE5B,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QACtC,MAAM,EAAE,WAAW,EAAE,GAAG,QAAyB,CAAC;QAClD,MAAM,EAAE,UAAU,EAAE,EAAE,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,UAG9C,CAAC;QAEF,IAAI,OAAoC,CAAC;QAEzC,IAAI,EAAE,IAAI,KAAK,EAAE;YACb,OAAO,GAAG,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;YAC7B,IAAI,CAAC,OAAO,EAAE;gBACV,MAAM,OAAO,GAAG,GAAG,EAAE;oBACjB,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC;oBAE1C,MAAM,MAAM,GAAG,GAAG,CAAC,SAAS,CAAC,OAAO,CAAC,OAAO,CAAkB,CAAC;oBAC/D,MAAM,CAAC,uBAAuB,CAAC,EAAE,EAAE,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE;wBAC7C,IAAI,GAAG;4BAAE,OAAO;wBAChB,GAAG,CAAC,MAAM,CAAC;4BACP,MAAM,EAAE,WAAyB;4BACjC,IAAI;4BACJ,QAAQ,EAAE,gBAAgB;4BAC1B,MAAM,EAAE,uBAAuB;yBAClC,CAAC,CAAC;oBACP,CAAC,CAAC,CAAC;gBACP,CAAC,CAAC;gBAEF,OAAO,GAAG,IAAI,MAAM,CAAC;oBACjB,OAAO,EAAE,CACL,cACI,EAAE,EAAE,EAAE,EACN,KAAK,EAAC,cAAc,EACpB,YAAY,EAAE,GAAG,EAAE;4BACf,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;wBAC3C,CAAC,EACD,YAAY,EAAE,GAAG,EAAE;4BACf,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC;wBAC9C,CAAC,EACD,OAAO,EAAE,OAAO,IACf,YAAa,CAAC,OAAO,CAAC,KAAK,CAAC,CACxB,CACZ;iBACJ,CAAC,CAAC,SAAS,CAAC,WAAyB,CAAC,CAAC;gBAExC,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC;aAChC;YACD,MAAM,aAAa,GAAG,GAAG,CAAC,SAAS,CAAC,OAAO,CAAC,OAAO,CAAkB,CAAC;YACtE,MAAM,MAAM,GAAoB;gBAC5B,OAAO;gBACP,aAAa;gBACb,SAAS,EAAE,EAAE;aAChB,CAAC;YAEF,sBAAsB,CAAC,MAAM,CAAC,CAAC;YAE/B,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC;gBAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK,CAAC,GAAG,EAAE;SACnD;QAED,OAAO,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;IACzB,CAAC;IAED,SAAS,UAAU,CACf,EAAE,UAAU,EAAmB,EAC/B,OAA4B;;QAE5B,MAAM,WAAW,GAAG,sBAAsB,CAAc,UAAU,CAAC,CAAC;QACpE,IAAI,CAAC,WAAW;YAAE,OAAO,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QAChD,MAAM,EAAE,EAAE,EAAE,WAAW,EAAE,GAAG,WAAW,CAAC;QAExC,IAAI,OAAO,GAAgC,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;QAC9D,MAAM,MAAM,GAAG,eAAe,CAAC,WAAW,CAAC,CAAC;QAE5C,IAAI,CAAC,OAAO,EAAE;YACV,MAAM,GAAG,GAAG,OAAA,OAAO,CAAC,kBAAkB,0CAAE,GAAG,KAAI,QAAQ,CAAC;YACxD,OAAO,GAAG,IAAI,MAAM,CAAC;gBACjB,MAAM,EAAE,QAAQ;gBAChB,OAAO,EAAE,CACL,EAAC,GAAG,kBACA,EAAE,EAAE,WAAW,EAAE,EAAE,EACnB,YAAY,EAAE,GAAG,EAAE;wBACf,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;wBACvC,WAAW,CAAC,WAAW,CAAC,CAAC;oBAC7B,CAAC,EACD,YAAY,EAAE,GAAG,EAAE;wBACf,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC;wBAC1C,UAAU,EAAE,CAAC;oBACjB,CAAC,IACG,CAAC,QAAC,OAAO,CAAC,kBAAkB,0CAAE,iBAAiB,CAAA,IAAI;oBACnD,OAAO,CAAC,CAAQ;wBACZ,CAAC,CAAC,eAAe,EAAE,CAAC;wBACpB,WAAW,CAAC,WAAW,CAAC,CAAC;oBAC7B,CAAC;iBACJ,CAAC,IACF,KAAK,EAAE,eACH,OAAO,CAAC,oBAAoB,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,EAC/D,EAAE,KACD,OAAO,CAAC,aAAa,CAAC,WAAW,CAAC,CACjC,CACT;aACJ,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;YAErB,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC;SAChC;QAED,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC;YAAE,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAE/C,OAAO,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;IACzB,CAAC;IAED,SAAS,aAAa;;QAClB,MAAM,WAAW,GAAe,EAAE,CAAC;QACnC,MAAM,WAAW,GAAe,EAAE,CAAC;QAEnC,MAAA,KAAK,CAAC,OAAO,0CAAE,QAAQ,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;YACxC,MAAM,QAAQ,GAAG,GAAG,CAAC,mBAAmB,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;YAE1D,QAAQ,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;gBACzB,MAAM,EAAE,UAAU,EAAE,GAAG,OAAO,CAAC;gBAE/B,IAAI,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,OAAO,EAAE;oBACrB,MAAM,CAAC,OAAO,EAAE,EAAE,CAAC,GAAG,UAAU,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;oBAEnD,IAAI,OAAO,IAAI,EAAE;wBAAE,WAAW,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC;iBAChD;qBAAM;oBACH,MAAM,CAAC,OAAO,EAAE,EAAE,CAAC,GAAG,UAAU,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;oBAEnD,IAAI,OAAO,IAAI,EAAE;wBAAE,WAAW,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC;iBAChD;YACL,CAAC,CAAC,CAAC;QACP,CAAC,EAAE;QAEH,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE;YAC1C,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC;gBAAE,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,MAAM,EAAE,CAAC;QACzD,CAAC,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE;YAC1C,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,EAAE;gBAClB,cAAc,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC;aACzC;QACL,CAAC,CAAC,CAAC;QAEH,QAAQ,CAAC,QAAQ,GAAG,WAAW,CAAC;QAChC,QAAQ,CAAC,QAAQ,GAAG,WAAW,CAAC;IACpC,CAAC;IAED,SAAS,cAAc,CAAC,OAAwB;QAC5C,MAAM,cAAc,GAAG,OAAO,CAAC,UAAU,EAAE,CAAC;QAE5C,cAAc,CAAC,SAAS,CAAC,GAAG,CAAC,uBAAuB,CAAC,CAAC;QAEtD,UAAU,CAAC,GAAG,EAAE;YACZ,OAAO,CAAC,MAAM,EAAE,CAAC;YAEjB,cAAc,CAAC,SAAS,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC;QAC7D,CAAC,EAAE,wBAAwB,CAAC,CAAC;IACjC,CAAC;AACL,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { h } from '@atomify/jsx';\nimport { MapDataItem, MapTheme, PointerThemeSetting } from '@bpd-library/types';\nimport { calculateCenter, throttle } from '@bpd-library/utilities';\nimport { GeoJSONSource, LngLatLike, Marker } from 'mapbox-gl';\n\nimport { clearHover, updateClick, updateHover } from '../../../store';\nimport { MAP_FLY_DURATION, MAP_FLY_EASING_FUNCTION } from '../constants';\nimport { parseFeatureProperties } from '../parse-feature-properties';\n\ntype MapMarkers = { [key: string]: mapboxgl.Marker };\n\ntype MarkerObject = {\n cache: MapMarkers;\n onScreen: MapMarkers;\n};\n\ninterface ClusterChildren {\n cluster: Marker;\n clusterSource: GeoJSONSource;\n clusterId: number;\n}\n\ninterface MarkersToCluster {\n cluster: Marker;\n features: GeoJSON.Feature<GeoJSON.Geometry, GeoJSON.GeoJsonProperties>[];\n}\n\nconst MAP_HOVER_CLASS = 'map--hovering';\nconst POINTER_FADEOUT_DURATION = 300;\n\nconst setupPointers = (map: mapboxgl.Map, theme: MapTheme, element: HTMLElement) => {\n const { pointer: pointerTheme } = theme;\n const clusters: MarkerObject = { cache: {}, onScreen: {} };\n const pointers: MarkerObject = { cache: {}, onScreen: {} };\n const sourceNames: string[] = [];\n\n init();\n\n function init() {\n theme.pointer?.settings.forEach(({ variant, minzoom, maxzoom }) => {\n sourceNames.push(variant);\n\n map.addSource(variant, {\n type: 'geojson',\n data: { type: 'FeatureCollection', features: [] },\n cluster: true,\n clusterRadius: 50,\n clusterMaxZoom: 8,\n promoteId: 'id',\n });\n\n const layerSettings: mapboxgl.AnyLayer | mapboxgl.CustomLayerInterface = {\n id: variant,\n type: 'circle',\n source: variant,\n filter: ['!=', 'cluster', true],\n paint: {\n 'circle-opacity': 0,\n },\n };\n\n if (minzoom) layerSettings.minzoom = minzoom;\n if (maxzoom) layerSettings.maxzoom = maxzoom;\n\n map.addLayer(layerSettings);\n });\n\n bindEvents();\n }\n\n function bindEvents() {\n map.on('render', throttle(updateMarkers, 200));\n }\n\n function setClusterChildrenData({ cluster, clusterSource, clusterId }: ClusterChildren) {\n clusterSource?.getClusterChildren(clusterId!, (_, features) => {\n const markersLength = features[0].properties?.point_count;\n const OFFSET = 0;\n\n clusterSource.getClusterLeaves(clusterId, markersLength, OFFSET, (_, features) => {\n const config: MarkersToCluster = {\n cluster,\n features,\n };\n addMarkersToCluster(config);\n });\n });\n }\n\n function addMarkersToCluster({ cluster, features }: MarkersToCluster) {\n let clusterChildren: string[];\n\n clusterChildren = features.map((feature: any) => {\n return feature.properties?.id;\n });\n\n clusterChildren = clusterChildren?.filter(Boolean);\n cluster.getElement().dataset.children = String(clusterChildren);\n }\n\n function addCluster(\n clus: GeoJSON.Feature,\n setting: PointerThemeSetting,\n ): [mapboxgl.Marker | undefined, number | undefined] {\n const { properties, geometry } = clus;\n const { coordinates } = geometry as GeoJSON.Point;\n const { cluster_id: id, point_count: count } = properties as {\n cluster_id?: number;\n point_count?: number;\n };\n\n let cluster: mapboxgl.Marker | undefined;\n\n if (id && count) {\n cluster = clusters.cache[id];\n if (!cluster) {\n const onCLick = () => {\n element.classList.remove(MAP_HOVER_CLASS);\n\n const source = map.getSource(setting.variant) as GeoJSONSource;\n source.getClusterExpansionZoom(id, (err, zoom) => {\n if (err) return;\n map.easeTo({\n center: coordinates as LngLatLike,\n zoom,\n duration: MAP_FLY_DURATION,\n easing: MAP_FLY_EASING_FUNCTION,\n });\n });\n };\n\n cluster = new Marker({\n element: (\n <button\n id={id}\n class=\"map__cluster\"\n onMouseenter={() => {\n element.classList.add(MAP_HOVER_CLASS);\n }}\n onMouseleave={() => {\n element.classList.remove(MAP_HOVER_CLASS);\n }}\n onClick={onCLick}>\n {pointerTheme!.cluster(count)}\n </button>\n ),\n }).setLngLat(coordinates as LngLatLike);\n\n clusters.cache[id] = cluster;\n }\n const clusterSource = map.getSource(setting.variant) as GeoJSONSource;\n const config: ClusterChildren = {\n cluster,\n clusterSource,\n clusterId: id,\n };\n\n setClusterChildrenData(config);\n\n if (!clusters.onScreen[id]) cluster?.addTo(map);\n }\n\n return [cluster, id];\n }\n\n function addPointer(\n { properties }: GeoJSON.Feature,\n setting: PointerThemeSetting,\n ): [mapboxgl.Marker | undefined, string | undefined] {\n const mapDataItem = parseFeatureProperties<MapDataItem>(properties);\n if (!mapDataItem) return [undefined, undefined];\n const { id, coordinates } = mapDataItem;\n\n let pointer: mapboxgl.Marker | undefined = pointers.cache[id];\n const center = calculateCenter(coordinates);\n\n if (!pointer) {\n const Tag = setting.baseElementOptions?.tag || 'button';\n pointer = new Marker({\n anchor: 'center',\n element: (\n <Tag\n id={`pointer-${id}`}\n onMouseenter={() => {\n element.classList.add(MAP_HOVER_CLASS);\n updateHover(mapDataItem);\n }}\n onMouseleave={() => {\n element.classList.remove(MAP_HOVER_CLASS);\n clearHover();\n }}\n {...(!setting.baseElementOptions?.disableClickEvent && {\n onClick(e: Event) {\n e.stopPropagation();\n updateClick(mapDataItem);\n },\n })}\n class={`map__pointer${\n setting.disablePointerEvents ? ' map__pointer--disabled' : ''\n }`}>\n {setting.createElement(mapDataItem)}\n </Tag>\n ),\n }).setLngLat(center);\n\n pointers.cache[id] = pointer;\n }\n\n if (!pointers.onScreen[id]) pointer.addTo(map);\n\n return [pointer, id];\n }\n\n function updateMarkers() {\n const newClusters: MapMarkers = {};\n const newPointers: MapMarkers = {};\n\n theme.pointer?.settings.forEach((setting) => {\n const features = map.querySourceFeatures(setting.variant);\n\n features.forEach((feature) => {\n const { properties } = feature;\n\n if (properties?.cluster) {\n const [cluster, id] = addCluster(feature, setting);\n\n if (cluster && id) newClusters[id] = cluster;\n } else {\n const [pointer, id] = addPointer(feature, setting);\n\n if (pointer && id) newPointers[id] = pointer;\n }\n });\n });\n\n Object.keys(clusters.onScreen).forEach((id) => {\n if (!newClusters[id]) clusters.onScreen[id].remove();\n });\n\n Object.keys(pointers.onScreen).forEach((id) => {\n if (!newPointers[id]) {\n fadeoutPointer(pointers.onScreen[id]);\n }\n });\n\n clusters.onScreen = newClusters;\n pointers.onScreen = newPointers;\n }\n\n function fadeoutPointer(pointer: mapboxgl.Marker) {\n const pointerElement = pointer.getElement();\n\n pointerElement.classList.add('map__pointer--fadeout');\n\n setTimeout(() => {\n pointer.remove();\n\n pointerElement.classList.remove('map__pointer--fadeout');\n }, POINTER_FADEOUT_DURATION);\n }\n};\n\nexport default setupPointers;\n"]}
|
|
@@ -14,7 +14,7 @@ const interaction = (map, setting) => {
|
|
|
14
14
|
return;
|
|
15
15
|
if (((_a = hover.current) === null || _a === void 0 ? void 0 : _a.id) !== feature.id) {
|
|
16
16
|
const item = parseFeatureProperties(feature.properties);
|
|
17
|
-
updateHover(item);
|
|
17
|
+
item && updateHover(item);
|
|
18
18
|
}
|
|
19
19
|
});
|
|
20
20
|
map.on('mouseleave', setting.variant + '-fill', () => {
|
|
@@ -24,7 +24,7 @@ const interaction = (map, setting) => {
|
|
|
24
24
|
const feature = getFeatureFromEvent(e);
|
|
25
25
|
if (feature) {
|
|
26
26
|
const item = parseFeatureProperties(feature.properties);
|
|
27
|
-
updateClick(item);
|
|
27
|
+
item && updateClick(item);
|
|
28
28
|
}
|
|
29
29
|
});
|
|
30
30
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interaction.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/polygons/interaction.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAChF,OAAO,
|
|
1
|
+
{"version":3,"file":"interaction.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/polygons/interaction.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAChF,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAMrE,MAAM,mBAAmB,GAAG,CAAC,CAAc,EAAE,EAAE;IAC3C,MAAM,QAAQ,GAAG,CAAC,CAAC,QAAQ,CAAC;IAC5B,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAEnD,OAAO,OAAO,IAAI,SAAS,CAAC;AAChC,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,GAAiB,EAAE,OAA4B,EAAE,EAAE;IACpE,GAAG,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;;QACjD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;QACzB,MAAM,OAAO,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC;QAEvC,IAAI,CAAC,OAAO;YAAE,OAAO;QACrB,IAAI,OAAA,KAAK,CAAC,OAAO,0CAAE,EAAE,MAAK,OAAO,CAAC,EAAE,EAAE;YAClC,MAAM,IAAI,GAAG,sBAAsB,CAAc,OAAO,CAAC,UAAU,CAAC,CAAC;YACrE,IAAI,IAAI,WAAW,CAAC,IAAI,CAAC,CAAC;SAC7B;IACL,CAAC,CAAC,CAAC;IAEH,GAAG,CAAC,EAAE,CAAC,YAAY,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,GAAG,EAAE;QACjD,UAAU,EAAE,CAAC;IACjB,CAAC,CAAC,CAAC;IAEH,GAAG,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;QAC7C,MAAM,OAAO,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC;QACvC,IAAI,OAAO,EAAE;YACT,MAAM,IAAI,GAAG,sBAAsB,CAAc,OAAO,CAAC,UAAU,CAAC,CAAC;YACrE,IAAI,IAAI,WAAW,CAAC,IAAI,CAAC,CAAC;SAC7B;IACL,CAAC,CAAC,CAAC;AACP,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { MapDataItem, PolygonThemeSetting } from '@bpd-library/types';\n\nimport { clearHover, getHover, updateClick, updateHover } from '../../../store';\nimport { parseFeatureProperties } from '../parse-feature-properties';\n\ntype MapboxEvent = mapboxgl.MapMouseEvent & {\n features?: mapboxgl.MapboxGeoJSONFeature[] | undefined;\n} & mapboxgl.EventData;\n\nconst getFeatureFromEvent = (e: MapboxEvent) => {\n const features = e.features;\n const feature = features ? features[0] : undefined;\n\n return feature || undefined;\n};\n\nconst interaction = (map: mapboxgl.Map, setting: PolygonThemeSetting) => {\n map.on('mousemove', setting.variant + '-fill', (e) => {\n const hover = getHover();\n const feature = getFeatureFromEvent(e);\n\n if (!feature) return;\n if (hover.current?.id !== feature.id) {\n const item = parseFeatureProperties<MapDataItem>(feature.properties);\n item && updateHover(item);\n }\n });\n\n map.on('mouseleave', setting.variant + '-fill', () => {\n clearHover();\n });\n\n map.on('click', setting.variant + '-fill', (e) => {\n const feature = getFeatureFromEvent(e);\n if (feature) {\n const item = parseFeatureProperties<MapDataItem>(feature.properties);\n item && updateClick(item);\n }\n });\n};\n\nexport default interaction;\n"]}
|
|
@@ -64,7 +64,7 @@ const layer = (map, { variant, normal, hover, minzoom, maxzoom, visibility = 'vi
|
|
|
64
64
|
});
|
|
65
65
|
setTransitionPaintProperty(`${variant}-line`, normal.stroke, 'line-color');
|
|
66
66
|
}
|
|
67
|
-
if (hover) {
|
|
67
|
+
if (hover === null || hover === void 0 ? void 0 : hover.fill) {
|
|
68
68
|
map.addLayer({
|
|
69
69
|
id: `${variant}-fill-hover`,
|
|
70
70
|
type: 'fill',
|
|
@@ -80,6 +80,8 @@ const layer = (map, { variant, normal, hover, minzoom, maxzoom, visibility = 'vi
|
|
|
80
80
|
},
|
|
81
81
|
});
|
|
82
82
|
setTransitionPaintProperty(`${variant}-fill-hover`, hover.fill, 'fill-color');
|
|
83
|
+
}
|
|
84
|
+
if (hover === null || hover === void 0 ? void 0 : hover.stroke) {
|
|
83
85
|
if (normal.stroke) {
|
|
84
86
|
map.addLayer({
|
|
85
87
|
id: `${variant}-line-hover`,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layer.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/polygons/layer.ts"],"names":[],"mappings":"AAEA,MAAM,QAAQ,GAAG,CAAC,CAAC;AACnB,MAAM,QAAQ,GAAG,EAAE,CAAC;AACpB,MAAM,UAAU,GAAG,CAAC,CAAC;AACrB,MAAM,sBAAsB,GAAG,IAAI,CAAC;AAEpC,MAAM,oBAAoB,GAAwB;IAC9C,MAAM;IACN,CAAC,SAAS,EAAE,CAAC,eAAe,EAAE,OAAO,CAAC,EAAE,KAAK,CAAC;IAC9C,CAAC;IACD,CAAC,SAAS,EAAE,CAAC,eAAe,EAAE,OAAO,CAAC,EAAE,KAAK,CAAC;IAC9C,CAAC;IACD,CAAC;CACJ,CAAC;AAEF,MAAM,mBAAmB,GAAwB;IAC7C,MAAM;IACN,CAAC,SAAS,EAAE,CAAC,eAAe,EAAE,OAAO,CAAC,EAAE,KAAK,CAAC;IAC9C,CAAC;IACD,CAAC,SAAS,EAAE,CAAC,eAAe,EAAE,OAAO,CAAC,EAAE,KAAK,CAAC;IAC9C,CAAC;IACD,CAAC;CACJ,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAO,EAAE,cAAuB,EAAE,EAAE;IAC/D,CAAC,GAAG,cAAc,KAAK,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;IAEtD,OAAO,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC;AACvC,CAAC,CAAC;AAEF,MAAM,KAAK,GAAG,CACV,GAAiB,EACjB,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,UAAU,GAAG,SAAS,EAAuB,EAC3F,EAAE;IAEA,IAAI,YAAY,GAAG,OAAO,CAAC,CAAC,CAAC,OAAO,GAAG,sBAAsB,CAAC,CAAC,CAAC,QAAQ,CAAC;IACzE,IAAI,YAAY,GAAG,OAAO,CAAC,CAAC,CAAC,OAAO,GAAG,sBAAsB,CAAC,CAAC,CAAC,QAAQ,CAAC;IAGzE,IAAI,YAAY,GAAG,CAAC;QAAE,YAAY,GAAG,CAAC,CAAC;IACvC,IAAI,YAAY,GAAG,EAAE;QAAE,YAAY,GAAG,EAAE,CAAC;IAEzC,IAAI,MAAM,CAAC,IAAI,EAAE;QACb,GAAG,CAAC,QAAQ,CAAC;YACT,EAAE,EAAE,GAAG,OAAO,OAAO;YACrB,IAAI,EAAE,MAAM;YACZ,MAAM,EAAE,OAAO;YACf,OAAO,EAAE,YAAY;YACrB,OAAO,EAAE,YAAY;YACrB,MAAM,EAAE;gBACJ,UAAU,EAAE,UAAU;aACzB;YACD,KAAK,EAAE;gBACH,YAAY,EAAE,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC;gBACrC,cAAc,EAAE,oBAAoB;aACvC;SACJ,CAAC,CAAC;QAEH,0BAA0B,CAAC,GAAG,OAAO,OAAO,EAAE,MAAM,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC;KAC5E;IAGD,IAAI,MAAM,CAAC,MAAM,EAAE;QACf,GAAG,CAAC,QAAQ,CAAC;YACT,EAAE,EAAE,GAAG,OAAO,OAAO;YACrB,IAAI,EAAE,MAAM;YACZ,MAAM,EAAE,OAAO;YACf,OAAO,EAAE,YAAY;YACrB,OAAO,EAAE,YAAY;YACrB,MAAM,EAAE;gBACJ,UAAU,EAAE,SAAS;aACxB;YACD,KAAK,EAAE;gBACH,YAAY,EAAE,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC;gBACvC,YAAY,EAAE,UAAU;gBACxB,cAAc,EAAE,oBAAoB;aACvC;SACJ,CAAC,CAAC;QAEH,0BAA0B,CAAC,GAAG,OAAO,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;KAC9E;IAED,IAAI,KAAK,EAAE;
|
|
1
|
+
{"version":3,"file":"layer.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/polygons/layer.ts"],"names":[],"mappings":"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","sourcesContent":["import { PolygonThemeSetting, RGBA } from '@bpd-library/types';\n\nconst MIN_ZOOM = 1;\nconst MAX_ZOOM = 24;\nconst LINE_WIDTH = 2;\nconst TRANSITION_ZOOM_MARGIN = 0.75;\n\nconst NORMAL_FEATURE_STATE: mapboxgl.Expression = [\n 'case',\n ['boolean', ['feature-state', 'hover'], false],\n 0,\n ['boolean', ['feature-state', 'focus'], false],\n 0,\n 1,\n];\n\nconst HOVER_FEATURE_STATE: mapboxgl.Expression = [\n 'case',\n ['boolean', ['feature-state', 'hover'], false],\n 1,\n ['boolean', ['feature-state', 'focus'], false],\n 1,\n 0,\n];\n\nconst RGBAString = ([r, g, b, a]: RGBA, overwriteAlpha?: number) => {\n a = overwriteAlpha !== undefined ? overwriteAlpha : a;\n\n return `rgba(${r},${g},${b},${a})`;\n};\n\nconst layer = (\n map: mapboxgl.Map,\n { variant, normal, hover, minzoom, maxzoom, visibility = 'visible' }: PolygonThemeSetting,\n) => {\n // Calculate the minzoom and maxzoom when it's set. This makes sure the layer gets disabled when it's invisible.\n let layerMinzoom = minzoom ? minzoom - TRANSITION_ZOOM_MARGIN : MIN_ZOOM;\n let layerMaxzoom = maxzoom ? maxzoom + TRANSITION_ZOOM_MARGIN : MAX_ZOOM;\n\n // Limit the minzoom to 1 and the maxzoom to 24.\n if (layerMinzoom < 1) layerMinzoom = 1;\n if (layerMaxzoom > 24) layerMaxzoom = 24;\n\n if (normal.fill) {\n map.addLayer({\n id: `${variant}-fill`,\n type: 'fill',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n layout: {\n visibility: visibility,\n },\n paint: {\n 'fill-color': RGBAString(normal.fill),\n 'fill-opacity': NORMAL_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-fill`, normal.fill, 'fill-color');\n }\n\n // Only add stroke layer, if it is set\n if (normal.stroke) {\n map.addLayer({\n id: `${variant}-line`,\n type: 'line',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n layout: {\n visibility: 'visible',\n },\n paint: {\n 'line-color': RGBAString(normal.stroke),\n 'line-width': LINE_WIDTH,\n 'line-opacity': NORMAL_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-line`, normal.stroke, 'line-color');\n }\n\n if (hover?.fill) {\n map.addLayer({\n id: `${variant}-fill-hover`,\n type: 'fill',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n layout: {\n // Make the layer visible by default.\n visibility: visibility,\n },\n paint: {\n 'fill-color': RGBAString(hover.fill),\n 'fill-opacity': HOVER_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-fill-hover`, hover.fill, 'fill-color');\n }\n\n if (hover?.stroke) {\n if (normal.stroke) {\n map.addLayer({\n id: `${variant}-line-hover`,\n type: 'line',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n paint: {\n 'line-color': RGBAString(hover.stroke),\n 'line-width': LINE_WIDTH,\n 'line-opacity': HOVER_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-line-hover`, hover.stroke, 'line-color');\n }\n }\n\n /**\n * @description Creates a fade-in effect when zooming in or out, based on a minzoom and maxzoom\n * @param {string} layer\n * @param {RGBA} color\n * @param {string} property\n * @return {*}\n */\n function setTransitionPaintProperty(layer: string, color: RGBA, property: string) {\n if (!minzoom || !maxzoom) return;\n\n map.setPaintProperty(layer, property, [\n 'interpolate',\n ['exponential', TRANSITION_ZOOM_MARGIN],\n ['zoom'],\n minzoom - TRANSITION_ZOOM_MARGIN,\n RGBAString(color, 0),\n minzoom,\n RGBAString(color),\n maxzoom,\n RGBAString(color),\n maxzoom + TRANSITION_ZOOM_MARGIN,\n RGBAString(color, 0),\n ]);\n }\n};\n\nexport default layer;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bpd-library/components",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.1-beta.0",
|
|
4
4
|
"description": "Description",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -46,14 +46,14 @@
|
|
|
46
46
|
"publishConfig": {
|
|
47
47
|
"access": "public"
|
|
48
48
|
},
|
|
49
|
-
"gitHead": "
|
|
49
|
+
"gitHead": "34a4fe7ebc5835d041ca16edc0aa84ce2bb38032",
|
|
50
50
|
"dependencies": {
|
|
51
51
|
"@atomify/core": "2.4.1",
|
|
52
52
|
"@atomify/hooks": "1.1.11",
|
|
53
53
|
"@atomify/jsx": "1.7.1",
|
|
54
54
|
"@atomify/kit": "1.1.11",
|
|
55
|
-
"@bpd-library/types": "^
|
|
56
|
-
"@bpd-library/utilities": "^
|
|
55
|
+
"@bpd-library/types": "^2.0.1-beta.0",
|
|
56
|
+
"@bpd-library/utilities": "^2.0.1-beta.0",
|
|
57
57
|
"@mapbox/mapbox-gl-geocoder": "^4.7.0",
|
|
58
58
|
"@mapbox/mapbox-gl-language": "^0.10.1",
|
|
59
59
|
"@turf/helpers": "^6.5.0",
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
declare type Service = 'vimeo' | 'youtube' | 'mapbox';
|
|
2
|
-
declare type Services = {
|
|
3
|
-
vimeo: string;
|
|
4
|
-
youtube: string;
|
|
5
|
-
mapbox: string;
|
|
6
|
-
};
|
|
7
|
-
export declare const blockedServices: Services;
|
|
8
|
-
export declare function isBlockedService(service: Service): boolean;
|
|
9
|
-
export {};
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
export const blockedServices = {
|
|
2
|
-
vimeo: 'HyEX5Nidi-m',
|
|
3
|
-
youtube: 'BJz7qNsdj-7',
|
|
4
|
-
mapbox: 'U8QkTd2W'
|
|
5
|
-
};
|
|
6
|
-
export function isBlockedService(service) {
|
|
7
|
-
return !!document.querySelector(`[pid="${blockedServices[service]}"]`);
|
|
8
|
-
}
|
|
9
|
-
//# sourceMappingURL=blocklist.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"blocklist.js","sourceRoot":"","sources":["../../../../src/molecules/map/utilities/blocklist.ts"],"names":[],"mappings":"AAUA,MAAM,CAAC,MAAM,eAAe,GAAa;IACrC,KAAK,EAAE,aAAa;IACpB,OAAO,EAAE,aAAa;IACtB,MAAM,EAAE,UAAU;CACrB,CAAA;AAED,MAAM,UAAU,gBAAgB,CAAC,OAAgB;IAC7C,OAAO,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC,SAAS,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;AAC3E,CAAC","sourcesContent":["// TODO (abo 16/1/2024) move this to a more generic place\n\ntype Service = 'vimeo' | 'youtube' | 'mapbox';\n\ntype Services = {\n vimeo: string;\n youtube: string;\n mapbox: string;\n}\n\nexport const blockedServices: Services = {\n vimeo: 'HyEX5Nidi-m',\n youtube: 'BJz7qNsdj-7',\n mapbox: 'U8QkTd2W'\n}\n\nexport function isBlockedService(service: Service) {\n return !!document.querySelector(`[pid=\"${blockedServices[service]}\"]`);\n}\n"]}
|