@esri/solutions-components 0.8.33 → 0.8.35
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/cjs/basemap-gallery_7.cjs.entry.js +1 -17
- package/dist/cjs/calcite-flow_6.cjs.entry.js +22 -19
- package/dist/cjs/crowdsource-reporter.cjs.entry.js +29 -6
- package/dist/collection/components/create-feature/create-feature.js +13 -12
- package/dist/collection/components/create-related-feature/create-related-feature.js +23 -3
- package/dist/collection/components/crowdsource-reporter/crowdsource-reporter.js +31 -8
- package/dist/collection/components/feature-details/feature-details.js +0 -4
- package/dist/collection/components/floor-filter/floor-filter.js +1 -17
- package/dist/collection/demos/crowdsource-reporter.html +32 -8
- package/dist/components/create-feature2.js +13 -12
- package/dist/components/create-related-feature2.js +9 -3
- package/dist/components/crowdsource-reporter.js +29 -6
- package/dist/components/feature-details2.js +0 -4
- package/dist/components/floor-filter2.js +1 -17
- package/dist/esm/basemap-gallery_7.entry.js +1 -17
- package/dist/esm/calcite-flow_6.entry.js +22 -19
- package/dist/esm/crowdsource-reporter.entry.js +29 -6
- package/dist/solutions-components/demos/crowdsource-reporter.html +32 -8
- package/dist/solutions-components/p-0ce36a4a.entry.js +17 -0
- package/dist/solutions-components/p-5c5e3745.entry.js +6 -0
- package/dist/solutions-components/p-6e260ca3.entry.js +6 -0
- package/dist/solutions-components/solutions-components.esm.js +1 -1
- package/dist/types/components/create-related-feature/create-related-feature.d.ts +4 -0
- package/dist/types/components/crowdsource-reporter/crowdsource-reporter.d.ts +16 -3
- package/dist/types/components.d.ts +7 -2
- package/dist/types/preact.d.ts +2 -1
- package/package.json +1 -1
- package/dist/solutions-components/p-21cbb55d.entry.js +0 -6
- package/dist/solutions-components/p-4ae34862.entry.js +0 -17
- package/dist/solutions-components/p-90c3bc54.entry.js +0 -6
@@ -140,17 +140,12 @@ const FloorFilter = class {
|
|
140
140
|
* Watch for changes to the mapView and re-init the floor filter
|
141
141
|
*/
|
142
142
|
async mapViewWatchHandler() {
|
143
|
-
console.log("mapViewWatchHandler");
|
144
|
-
console.log(`this.mapView: ${this.mapView}`);
|
145
143
|
await this._initFloorFilter(this.mapView);
|
146
144
|
}
|
147
145
|
/**
|
148
146
|
* Watch for changes to the enabled property and re-init or destroy the floor filter
|
149
147
|
*/
|
150
148
|
async enabledWatchHandler() {
|
151
|
-
console.log("enabledWatchHandler");
|
152
|
-
console.log(`this.enabled: ${this.enabled}`);
|
153
|
-
console.log(`this.mapView: ${this.mapView}`);
|
154
149
|
if (this.enabled) {
|
155
150
|
await this._initFloorFilter(this.mapView);
|
156
151
|
}
|
@@ -173,9 +168,7 @@ const FloorFilter = class {
|
|
173
168
|
* Renders the component.
|
174
169
|
*/
|
175
170
|
render() {
|
176
|
-
|
177
|
-
console.log(`this._floorFilterElement: ${this._floorFilterElement}`);
|
178
|
-
return (index.h(index.Host, { key: '01b71c71af2a183b85c8620c338512fd338f19ef' }, index.h("div", { key: '752d397c6e3b6a2257d0a8a05051ed821eca4b94', ref: (el) => { this._floorFilterElement = el; } })));
|
171
|
+
return (index.h(index.Host, { key: 'c80a8d46fb48f3789d9fa09c2400faad49e2e236' }, index.h("div", { key: '82919a3ba061a17c8aeaa0d2f6f4f13bc428b519', ref: (el) => { this._floorFilterElement = el; } })));
|
179
172
|
}
|
180
173
|
//--------------------------------------------------------------------------
|
181
174
|
//
|
@@ -203,7 +196,6 @@ const FloorFilter = class {
|
|
203
196
|
* @protected
|
204
197
|
*/
|
205
198
|
_destroyWidget() {
|
206
|
-
console.log("_destroyWidget");
|
207
199
|
if (this.floorFilterWidget) {
|
208
200
|
this.floorFilterWidget.destroy();
|
209
201
|
this.floorFilterWidget = undefined;
|
@@ -218,7 +210,6 @@ const FloorFilter = class {
|
|
218
210
|
* @protected
|
219
211
|
*/
|
220
212
|
_initContainer() {
|
221
|
-
console.log("_initContainer");
|
222
213
|
this._destroyWidget();
|
223
214
|
this._floorFilterElement = document.createElement("div");
|
224
215
|
}
|
@@ -226,16 +217,9 @@ const FloorFilter = class {
|
|
226
217
|
* Initialize the floor filter or reset the current view if it already exists
|
227
218
|
*/
|
228
219
|
async _initFloorFilter(view) {
|
229
|
-
console.log("_initFloorFilter");
|
230
220
|
const webMap = view === null || view === void 0 ? void 0 : view.map;
|
231
221
|
await webMap.when(() => {
|
232
222
|
var _a, _b, _c;
|
233
|
-
console.log("webMap.when");
|
234
|
-
console.log("_initFloorFilter");
|
235
|
-
console.log(`view: ${view}`);
|
236
|
-
console.log(`this.enabled: ${this.enabled}`);
|
237
|
-
console.log(`this.FloorFilter: ${this.FloorFilter}`);
|
238
|
-
console.log(`webMap?.floorInfo: ${webMap === null || webMap === void 0 ? void 0 : webMap.floorInfo}`);
|
239
223
|
if (view && this.enabled && this.FloorFilter && (webMap === null || webMap === void 0 ? void 0 : webMap.floorInfo)) {
|
240
224
|
this._initContainer();
|
241
225
|
this.floorFilterWidget = new this.FloorFilter({
|
@@ -522,14 +522,23 @@ const CreateFeature = class {
|
|
522
522
|
}
|
523
523
|
});
|
524
524
|
this._editor.viewModel.addHandles(handle);
|
525
|
+
//Add handle to watch featureFormViewModel ready state
|
526
|
+
const formHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
|
527
|
+
if (state === 'ready') {
|
528
|
+
this._showSearchWidget = false;
|
529
|
+
this.progressStatus.emit(1);
|
530
|
+
this.drawComplete.emit();
|
531
|
+
}
|
532
|
+
});
|
533
|
+
this._editor.viewModel.addHandles(formHandle);
|
525
534
|
//Add handle to watch editor viewmodel state and then show the search widget
|
526
|
-
const
|
535
|
+
const createFeatureHandle = this.reactiveUtils.watch(() => this._editor.viewModel.state, (state) => {
|
527
536
|
if (state === 'creating-features') {
|
528
537
|
this._editorLoading = true;
|
529
538
|
this._showSearchWidget = true;
|
530
539
|
}
|
531
540
|
});
|
532
|
-
this._editor.viewModel.addHandles(
|
541
|
+
this._editor.viewModel.addHandles(createFeatureHandle);
|
533
542
|
}
|
534
543
|
/**
|
535
544
|
* Start creating the feature
|
@@ -547,14 +556,6 @@ const CreateFeature = class {
|
|
547
556
|
setTimeout(() => {
|
548
557
|
//on form submit
|
549
558
|
this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
|
550
|
-
//on sketch complete emit the event
|
551
|
-
this._editor.viewModel.sketchViewModel.on("create", (evt) => {
|
552
|
-
if (evt.state === "complete") {
|
553
|
-
this._showSearchWidget = false;
|
554
|
-
this.progressStatus.emit(1);
|
555
|
-
this.drawComplete.emit();
|
556
|
-
}
|
557
|
-
});
|
558
559
|
//hides the header and footer elements in editor widget
|
559
560
|
this.hideEditorsElements().then(() => {
|
560
561
|
resolve({});
|
@@ -668,13 +669,13 @@ const CreateFeature = class {
|
|
668
669
|
* @protected
|
669
670
|
*/
|
670
671
|
async hideEditorsElements() {
|
671
|
-
var _a;
|
672
|
+
var _a, _b;
|
672
673
|
if (!this.customizeSubmit) {
|
673
674
|
return;
|
674
675
|
}
|
675
676
|
await this.timeout(700);
|
676
677
|
//hides the header and footer on the featureForm
|
677
|
-
(_a = this.el.querySelector('.esri-editor').querySelectorAll('calcite-flow-item')) === null ||
|
678
|
+
(_b = (_a = this.el.querySelector('.esri-editor')) === null || _a === void 0 ? void 0 : _a.querySelectorAll('calcite-flow-item')) === null || _b === void 0 ? void 0 : _b.forEach((flowItem) => {
|
678
679
|
var _a, _b, _c, _d, _e;
|
679
680
|
const article = (_c = (_b = (_a = flowItem.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('calcite-panel')) === null || _b === void 0 ? void 0 : _b.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('article');
|
680
681
|
//hide the header
|
@@ -742,6 +743,7 @@ const CreateRelatedFeature = class {
|
|
742
743
|
this.success = index.createEvent(this, "success", 7);
|
743
744
|
this.fail = index.createEvent(this, "fail", 7);
|
744
745
|
this.isActionPending = index.createEvent(this, "isActionPending", 7);
|
746
|
+
this.formReady = index.createEvent(this, "formReady", 7);
|
745
747
|
/**
|
746
748
|
* boolean: Flag to maintain form submission using submit button
|
747
749
|
*/
|
@@ -834,7 +836,7 @@ const CreateRelatedFeature = class {
|
|
834
836
|
}
|
835
837
|
render() {
|
836
838
|
const loaderClass = this._editorLoading ? "" : "display-none";
|
837
|
-
return (index.h("calcite-loader", { key: '
|
839
|
+
return (index.h("calcite-loader", { key: '5302b1166a175b0605604792cd40b9d3fbfabd02', class: loaderClass, label: "", scale: "s" }));
|
838
840
|
}
|
839
841
|
/**
|
840
842
|
* StencilJS: Called once just after the component is fully loaded and the first render() occurs.
|
@@ -882,6 +884,13 @@ const CreateRelatedFeature = class {
|
|
882
884
|
}
|
883
885
|
});
|
884
886
|
this._editor.viewModel.addHandles(attachmentHandle);
|
887
|
+
//Add handle to watch featureFormViewModel ready state
|
888
|
+
const formHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
|
889
|
+
if (state === 'ready') {
|
890
|
+
this.formReady.emit();
|
891
|
+
}
|
892
|
+
});
|
893
|
+
this._editor.viewModel.addHandles(formHandle);
|
885
894
|
}
|
886
895
|
/**
|
887
896
|
* Start creating the feature feature form
|
@@ -907,8 +916,6 @@ const CreateRelatedFeature = class {
|
|
907
916
|
await this._editor.startCreateFeaturesWorkflowAtFeatureCreation(creationInfo);
|
908
917
|
//hides the header and footer elements in editor widget
|
909
918
|
await this.hideEditorsElements();
|
910
|
-
// Emit an event to show submit cancel buttons
|
911
|
-
this.isActionPending.emit(false);
|
912
919
|
this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
|
913
920
|
}
|
914
921
|
/**
|
@@ -1316,10 +1323,6 @@ const FeatureDetails = class {
|
|
1316
1323
|
const param = { updateFeatures: [newGraphicInstance] };
|
1317
1324
|
await selectedLayer.applyEdits(param).then(() => {
|
1318
1325
|
this._selectedGraphic = selectFeatureAttr;
|
1319
|
-
//update the current graphics in info card so that, the updated values are reflected in popup content
|
1320
|
-
if (this._infoCard) {
|
1321
|
-
void this._infoCard.updateCurrentGraphic(this._selectedGraphic);
|
1322
|
-
}
|
1323
1326
|
//store the like dislike value for the current selected graphic in local storage
|
1324
1327
|
this.setInLocalStorage();
|
1325
1328
|
this._updating = false;
|
@@ -113,7 +113,7 @@ const CrowdsourceReporter = class {
|
|
113
113
|
*/
|
114
114
|
render() {
|
115
115
|
const themeClass = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light";
|
116
|
-
return (index.h(index.Host, { key: '
|
116
|
+
return (index.h(index.Host, { key: 'e512e2693a586f8a6da7bcfa171feb60da26aee3' }, this._reportSubmitted && index.h("calcite-alert", { key: 'e5805ba948f1dc43eba2a78716af452cf71a8222', "auto-close": true, class: themeClass + " report-submitted-msg", icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._reportSubmitted = false; }, open: true, placement: "top" }, index.h("div", { key: '95b9accf1f09186c09c81cfb02a8939c4869ae8d', slot: "message" }, this.reportSubmittedMessage ? this.reportSubmittedMessage : this._translations.submitMsg)), this._featureCreationFailedErrorMsg && index.h("calcite-alert", { key: 'cab7f0e0f0d882612b4fa6f00799be9870aea6c5', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._featureCreationFailedErrorMsg = ""; }, open: true, placement: "top" }, index.h("div", { key: 'b9453672d85e26cf7bdeae0923cd36020d259d49', slot: "title" }, this._translations.error), index.h("div", { key: '5084315857bc88b8f80aaa411ac3fd5e4493e918', slot: "message" }, this._featureCreationFailedErrorMsg)), this._commentSubmitted && index.h("calcite-alert", { key: '62b7d9818913c3331ca9c8e4ed23c7f0c48a7946', "auto-close": true, class: 'report-submitted ' + themeClass, icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._commentSubmitted = false; }, open: true, placement: "top" }, index.h("div", { key: '5f18444fd375657db0c2a403cb453ead75536181', slot: "message" }, this._translations.commentSubmittedMsg)), this._addingCommentFailed && index.h("calcite-alert", { key: '732f08960095fc9fefcc79fc8df387a5a4c3f781', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._addingCommentFailed = false; }, open: true, placement: "top" }, index.h("div", { key: '16415430cf33ce53c0d49cab19dce2c3e34257d6', slot: "title" }, this._translations.error), index.h("div", { key: '83e5918e00902bd49512165f4aa62813cecb4619', slot: "message" }, this._translations.addingCommentFailedMsg)), index.h("div", { key: '3e9dadd880319708e64e717ba7e7adaddf97b935' }, index.h("calcite-shell", { key: 'c72664d361b3904bc191668207c3ad31ff1f98c9', "content-behind": true }, this._getReporter())), this.filterModal()));
|
117
117
|
}
|
118
118
|
//--------------------------------------------------------------------------
|
119
119
|
//
|
@@ -290,7 +290,7 @@ const CrowdsourceReporter = class {
|
|
290
290
|
* @protected
|
291
291
|
*/
|
292
292
|
getFeatureCreateFlowItem() {
|
293
|
-
return (index.h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), this._showSubmitCancelButton && index.h("div", { class: "width-full", slot: "footer" }, index.h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), index.h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), index.h("calcite-panel", { "full-height": true, "full-width": true }, index.h("div", { class: "progress-bar" }, index.h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), index.h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, index.h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), index.h("create-feature", { customizeSubmit: true, mapView: this.mapView, onDrawComplete: this.
|
293
|
+
return (index.h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), this._showSubmitCancelButton && index.h("div", { class: "width-full", slot: "footer" }, index.h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), index.h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), index.h("calcite-panel", { "full-height": true, "full-width": true }, index.h("div", { class: "progress-bar" }, index.h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), index.h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, index.h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), index.h("create-feature", { customizeSubmit: true, mapView: this.mapView, onDrawComplete: this.onFormReady.bind(this), onEditingAttachment: this.showSubmitCancelButton.bind(this), onFail: this.createFeatureFailed.bind(this), onProgressStatus: this.updatedProgressStatus.bind(this), onSuccess: this.onReportSubmitted.bind(this), ref: el => this._createFeature = el, searchConfiguration: this.searchConfiguration, selectedLayerId: this._selectedLayerId }))));
|
294
294
|
}
|
295
295
|
/**
|
296
296
|
* Update the progress bar status when editor panel changes
|
@@ -301,10 +301,12 @@ const CrowdsourceReporter = class {
|
|
301
301
|
this._updatedProgressBarStatus = evt.detail;
|
302
302
|
}
|
303
303
|
/**
|
304
|
-
* When
|
304
|
+
* When form is ready then show submit and cancel button
|
305
305
|
* @protected
|
306
306
|
*/
|
307
|
-
|
307
|
+
onFormReady() {
|
308
|
+
// update the form state when form is ready
|
309
|
+
this.updateFormState(true);
|
308
310
|
this._showSubmitCancelButton = true;
|
309
311
|
}
|
310
312
|
/**
|
@@ -331,6 +333,10 @@ const CrowdsourceReporter = class {
|
|
331
333
|
if (this._createFeature) {
|
332
334
|
void this._createFeature.close();
|
333
335
|
}
|
336
|
+
//on back form will be closed, so update the form state
|
337
|
+
if (this.isFormOpen) {
|
338
|
+
this.updateFormState(false);
|
339
|
+
}
|
334
340
|
this.backFromSelectedPanel();
|
335
341
|
}
|
336
342
|
/**
|
@@ -351,6 +357,10 @@ const CrowdsourceReporter = class {
|
|
351
357
|
void this._createRelatedFeature.close();
|
352
358
|
this._showSubmitCancelButton = false;
|
353
359
|
}
|
360
|
+
//on back form will be closed, so update the form state
|
361
|
+
if (this.isFormOpen) {
|
362
|
+
this.updateFormState(false);
|
363
|
+
}
|
354
364
|
this.backFromSelectedPanel();
|
355
365
|
}
|
356
366
|
/**
|
@@ -367,6 +377,10 @@ const CrowdsourceReporter = class {
|
|
367
377
|
* @protected
|
368
378
|
*/
|
369
379
|
onReportSubmitted() {
|
380
|
+
//on report submit form will be closed, so update the form state
|
381
|
+
if (this.isFormOpen) {
|
382
|
+
this.updateFormState(false);
|
383
|
+
}
|
370
384
|
this._reportSubmitted = true;
|
371
385
|
void this.navigateToHomePage();
|
372
386
|
}
|
@@ -503,7 +517,16 @@ const CrowdsourceReporter = class {
|
|
503
517
|
*/
|
504
518
|
toggleSidePanel() {
|
505
519
|
this._sidePanelCollapsed = !this._sidePanelCollapsed;
|
506
|
-
this.togglePanel.emit(this._sidePanelCollapsed);
|
520
|
+
this.togglePanel.emit({ panelState: this._sidePanelCollapsed, isFormOpen: this.isFormOpen });
|
521
|
+
}
|
522
|
+
/**
|
523
|
+
* Hide map when form open in case of mobile
|
524
|
+
* @param isFormOpen updated form state
|
525
|
+
* @protected
|
526
|
+
*/
|
527
|
+
updateFormState(isFormOpen) {
|
528
|
+
this.isFormOpen = isFormOpen;
|
529
|
+
this.togglePanel.emit({ panelState: this._sidePanelCollapsed, isFormOpen: this.isFormOpen });
|
507
530
|
}
|
508
531
|
/**
|
509
532
|
* When feature is selected from list store that and show feature details
|
@@ -598,7 +621,7 @@ const CrowdsourceReporter = class {
|
|
598
621
|
* @returns Node
|
599
622
|
*/
|
600
623
|
getAddCommentFlowItem() {
|
601
|
-
return (index.h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._relatedTable.title, onCalciteFlowItemBack: this.backFromCreateRelatedFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), index.h("div", { class: "width-full", slot: "footer" }, this._showSubmitCancelButton && index.h("div", { class: "width-full", slot: "footer" }, index.h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateRelatedFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), index.h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateRelatedFeaturePanel.bind(this), width: "full" }, this._translations.cancel))), index.h("calcite-panel", null, index.h("create-related-feature", { customizeSubmit: true, mapView: this.mapView, onFail: this.addCommentFailed.bind(this), onIsActionPending: this.showSubmitCancelButton.bind(this), onSuccess: this.onCommentSubmitted.bind(this), ref: el => this._createRelatedFeature = el, selectedFeature: this._currentFeature, table: this._relatedTable }))));
|
624
|
+
return (index.h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._relatedTable.title, onCalciteFlowItemBack: this.backFromCreateRelatedFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), index.h("div", { class: "width-full", slot: "footer" }, this._showSubmitCancelButton && index.h("div", { class: "width-full", slot: "footer" }, index.h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateRelatedFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), index.h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateRelatedFeaturePanel.bind(this), width: "full" }, this._translations.cancel))), index.h("calcite-panel", null, index.h("create-related-feature", { customizeSubmit: true, mapView: this.mapView, onFail: this.addCommentFailed.bind(this), onFormReady: this.onFormReady.bind(this), onIsActionPending: this.showSubmitCancelButton.bind(this), onSuccess: this.onCommentSubmitted.bind(this), ref: el => this._createRelatedFeature = el, selectedFeature: this._currentFeature, table: this._relatedTable }))));
|
602
625
|
}
|
603
626
|
/**
|
604
627
|
* Sets the selected features and updates the first feature as the current selected feature
|
@@ -194,14 +194,23 @@ export class CreateFeature {
|
|
194
194
|
}
|
195
195
|
});
|
196
196
|
this._editor.viewModel.addHandles(handle);
|
197
|
+
//Add handle to watch featureFormViewModel ready state
|
198
|
+
const formHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
|
199
|
+
if (state === 'ready') {
|
200
|
+
this._showSearchWidget = false;
|
201
|
+
this.progressStatus.emit(1);
|
202
|
+
this.drawComplete.emit();
|
203
|
+
}
|
204
|
+
});
|
205
|
+
this._editor.viewModel.addHandles(formHandle);
|
197
206
|
//Add handle to watch editor viewmodel state and then show the search widget
|
198
|
-
const
|
207
|
+
const createFeatureHandle = this.reactiveUtils.watch(() => this._editor.viewModel.state, (state) => {
|
199
208
|
if (state === 'creating-features') {
|
200
209
|
this._editorLoading = true;
|
201
210
|
this._showSearchWidget = true;
|
202
211
|
}
|
203
212
|
});
|
204
|
-
this._editor.viewModel.addHandles(
|
213
|
+
this._editor.viewModel.addHandles(createFeatureHandle);
|
205
214
|
}
|
206
215
|
/**
|
207
216
|
* Start creating the feature
|
@@ -219,14 +228,6 @@ export class CreateFeature {
|
|
219
228
|
setTimeout(() => {
|
220
229
|
//on form submit
|
221
230
|
this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
|
222
|
-
//on sketch complete emit the event
|
223
|
-
this._editor.viewModel.sketchViewModel.on("create", (evt) => {
|
224
|
-
if (evt.state === "complete") {
|
225
|
-
this._showSearchWidget = false;
|
226
|
-
this.progressStatus.emit(1);
|
227
|
-
this.drawComplete.emit();
|
228
|
-
}
|
229
|
-
});
|
230
231
|
//hides the header and footer elements in editor widget
|
231
232
|
this.hideEditorsElements().then(() => {
|
232
233
|
resolve({});
|
@@ -340,13 +341,13 @@ export class CreateFeature {
|
|
340
341
|
* @protected
|
341
342
|
*/
|
342
343
|
async hideEditorsElements() {
|
343
|
-
var _a;
|
344
|
+
var _a, _b;
|
344
345
|
if (!this.customizeSubmit) {
|
345
346
|
return;
|
346
347
|
}
|
347
348
|
await this.timeout(700);
|
348
349
|
//hides the header and footer on the featureForm
|
349
|
-
(_a = this.el.querySelector('.esri-editor').querySelectorAll('calcite-flow-item')) === null ||
|
350
|
+
(_b = (_a = this.el.querySelector('.esri-editor')) === null || _a === void 0 ? void 0 : _a.querySelectorAll('calcite-flow-item')) === null || _b === void 0 ? void 0 : _b.forEach((flowItem) => {
|
350
351
|
var _a, _b, _c, _d, _e;
|
351
352
|
const article = (_c = (_b = (_a = flowItem.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('calcite-panel')) === null || _b === void 0 ? void 0 : _b.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('article');
|
352
353
|
//hide the header
|
@@ -114,7 +114,7 @@ export class CreateRelatedFeature {
|
|
114
114
|
}
|
115
115
|
render() {
|
116
116
|
const loaderClass = this._editorLoading ? "" : "display-none";
|
117
|
-
return (h("calcite-loader", { key: '
|
117
|
+
return (h("calcite-loader", { key: '5302b1166a175b0605604792cd40b9d3fbfabd02', class: loaderClass, label: "", scale: "s" }));
|
118
118
|
}
|
119
119
|
/**
|
120
120
|
* StencilJS: Called once just after the component is fully loaded and the first render() occurs.
|
@@ -162,6 +162,13 @@ export class CreateRelatedFeature {
|
|
162
162
|
}
|
163
163
|
});
|
164
164
|
this._editor.viewModel.addHandles(attachmentHandle);
|
165
|
+
//Add handle to watch featureFormViewModel ready state
|
166
|
+
const formHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
|
167
|
+
if (state === 'ready') {
|
168
|
+
this.formReady.emit();
|
169
|
+
}
|
170
|
+
});
|
171
|
+
this._editor.viewModel.addHandles(formHandle);
|
165
172
|
}
|
166
173
|
/**
|
167
174
|
* Start creating the feature feature form
|
@@ -187,8 +194,6 @@ export class CreateRelatedFeature {
|
|
187
194
|
await this._editor.startCreateFeaturesWorkflowAtFeatureCreation(creationInfo);
|
188
195
|
//hides the header and footer elements in editor widget
|
189
196
|
await this.hideEditorsElements();
|
190
|
-
// Emit an event to show submit cancel buttons
|
191
|
-
this.isActionPending.emit(false);
|
192
197
|
this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
|
193
198
|
}
|
194
199
|
/**
|
@@ -422,6 +427,21 @@ export class CreateRelatedFeature {
|
|
422
427
|
"resolved": "boolean",
|
423
428
|
"references": {}
|
424
429
|
}
|
430
|
+
}, {
|
431
|
+
"method": "formReady",
|
432
|
+
"name": "formReady",
|
433
|
+
"bubbles": true,
|
434
|
+
"cancelable": true,
|
435
|
+
"composed": true,
|
436
|
+
"docs": {
|
437
|
+
"tags": [],
|
438
|
+
"text": "Emitted on demand when form is ready"
|
439
|
+
},
|
440
|
+
"complexType": {
|
441
|
+
"original": "void",
|
442
|
+
"resolved": "void",
|
443
|
+
"references": {}
|
444
|
+
}
|
425
445
|
}];
|
426
446
|
}
|
427
447
|
static get methods() {
|
@@ -118,7 +118,7 @@ export class CrowdsourceReporter {
|
|
118
118
|
*/
|
119
119
|
render() {
|
120
120
|
const themeClass = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light";
|
121
|
-
return (h(Host, { key: '
|
121
|
+
return (h(Host, { key: 'e512e2693a586f8a6da7bcfa171feb60da26aee3' }, this._reportSubmitted && h("calcite-alert", { key: 'e5805ba948f1dc43eba2a78716af452cf71a8222', "auto-close": true, class: themeClass + " report-submitted-msg", icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._reportSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '95b9accf1f09186c09c81cfb02a8939c4869ae8d', slot: "message" }, this.reportSubmittedMessage ? this.reportSubmittedMessage : this._translations.submitMsg)), this._featureCreationFailedErrorMsg && h("calcite-alert", { key: 'cab7f0e0f0d882612b4fa6f00799be9870aea6c5', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._featureCreationFailedErrorMsg = ""; }, open: true, placement: "top" }, h("div", { key: 'b9453672d85e26cf7bdeae0923cd36020d259d49', slot: "title" }, this._translations.error), h("div", { key: '5084315857bc88b8f80aaa411ac3fd5e4493e918', slot: "message" }, this._featureCreationFailedErrorMsg)), this._commentSubmitted && h("calcite-alert", { key: '62b7d9818913c3331ca9c8e4ed23c7f0c48a7946', "auto-close": true, class: 'report-submitted ' + themeClass, icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._commentSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '5f18444fd375657db0c2a403cb453ead75536181', slot: "message" }, this._translations.commentSubmittedMsg)), this._addingCommentFailed && h("calcite-alert", { key: '732f08960095fc9fefcc79fc8df387a5a4c3f781', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._addingCommentFailed = false; }, open: true, placement: "top" }, h("div", { key: '16415430cf33ce53c0d49cab19dce2c3e34257d6', slot: "title" }, this._translations.error), h("div", { key: '83e5918e00902bd49512165f4aa62813cecb4619', slot: "message" }, this._translations.addingCommentFailedMsg)), h("div", { key: '3e9dadd880319708e64e717ba7e7adaddf97b935' }, h("calcite-shell", { key: 'c72664d361b3904bc191668207c3ad31ff1f98c9', "content-behind": true }, this._getReporter())), this.filterModal()));
|
122
122
|
}
|
123
123
|
//--------------------------------------------------------------------------
|
124
124
|
//
|
@@ -295,7 +295,7 @@ export class CrowdsourceReporter {
|
|
295
295
|
* @protected
|
296
296
|
*/
|
297
297
|
getFeatureCreateFlowItem() {
|
298
|
-
return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), h("calcite-panel", { "full-height": true, "full-width": true }, h("div", { class: "progress-bar" }, h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), h("create-feature", { customizeSubmit: true, mapView: this.mapView, onDrawComplete: this.
|
298
|
+
return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), h("calcite-panel", { "full-height": true, "full-width": true }, h("div", { class: "progress-bar" }, h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), h("create-feature", { customizeSubmit: true, mapView: this.mapView, onDrawComplete: this.onFormReady.bind(this), onEditingAttachment: this.showSubmitCancelButton.bind(this), onFail: this.createFeatureFailed.bind(this), onProgressStatus: this.updatedProgressStatus.bind(this), onSuccess: this.onReportSubmitted.bind(this), ref: el => this._createFeature = el, searchConfiguration: this.searchConfiguration, selectedLayerId: this._selectedLayerId }))));
|
299
299
|
}
|
300
300
|
/**
|
301
301
|
* Update the progress bar status when editor panel changes
|
@@ -306,10 +306,12 @@ export class CrowdsourceReporter {
|
|
306
306
|
this._updatedProgressBarStatus = evt.detail;
|
307
307
|
}
|
308
308
|
/**
|
309
|
-
* When
|
309
|
+
* When form is ready then show submit and cancel button
|
310
310
|
* @protected
|
311
311
|
*/
|
312
|
-
|
312
|
+
onFormReady() {
|
313
|
+
// update the form state when form is ready
|
314
|
+
this.updateFormState(true);
|
313
315
|
this._showSubmitCancelButton = true;
|
314
316
|
}
|
315
317
|
/**
|
@@ -336,6 +338,10 @@ export class CrowdsourceReporter {
|
|
336
338
|
if (this._createFeature) {
|
337
339
|
void this._createFeature.close();
|
338
340
|
}
|
341
|
+
//on back form will be closed, so update the form state
|
342
|
+
if (this.isFormOpen) {
|
343
|
+
this.updateFormState(false);
|
344
|
+
}
|
339
345
|
this.backFromSelectedPanel();
|
340
346
|
}
|
341
347
|
/**
|
@@ -356,6 +362,10 @@ export class CrowdsourceReporter {
|
|
356
362
|
void this._createRelatedFeature.close();
|
357
363
|
this._showSubmitCancelButton = false;
|
358
364
|
}
|
365
|
+
//on back form will be closed, so update the form state
|
366
|
+
if (this.isFormOpen) {
|
367
|
+
this.updateFormState(false);
|
368
|
+
}
|
359
369
|
this.backFromSelectedPanel();
|
360
370
|
}
|
361
371
|
/**
|
@@ -372,6 +382,10 @@ export class CrowdsourceReporter {
|
|
372
382
|
* @protected
|
373
383
|
*/
|
374
384
|
onReportSubmitted() {
|
385
|
+
//on report submit form will be closed, so update the form state
|
386
|
+
if (this.isFormOpen) {
|
387
|
+
this.updateFormState(false);
|
388
|
+
}
|
375
389
|
this._reportSubmitted = true;
|
376
390
|
void this.navigateToHomePage();
|
377
391
|
}
|
@@ -508,7 +522,16 @@ export class CrowdsourceReporter {
|
|
508
522
|
*/
|
509
523
|
toggleSidePanel() {
|
510
524
|
this._sidePanelCollapsed = !this._sidePanelCollapsed;
|
511
|
-
this.togglePanel.emit(this._sidePanelCollapsed);
|
525
|
+
this.togglePanel.emit({ panelState: this._sidePanelCollapsed, isFormOpen: this.isFormOpen });
|
526
|
+
}
|
527
|
+
/**
|
528
|
+
* Hide map when form open in case of mobile
|
529
|
+
* @param isFormOpen updated form state
|
530
|
+
* @protected
|
531
|
+
*/
|
532
|
+
updateFormState(isFormOpen) {
|
533
|
+
this.isFormOpen = isFormOpen;
|
534
|
+
this.togglePanel.emit({ panelState: this._sidePanelCollapsed, isFormOpen: this.isFormOpen });
|
512
535
|
}
|
513
536
|
/**
|
514
537
|
* When feature is selected from list store that and show feature details
|
@@ -603,7 +626,7 @@ export class CrowdsourceReporter {
|
|
603
626
|
* @returns Node
|
604
627
|
*/
|
605
628
|
getAddCommentFlowItem() {
|
606
|
-
return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._relatedTable.title, onCalciteFlowItemBack: this.backFromCreateRelatedFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), h("div", { class: "width-full", slot: "footer" }, this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateRelatedFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateRelatedFeaturePanel.bind(this), width: "full" }, this._translations.cancel))), h("calcite-panel", null, h("create-related-feature", { customizeSubmit: true, mapView: this.mapView, onFail: this.addCommentFailed.bind(this), onIsActionPending: this.showSubmitCancelButton.bind(this), onSuccess: this.onCommentSubmitted.bind(this), ref: el => this._createRelatedFeature = el, selectedFeature: this._currentFeature, table: this._relatedTable }))));
|
629
|
+
return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._relatedTable.title, onCalciteFlowItemBack: this.backFromCreateRelatedFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), h("div", { class: "width-full", slot: "footer" }, this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateRelatedFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateRelatedFeaturePanel.bind(this), width: "full" }, this._translations.cancel))), h("calcite-panel", null, h("create-related-feature", { customizeSubmit: true, mapView: this.mapView, onFail: this.addCommentFailed.bind(this), onFormReady: this.onFormReady.bind(this), onIsActionPending: this.showSubmitCancelButton.bind(this), onSuccess: this.onCommentSubmitted.bind(this), ref: el => this._createRelatedFeature = el, selectedFeature: this._currentFeature, table: this._relatedTable }))));
|
607
630
|
}
|
608
631
|
/**
|
609
632
|
* Sets the selected features and updates the first feature as the current selected feature
|
@@ -1425,8 +1448,8 @@ export class CrowdsourceReporter {
|
|
1425
1448
|
"text": "Emitted when toggle panel button is clicked in reporter"
|
1426
1449
|
},
|
1427
1450
|
"complexType": {
|
1428
|
-
"original": "boolean",
|
1429
|
-
"resolved": "boolean",
|
1451
|
+
"original": "{panelState: boolean, isFormOpen: boolean}",
|
1452
|
+
"resolved": "{ panelState: boolean; isFormOpen: boolean; }",
|
1430
1453
|
"references": {}
|
1431
1454
|
}
|
1432
1455
|
}];
|
@@ -329,10 +329,6 @@ export class FeatureDetails {
|
|
329
329
|
const param = { updateFeatures: [newGraphicInstance] };
|
330
330
|
await selectedLayer.applyEdits(param).then(() => {
|
331
331
|
this._selectedGraphic = selectFeatureAttr;
|
332
|
-
//update the current graphics in info card so that, the updated values are reflected in popup content
|
333
|
-
if (this._infoCard) {
|
334
|
-
void this._infoCard.updateCurrentGraphic(this._selectedGraphic);
|
335
|
-
}
|
336
332
|
//store the like dislike value for the current selected graphic in local storage
|
337
333
|
this.setInLocalStorage();
|
338
334
|
this._updating = false;
|
@@ -35,17 +35,12 @@ export class FloorFilter {
|
|
35
35
|
* Watch for changes to the mapView and re-init the floor filter
|
36
36
|
*/
|
37
37
|
async mapViewWatchHandler() {
|
38
|
-
console.log("mapViewWatchHandler");
|
39
|
-
console.log(`this.mapView: ${this.mapView}`);
|
40
38
|
await this._initFloorFilter(this.mapView);
|
41
39
|
}
|
42
40
|
/**
|
43
41
|
* Watch for changes to the enabled property and re-init or destroy the floor filter
|
44
42
|
*/
|
45
43
|
async enabledWatchHandler() {
|
46
|
-
console.log("enabledWatchHandler");
|
47
|
-
console.log(`this.enabled: ${this.enabled}`);
|
48
|
-
console.log(`this.mapView: ${this.mapView}`);
|
49
44
|
if (this.enabled) {
|
50
45
|
await this._initFloorFilter(this.mapView);
|
51
46
|
}
|
@@ -68,9 +63,7 @@ export class FloorFilter {
|
|
68
63
|
* Renders the component.
|
69
64
|
*/
|
70
65
|
render() {
|
71
|
-
|
72
|
-
console.log(`this._floorFilterElement: ${this._floorFilterElement}`);
|
73
|
-
return (h(Host, { key: '01b71c71af2a183b85c8620c338512fd338f19ef' }, h("div", { key: '752d397c6e3b6a2257d0a8a05051ed821eca4b94', ref: (el) => { this._floorFilterElement = el; } })));
|
66
|
+
return (h(Host, { key: 'c80a8d46fb48f3789d9fa09c2400faad49e2e236' }, h("div", { key: '82919a3ba061a17c8aeaa0d2f6f4f13bc428b519', ref: (el) => { this._floorFilterElement = el; } })));
|
74
67
|
}
|
75
68
|
//--------------------------------------------------------------------------
|
76
69
|
//
|
@@ -98,7 +91,6 @@ export class FloorFilter {
|
|
98
91
|
* @protected
|
99
92
|
*/
|
100
93
|
_destroyWidget() {
|
101
|
-
console.log("_destroyWidget");
|
102
94
|
if (this.floorFilterWidget) {
|
103
95
|
this.floorFilterWidget.destroy();
|
104
96
|
this.floorFilterWidget = undefined;
|
@@ -113,7 +105,6 @@ export class FloorFilter {
|
|
113
105
|
* @protected
|
114
106
|
*/
|
115
107
|
_initContainer() {
|
116
|
-
console.log("_initContainer");
|
117
108
|
this._destroyWidget();
|
118
109
|
this._floorFilterElement = document.createElement("div");
|
119
110
|
}
|
@@ -121,16 +112,9 @@ export class FloorFilter {
|
|
121
112
|
* Initialize the floor filter or reset the current view if it already exists
|
122
113
|
*/
|
123
114
|
async _initFloorFilter(view) {
|
124
|
-
console.log("_initFloorFilter");
|
125
115
|
const webMap = view === null || view === void 0 ? void 0 : view.map;
|
126
116
|
await webMap.when(() => {
|
127
117
|
var _a, _b, _c;
|
128
|
-
console.log("webMap.when");
|
129
|
-
console.log("_initFloorFilter");
|
130
|
-
console.log(`view: ${view}`);
|
131
|
-
console.log(`this.enabled: ${this.enabled}`);
|
132
|
-
console.log(`this.FloorFilter: ${this.FloorFilter}`);
|
133
|
-
console.log(`webMap?.floorInfo: ${webMap === null || webMap === void 0 ? void 0 : webMap.floorInfo}`);
|
134
118
|
if (view && this.enabled && this.FloorFilter && (webMap === null || webMap === void 0 ? void 0 : webMap.floorInfo)) {
|
135
119
|
this._initContainer();
|
136
120
|
this.floorFilterWidget = new this.FloorFilter({
|