@esri/solutions-components 0.6.13 → 0.6.14
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/assets/t9n/layer-table/resources.json +1 -1
- package/dist/assets/t9n/layer-table/resources_en.json +1 -1
- package/dist/assets/t9n/map-layer-picker/resources.json +4 -0
- package/dist/assets/t9n/map-layer-picker/resources_en.json +4 -0
- package/dist/cjs/basemap-gallery_6.cjs.entry.js +20 -5
- package/dist/cjs/buffer-tools_4.cjs.entry.js +1 -1
- package/dist/cjs/calcite-chip_3.cjs.entry.js +803 -0
- package/dist/cjs/calcite-combobox_6.cjs.entry.js +76 -28
- package/dist/cjs/card-manager_3.cjs.entry.js +112 -54
- package/dist/cjs/crowdsource-manager.cjs.entry.js +18 -5
- package/dist/cjs/{downloadUtils-fb4744e0.js → downloadUtils-34a515ad.js} +2 -2
- package/dist/cjs/edit-card_2.cjs.entry.js +5 -0
- package/dist/cjs/{index.es-372e33de.js → index.es-0ba11065.js} +2 -2
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/map-select-tools_3.cjs.entry.js +3 -3
- package/dist/cjs/{mapViewUtils-a4dd36ec.js → mapViewUtils-a2884698.js} +39 -55
- package/dist/cjs/public-notification.cjs.entry.js +3 -3
- package/dist/cjs/{publicNotificationStore-b69862af.js → publicNotificationStore-610bd880.js} +0 -4
- package/dist/cjs/solutions-components.cjs.js +1 -1
- package/dist/collection/components/basemap-gallery/basemap-gallery.js +23 -1
- package/dist/collection/components/card-manager/card-manager.js +2 -2
- package/dist/collection/components/crowdsource-manager/crowdsource-manager.js +171 -5
- package/dist/collection/components/edit-card/edit-card.js +19 -0
- package/dist/collection/components/layer-table/layer-table.js +127 -47
- package/dist/collection/components/map-card/map-card.js +115 -5
- package/dist/collection/components/map-layer-picker/map-layer-picker.css +4 -0
- package/dist/collection/components/map-layer-picker/map-layer-picker.js +107 -27
- package/dist/collection/components/map-picker/map-picker.css +5 -1
- package/dist/collection/components/map-picker/map-picker.js +3 -3
- package/dist/collection/components/map-tools/map-tools.js +104 -1
- package/dist/collection/utils/interfaces.ts +12 -1
- package/dist/collection/utils/mapViewUtils.js +38 -52
- package/dist/collection/utils/mapViewUtils.ts +41 -57
- package/dist/collection/utils/publicNotificationStore.js +0 -4
- package/dist/collection/utils/publicNotificationStore.ts +0 -4
- package/dist/components/basemap-gallery2.js +2 -0
- package/dist/components/card-manager2.js +2 -2
- package/dist/components/crowdsource-manager.js +27 -6
- package/dist/components/edit-card2.js +5 -0
- package/dist/components/layer-table2.js +136 -78
- package/dist/components/map-card2.js +17 -5
- package/dist/components/map-layer-picker2.js +114 -52
- package/dist/components/map-picker2.js +4 -4
- package/dist/components/map-select-tools2.js +55 -43
- package/dist/components/map-tools2.js +20 -1
- package/dist/components/mapViewUtils.js +39 -53
- package/dist/components/public-notification.js +1 -1
- package/dist/components/publicNotificationStore.js +0 -4
- package/dist/components/refine-selection2.js +61 -49
- package/dist/esm/basemap-gallery_6.entry.js +20 -5
- package/dist/esm/buffer-tools_4.entry.js +1 -1
- package/dist/esm/calcite-chip_3.entry.js +797 -0
- package/dist/esm/calcite-combobox_6.entry.js +76 -28
- package/dist/esm/card-manager_3.entry.js +112 -54
- package/dist/esm/crowdsource-manager.entry.js +18 -5
- package/dist/esm/{downloadUtils-67c7a6c8.js → downloadUtils-ac67a786.js} +2 -2
- package/dist/esm/edit-card_2.entry.js +5 -0
- package/dist/esm/{index.es-59a67d3d.js → index.es-f553598f.js} +2 -2
- package/dist/esm/loader.js +1 -1
- package/dist/esm/map-select-tools_3.entry.js +3 -3
- package/dist/esm/{mapViewUtils-00a04d52.js → mapViewUtils-8141d8c1.js} +39 -53
- package/dist/esm/public-notification.entry.js +3 -3
- package/dist/esm/{publicNotificationStore-90a6a274.js → publicNotificationStore-dcf39a55.js} +0 -4
- package/dist/esm/solutions-components.js +1 -1
- package/dist/solutions-components/p-08b52ed8.entry.js +6 -0
- package/dist/solutions-components/p-16362eb4.js +36 -0
- package/dist/solutions-components/{p-3691a072.js → p-1ab414e0.js} +2 -2
- package/dist/solutions-components/{p-73ab9d9a.entry.js → p-3d7aa1b2.entry.js} +1 -1
- package/dist/solutions-components/{p-9a8c51bf.entry.js → p-57cf6784.entry.js} +1 -1
- package/dist/solutions-components/p-64b22d57.entry.js +6 -0
- package/dist/solutions-components/p-654dd5df.entry.js +6 -0
- package/dist/solutions-components/{p-f9166fcb.js → p-a26711e8.js} +1 -1
- package/dist/solutions-components/p-b1c8c6d7.entry.js +6 -0
- package/dist/solutions-components/{p-b892e595.entry.js → p-b9d29f30.entry.js} +1 -1
- package/dist/solutions-components/{p-1b41181b.js → p-c8d0ce92.js} +2 -2
- package/dist/solutions-components/{p-0219a1a9.entry.js → p-e76949eb.entry.js} +6 -6
- package/dist/solutions-components/p-ee7e2f00.entry.js +34 -0
- package/dist/solutions-components/solutions-components.esm.js +1 -1
- package/dist/solutions-components/utils/interfaces.ts +12 -1
- package/dist/solutions-components/utils/mapViewUtils.ts +41 -57
- package/dist/solutions-components/utils/publicNotificationStore.ts +0 -4
- package/dist/types/components/basemap-gallery/basemap-gallery.d.ts +5 -0
- package/dist/types/components/crowdsource-manager/crowdsource-manager.d.ts +37 -1
- package/dist/types/components/edit-card/edit-card.d.ts +8 -0
- package/dist/types/components/layer-table/layer-table.d.ts +40 -0
- package/dist/types/components/map-card/map-card.d.ts +25 -1
- package/dist/types/components/map-layer-picker/map-layer-picker.d.ts +50 -3
- package/dist/types/components/map-picker/map-picker.d.ts +2 -2
- package/dist/types/components/map-tools/map-tools.d.ts +21 -1
- package/dist/types/components.d.ts +182 -2
- package/dist/types/preact.d.ts +6 -3
- package/dist/types/utils/interfaces.d.ts +10 -1
- package/dist/types/utils/mapViewUtils.d.ts +8 -24
- package/dist/types/utils/publicNotificationStore.d.ts +0 -2
- package/package.json +1 -1
- package/dist/cjs/calcite-chip.cjs.entry.js +0 -259
- package/dist/cjs/calcite-notice.cjs.entry.js +0 -139
- package/dist/cjs/calcite-tooltip.cjs.entry.js +0 -439
- package/dist/esm/calcite-chip.entry.js +0 -255
- package/dist/esm/calcite-notice.entry.js +0 -135
- package/dist/esm/calcite-tooltip.entry.js +0 -435
- package/dist/solutions-components/p-2cff8331.entry.js +0 -6
- package/dist/solutions-components/p-3a6c8fc3.entry.js +0 -6
- package/dist/solutions-components/p-3b1fc7a2.entry.js +0 -6
- package/dist/solutions-components/p-767002cd.js +0 -36
- package/dist/solutions-components/p-a776b7e6.entry.js +0 -6
- package/dist/solutions-components/p-be36d5ed.entry.js +0 -22
- package/dist/solutions-components/p-c644edf5.entry.js +0 -11
- package/dist/solutions-components/p-cfd88a2f.entry.js +0 -11
|
@@ -32,6 +32,11 @@ export class MapCard {
|
|
|
32
32
|
* string: the id of map currently displayed
|
|
33
33
|
*/
|
|
34
34
|
this._loadedId = "";
|
|
35
|
+
this.enableLegend = undefined;
|
|
36
|
+
this.enableFullscreen = undefined;
|
|
37
|
+
this.enableSearch = undefined;
|
|
38
|
+
this.enableBasemap = undefined;
|
|
39
|
+
this.basemapConfig = undefined;
|
|
35
40
|
this.mapInfos = [];
|
|
36
41
|
this.mapView = undefined;
|
|
37
42
|
this._searchConfiguration = undefined;
|
|
@@ -58,7 +63,7 @@ export class MapCard {
|
|
|
58
63
|
* Renders the component.
|
|
59
64
|
*/
|
|
60
65
|
render() {
|
|
61
|
-
return (h(Host, null, h("map-picker", { mapInfos: this.mapInfos }), h("div", { class: "map-height", ref: (el) => (this._mapDiv = el) }), h("map-tools", { class: "box-shadow", mapView: this.mapView, ref: (el) => this._mapTools = el, searchConfiguration: this._searchConfiguration })));
|
|
66
|
+
return (h(Host, null, h("map-picker", { mapInfos: this.mapInfos }), h("div", { class: "map-height", ref: (el) => (this._mapDiv = el) }), h("map-tools", { basemapConfig: this.basemapConfig, class: "box-shadow", enableBasemap: this.enableBasemap, enableFullscreen: this.enableFullscreen, enableLegend: this.enableLegend, enableSearch: this.enableSearch, mapView: this.mapView, ref: (el) => this._mapTools = el, searchConfiguration: this._searchConfiguration })));
|
|
62
67
|
}
|
|
63
68
|
//--------------------------------------------------------------------------
|
|
64
69
|
//
|
|
@@ -108,16 +113,17 @@ export class MapCard {
|
|
|
108
113
|
});
|
|
109
114
|
this._loadedId = id;
|
|
110
115
|
this._searchConfiguration = this._webMapInfo.searchConfiguration;
|
|
111
|
-
this.
|
|
112
|
-
id: id,
|
|
113
|
-
mapView: this.mapView
|
|
114
|
-
});
|
|
116
|
+
this.beforeMapChanged.emit();
|
|
115
117
|
await this.mapView.when(() => {
|
|
116
118
|
const home = new this.Home({
|
|
117
119
|
view: this.mapView
|
|
118
120
|
});
|
|
119
121
|
this.mapView.ui.add(home, { position: "top-left", index: 3 });
|
|
120
122
|
this.mapView.ui.add(this._mapTools, { position: "top-right", index: 0 });
|
|
123
|
+
this.mapChanged.emit({
|
|
124
|
+
id: id,
|
|
125
|
+
mapView: this.mapView
|
|
126
|
+
});
|
|
121
127
|
});
|
|
122
128
|
}
|
|
123
129
|
}
|
|
@@ -134,6 +140,95 @@ export class MapCard {
|
|
|
134
140
|
}
|
|
135
141
|
static get properties() {
|
|
136
142
|
return {
|
|
143
|
+
"enableLegend": {
|
|
144
|
+
"type": "boolean",
|
|
145
|
+
"mutable": false,
|
|
146
|
+
"complexType": {
|
|
147
|
+
"original": "boolean",
|
|
148
|
+
"resolved": "boolean",
|
|
149
|
+
"references": {}
|
|
150
|
+
},
|
|
151
|
+
"required": false,
|
|
152
|
+
"optional": false,
|
|
153
|
+
"docs": {
|
|
154
|
+
"tags": [],
|
|
155
|
+
"text": "boolean: when true the legend widget will be available"
|
|
156
|
+
},
|
|
157
|
+
"attribute": "enable-legend",
|
|
158
|
+
"reflect": false
|
|
159
|
+
},
|
|
160
|
+
"enableFullscreen": {
|
|
161
|
+
"type": "boolean",
|
|
162
|
+
"mutable": false,
|
|
163
|
+
"complexType": {
|
|
164
|
+
"original": "boolean",
|
|
165
|
+
"resolved": "boolean",
|
|
166
|
+
"references": {}
|
|
167
|
+
},
|
|
168
|
+
"required": false,
|
|
169
|
+
"optional": false,
|
|
170
|
+
"docs": {
|
|
171
|
+
"tags": [],
|
|
172
|
+
"text": "boolean: when true the fullscreen widget will be available"
|
|
173
|
+
},
|
|
174
|
+
"attribute": "enable-fullscreen",
|
|
175
|
+
"reflect": false
|
|
176
|
+
},
|
|
177
|
+
"enableSearch": {
|
|
178
|
+
"type": "boolean",
|
|
179
|
+
"mutable": false,
|
|
180
|
+
"complexType": {
|
|
181
|
+
"original": "boolean",
|
|
182
|
+
"resolved": "boolean",
|
|
183
|
+
"references": {}
|
|
184
|
+
},
|
|
185
|
+
"required": false,
|
|
186
|
+
"optional": false,
|
|
187
|
+
"docs": {
|
|
188
|
+
"tags": [],
|
|
189
|
+
"text": "boolean: when true the search widget will be available"
|
|
190
|
+
},
|
|
191
|
+
"attribute": "enable-search",
|
|
192
|
+
"reflect": false
|
|
193
|
+
},
|
|
194
|
+
"enableBasemap": {
|
|
195
|
+
"type": "boolean",
|
|
196
|
+
"mutable": false,
|
|
197
|
+
"complexType": {
|
|
198
|
+
"original": "boolean",
|
|
199
|
+
"resolved": "boolean",
|
|
200
|
+
"references": {}
|
|
201
|
+
},
|
|
202
|
+
"required": false,
|
|
203
|
+
"optional": false,
|
|
204
|
+
"docs": {
|
|
205
|
+
"tags": [],
|
|
206
|
+
"text": "boolean: when true the basemap widget will be available"
|
|
207
|
+
},
|
|
208
|
+
"attribute": "enable-basemap",
|
|
209
|
+
"reflect": false
|
|
210
|
+
},
|
|
211
|
+
"basemapConfig": {
|
|
212
|
+
"type": "unknown",
|
|
213
|
+
"mutable": false,
|
|
214
|
+
"complexType": {
|
|
215
|
+
"original": "IBasemapConfig",
|
|
216
|
+
"resolved": "IBasemapConfig",
|
|
217
|
+
"references": {
|
|
218
|
+
"IBasemapConfig": {
|
|
219
|
+
"location": "import",
|
|
220
|
+
"path": "../../utils/interfaces",
|
|
221
|
+
"id": "src/utils/interfaces.ts::IBasemapConfig"
|
|
222
|
+
}
|
|
223
|
+
}
|
|
224
|
+
},
|
|
225
|
+
"required": false,
|
|
226
|
+
"optional": false,
|
|
227
|
+
"docs": {
|
|
228
|
+
"tags": [],
|
|
229
|
+
"text": "IBasemapConfig: List of any basemaps to filter out from the basemap widget"
|
|
230
|
+
}
|
|
231
|
+
},
|
|
137
232
|
"mapInfos": {
|
|
138
233
|
"type": "unknown",
|
|
139
234
|
"mutable": false,
|
|
@@ -206,6 +301,21 @@ export class MapCard {
|
|
|
206
301
|
}
|
|
207
302
|
}
|
|
208
303
|
}
|
|
304
|
+
}, {
|
|
305
|
+
"method": "beforeMapChanged",
|
|
306
|
+
"name": "beforeMapChanged",
|
|
307
|
+
"bubbles": true,
|
|
308
|
+
"cancelable": true,
|
|
309
|
+
"composed": true,
|
|
310
|
+
"docs": {
|
|
311
|
+
"tags": [],
|
|
312
|
+
"text": "Emitted before a new map is loaded"
|
|
313
|
+
},
|
|
314
|
+
"complexType": {
|
|
315
|
+
"original": "void",
|
|
316
|
+
"resolved": "void",
|
|
317
|
+
"references": {}
|
|
318
|
+
}
|
|
209
319
|
}];
|
|
210
320
|
}
|
|
211
321
|
static get elementRef() { return "el"; }
|
|
@@ -19,7 +19,8 @@
|
|
|
19
19
|
* limitations under the License.
|
|
20
20
|
*/
|
|
21
21
|
import { Host, h } from "@stencil/core";
|
|
22
|
-
import {
|
|
22
|
+
import { getLocaleComponentStrings } from "../../utils/locale";
|
|
23
|
+
import { getMapLayerHash, getMapTableHash } from "../../utils/mapViewUtils";
|
|
23
24
|
import state from "../../utils/publicNotificationStore";
|
|
24
25
|
export class MapLayerPicker {
|
|
25
26
|
constructor() {
|
|
@@ -27,13 +28,16 @@ export class MapLayerPicker {
|
|
|
27
28
|
this.enabledLayerIds = [];
|
|
28
29
|
this.enabledTableIds = [];
|
|
29
30
|
this.mapView = undefined;
|
|
31
|
+
this.onlyShowUpdatableLayers = undefined;
|
|
30
32
|
this.placeholderIcon = "";
|
|
31
33
|
this.selectedIds = [];
|
|
32
34
|
this.scale = "m";
|
|
33
35
|
this.showTables = true;
|
|
34
36
|
this.type = "select";
|
|
37
|
+
this._hasValidLayers = true;
|
|
35
38
|
this.ids = [];
|
|
36
39
|
this.selectedName = "";
|
|
40
|
+
this._translations = undefined;
|
|
37
41
|
}
|
|
38
42
|
//--------------------------------------------------------------------------
|
|
39
43
|
//
|
|
@@ -46,10 +50,13 @@ export class MapLayerPicker {
|
|
|
46
50
|
*/
|
|
47
51
|
async mapViewWatchHandler() {
|
|
48
52
|
await this._setLayers();
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
+
if (this.ids.length > 0) {
|
|
54
|
+
this._hasValidLayers = true;
|
|
55
|
+
this._setSelectedLayer(this.ids[0]);
|
|
56
|
+
}
|
|
57
|
+
else {
|
|
58
|
+
this._hasValidLayers = false;
|
|
59
|
+
this.noLayersFound.emit();
|
|
53
60
|
}
|
|
54
61
|
}
|
|
55
62
|
//--------------------------------------------------------------------------
|
|
@@ -61,6 +68,7 @@ export class MapLayerPicker {
|
|
|
61
68
|
* StencilJS: Called once just after the component is first connected to the DOM.
|
|
62
69
|
*/
|
|
63
70
|
async componentWillLoad() {
|
|
71
|
+
await this._getTranslations();
|
|
64
72
|
await this._setLayers();
|
|
65
73
|
if (this.ids.length > 0 || this.selectedIds.length === 1) {
|
|
66
74
|
this.layerSelectionChange.emit(this.selectedIds.length === 1 ? [this.selectedIds[0]] : [this.ids[0]]);
|
|
@@ -70,7 +78,7 @@ export class MapLayerPicker {
|
|
|
70
78
|
* Renders the component.
|
|
71
79
|
*/
|
|
72
80
|
render() {
|
|
73
|
-
return (h(Host, null, h("div", { class: "map-layer-picker-container" }, h("div", { class: "map-layer-picker" }, this.type === "combobox" ? this._getCombobox() :
|
|
81
|
+
return (h(Host, null, h("div", { class: "map-layer-picker-container" }, h("div", { class: "map-layer-picker" }, !this._hasValidLayers ? this._getInvalidPlaceholder() : this.type === "combobox" ? this._getCombobox() :
|
|
74
82
|
this.type === "select" ? this._getSelect() : this._getDropdown()))));
|
|
75
83
|
}
|
|
76
84
|
/**
|
|
@@ -83,9 +91,9 @@ export class MapLayerPicker {
|
|
|
83
91
|
this._layerElement.value = id;
|
|
84
92
|
}
|
|
85
93
|
else if (this.type === "dropdown") {
|
|
86
|
-
this.selectedName = Object.keys(
|
|
87
|
-
|
|
88
|
-
|
|
94
|
+
this.selectedName = Object.keys(this._layerNameHash).indexOf(id) > -1 ?
|
|
95
|
+
this._layerNameHash[id].name : Object.keys(this._tableNameHash).indexOf(id) > -1 ?
|
|
96
|
+
this._tableNameHash[id].name : "";
|
|
89
97
|
}
|
|
90
98
|
}
|
|
91
99
|
}
|
|
@@ -94,6 +102,14 @@ export class MapLayerPicker {
|
|
|
94
102
|
// Functions (protected)
|
|
95
103
|
//
|
|
96
104
|
//--------------------------------------------------------------------------
|
|
105
|
+
/**
|
|
106
|
+
* Create a notice to inform the user that no layers were found
|
|
107
|
+
*
|
|
108
|
+
* @returns Calcite Notice component with the message
|
|
109
|
+
*/
|
|
110
|
+
_getInvalidPlaceholder() {
|
|
111
|
+
return (h("div", null, h("calcite-notice", { class: "height-100", icon: "exclamation-mark-triangle", id: "no-valid-layers", kind: "danger", open: true }, h("div", { slot: "message" }, this._translations.noLayersFound)), h("calcite-tooltip", { label: this._translations.enableEditUpdate, placement: "bottom", "reference-element": "no-valid-layers" }, h("span", null, this._translations.enableEditUpdate))));
|
|
112
|
+
}
|
|
97
113
|
/**
|
|
98
114
|
* Create a list of layers from the map
|
|
99
115
|
*
|
|
@@ -144,16 +160,21 @@ export class MapLayerPicker {
|
|
|
144
160
|
* @returns A dom node with the name of the layer or table
|
|
145
161
|
*/
|
|
146
162
|
_getItem(id, itemType) {
|
|
147
|
-
const
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
163
|
+
const item = itemType === "layer" ? this._layerNameHash[id] : this._tableNameHash[id];
|
|
164
|
+
const disabled = this.onlyShowUpdatableLayers ? !item.supportsUpdate : false;
|
|
165
|
+
const name = item.name;
|
|
166
|
+
return this.type === "combobox" ? (h("calcite-combobox-item", { disabled: disabled, textLabel: name, value: id })) :
|
|
167
|
+
this.type === "select" ? (h("calcite-option", { disabled: disabled, label: name, value: id })) :
|
|
168
|
+
(h("calcite-dropdown-item", { disabled: disabled, onClick: disabled ? undefined : () => void this._setSelectedLayer(id) }, name));
|
|
151
169
|
}
|
|
152
170
|
/**
|
|
153
171
|
* Store the layer name based on the user selection
|
|
154
172
|
*/
|
|
155
|
-
_setSelectedLayer(id
|
|
156
|
-
|
|
173
|
+
_setSelectedLayer(id) {
|
|
174
|
+
const item = Object.keys(this._layerNameHash).indexOf(id) > -1 ?
|
|
175
|
+
this._layerNameHash[id] : Object.keys(this._tableNameHash).indexOf(id) > -1 ?
|
|
176
|
+
this._tableNameHash[id] : undefined;
|
|
177
|
+
this.selectedName = item === null || item === void 0 ? void 0 : item.name;
|
|
157
178
|
this.selectedIds = [id];
|
|
158
179
|
this.layerSelectionChange.emit(this.selectedIds);
|
|
159
180
|
}
|
|
@@ -164,25 +185,38 @@ export class MapLayerPicker {
|
|
|
164
185
|
*/
|
|
165
186
|
async _setLayers() {
|
|
166
187
|
if (this.mapView) {
|
|
167
|
-
|
|
168
|
-
const
|
|
188
|
+
await this._initLayerTableHash();
|
|
189
|
+
const mapLayerIds = this.onlyShowUpdatableLayers ?
|
|
190
|
+
this._getEditableIds(this._layerNameHash) : Object.keys(this._layerNameHash);
|
|
191
|
+
const mapTableIds = this.showTables ? this.onlyShowUpdatableLayers ?
|
|
192
|
+
this._getEditableIds(this._tableNameHash) : Object.keys(this._tableNameHash) : [];
|
|
169
193
|
this.ids = [
|
|
170
194
|
...mapLayerIds.filter(n => { var _a; return ((_a = this.enabledLayerIds) === null || _a === void 0 ? void 0 : _a.length) > 0 ? this.enabledLayerIds.indexOf(n) > -1 : true; }),
|
|
171
195
|
...mapTableIds.filter(n => { var _a; return ((_a = this.enabledTableIds) === null || _a === void 0 ? void 0 : _a.length) > 0 ? this.enabledTableIds.indexOf(n) > -1 : true; }),
|
|
172
196
|
];
|
|
173
|
-
await this._initStateHash();
|
|
174
197
|
}
|
|
175
198
|
}
|
|
199
|
+
/**
|
|
200
|
+
* Fetch the ids of all layers that support edits with the update capability
|
|
201
|
+
*
|
|
202
|
+
* @returns array of layer ids
|
|
203
|
+
*/
|
|
204
|
+
_getEditableIds(hash) {
|
|
205
|
+
return Object.keys(hash).reduce((prev, cur) => {
|
|
206
|
+
if (hash[cur].supportsUpdate) {
|
|
207
|
+
prev.push(cur);
|
|
208
|
+
}
|
|
209
|
+
return prev;
|
|
210
|
+
}, []);
|
|
211
|
+
}
|
|
176
212
|
/**
|
|
177
213
|
* Create a layer id:title hash for layer name display
|
|
178
214
|
*
|
|
179
215
|
* @returns Promise when the operation has completed
|
|
180
216
|
*/
|
|
181
|
-
async
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
state.tableNameHash = this.showTables ? await getMapTableHash(this.mapView) : {};
|
|
185
|
-
}
|
|
217
|
+
async _initLayerTableHash() {
|
|
218
|
+
this._layerNameHash = await getMapLayerHash(this.mapView, this.onlyShowUpdatableLayers);
|
|
219
|
+
this._tableNameHash = this.showTables ? await getMapTableHash(this.mapView, this.onlyShowUpdatableLayers) : {};
|
|
186
220
|
}
|
|
187
221
|
/**
|
|
188
222
|
* Evaluate if the id exists in the current hash and verify if it should be excluded
|
|
@@ -190,9 +224,10 @@ export class MapLayerPicker {
|
|
|
190
224
|
* @returns boolean when true the layer will be used in the current layer picker type
|
|
191
225
|
*/
|
|
192
226
|
_validLayer(id) {
|
|
193
|
-
|
|
227
|
+
var _a;
|
|
228
|
+
const name = (_a = this._layerNameHash[id]) === null || _a === void 0 ? void 0 : _a.name;
|
|
194
229
|
return name && state.managedLayers.indexOf(name) < 0 && (this.enabledLayerIds.length > 0 ?
|
|
195
|
-
this.enabledLayerIds.indexOf(id) > -1 :
|
|
230
|
+
this.enabledLayerIds.indexOf(id) > -1 : true);
|
|
196
231
|
}
|
|
197
232
|
/**
|
|
198
233
|
* Evaluate if the id exists in the current hash and verify if it should be excluded
|
|
@@ -200,7 +235,8 @@ export class MapLayerPicker {
|
|
|
200
235
|
* @returns boolean when true the table will be used in the current layer picker type
|
|
201
236
|
*/
|
|
202
237
|
_validTable(id) {
|
|
203
|
-
|
|
238
|
+
var _a;
|
|
239
|
+
const name = (_a = this._tableNameHash[id]) === null || _a === void 0 ? void 0 : _a.name;
|
|
204
240
|
const validName = name && this.showTables;
|
|
205
241
|
return validName ? state.managedTables.indexOf(name) < 0 &&
|
|
206
242
|
(this.enabledTableIds.length > 0 ? this.enabledTableIds.indexOf(id) > -1 : true) : validName;
|
|
@@ -217,6 +253,16 @@ export class MapLayerPicker {
|
|
|
217
253
|
this.layerSelectionChange.emit(this.selectedIds);
|
|
218
254
|
}
|
|
219
255
|
}
|
|
256
|
+
/**
|
|
257
|
+
* Fetches the component's translations
|
|
258
|
+
*
|
|
259
|
+
* @returns Promise when complete
|
|
260
|
+
* @protected
|
|
261
|
+
*/
|
|
262
|
+
async _getTranslations() {
|
|
263
|
+
const messages = await getLocaleComponentStrings(this.el);
|
|
264
|
+
this._translations = messages[0];
|
|
265
|
+
}
|
|
220
266
|
static get is() { return "map-layer-picker"; }
|
|
221
267
|
static get originalStyleUrls() {
|
|
222
268
|
return {
|
|
@@ -300,6 +346,23 @@ export class MapLayerPicker {
|
|
|
300
346
|
"text": "esri/views/View: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html"
|
|
301
347
|
}
|
|
302
348
|
},
|
|
349
|
+
"onlyShowUpdatableLayers": {
|
|
350
|
+
"type": "boolean",
|
|
351
|
+
"mutable": false,
|
|
352
|
+
"complexType": {
|
|
353
|
+
"original": "boolean",
|
|
354
|
+
"resolved": "boolean",
|
|
355
|
+
"references": {}
|
|
356
|
+
},
|
|
357
|
+
"required": false,
|
|
358
|
+
"optional": false,
|
|
359
|
+
"docs": {
|
|
360
|
+
"tags": [],
|
|
361
|
+
"text": "boolean: When true only editable layers that support the update capability will be available"
|
|
362
|
+
},
|
|
363
|
+
"attribute": "only-show-updatable-layers",
|
|
364
|
+
"reflect": false
|
|
365
|
+
},
|
|
303
366
|
"placeholderIcon": {
|
|
304
367
|
"type": "string",
|
|
305
368
|
"mutable": false,
|
|
@@ -392,12 +455,29 @@ export class MapLayerPicker {
|
|
|
392
455
|
}
|
|
393
456
|
static get states() {
|
|
394
457
|
return {
|
|
458
|
+
"_hasValidLayers": {},
|
|
395
459
|
"ids": {},
|
|
396
|
-
"selectedName": {}
|
|
460
|
+
"selectedName": {},
|
|
461
|
+
"_translations": {}
|
|
397
462
|
};
|
|
398
463
|
}
|
|
399
464
|
static get events() {
|
|
400
465
|
return [{
|
|
466
|
+
"method": "noLayersFound",
|
|
467
|
+
"name": "noLayersFound",
|
|
468
|
+
"bubbles": true,
|
|
469
|
+
"cancelable": true,
|
|
470
|
+
"composed": true,
|
|
471
|
+
"docs": {
|
|
472
|
+
"tags": [],
|
|
473
|
+
"text": "Emitted on demand when no valid layers are found"
|
|
474
|
+
},
|
|
475
|
+
"complexType": {
|
|
476
|
+
"original": "void",
|
|
477
|
+
"resolved": "void",
|
|
478
|
+
"references": {}
|
|
479
|
+
}
|
|
480
|
+
}, {
|
|
401
481
|
"method": "layerSelectionChange",
|
|
402
482
|
"name": "layerSelectionChange",
|
|
403
483
|
"bubbles": true,
|
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
flex-direction: column;
|
|
49
49
|
overflow: hidden;
|
|
50
50
|
animation: calcite-scrim-fade-in var(--calcite-internal-animation-timing-medium) ease-in-out;
|
|
51
|
-
background-color: var(--calcite-
|
|
51
|
+
background-color: var(--calcite-ui-background);
|
|
52
52
|
z-index: 1000;
|
|
53
53
|
width: 100%;
|
|
54
54
|
height: -moz-fit-content;
|
|
@@ -62,3 +62,7 @@
|
|
|
62
62
|
.action-bar-color {
|
|
63
63
|
background-color: var(--calcite-ui-border-3) !important;
|
|
64
64
|
}
|
|
65
|
+
|
|
66
|
+
.align-center {
|
|
67
|
+
align-items: center;
|
|
68
|
+
}
|
|
@@ -46,9 +46,9 @@ export class MapPicker {
|
|
|
46
46
|
/**
|
|
47
47
|
* Called each time the mapInfos prop is changed.
|
|
48
48
|
*/
|
|
49
|
-
mapInfosWatchHandler(v, oldV) {
|
|
49
|
+
async mapInfosWatchHandler(v, oldV) {
|
|
50
50
|
if (v && JSON.stringify(v) !== JSON.stringify(oldV)) {
|
|
51
|
-
this.
|
|
51
|
+
this._webMapSelected(v[0]);
|
|
52
52
|
}
|
|
53
53
|
}
|
|
54
54
|
//--------------------------------------------------------------------------
|
|
@@ -73,7 +73,7 @@ export class MapPicker {
|
|
|
73
73
|
/**
|
|
74
74
|
* Called once after the component has loaded
|
|
75
75
|
*/
|
|
76
|
-
componentDidLoad() {
|
|
76
|
+
async componentDidLoad() {
|
|
77
77
|
const webMapInfo = this.mapInfos && this.mapInfos.length > 0 ? this.mapInfos[0] : undefined;
|
|
78
78
|
if (webMapInfo) {
|
|
79
79
|
this._webMapSelected(webMapInfo);
|
|
@@ -22,6 +22,11 @@ import { Host, h } from "@stencil/core";
|
|
|
22
22
|
import { getLocaleComponentStrings } from "../../utils/locale";
|
|
23
23
|
export class MapTools {
|
|
24
24
|
constructor() {
|
|
25
|
+
this.enableLegend = undefined;
|
|
26
|
+
this.enableFullscreen = undefined;
|
|
27
|
+
this.enableSearch = undefined;
|
|
28
|
+
this.enableBasemap = undefined;
|
|
29
|
+
this.basemapConfig = undefined;
|
|
25
30
|
this.layout = "vertical";
|
|
26
31
|
this.mapView = undefined;
|
|
27
32
|
this.searchConfiguration = undefined;
|
|
@@ -125,7 +130,16 @@ export class MapTools {
|
|
|
125
130
|
const fullscreenIcon = this._showFullscreen ? "full-screen-exit" : "full-screen";
|
|
126
131
|
const fullscreenTip = this._showFullscreen ? this._translations.exitFullscreen : this._translations.enterFullscreen;
|
|
127
132
|
const expandTip = this._showTools ? this._translations.collapse : this._translations.expand;
|
|
128
|
-
|
|
133
|
+
const containerClass = !this.enableBasemap && !this.enableFullscreen && !this.enableLegend && !this.enableSearch ? "display-none" : "";
|
|
134
|
+
return (h(Host, null, h("div", { class: containerClass }, h("div", { class: "box-shadow" }, this._getActionGroup(toggleIcon, false, expandTip, () => this._toggleTools())), h("div", { class: `margin-top-1-2 box-shadow ${toolsClass}` }, this.enableLegend ?
|
|
135
|
+
this._getActionGroup("legend", false, this._translations.legend, () => this._showLegend()) :
|
|
136
|
+
undefined, this.enableSearch ?
|
|
137
|
+
this._getActionGroup("magnifying-glass", false, this._translations.search, () => this._search()) :
|
|
138
|
+
undefined, this.enableFullscreen ?
|
|
139
|
+
this._getActionGroup(fullscreenIcon, false, fullscreenTip, () => this._expand()) :
|
|
140
|
+
undefined, this.enableBasemap ?
|
|
141
|
+
this._getActionGroup("basemap", false, this._translations.basemap, () => this._toggleBasemapPicker()) :
|
|
142
|
+
undefined)), h("basemap-gallery", { basemapConfig: this.basemapConfig, class: basemapClass, mapView: this.mapView, ref: (el) => { this._basemapElement = el; } }), h("map-search", { class: searchClass, mapView: this.mapView, ref: (el) => { this._searchElement = el; }, searchConfiguration: this.searchConfiguration }), h("map-legend", { class: legendClass, mapView: this.mapView, ref: (el) => { this._legendElement = el; } }), h("map-fullscreen", { class: fullscreenClass, mapView: this.mapView, ref: (el) => { this._fullscreenElement = el; } })));
|
|
129
143
|
}
|
|
130
144
|
//--------------------------------------------------------------------------
|
|
131
145
|
//
|
|
@@ -217,6 +231,95 @@ export class MapTools {
|
|
|
217
231
|
}
|
|
218
232
|
static get properties() {
|
|
219
233
|
return {
|
|
234
|
+
"enableLegend": {
|
|
235
|
+
"type": "boolean",
|
|
236
|
+
"mutable": false,
|
|
237
|
+
"complexType": {
|
|
238
|
+
"original": "boolean",
|
|
239
|
+
"resolved": "boolean",
|
|
240
|
+
"references": {}
|
|
241
|
+
},
|
|
242
|
+
"required": false,
|
|
243
|
+
"optional": false,
|
|
244
|
+
"docs": {
|
|
245
|
+
"tags": [],
|
|
246
|
+
"text": "boolean: when true the legend widget will be available"
|
|
247
|
+
},
|
|
248
|
+
"attribute": "enable-legend",
|
|
249
|
+
"reflect": false
|
|
250
|
+
},
|
|
251
|
+
"enableFullscreen": {
|
|
252
|
+
"type": "boolean",
|
|
253
|
+
"mutable": false,
|
|
254
|
+
"complexType": {
|
|
255
|
+
"original": "boolean",
|
|
256
|
+
"resolved": "boolean",
|
|
257
|
+
"references": {}
|
|
258
|
+
},
|
|
259
|
+
"required": false,
|
|
260
|
+
"optional": false,
|
|
261
|
+
"docs": {
|
|
262
|
+
"tags": [],
|
|
263
|
+
"text": "boolean: when true the fullscreen widget will be available"
|
|
264
|
+
},
|
|
265
|
+
"attribute": "enable-fullscreen",
|
|
266
|
+
"reflect": false
|
|
267
|
+
},
|
|
268
|
+
"enableSearch": {
|
|
269
|
+
"type": "boolean",
|
|
270
|
+
"mutable": false,
|
|
271
|
+
"complexType": {
|
|
272
|
+
"original": "boolean",
|
|
273
|
+
"resolved": "boolean",
|
|
274
|
+
"references": {}
|
|
275
|
+
},
|
|
276
|
+
"required": false,
|
|
277
|
+
"optional": false,
|
|
278
|
+
"docs": {
|
|
279
|
+
"tags": [],
|
|
280
|
+
"text": "boolean: when true the search widget will be available"
|
|
281
|
+
},
|
|
282
|
+
"attribute": "enable-search",
|
|
283
|
+
"reflect": false
|
|
284
|
+
},
|
|
285
|
+
"enableBasemap": {
|
|
286
|
+
"type": "boolean",
|
|
287
|
+
"mutable": false,
|
|
288
|
+
"complexType": {
|
|
289
|
+
"original": "boolean",
|
|
290
|
+
"resolved": "boolean",
|
|
291
|
+
"references": {}
|
|
292
|
+
},
|
|
293
|
+
"required": false,
|
|
294
|
+
"optional": false,
|
|
295
|
+
"docs": {
|
|
296
|
+
"tags": [],
|
|
297
|
+
"text": "boolean: when true the basemap widget will be available"
|
|
298
|
+
},
|
|
299
|
+
"attribute": "enable-basemap",
|
|
300
|
+
"reflect": false
|
|
301
|
+
},
|
|
302
|
+
"basemapConfig": {
|
|
303
|
+
"type": "unknown",
|
|
304
|
+
"mutable": false,
|
|
305
|
+
"complexType": {
|
|
306
|
+
"original": "IBasemapConfig",
|
|
307
|
+
"resolved": "IBasemapConfig",
|
|
308
|
+
"references": {
|
|
309
|
+
"IBasemapConfig": {
|
|
310
|
+
"location": "import",
|
|
311
|
+
"path": "../../utils/interfaces",
|
|
312
|
+
"id": "src/utils/interfaces.ts::IBasemapConfig"
|
|
313
|
+
}
|
|
314
|
+
}
|
|
315
|
+
},
|
|
316
|
+
"required": false,
|
|
317
|
+
"optional": false,
|
|
318
|
+
"docs": {
|
|
319
|
+
"tags": [],
|
|
320
|
+
"text": "IBasemapConfig: List of any basemaps to filter out from the basemap widget"
|
|
321
|
+
}
|
|
322
|
+
},
|
|
220
323
|
"layout": {
|
|
221
324
|
"type": "string",
|
|
222
325
|
"mutable": false,
|
|
@@ -165,7 +165,12 @@ export interface IValueChange {
|
|
|
165
165
|
* Layer or table id and title key value pair
|
|
166
166
|
*/
|
|
167
167
|
export interface IMapItemHash {
|
|
168
|
-
[key: string]:
|
|
168
|
+
[key: string]: ILayerHashInfo;
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
export interface ILayerHashInfo {
|
|
172
|
+
name: string;
|
|
173
|
+
supportsUpdate: boolean;
|
|
169
174
|
}
|
|
170
175
|
|
|
171
176
|
/**
|
|
@@ -444,6 +449,8 @@ export interface IMapInfo {
|
|
|
444
449
|
searchConfiguration?: ISearchConfiguration;
|
|
445
450
|
filters?: any[]; // TODO generate an interface for this once we know how it will be passed in
|
|
446
451
|
layerInfos?: ILayerInfo[];
|
|
452
|
+
_hasValidLayers?: boolean;
|
|
453
|
+
visible: boolean;
|
|
447
454
|
}
|
|
448
455
|
|
|
449
456
|
export interface ILayerInfo {
|
|
@@ -466,3 +473,7 @@ export interface IExportInfo {
|
|
|
466
473
|
layerView?: __esri.FeatureLayerView;
|
|
467
474
|
selectionSetNames: string[];
|
|
468
475
|
}
|
|
476
|
+
|
|
477
|
+
export interface IBasemapConfig {
|
|
478
|
+
basemapIdsToFilter: string[];
|
|
479
|
+
}
|