@wizishop/wizi-block 4.2.33-beta → 4.2.36-beta

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.
Files changed (30) hide show
  1. package/bundles/wizishop-wizi-block.umd.js +221 -277
  2. package/bundles/wizishop-wizi-block.umd.js.map +1 -1
  3. package/bundles/wizishop-wizi-block.umd.min.js +1 -1
  4. package/bundles/wizishop-wizi-block.umd.min.js.map +1 -1
  5. package/esm2015/lib/services/blocks/images/images-banner.service.js +2 -2
  6. package/esm2015/lib/services/blocks/images/images-simple.service.js +2 -2
  7. package/esm2015/lib/services/blocks/text-backgrounds/text-backgrounds-simple.service.js +2 -2
  8. package/esm2015/lib/services/blocks/text-backgrounds/text-backgrounds-with-banner.service.js +2 -2
  9. package/esm2015/lib/services/blocks/text-backgrounds/text-backgrounds-with-txt.service.js +2 -2
  10. package/esm2015/lib/shared/components/editorjs/tools/inline/tool-type/inline-style-tool.component.js +13 -8
  11. package/esm2015/lib/shared/components/editorjs/tools/paragraph/tool-type/text-edition.component.js +13 -13
  12. package/esm2015/lib/shared/components/quill/quill.component.js +2 -1
  13. package/esm2015/lib/structures/map/background-form-left/map-background-form-left.component.js +32 -41
  14. package/esm2015/lib/structures/map/background-form-right/map-background-form-right.component.js +32 -41
  15. package/esm2015/lib/structures/map/fullpage/map-fullpage.component.js +32 -43
  16. package/esm2015/lib/structures/map/left-text/map-left-text.component.js +30 -41
  17. package/esm2015/lib/structures/map/right-text/map-right-text.component.js +30 -41
  18. package/esm2015/lib/structures/map/text-form/map-text-form.component.js +32 -43
  19. package/esm2015/lib/structures/structures.module.js +3 -1
  20. package/fesm2015/wizishop-wizi-block.js +215 -261
  21. package/fesm2015/wizishop-wizi-block.js.map +1 -1
  22. package/lib/structures/map/background-form-left/map-background-form-left.component.d.ts +8 -6
  23. package/lib/structures/map/background-form-right/map-background-form-right.component.d.ts +8 -6
  24. package/lib/structures/map/fullpage/map-fullpage.component.d.ts +7 -5
  25. package/lib/structures/map/left-text/map-left-text.component.d.ts +7 -5
  26. package/lib/structures/map/right-text/map-right-text.component.d.ts +7 -5
  27. package/lib/structures/map/text-form/map-text-form.component.d.ts +8 -6
  28. package/package.json +1 -5
  29. package/wizi-block.scss +576 -571
  30. package/wizishop-wizi-block.metadata.json +1 -1
@@ -23,13 +23,10 @@ import { NgScrollbarModule } from 'ngx-scrollbar';
23
23
  import { __awaiter } from 'tslib';
24
24
  import EditorJS from '@editorjs/editorjs';
25
25
  import iro from '@jaames/iro';
26
- import { basicSetup, EditorView } from 'codemirror';
27
- import { EditorState } from '@codemirror/state';
28
- import { html } from '@codemirror/lang-html';
29
26
  import { MonacoEditorModule } from 'ngx-monaco-editor';
30
27
  import { tileLayer, latLng, marker, icon } from 'leaflet';
31
- import places from 'places.js';
32
28
  import { LeafletModule } from '@asymmetrik/ngx-leaflet';
29
+ import { GooglePlaceModule } from 'ngx-google-places-autocomplete';
33
30
  import { ColorPickerModule } from 'ngx-color-picker';
34
31
 
35
32
  class MediaConnectorService {
@@ -3126,7 +3123,7 @@ class ImagesSimpleService {
3126
3123
  'wb.blocks.FormContentDto.117',
3127
3124
  ], ['0', '0.25', '0.5', '1']);
3128
3125
  imgSimpleFormDto.forms.push(parallaxSpeedImgSimpleContentDto);
3129
- const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.forms.FormsContentDto.27', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
3126
+ const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.blocks.FormContentDto.114', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
3130
3127
  imgSimpleFormDto.forms.push(parallaxInvertedImgSimpleContentDto);
3131
3128
  return imgSimpleFormDto;
3132
3129
  }
@@ -4116,7 +4113,7 @@ class TextBackgroundsSimpleService {
4116
4113
  'wb.blocks.FormContentDto.117',
4117
4114
  ], ['0', '0.25', '0.5', '1']);
4118
4115
  TextBackgroundsSimpleFormDto.forms.push(parallaxSpeedImgSimpleContentDto);
4119
- const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.forms.FormsContentDto.27', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
4116
+ const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.blocks.FormContentDto.114', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
4120
4117
  TextBackgroundsSimpleFormDto.forms.push(parallaxInvertedImgSimpleContentDto);
4121
4118
  return TextBackgroundsSimpleFormDto;
4122
4119
  }
@@ -4191,7 +4188,7 @@ class TextBackgroundsWithTxtService {
4191
4188
  'wb.blocks.FormContentDto.117',
4192
4189
  ], ['0', '0.25', '0.5', '1']);
4193
4190
  formsDto.forms.push(parallaxSpeedImgSimpleContentDto);
4194
- const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.forms.FormsContentDto.27', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
4191
+ const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.blocks.FormContentDto.114', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
4195
4192
  formsDto.forms.push(parallaxInvertedImgSimpleContentDto);
4196
4193
  return formsDto;
4197
4194
  }
@@ -4266,7 +4263,7 @@ class TextBackgroundsWithBannerService {
4266
4263
  'wb.blocks.FormContentDto.117',
4267
4264
  ], ['0', '0.25', '0.5', '1']);
4268
4265
  formsDto.forms.push(parallaxSpeedImgSimpleContentDto);
4269
- const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.forms.FormsContentDto.27', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
4266
+ const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.blocks.FormContentDto.114', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
4270
4267
  formsDto.forms.push(parallaxInvertedImgSimpleContentDto);
4271
4268
  const colorContentDto = new FormsContentDto(FORM_NAME_COLOR, 'wb.blocks.FormContentDto.112', FORM_TYPE_COLOR, content[FORM_NAME_COLOR], '#122231', '');
4272
4269
  formsDto.forms.push(colorContentDto);
@@ -5686,7 +5683,7 @@ class ImagesBannerService {
5686
5683
  'wb.blocks.FormContentDto.117',
5687
5684
  ], ['0', '0.25', '0.5', '1']);
5688
5685
  imgBannerFormDto.forms.push(parallaxSpeedImgSimpleContentDto);
5689
- const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.forms.FormsContentDto.27', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
5686
+ const parallaxInvertedImgSimpleContentDto = new FormsContentDto(FORM_NAME_PARALLAX_INVERTED, 'wb.blocks.FormContentDto.114', FORM_TYPE_CHECKBOX, content[FORM_NAME_PARALLAX_INVERTED], '', '', [], [], [true, false], false, 'wb.forms.FormsContentDto.28');
5690
5687
  imgBannerFormDto.forms.push(parallaxInvertedImgSimpleContentDto);
5691
5688
  return imgBannerFormDto;
5692
5689
  }
@@ -9614,6 +9611,7 @@ class QuillComponent {
9614
9611
  },
9615
9612
  clipboard: {
9616
9613
  matchers: [['BR', this.lineBreakMatcher]],
9614
+ matchVisual: false,
9617
9615
  },
9618
9616
  keyboard: {
9619
9617
  bindings: {
@@ -19085,7 +19083,9 @@ class InlineStyleTool extends EditorJSTool {
19085
19083
  const children = Array.from(parentContainer.childNodes);
19086
19084
  if ((children === null || children === void 0 ? void 0 : children.length) > 0) {
19087
19085
  for (var currentNode = children[0]; currentNode; currentNode = currentNode.nextSibling) {
19088
- if ((!currentNode.textContent || currentNode.textContent.length === 0) || (currentNode.nodeType === Node.ELEMENT_NODE && currentNode.innerText.length === 0)) {
19086
+ if (!currentNode.textContent ||
19087
+ currentNode.textContent.length === 0 ||
19088
+ (currentNode.nodeType === Node.ELEMENT_NODE && currentNode.innerText.length === 0)) {
19089
19089
  let previousSibling = currentNode.previousSibling;
19090
19090
  parentContainer.removeChild(currentNode);
19091
19091
  currentNode = previousSibling;
@@ -19157,13 +19157,16 @@ class InlineStyleTool extends EditorJSTool {
19157
19157
  }
19158
19158
  identicalAttributes(currentElement, nextElement) {
19159
19159
  let currentElementAttributes = currentElement.getAttributeNames();
19160
- currentElementAttributes.forEach(attribute => {
19161
- if (attribute !== 'style') {
19162
- if (!nextElement.getAttribute(attribute) || nextElement.getAttribute(attribute) !== currentElement.getAttribute(attribute)) {
19163
- return false;
19160
+ if (currentElementAttributes) {
19161
+ currentElementAttributes.forEach((attribute) => {
19162
+ if (attribute !== 'style') {
19163
+ if (!nextElement.getAttribute(attribute) ||
19164
+ nextElement.getAttribute(attribute) !== currentElement.getAttribute(attribute)) {
19165
+ return false;
19166
+ }
19164
19167
  }
19165
- }
19166
- });
19168
+ });
19169
+ }
19167
19170
  return true;
19168
19171
  }
19169
19172
  identicalInlineStyle(currentElement, nextElement) {
@@ -22208,6 +22211,9 @@ class textSizeTool extends InlineTextTool {
22208
22211
  }
22209
22212
  textSizeTool.title = 'Text Size';
22210
22213
 
22214
+ // import { EditorView, basicSetup } from 'codemirror';
22215
+ // import { EditorState } from '@codemirror/state';
22216
+ // import { html } from '@codemirror/lang-html';
22211
22217
  class TextEditionTool extends ParagraphStyleTool {
22212
22218
  constructor() {
22213
22219
  super(...arguments);
@@ -22277,15 +22283,15 @@ class TextEditionTool extends ParagraphStyleTool {
22277
22283
  modal.appendChild(buttonContainer);
22278
22284
  container.appendChild(modal);
22279
22285
  document.body.appendChild(container);
22280
- let state = EditorState.create({
22281
- doc: content,
22282
- extensions: [basicSetup, html()],
22283
- });
22284
- let view = new EditorView({
22285
- state: state,
22286
- parent: editorContainer,
22287
- });
22288
- saveButton.addEventListener('click', () => saveCodeEditModal(view.state.doc.toString()), true);
22286
+ // let state = EditorState.create({
22287
+ // doc: content,
22288
+ // extensions: [basicSetup, html()],
22289
+ // });
22290
+ // let view = new EditorView({
22291
+ // state: state,
22292
+ // parent: editorContainer,
22293
+ // });
22294
+ // saveButton.addEventListener('click', () => saveCodeEditModal(view.state.doc.toString()), true);
22289
22295
  buttonContainer.appendChild(saveButton);
22290
22296
  }
22291
22297
  getSavedEditorContent(name) {
@@ -26457,15 +26463,14 @@ QuotesSimpleBackgroundComponent.decorators = [
26457
26463
  ];
26458
26464
  QuotesSimpleBackgroundComponent.ctorParameters = () => [];
26459
26465
 
26460
- class OpenMapDto {
26461
- }
26462
-
26463
26466
  class MapFullpageComponent extends StructuresComponent {
26464
26467
  constructor(externalConfigService) {
26465
26468
  super();
26466
26469
  this.externalConfigService = externalConfigService;
26467
26470
  this.address = '';
26471
+ this.triggerAddress = '';
26468
26472
  this.editPlaceMap = null;
26473
+ this.firstTimeTrigger = false;
26469
26474
  this.options = {};
26470
26475
  this.layers = [];
26471
26476
  this.showMap = false;
@@ -26474,40 +26479,29 @@ class MapFullpageComponent extends StructuresComponent {
26474
26479
  ngOnInit() {
26475
26480
  super.ngOnInit();
26476
26481
  if (this.contentBlock[this.FORM_NAME_COORDINATE_Y] && this.contentBlock[this.FORM_NAME_COORDINATE_X]) {
26477
- const algolia = new OpenMapDto();
26478
- algolia.suggestion = {
26479
- latlng: {
26480
- lat: this.contentBlock[this.FORM_NAME_COORDINATE_Y],
26481
- lng: this.contentBlock[this.FORM_NAME_COORDINATE_X],
26482
+ this.googleMapReturnElement = {
26483
+ suggestion: {
26484
+ latlng: {
26485
+ lat: this.contentBlock[this.FORM_NAME_COORDINATE_Y],
26486
+ lng: this.contentBlock[this.FORM_NAME_COORDINATE_X],
26487
+ },
26488
+ value: '',
26482
26489
  },
26483
- value: '',
26484
26490
  };
26485
- this.setCoordinateOnPlaces(algolia);
26491
+ this.setCoordinateOnPlaces(this.googleMapReturnElement);
26486
26492
  }
26487
26493
  }
26488
- ngAfterViewInit() {
26489
- if (!this.showMap) {
26490
- const placesAutocomplete = places({
26491
- appId: this.externalConfigService.getAlgoliaAppId(),
26492
- apiKey: this.externalConfigService.getAlgoliaApiKey(),
26493
- container: this.input.nativeElement,
26494
- });
26495
- placesAutocomplete.on('change', (algoliaReturnElement) => {
26496
- this.setCoordinateOnPlaces(algoliaReturnElement);
26497
- });
26498
- }
26499
- }
26500
- setCoordinateOnPlaces(algoliaReturnElement) {
26494
+ setCoordinateOnPlaces(googleResults) {
26501
26495
  this.showMap = false;
26502
26496
  this.options = {
26503
26497
  layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: 'WiziShop' })],
26504
26498
  zoom: 18,
26505
26499
  zoomControl: false,
26506
- center: latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng),
26500
+ center: latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng),
26507
26501
  };
26508
- this.center = latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng);
26502
+ this.center = latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng);
26509
26503
  this.layers = [
26510
- marker([algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng], {
26504
+ marker([googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng], {
26511
26505
  icon: icon({
26512
26506
  iconSize: [25, 41],
26513
26507
  iconAnchor: [13, 41],
@@ -26516,23 +26510,23 @@ class MapFullpageComponent extends StructuresComponent {
26516
26510
  }),
26517
26511
  }),
26518
26512
  ];
26519
- this.contentBlock[this.FORM_NAME_COORDINATE_Y] = algoliaReturnElement.suggestion.latlng.lat;
26520
- this.contentBlock[this.FORM_NAME_COORDINATE_X] = algoliaReturnElement.suggestion.latlng.lng;
26521
- this.address = algoliaReturnElement.suggestion.value;
26513
+ this.contentBlock[this.FORM_NAME_COORDINATE_Y] = googleResults.suggestion.latlng.lat;
26514
+ this.contentBlock[this.FORM_NAME_COORDINATE_X] = googleResults.suggestion.latlng.lng;
26515
+ this.address = googleResults.suggestion.value;
26522
26516
  this.showMap = true;
26523
26517
  this.persist();
26524
26518
  }
26525
- createEditAlgoliaInput() {
26526
- if (this.editPlaceMap === null) {
26527
- this.editPlaceMap = places({
26528
- appId: this.externalConfigService.getAlgoliaAppId(),
26529
- apiKey: this.externalConfigService.getAlgoliaApiKey(),
26530
- container: document.querySelector('#address-input-edit' + this.uuid),
26531
- });
26532
- this.editPlaceMap.on('change', (algoliaReturnElement) => {
26533
- this.setCoordinateOnPlaces(algoliaReturnElement);
26534
- });
26535
- }
26519
+ handleAddressChange(event) {
26520
+ this.googleMapReturnElement = {
26521
+ suggestion: {
26522
+ latlng: {
26523
+ lat: event.geometry.location.lat(),
26524
+ lng: event.geometry.location.lng(),
26525
+ },
26526
+ value: event.name,
26527
+ },
26528
+ };
26529
+ this.setCoordinateOnPlaces(this.googleMapReturnElement);
26536
26530
  }
26537
26531
  /**
26538
26532
  * Avoid partial map loaded at the initialization
@@ -26547,7 +26541,7 @@ class MapFullpageComponent extends StructuresComponent {
26547
26541
  MapFullpageComponent.decorators = [
26548
26542
  { type: Component, args: [{
26549
26543
  selector: MapFullpageService.selector(),
26550
- template: "<div class=\"wb-map-fullpage\">\n <div class=\"wb-map-fullpage__container\">\n <div *ngIf=\"showMap\">\n <div class=\"wb-map-fullpage__container__config\">\n <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_LEFT_TOP\" (click)=\"createEditAlgoliaInput()\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input-edit{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInputEdit\n (click)=\"myInputEdit.select()\"\n />\n </wb-structure-config>\n </div>\n <div class=\"wb-map-fullpage__cover\"></div>\n <div\n class=\"wb-map-fullpage__container__map\"\n leaflet\n [leafletOptions]=\"options\"\n [leafletLayers]=\"layers\"\n [(leafletCenter)]=\"center\"\n (leafletMapReady)=\"onMapReady($event)\"\n ></div>\n </div>\n </div>\n <div class=\"wb-map-fullpage__selector\" *ngIf=\"!showMap\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input id=\"address-input{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInput (click)=\"myInput.select()\" />\n </div>\n</div>\n"
26544
+ template: "<div class=\"wb-map-fullpage\">\n <div class=\"wb-map-fullpage__container\">\n <div *ngIf=\"showMap\">\n <div class=\"wb-map-fullpage__container__config\">\n <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_LEFT_TOP\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input-edit{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInputEdit\n (click)=\"myInputEdit.select()\"\n ngx-google-places-autocomplete\n (onAddressChange)=\"handleAddressChange($event)\"\n />\n </wb-structure-config>\n </div>\n <div class=\"wb-map-fullpage__cover\"></div>\n <div\n class=\"wb-map-fullpage__container__map\"\n leaflet\n [leafletOptions]=\"options\"\n [leafletLayers]=\"layers\"\n [(leafletCenter)]=\"center\"\n (leafletMapReady)=\"onMapReady($event)\"\n ></div>\n </div>\n </div>\n <div class=\"wb-map-fullpage__selector\" *ngIf=\"!showMap\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInput\n (click)=\"myInput.select()\"\n ngx-google-places-autocomplete\n (onAddressChange)=\"handleAddressChange($event)\"\n />\n </div>\n</div>\n"
26551
26545
  },] }
26552
26546
  ];
26553
26547
  MapFullpageComponent.ctorParameters = () => [
@@ -26562,7 +26556,9 @@ class MapLeftTextComponent extends StructuresComponent {
26562
26556
  super();
26563
26557
  this.externalConfigService = externalConfigService;
26564
26558
  this.address = '';
26559
+ this.triggerAddress = '';
26565
26560
  this.editPlaceMap = null;
26561
+ this.firstTimeTrigger = false;
26566
26562
  this.options = {};
26567
26563
  this.layers = [];
26568
26564
  this.showMap = false;
@@ -26571,40 +26567,29 @@ class MapLeftTextComponent extends StructuresComponent {
26571
26567
  ngOnInit() {
26572
26568
  super.ngOnInit();
26573
26569
  if (this.contentBlock[this.FORM_NAME_COORDINATE_Y] && this.contentBlock[this.FORM_NAME_COORDINATE_X]) {
26574
- const algolia = new OpenMapDto();
26575
- algolia.suggestion = {
26576
- latlng: {
26577
- lat: this.contentBlock[this.FORM_NAME_COORDINATE_Y],
26578
- lng: this.contentBlock[this.FORM_NAME_COORDINATE_X],
26570
+ this.googleMapReturnElement = {
26571
+ suggestion: {
26572
+ latlng: {
26573
+ lat: this.contentBlock[this.FORM_NAME_COORDINATE_Y],
26574
+ lng: this.contentBlock[this.FORM_NAME_COORDINATE_X],
26575
+ },
26576
+ value: '',
26579
26577
  },
26580
- value: '',
26581
26578
  };
26582
- this.setCoordinateOnPlaces(algolia);
26583
- }
26584
- }
26585
- ngAfterViewInit() {
26586
- if (!this.showMap) {
26587
- const placesAutocomplete = places({
26588
- appId: this.externalConfigService.getAlgoliaAppId(),
26589
- apiKey: this.externalConfigService.getAlgoliaApiKey(),
26590
- container: this.input.nativeElement,
26591
- });
26592
- placesAutocomplete.on('change', (algoliaReturnElement) => {
26593
- this.setCoordinateOnPlaces(algoliaReturnElement);
26594
- });
26579
+ this.setCoordinateOnPlaces(this.googleMapReturnElement);
26595
26580
  }
26596
26581
  }
26597
- setCoordinateOnPlaces(algoliaReturnElement) {
26582
+ setCoordinateOnPlaces(googleResults) {
26598
26583
  this.showMap = false;
26599
26584
  this.options = {
26600
26585
  layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: 'WiziShop' })],
26601
26586
  zoom: 18,
26602
26587
  zoomControl: false,
26603
- center: latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng),
26588
+ center: latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng),
26604
26589
  };
26605
- this.center = latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng);
26590
+ this.center = latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng);
26606
26591
  this.layers = [
26607
- marker([algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng], {
26592
+ marker([googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng], {
26608
26593
  icon: icon({
26609
26594
  iconSize: [25, 41],
26610
26595
  iconAnchor: [13, 41],
@@ -26613,23 +26598,23 @@ class MapLeftTextComponent extends StructuresComponent {
26613
26598
  }),
26614
26599
  }),
26615
26600
  ];
26616
- this.contentBlock[this.FORM_NAME_COORDINATE_Y] = algoliaReturnElement.suggestion.latlng.lat;
26617
- this.contentBlock[this.FORM_NAME_COORDINATE_X] = algoliaReturnElement.suggestion.latlng.lng;
26618
- this.address = algoliaReturnElement.suggestion.value;
26601
+ this.contentBlock[this.FORM_NAME_COORDINATE_Y] = googleResults.suggestion.latlng.lat;
26602
+ this.contentBlock[this.FORM_NAME_COORDINATE_X] = googleResults.suggestion.latlng.lng;
26603
+ this.address = googleResults.suggestion.value;
26619
26604
  this.showMap = true;
26620
26605
  this.persist();
26621
26606
  }
26622
- createEditAlgoliaInput() {
26623
- if (this.editPlaceMap === null) {
26624
- this.editPlaceMap = places({
26625
- appId: this.externalConfigService.getAlgoliaAppId(),
26626
- apiKey: this.externalConfigService.getAlgoliaApiKey(),
26627
- container: document.querySelector('#address-input-edit' + this.uuid),
26628
- });
26629
- this.editPlaceMap.on('change', (algoliaReturnElement) => {
26630
- this.setCoordinateOnPlaces(algoliaReturnElement);
26631
- });
26632
- }
26607
+ handleAddressChange(event) {
26608
+ this.googleMapReturnElement = {
26609
+ suggestion: {
26610
+ latlng: {
26611
+ lat: event.geometry.location.lat(),
26612
+ lng: event.geometry.location.lng(),
26613
+ },
26614
+ value: event.name,
26615
+ },
26616
+ };
26617
+ this.setCoordinateOnPlaces(this.googleMapReturnElement);
26633
26618
  }
26634
26619
  /**
26635
26620
  * Avoid partial map loaded at the initialization
@@ -26644,7 +26629,7 @@ class MapLeftTextComponent extends StructuresComponent {
26644
26629
  MapLeftTextComponent.decorators = [
26645
26630
  { type: Component, args: [{
26646
26631
  selector: MapLeftTextService.selector(),
26647
- template: "<div class=\"wb-map-left-text\">\n <div class=\"columns is-gapless\">\n <div class=\"column\">\n <div class=\"wb-map-left-text__addresses\">\n <div class=\"wb-map-left-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-left-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ADDRESS]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-left-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PHONE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-left-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_EMAIL]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n </div>\n <div\n class=\"wb-map-left-text__social\"\n *ngIf=\"\n contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\n \"\n >\n <div class=\"wb-map-left-text__social__facebook\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK]\">\n <i class=\"fab fa-facebook-f\"></i>\n </div>\n <div class=\"wb-map-left-text__social__twitter\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER]\">\n <i class=\"fab fa-twitter\"></i>\n </div>\n <div class=\"wb-map-left-text__social__pinterest\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST]\">\n <i class=\"fab fa-pinterest-p\"></i>\n </div>\n <div class=\"wb-map-left-text__social__instagram\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\">\n <i class=\"fab fa-instagram\"></i>\n </div>\n </div>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-left-text__container\">\n <div *ngIf=\"showMap\">\n <div class=\"wb-map-left-text__container__config\">\n <wb-structure-config\n [blockUUID]=\"uuid\"\n [position]=\"TYPE_CONFIG_POSITION_RIGHT_TOP\"\n (click)=\"createEditAlgoliaInput()\"\n [isFullwidth]=\"true\"\n >\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input-edit{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInputEdit\n (click)=\"myInputEdit.select()\"\n />\n </wb-structure-config>\n </div>\n <div class=\"wb-map-left-text__cover\"></div>\n <div\n class=\"wb-map-left-text__container__map\"\n leaflet\n [leafletOptions]=\"options\"\n [leafletLayers]=\"layers\"\n [(leafletCenter)]=\"center\"\n (leafletMapReady)=\"onMapReady($event)\"\n ></div>\n </div>\n </div>\n <div class=\"wb-map-left-text__selector\" *ngIf=\"!showMap\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input id=\"address-input{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInput (click)=\"myInput.select()\" />\n </div>\n </div>\n </div>\n</div>\n"
26632
+ template: "<div class=\"wb-map-left-text\">\n <div class=\"columns is-gapless\">\n <div class=\"column\">\n <div class=\"wb-map-left-text__addresses\">\n <div class=\"wb-map-left-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-left-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ADDRESS]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-left-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PHONE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-left-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_EMAIL]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n </div>\n <div\n class=\"wb-map-left-text__social\"\n *ngIf=\"\n contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\n \"\n >\n <div class=\"wb-map-left-text__social__facebook\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK]\">\n <i class=\"fab fa-facebook-f\"></i>\n </div>\n <div class=\"wb-map-left-text__social__twitter\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER]\">\n <i class=\"fab fa-twitter\"></i>\n </div>\n <div class=\"wb-map-left-text__social__pinterest\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST]\">\n <i class=\"fab fa-pinterest-p\"></i>\n </div>\n <div class=\"wb-map-left-text__social__instagram\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\">\n <i class=\"fab fa-instagram\"></i>\n </div>\n </div>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-left-text__container\">\n <div *ngIf=\"showMap\">\n <div class=\"wb-map-left-text__container__config\">\n <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_RIGHT_TOP\" [isFullwidth]=\"true\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input-edit{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInputEdit\n (click)=\"myInputEdit.select()\"\n ngx-google-places-autocomplete\n (onAddressChange)=\"handleAddressChange($event)\"\n />\n </wb-structure-config>\n </div>\n <div class=\"wb-map-left-text__cover\"></div>\n <div\n class=\"wb-map-left-text__container__map\"\n leaflet\n [leafletOptions]=\"options\"\n [leafletLayers]=\"layers\"\n [(leafletCenter)]=\"center\"\n (leafletMapReady)=\"onMapReady($event)\"\n ></div>\n </div>\n </div>\n <div class=\"wb-map-left-text__selector\" *ngIf=\"!showMap\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInput\n (click)=\"myInput.select()\"\n ngx-google-places-autocomplete\n (onAddressChange)=\"handleAddressChange($event)\"\n />\n </div>\n </div>\n </div>\n</div>\n"
26648
26633
  },] }
26649
26634
  ];
26650
26635
  MapLeftTextComponent.ctorParameters = () => [
@@ -26659,7 +26644,9 @@ class MapRightTextComponent extends StructuresComponent {
26659
26644
  super();
26660
26645
  this.externalConfigService = externalConfigService;
26661
26646
  this.address = '';
26647
+ this.triggerAddress = '';
26662
26648
  this.editPlaceMap = null;
26649
+ this.firstTimeTrigger = false;
26663
26650
  this.options = {};
26664
26651
  this.layers = [];
26665
26652
  this.showMap = false;
@@ -26668,40 +26655,29 @@ class MapRightTextComponent extends StructuresComponent {
26668
26655
  ngOnInit() {
26669
26656
  super.ngOnInit();
26670
26657
  if (this.contentBlock[this.FORM_NAME_COORDINATE_Y] && this.contentBlock[this.FORM_NAME_COORDINATE_X]) {
26671
- const algolia = new OpenMapDto();
26672
- algolia.suggestion = {
26673
- latlng: {
26674
- lat: this.contentBlock[this.FORM_NAME_COORDINATE_Y],
26675
- lng: this.contentBlock[this.FORM_NAME_COORDINATE_X],
26658
+ this.googleMapReturnElement = {
26659
+ suggestion: {
26660
+ latlng: {
26661
+ lat: this.contentBlock[this.FORM_NAME_COORDINATE_Y],
26662
+ lng: this.contentBlock[this.FORM_NAME_COORDINATE_X],
26663
+ },
26664
+ value: '',
26676
26665
  },
26677
- value: '',
26678
26666
  };
26679
- this.setCoordinateOnPlaces(algolia);
26667
+ this.setCoordinateOnPlaces(this.googleMapReturnElement);
26680
26668
  }
26681
26669
  }
26682
- ngAfterViewInit() {
26683
- if (!this.showMap) {
26684
- const placesAutocomplete = places({
26685
- appId: this.externalConfigService.getAlgoliaAppId(),
26686
- apiKey: this.externalConfigService.getAlgoliaApiKey(),
26687
- container: this.input.nativeElement,
26688
- });
26689
- placesAutocomplete.on('change', (algoliaReturnElement) => {
26690
- this.setCoordinateOnPlaces(algoliaReturnElement);
26691
- });
26692
- }
26693
- }
26694
- setCoordinateOnPlaces(algoliaReturnElement) {
26670
+ setCoordinateOnPlaces(googleResults) {
26695
26671
  this.showMap = false;
26696
26672
  this.options = {
26697
26673
  layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: 'WiziShop' })],
26698
26674
  zoom: 18,
26699
26675
  zoomControl: false,
26700
- center: latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng),
26676
+ center: latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng),
26701
26677
  };
26702
- this.center = latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng);
26678
+ this.center = latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng);
26703
26679
  this.layers = [
26704
- marker([algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng], {
26680
+ marker([googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng], {
26705
26681
  icon: icon({
26706
26682
  iconSize: [25, 41],
26707
26683
  iconAnchor: [13, 41],
@@ -26710,23 +26686,23 @@ class MapRightTextComponent extends StructuresComponent {
26710
26686
  }),
26711
26687
  }),
26712
26688
  ];
26713
- this.contentBlock[this.FORM_NAME_COORDINATE_Y] = algoliaReturnElement.suggestion.latlng.lat;
26714
- this.contentBlock[this.FORM_NAME_COORDINATE_X] = algoliaReturnElement.suggestion.latlng.lng;
26715
- this.address = algoliaReturnElement.suggestion.value;
26689
+ this.contentBlock[this.FORM_NAME_COORDINATE_Y] = googleResults.suggestion.latlng.lat;
26690
+ this.contentBlock[this.FORM_NAME_COORDINATE_X] = googleResults.suggestion.latlng.lng;
26691
+ this.address = googleResults.suggestion.value;
26716
26692
  this.showMap = true;
26717
26693
  this.persist();
26718
26694
  }
26719
- createEditAlgoliaInput() {
26720
- if (this.editPlaceMap === null) {
26721
- this.editPlaceMap = places({
26722
- appId: this.externalConfigService.getAlgoliaAppId(),
26723
- apiKey: this.externalConfigService.getAlgoliaApiKey(),
26724
- container: document.querySelector('#address-input-edit' + this.uuid),
26725
- });
26726
- this.editPlaceMap.on('change', (algoliaReturnElement) => {
26727
- this.setCoordinateOnPlaces(algoliaReturnElement);
26728
- });
26729
- }
26695
+ handleAddressChange(event) {
26696
+ this.googleMapReturnElement = {
26697
+ suggestion: {
26698
+ latlng: {
26699
+ lat: event.geometry.location.lat(),
26700
+ lng: event.geometry.location.lng(),
26701
+ },
26702
+ value: event.name,
26703
+ },
26704
+ };
26705
+ this.setCoordinateOnPlaces(this.googleMapReturnElement);
26730
26706
  }
26731
26707
  /**
26732
26708
  * Avoid partial map loaded at the initialization
@@ -26741,7 +26717,7 @@ class MapRightTextComponent extends StructuresComponent {
26741
26717
  MapRightTextComponent.decorators = [
26742
26718
  { type: Component, args: [{
26743
26719
  selector: MapRightTextService.selector(),
26744
- template: "<div class=\"wb-map-right-text\">\n <div class=\"columns is-gapless\">\n <div class=\"column\">\n <div class=\"wb-map-right-text__container\">\n <div *ngIf=\"showMap\">\n <div class=\"wb-map-right-text__container__config\">\n <wb-structure-config\n [blockUUID]=\"uuid\"\n [position]=\"TYPE_CONFIG_POSITION_RIGHT_TOP\"\n (click)=\"createEditAlgoliaInput()\"\n [isFullwidth]=\"true\"\n >\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input-edit{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInputEdit\n (click)=\"myInputEdit.select()\"\n />\n </wb-structure-config>\n </div>\n <div class=\"wb-map-right-text__cover\"></div>\n <div\n class=\"wb-map-right-text__container__map\"\n leaflet\n [leafletOptions]=\"options\"\n [leafletLayers]=\"layers\"\n [(leafletCenter)]=\"center\"\n (leafletMapReady)=\"onMapReady($event)\"\n ></div>\n </div>\n </div>\n <div class=\"wb-map-right-text__selector\" *ngIf=\"!showMap\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input id=\"address-input{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInput (click)=\"myInput.select()\" />\n </div>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-right-text__addresses\">\n <div class=\"wb-map-right-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-right-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ADDRESS]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-right-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PHONE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-right-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_EMAIL]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n </div>\n <div\n class=\"wb-map-right-text__social\"\n *ngIf=\"\n contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\n \"\n >\n <div class=\"wb-map-right-text__social__facebook\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK]\">\n <i class=\"fab fa-facebook-f\"></i>\n </div>\n <div class=\"wb-map-right-text__social__twitter\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER]\">\n <i class=\"fab fa-twitter\"></i>\n </div>\n <div class=\"wb-map-right-text__social__pinterest\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST]\">\n <i class=\"fab fa-pinterest-p\"></i>\n </div>\n <div class=\"wb-map-right-text__social__instagram\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\">\n <i class=\"fab fa-instagram\"></i>\n </div>\n </div>\n </div>\n </div>\n</div>\n"
26720
+ template: "<div class=\"wb-map-right-text\">\n <div class=\"columns is-gapless\">\n <div class=\"column\">\n <div class=\"wb-map-right-text__container\">\n <div *ngIf=\"showMap\">\n <div class=\"wb-map-right-text__container__config\">\n <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_RIGHT_TOP\" [isFullwidth]=\"true\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input-edit{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInputEdit\n (click)=\"myInputEdit.select()\"\n ngx-google-places-autocomplete\n (onAddressChange)=\"handleAddressChange($event)\"\n />\n </wb-structure-config>\n </div>\n <div class=\"wb-map-right-text__cover\"></div>\n <div\n class=\"wb-map-right-text__container__map\"\n leaflet\n [leafletOptions]=\"options\"\n [leafletLayers]=\"layers\"\n [(leafletCenter)]=\"center\"\n (leafletMapReady)=\"onMapReady($event)\"\n ></div>\n </div>\n </div>\n <div class=\"wb-map-right-text__selector\" *ngIf=\"!showMap\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInput\n (click)=\"myInput.select()\"\n ngx-google-places-autocomplete\n (onAddressChange)=\"handleAddressChange($event)\"\n />\n </div>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-right-text__addresses\">\n <div class=\"wb-map-right-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-right-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ADDRESS]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-right-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PHONE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-right-text__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_EMAIL]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n </div>\n <div\n class=\"wb-map-right-text__social\"\n *ngIf=\"\n contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\n \"\n >\n <div class=\"wb-map-right-text__social__facebook\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK]\">\n <i class=\"fab fa-facebook-f\"></i>\n </div>\n <div class=\"wb-map-right-text__social__twitter\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER]\">\n <i class=\"fab fa-twitter\"></i>\n </div>\n <div class=\"wb-map-right-text__social__pinterest\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST]\">\n <i class=\"fab fa-pinterest-p\"></i>\n </div>\n <div class=\"wb-map-right-text__social__instagram\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\">\n <i class=\"fab fa-instagram\"></i>\n </div>\n </div>\n </div>\n </div>\n</div>\n"
26745
26721
  },] }
26746
26722
  ];
26747
26723
  MapRightTextComponent.ctorParameters = () => [
@@ -26751,13 +26727,18 @@ MapRightTextComponent.propDecorators = {
26751
26727
  input: [{ type: ViewChild, args: ['myInput',] }]
26752
26728
  };
26753
26729
 
26730
+ class OpenMapDto {
26731
+ }
26732
+
26754
26733
  class MapTextFormComponent extends StructuresComponent {
26755
26734
  constructor(apiService, externalConfigService) {
26756
26735
  super();
26757
26736
  this.apiService = apiService;
26758
26737
  this.externalConfigService = externalConfigService;
26759
26738
  this.address = '';
26739
+ this.triggerAddress = '';
26760
26740
  this.editPlaceMap = null;
26741
+ this.firstTimeTrigger = false;
26761
26742
  this.options = {};
26762
26743
  this.layers = [];
26763
26744
  this.showMap = false;
@@ -26791,29 +26772,17 @@ class MapTextFormComponent extends StructuresComponent {
26791
26772
  }
26792
26773
  });
26793
26774
  }
26794
- ngAfterViewInit() {
26795
- if (!this.showMap) {
26796
- const placesAutocomplete = places({
26797
- appId: this.externalConfigService.getAlgoliaAppId(),
26798
- apiKey: this.externalConfigService.getAlgoliaApiKey(),
26799
- container: this.input.nativeElement,
26800
- });
26801
- placesAutocomplete.on('change', (algoliaReturnElement) => {
26802
- this.setCoordinateOnPlaces(algoliaReturnElement);
26803
- });
26804
- }
26805
- }
26806
- setCoordinateOnPlaces(algoliaReturnElement) {
26775
+ setCoordinateOnPlaces(googleResults) {
26807
26776
  this.showMap = false;
26808
26777
  this.options = {
26809
- layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 16, attribution: 'WiziShop' })],
26778
+ layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: 'WiziShop' })],
26810
26779
  zoom: 18,
26811
26780
  zoomControl: false,
26812
- center: latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng),
26781
+ center: latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng),
26813
26782
  };
26814
- this.center = latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng);
26783
+ this.center = latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng);
26815
26784
  this.layers = [
26816
- marker([algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng], {
26785
+ marker([googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng], {
26817
26786
  icon: icon({
26818
26787
  iconSize: [25, 41],
26819
26788
  iconAnchor: [13, 41],
@@ -26822,23 +26791,32 @@ class MapTextFormComponent extends StructuresComponent {
26822
26791
  }),
26823
26792
  }),
26824
26793
  ];
26825
- this.contentBlock[this.FORM_NAME_COORDINATE_Y] = algoliaReturnElement.suggestion.latlng.lat;
26826
- this.contentBlock[this.FORM_NAME_COORDINATE_X] = algoliaReturnElement.suggestion.latlng.lng;
26827
- this.address = algoliaReturnElement.suggestion.value;
26794
+ this.contentBlock[this.FORM_NAME_COORDINATE_Y] = googleResults.suggestion.latlng.lat;
26795
+ this.contentBlock[this.FORM_NAME_COORDINATE_X] = googleResults.suggestion.latlng.lng;
26796
+ this.address = googleResults.suggestion.value;
26828
26797
  this.showMap = true;
26829
26798
  this.persist();
26830
26799
  }
26831
- createEditAlgoliaInput() {
26832
- if (this.editPlaceMap === null) {
26833
- this.editPlaceMap = places({
26834
- appId: this.externalConfigService.getAlgoliaAppId(),
26835
- apiKey: this.externalConfigService.getAlgoliaApiKey(),
26836
- container: document.querySelector('#address-input-edit' + this.uuid),
26837
- });
26838
- this.editPlaceMap.on('change', (algoliaReturnElement) => {
26839
- this.setCoordinateOnPlaces(algoliaReturnElement);
26840
- });
26841
- }
26800
+ handleAddressChange(event) {
26801
+ this.googleMapReturnElement = {
26802
+ suggestion: {
26803
+ latlng: {
26804
+ lat: event.geometry.location.lat(),
26805
+ lng: event.geometry.location.lng(),
26806
+ },
26807
+ value: event.name,
26808
+ },
26809
+ };
26810
+ this.setCoordinateOnPlaces(this.googleMapReturnElement);
26811
+ }
26812
+ /**
26813
+ * Avoid partial map loaded at the initialization
26814
+ * @param map
26815
+ */
26816
+ onMapReady(map) {
26817
+ setTimeout(() => {
26818
+ map.invalidateSize();
26819
+ }, 0);
26842
26820
  }
26843
26821
  selectThisForm() {
26844
26822
  if (this.selectedValue === null) {
@@ -26850,20 +26828,11 @@ class MapTextFormComponent extends StructuresComponent {
26850
26828
  this.contentBlock[FORM_NAME_ID_FORM] = this.selectedValue.id;
26851
26829
  this.persist();
26852
26830
  }
26853
- /**
26854
- * Avoid partial map loaded at the initialization
26855
- * @param map
26856
- */
26857
- onMapReady(map) {
26858
- setTimeout(() => {
26859
- map.invalidateSize();
26860
- }, 0);
26861
- }
26862
26831
  }
26863
26832
  MapTextFormComponent.decorators = [
26864
26833
  { type: Component, args: [{
26865
26834
  selector: MapTextFormService.selector(),
26866
- template: "<div class=\"wb-map-text-form\">\n <div class=\"wb-map-text-form__container__config\" *ngIf=\"showMap\">\n <wb-structure-config\n [blockUUID]=\"uuid\"\n [position]=\"TYPE_CONFIG_POSITION_LEFT_TOP\"\n (click)=\"createEditAlgoliaInput()\"\n [isFullwidth]=\"true\"\n >\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input id=\"address-input-edit{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInputEdit (click)=\"myInputEdit.select()\" />\n </wb-structure-config>\n </div>\n <div class=\"wb-map-text-form__selector\" *ngIf=\"!showMap\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input id=\"address-input{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInput (click)=\"myInput.select()\" />\n </div>\n <div class=\"columns is-gapless\" *ngIf=\"showMap\">\n <div class=\"column\">\n <div class=\"wb-map-text-form__addresses\">\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-text-form__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ADDRESS]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-text-form__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PHONE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-text-form__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_EMAIL]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n </div>\n <div\n class=\"wb-map-text-form__social\"\n *ngIf=\"\n contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\n \"\n >\n <div class=\"wb-map-text-form__social__facebook\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK]\">\n <i class=\"fab fa-facebook-f\"></i>\n </div>\n <div class=\"wb-map-text-form__social__twitter\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER]\">\n <i class=\"fab fa-twitter\"></i>\n </div>\n <div class=\"wb-map-text-form__social__pinterest\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST]\">\n <i class=\"fab fa-pinterest-p\"></i>\n </div>\n <div class=\"wb-map-text-form__social__instagram\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\">\n <i class=\"fab fa-instagram\"></i>\n </div>\n </div>\n <div class=\"wb-map-text-form__container\">\n <div *ngIf=\"showMap\">\n <div class=\"wb-map-text-form__cover\"></div>\n <div\n class=\"wb-map-text-form__container__map\"\n leaflet\n [leafletOptions]=\"options\"\n [leafletLayers]=\"layers\"\n [(leafletCenter)]=\"center\"\n (leafletMapReady)=\"onMapReady($event)\"\n ></div>\n </div>\n </div>\n </div>\n <div class=\"column\">\n <div *ngIf=\"selectedDetailForm.length === 0\">\n <div *ngIf=\"forms.length === 0\" class=\"wb-map-text-form__loader\">\n <wb-loader></wb-loader>\n </div>\n <div class=\"wb-map-text-form__selector\" *ngIf=\"forms.length > 0\">\n <wb-structure-select\n [selectedValue]=\"selectedValue\"\n [forms]=\"forms\"\n (changed)=\"selectedValue = $event; selectThisForm()\"\n ></wb-structure-select>\n </div>\n </div>\n <div *ngIf=\"selectedDetailForm.length > 0\" class=\"wb-map-text-form__container-form\">\n <div class=\"wb-map-text-form__container-form__editor\">\n <div>\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n <div>\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_CONTENT]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n <div class=\"wb-map-text-form__container-form__content\">\n <div *ngFor=\"let select of selectedDetailForm\">\n <p [innerHTML]=\"select.title\"></p>\n <p>{{ select.type | answerPipe | translate }}</p>\n </div>\n <div>\n <wb-structure-select\n [selectedValue]=\"selectedValue\"\n [forms]=\"forms\"\n (changed)=\"selectedValue = $event; selectThisForm()\"\n ></wb-structure-select>\n &nbsp;&nbsp;&nbsp;\n <button>{{ selectedValue.submit_label }}</button>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n"
26835
+ template: "<div class=\"wb-map-text-form\">\n <div class=\"wb-map-text-form__container__config\" *ngIf=\"showMap\">\n <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_LEFT_TOP\" [isFullwidth]=\"true\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input-edit{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInputEdit\n (click)=\"myInputEdit.select()\"\n ngx-google-places-autocomplete\n (onAddressChange)=\"handleAddressChange($event)\"\n />\n </wb-structure-config>\n </div>\n <div class=\"wb-map-text-form__selector\" *ngIf=\"!showMap\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInput\n (click)=\"myInput.select()\"\n ngx-google-places-autocomplete\n (onAddressChange)=\"handleAddressChange($event)\"\n />\n </div>\n <div class=\"columns is-gapless\" *ngIf=\"showMap\">\n <div class=\"column\">\n <div class=\"wb-map-text-form__addresses\">\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_ADDRESS] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-text-form__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ADDRESS]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_PHONE] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-text-form__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PHONE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n <div class=\"columns is-gapless\">\n <div class=\"column is-1\">\n <wb-structure-config-font\n [(value)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL]\"\n [white]=\"false\"\n [isSmall]=\"true\"\n [withImage]=\"false\"\n (valueChange)=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_ICON_EMAIL] = $event; persist()\"\n ></wb-structure-config-font>\n </div>\n <div class=\"column\">\n <div class=\"wb-map-text-form__address\">\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_EMAIL]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n </div>\n </div>\n <div\n class=\"wb-map-text-form__social\"\n *ngIf=\"\n contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST] ||\n contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\n \"\n >\n <div class=\"wb-map-text-form__social__facebook\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_FACEBOOK]\">\n <i class=\"fab fa-facebook-f\"></i>\n </div>\n <div class=\"wb-map-text-form__social__twitter\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TWITTER]\">\n <i class=\"fab fa-twitter\"></i>\n </div>\n <div class=\"wb-map-text-form__social__pinterest\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_PINTEREST]\">\n <i class=\"fab fa-pinterest-p\"></i>\n </div>\n <div class=\"wb-map-text-form__social__instagram\" *ngIf=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_INSTAGRAM]\">\n <i class=\"fab fa-instagram\"></i>\n </div>\n </div>\n <div class=\"wb-map-text-form__container\">\n <div *ngIf=\"showMap\">\n <div class=\"wb-map-text-form__cover\"></div>\n <div\n class=\"wb-map-text-form__container__map\"\n leaflet\n [leafletOptions]=\"options\"\n [leafletLayers]=\"layers\"\n [(leafletCenter)]=\"center\"\n (leafletMapReady)=\"onMapReady($event)\"\n ></div>\n </div>\n </div>\n </div>\n <div class=\"column\">\n <div *ngIf=\"selectedDetailForm.length === 0\">\n <div *ngIf=\"forms.length === 0\" class=\"wb-map-text-form__loader\">\n <wb-loader></wb-loader>\n </div>\n <div class=\"wb-map-text-form__selector\" *ngIf=\"forms.length > 0\">\n <wb-structure-select\n [selectedValue]=\"selectedValue\"\n [forms]=\"forms\"\n (changed)=\"selectedValue = $event; selectThisForm()\"\n ></wb-structure-select>\n </div>\n </div>\n <div *ngIf=\"selectedDetailForm.length > 0\" class=\"wb-map-text-form__container-form\">\n <div class=\"wb-map-text-form__container-form__editor\">\n <div>\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n <div>\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_CONTENT]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n <div class=\"wb-map-text-form__container-form__content\">\n <div *ngFor=\"let select of selectedDetailForm\">\n <p [innerHTML]=\"select.title\"></p>\n <p>{{ select.type | answerPipe | translate }}</p>\n </div>\n <div>\n <wb-structure-select\n [selectedValue]=\"selectedValue\"\n [forms]=\"forms\"\n (changed)=\"selectedValue = $event; selectThisForm()\"\n ></wb-structure-select>\n &nbsp;&nbsp;&nbsp;\n <button>{{ selectedValue.submit_label }}</button>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n"
26867
26836
  },] }
26868
26837
  ];
26869
26838
  MapTextFormComponent.ctorParameters = () => [
@@ -26879,7 +26848,9 @@ class MapBackgroundFormLeftComponent extends StructuresComponent {
26879
26848
  super();
26880
26849
  this.apiService = apiService;
26881
26850
  this.address = '';
26851
+ this.triggerAddress = '';
26882
26852
  this.editPlaceMap = null;
26853
+ this.firstTimeTrigger = false;
26883
26854
  this.options = {};
26884
26855
  this.layers = [];
26885
26856
  this.showMap = false;
@@ -26902,27 +26873,17 @@ class MapBackgroundFormLeftComponent extends StructuresComponent {
26902
26873
  }
26903
26874
  });
26904
26875
  }
26905
- ngAfterViewInit() {
26906
- const placesAutocomplete = places({
26907
- appId: 'pl9OI1NPY62Y',
26908
- apiKey: '290e5a0e33e751c85c36690d502991fc',
26909
- container: this.input.nativeElement,
26910
- });
26911
- placesAutocomplete.on('change', (algoliaReturnElement) => {
26912
- this.setCoordinateOnPlaces(algoliaReturnElement);
26913
- });
26914
- }
26915
- setCoordinateOnPlaces(algoliaReturnElement) {
26876
+ setCoordinateOnPlaces(googleResults) {
26916
26877
  this.showMap = false;
26917
26878
  this.options = {
26918
- layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 16, attribution: 'WiziShop' })],
26879
+ layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: 'WiziShop' })],
26919
26880
  zoom: 18,
26920
26881
  zoomControl: false,
26921
- center: latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng),
26882
+ center: latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng),
26922
26883
  };
26923
- this.center = latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng);
26884
+ this.center = latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng);
26924
26885
  this.layers = [
26925
- marker([algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng], {
26886
+ marker([googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng], {
26926
26887
  icon: icon({
26927
26888
  iconSize: [25, 41],
26928
26889
  iconAnchor: [13, 41],
@@ -26931,23 +26892,32 @@ class MapBackgroundFormLeftComponent extends StructuresComponent {
26931
26892
  }),
26932
26893
  }),
26933
26894
  ];
26934
- this.contentBlock[this.FORM_NAME_COORDINATE_Y] = algoliaReturnElement.suggestion.latlng.lat;
26935
- this.contentBlock[this.FORM_NAME_COORDINATE_X] = algoliaReturnElement.suggestion.latlng.lng;
26936
- this.address = algoliaReturnElement.suggestion.value;
26895
+ this.contentBlock[this.FORM_NAME_COORDINATE_Y] = googleResults.suggestion.latlng.lat;
26896
+ this.contentBlock[this.FORM_NAME_COORDINATE_X] = googleResults.suggestion.latlng.lng;
26897
+ this.address = googleResults.suggestion.value;
26937
26898
  this.showMap = true;
26938
26899
  this.persist();
26939
26900
  }
26940
- createEditAlgoliaInput() {
26941
- if (this.editPlaceMap === null) {
26942
- this.editPlaceMap = places({
26943
- appId: 'pl9OI1NPY62Y',
26944
- apiKey: '290e5a0e33e751c85c36690d502991fc',
26945
- container: document.querySelector('#address-input-edit' + this.uuid),
26946
- });
26947
- this.editPlaceMap.on('change', (algoliaReturnElement) => {
26948
- this.setCoordinateOnPlaces(algoliaReturnElement);
26949
- });
26950
- }
26901
+ handleAddressChange(event) {
26902
+ this.googleMapReturnElement = {
26903
+ suggestion: {
26904
+ latlng: {
26905
+ lat: event.geometry.location.lat(),
26906
+ lng: event.geometry.location.lng(),
26907
+ },
26908
+ value: event.name,
26909
+ },
26910
+ };
26911
+ this.setCoordinateOnPlaces(this.googleMapReturnElement);
26912
+ }
26913
+ /**
26914
+ * Avoid partial map loaded at the initialization
26915
+ * @param map
26916
+ */
26917
+ onMapReady(map) {
26918
+ setTimeout(() => {
26919
+ map.invalidateSize();
26920
+ }, 0);
26951
26921
  }
26952
26922
  selectThisForm() {
26953
26923
  if (this.selectedValue === null) {
@@ -26959,20 +26929,11 @@ class MapBackgroundFormLeftComponent extends StructuresComponent {
26959
26929
  this.contentBlock[FORM_NAME_ID_FORM] = this.selectedValue.id;
26960
26930
  this.persist();
26961
26931
  }
26962
- /**
26963
- * Avoid partial map loaded at the initialization
26964
- * @param map
26965
- */
26966
- onMapReady(map) {
26967
- setTimeout(() => {
26968
- map.invalidateSize();
26969
- }, 0);
26970
- }
26971
26932
  }
26972
26933
  MapBackgroundFormLeftComponent.decorators = [
26973
26934
  { type: Component, args: [{
26974
26935
  selector: MapBackgroundFormLeftService.selector(),
26975
- template: "<div class=\"wb-map-background-form-left\">\n <div class=\"wb-map-background-form-left__container__config\" *ngIf=\"showMap\">\n <wb-structure-config\n [blockUUID]=\"uuid\"\n [position]=\"TYPE_CONFIG_POSITION_RIGHT_TOP\"\n (click)=\"createEditAlgoliaInput()\"\n [isFullwidth]=\"true\"\n >\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input id=\"address-input-edit{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInputEdit (click)=\"myInputEdit.select()\" />\n </wb-structure-config>\n </div>\n <div class=\"wb-map-background-form-left__selector\" *ngIf=\"!showMap\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input id=\"address-input{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInput (click)=\"myInput.select()\" />\n </div>\n <div class=\"columns is-gapless\" *ngIf=\"showMap\">\n <div class=\"column\">\n <div *ngIf=\"selectedDetailForm.length === 0\">\n <div *ngIf=\"forms.length === 0\" class=\"wb-map-background-form-left__loader\">\n <wb-loader></wb-loader>\n </div>\n <div class=\"wb-map-background-form-left__selector-form\" *ngIf=\"forms.length > 0\">\n <wb-structure-select\n [selectedValue]=\"selectedValue\"\n [forms]=\"forms\"\n (changed)=\"selectedValue = $event; selectThisForm()\"\n ></wb-structure-select>\n </div>\n </div>\n <div *ngIf=\"selectedDetailForm.length > 0\" class=\"wb-map-background-form-left__container-form\">\n <div class=\"wb-map-background-form-left__container-form__editor\">\n <div>\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n <div>\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_CONTENT]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n <div class=\"wb-map-background-form-left__container-form__content\">\n <div *ngFor=\"let select of selectedDetailForm\">\n <p [innerHTML]=\"select.title\"></p>\n <p>{{ select.type | answerPipe | translate }}</p>\n </div>\n <div>\n <wb-structure-select\n [selectedValue]=\"selectedValue\"\n [forms]=\"forms\"\n (changed)=\"selectedValue = $event; selectThisForm()\"\n ></wb-structure-select>\n &nbsp;&nbsp;&nbsp;\n <button>{{ selectedValue.submit_label }}</button>\n </div>\n </div>\n </div>\n <div class=\"wb-map-background-form-left__container\">\n <div>\n <div class=\"wb-map-background-form-left__cover\"></div>\n <div\n class=\"wb-map-background-form-left__container__map\"\n leaflet\n [leafletOptions]=\"options\"\n [leafletLayers]=\"layers\"\n [(leafletCenter)]=\"center\"\n (leafletMapReady)=\"onMapReady($event)\"\n ></div>\n </div>\n </div>\n </div>\n </div>\n</div>\n"
26936
+ template: "<div class=\"wb-map-background-form-left\">\n <div class=\"wb-map-background-form-left__container__config\" *ngIf=\"showMap\">\n <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_RIGHT_TOP\" [isFullwidth]=\"true\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input-edit{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInputEdit\n (click)=\"myInputEdit.select()\"\n ngx-google-places-autocomplete\n (onAddressChange)=\"handleAddressChange($event)\"\n />\n </wb-structure-config>\n </div>\n <div class=\"wb-map-background-form-left__selector\" *ngIf=\"!showMap\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInput\n (click)=\"myInput.select()\"\n ngx-google-places-autocomplete\n (onAddressChange)=\"handleAddressChange($event)\"\n />\n </div>\n <div class=\"columns is-gapless\" *ngIf=\"showMap\">\n <div class=\"column\">\n <div *ngIf=\"selectedDetailForm.length === 0\">\n <div *ngIf=\"forms.length === 0\" class=\"wb-map-background-form-left__loader\">\n <wb-loader></wb-loader>\n </div>\n <div class=\"wb-map-background-form-left__selector-form\" *ngIf=\"forms.length > 0\">\n <wb-structure-select\n [selectedValue]=\"selectedValue\"\n [forms]=\"forms\"\n (changed)=\"selectedValue = $event; selectThisForm()\"\n ></wb-structure-select>\n </div>\n </div>\n <div *ngIf=\"selectedDetailForm.length > 0\" class=\"wb-map-background-form-left__container-form\">\n <div class=\"wb-map-background-form-left__container-form__editor\">\n <div>\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n <div>\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_CONTENT]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n <div class=\"wb-map-background-form-left__container-form__content\">\n <div *ngFor=\"let select of selectedDetailForm\">\n <p [innerHTML]=\"select.title\"></p>\n <p>{{ select.type | answerPipe | translate }}</p>\n </div>\n <div>\n <wb-structure-select\n [selectedValue]=\"selectedValue\"\n [forms]=\"forms\"\n (changed)=\"selectedValue = $event; selectThisForm()\"\n ></wb-structure-select>\n &nbsp;&nbsp;&nbsp;\n <button>{{ selectedValue.submit_label }}</button>\n </div>\n </div>\n </div>\n <div class=\"wb-map-background-form-left__container\">\n <div>\n <div class=\"wb-map-background-form-left__cover\"></div>\n <div\n class=\"wb-map-background-form-left__container__map\"\n leaflet\n [leafletOptions]=\"options\"\n [leafletLayers]=\"layers\"\n [(leafletCenter)]=\"center\"\n (leafletMapReady)=\"onMapReady($event)\"\n ></div>\n </div>\n </div>\n </div>\n </div>\n</div>\n"
26976
26937
  },] }
26977
26938
  ];
26978
26939
  MapBackgroundFormLeftComponent.ctorParameters = () => [
@@ -26987,7 +26948,9 @@ class MapBackgroundFormRightComponent extends StructuresComponent {
26987
26948
  super();
26988
26949
  this.apiService = apiService;
26989
26950
  this.address = '';
26951
+ this.triggerAddress = '';
26990
26952
  this.editPlaceMap = null;
26953
+ this.firstTimeTrigger = false;
26991
26954
  this.options = {};
26992
26955
  this.layers = [];
26993
26956
  this.showMap = false;
@@ -27010,27 +26973,17 @@ class MapBackgroundFormRightComponent extends StructuresComponent {
27010
26973
  }
27011
26974
  });
27012
26975
  }
27013
- ngAfterViewInit() {
27014
- const placesAutocomplete = places({
27015
- appId: 'pl9OI1NPY62Y',
27016
- apiKey: '290e5a0e33e751c85c36690d502991fc',
27017
- container: this.input.nativeElement,
27018
- });
27019
- placesAutocomplete.on('change', (algoliaReturnElement) => {
27020
- this.setCoordinateOnPlaces(algoliaReturnElement);
27021
- });
27022
- }
27023
- setCoordinateOnPlaces(algoliaReturnElement) {
26976
+ setCoordinateOnPlaces(googleResults) {
27024
26977
  this.showMap = false;
27025
26978
  this.options = {
27026
- layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 16, attribution: 'WiziShop' })],
26979
+ layers: [tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18, attribution: 'WiziShop' })],
27027
26980
  zoom: 18,
27028
26981
  zoomControl: false,
27029
- center: latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng),
26982
+ center: latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng),
27030
26983
  };
27031
- this.center = latLng(algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng);
26984
+ this.center = latLng(googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng);
27032
26985
  this.layers = [
27033
- marker([algoliaReturnElement.suggestion.latlng.lat, algoliaReturnElement.suggestion.latlng.lng], {
26986
+ marker([googleResults.suggestion.latlng.lat, googleResults.suggestion.latlng.lng], {
27034
26987
  icon: icon({
27035
26988
  iconSize: [25, 41],
27036
26989
  iconAnchor: [13, 41],
@@ -27039,23 +26992,32 @@ class MapBackgroundFormRightComponent extends StructuresComponent {
27039
26992
  }),
27040
26993
  }),
27041
26994
  ];
27042
- this.contentBlock[this.FORM_NAME_COORDINATE_Y] = algoliaReturnElement.suggestion.latlng.lat;
27043
- this.contentBlock[this.FORM_NAME_COORDINATE_X] = algoliaReturnElement.suggestion.latlng.lng;
27044
- this.address = algoliaReturnElement.suggestion.value;
26995
+ this.contentBlock[this.FORM_NAME_COORDINATE_Y] = googleResults.suggestion.latlng.lat;
26996
+ this.contentBlock[this.FORM_NAME_COORDINATE_X] = googleResults.suggestion.latlng.lng;
26997
+ this.address = googleResults.suggestion.value;
27045
26998
  this.showMap = true;
27046
26999
  this.persist();
27047
27000
  }
27048
- createEditAlgoliaInput() {
27049
- if (this.editPlaceMap === null) {
27050
- this.editPlaceMap = places({
27051
- appId: 'pl9OI1NPY62Y',
27052
- apiKey: '290e5a0e33e751c85c36690d502991fc',
27053
- container: document.querySelector('#address-input-edit' + this.uuid),
27054
- });
27055
- this.editPlaceMap.on('change', (algoliaReturnElement) => {
27056
- this.setCoordinateOnPlaces(algoliaReturnElement);
27057
- });
27058
- }
27001
+ handleAddressChange(event) {
27002
+ this.googleMapReturnElement = {
27003
+ suggestion: {
27004
+ latlng: {
27005
+ lat: event.geometry.location.lat(),
27006
+ lng: event.geometry.location.lng(),
27007
+ },
27008
+ value: event.name,
27009
+ },
27010
+ };
27011
+ this.setCoordinateOnPlaces(this.googleMapReturnElement);
27012
+ }
27013
+ /**
27014
+ * Avoid partial map loaded at the initialization
27015
+ * @param map
27016
+ */
27017
+ onMapReady(map) {
27018
+ setTimeout(() => {
27019
+ map.invalidateSize();
27020
+ }, 0);
27059
27021
  }
27060
27022
  selectThisForm() {
27061
27023
  if (this.selectedValue === null) {
@@ -27067,20 +27029,11 @@ class MapBackgroundFormRightComponent extends StructuresComponent {
27067
27029
  this.contentBlock[FORM_NAME_ID_FORM] = this.selectedValue.id;
27068
27030
  this.persist();
27069
27031
  }
27070
- /**
27071
- * Avoid partial map loaded at the initialization
27072
- * @param map
27073
- */
27074
- onMapReady(map) {
27075
- setTimeout(() => {
27076
- map.invalidateSize();
27077
- }, 0);
27078
- }
27079
27032
  }
27080
27033
  MapBackgroundFormRightComponent.decorators = [
27081
27034
  { type: Component, args: [{
27082
27035
  selector: MapBackgroundFormRightService.selector(),
27083
- template: "<div class=\"wb-map-background-form-right\">\n <div class=\"wb-map-background-form-right__container__config\" *ngIf=\"showMap\">\n <wb-structure-config\n [blockUUID]=\"uuid\"\n [position]=\"TYPE_CONFIG_POSITION_LEFT_TOP\"\n (click)=\"createEditAlgoliaInput()\"\n [isFullwidth]=\"true\"\n >\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input id=\"address-input-edit{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInputEdit (click)=\"myInputEdit.select()\" />\n </wb-structure-config>\n </div>\n <div class=\"wb-map-background-form-right__selector\" *ngIf=\"!showMap\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input id=\"address-input{{ uuid }}\" type=\"text\" [(ngModel)]=\"address\" #myInput (click)=\"myInput.select()\" />\n </div>\n <div class=\"columns is-gapless\" *ngIf=\"showMap\">\n <div class=\"column\">\n <div class=\"wb-map-background-form-right__container\">\n <div *ngIf=\"showMap\">\n <div class=\"wb-map-background-form-right__cover\"></div>\n <div\n class=\"wb-map-background-form-right__container__map\"\n leaflet\n [leafletOptions]=\"options\"\n [leafletLayers]=\"layers\"\n [(leafletCenter)]=\"center\"\n (leafletMapReady)=\"onMapReady($event)\"\n ></div>\n </div>\n </div>\n </div>\n <div class=\"column\">\n <div *ngIf=\"selectedDetailForm.length === 0\">\n <div *ngIf=\"forms.length === 0\" class=\"wb-map-background-form-right__loader\">\n <wb-loader></wb-loader>\n </div>\n <div class=\"wb-map-background-form-right__selector\" *ngIf=\"forms.length > 0\">\n <wb-structure-select\n [selectedValue]=\"selectedValue\"\n [forms]=\"forms\"\n (changed)=\"selectedValue = $event; selectThisForm()\"\n ></wb-structure-select>\n </div>\n </div>\n <div *ngIf=\"selectedDetailForm.length > 0\" class=\"wb-map-background-form-right__container-form\">\n <div class=\"wb-map-background-form-right__container-form__editor\">\n <div>\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n <div>\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_CONTENT]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n <div class=\"wb-map-background-form-right__container-form__content\">\n <div *ngFor=\"let select of selectedDetailForm\">\n <p [innerHTML]=\"select.title\"></p>\n <p>{{ select.type | answerPipe | translate }}</p>\n </div>\n <div>\n <wb-structure-select\n [selectedValue]=\"selectedValue\"\n [forms]=\"forms\"\n (changed)=\"selectedValue = $event; selectThisForm()\"\n ></wb-structure-select>\n &nbsp;&nbsp;&nbsp;\n <button>{{ selectedValue.submit_label }}</button>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n"
27036
+ template: "<div class=\"wb-map-background-form-right\">\n <div class=\"wb-map-background-form-right__container__config\" *ngIf=\"showMap\">\n <wb-structure-config [blockUUID]=\"uuid\" [position]=\"TYPE_CONFIG_POSITION_LEFT_TOP\" [isFullwidth]=\"true\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input-edit{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInputEdit\n (click)=\"myInputEdit.select()\"\n ngx-google-places-autocomplete\n (onAddressChange)=\"handleAddressChange($event)\"\n />\n </wb-structure-config>\n </div>\n <div class=\"wb-map-background-form-right__selector\" *ngIf=\"!showMap\">\n <p>{{ 'wb.structures.template.19' | translate }}</p>\n <input\n id=\"address-input{{ uuid }}\"\n type=\"text\"\n [(ngModel)]=\"address\"\n #myInput\n (click)=\"myInput.select()\"\n ngx-google-places-autocomplete\n (onAddressChange)=\"handleAddressChange($event)\"\n />\n </div>\n <div class=\"columns is-gapless\" *ngIf=\"showMap\">\n <div class=\"column\">\n <div class=\"wb-map-background-form-right__container\">\n <div *ngIf=\"showMap\">\n <div class=\"wb-map-background-form-right__cover\"></div>\n <div\n class=\"wb-map-background-form-right__container__map\"\n leaflet\n [leafletOptions]=\"options\"\n [leafletLayers]=\"layers\"\n [(leafletCenter)]=\"center\"\n (leafletMapReady)=\"onMapReady($event)\"\n ></div>\n </div>\n </div>\n </div>\n <div class=\"column\">\n <div *ngIf=\"selectedDetailForm.length === 0\">\n <div *ngIf=\"forms.length === 0\" class=\"wb-map-background-form-right__loader\">\n <wb-loader></wb-loader>\n </div>\n <div class=\"wb-map-background-form-right__selector\" *ngIf=\"forms.length > 0\">\n <wb-structure-select\n [selectedValue]=\"selectedValue\"\n [forms]=\"forms\"\n (changed)=\"selectedValue = $event; selectThisForm()\"\n ></wb-structure-select>\n </div>\n </div>\n <div *ngIf=\"selectedDetailForm.length > 0\" class=\"wb-map-background-form-right__container-form\">\n <div class=\"wb-map-background-form-right__container-form__editor\">\n <div>\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_TITLE]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n <div>\n <wb-editorjs\n [(content)]=\"contents[BASE_BLOCK_CONTENT][FORM_NAME_CONTENT]\"\n (contentChange)=\"persist()\"\n [placeholder]=\"'wb.shared.components.quill.1' | translate\"\n >\n </wb-editorjs>\n </div>\n </div>\n <div class=\"wb-map-background-form-right__container-form__content\">\n <div *ngFor=\"let select of selectedDetailForm\">\n <p [innerHTML]=\"select.title\"></p>\n <p>{{ select.type | answerPipe | translate }}</p>\n </div>\n <div>\n <wb-structure-select\n [selectedValue]=\"selectedValue\"\n [forms]=\"forms\"\n (changed)=\"selectedValue = $event; selectThisForm()\"\n ></wb-structure-select>\n &nbsp;&nbsp;&nbsp;\n <button>{{ selectedValue.submit_label }}</button>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n"
27084
27037
  },] }
27085
27038
  ];
27086
27039
  MapBackgroundFormRightComponent.ctorParameters = () => [
@@ -29982,6 +29935,7 @@ StructuresModule.decorators = [
29982
29935
  imports: [
29983
29936
  SharedModule,
29984
29937
  MonacoEditorModule,
29938
+ GooglePlaceModule,
29985
29939
  QuillModule,
29986
29940
  LeafletModule,
29987
29941
  NwbCommonModule,