From 03998ed00d94b2571a99c8ae67d6e081b01e75ee Mon Sep 17 00:00:00 2001 From: Paola De Bartolo Date: Mon, 23 Sep 2024 17:03:42 -0300 Subject: [PATCH 1/7] feat: add/remove custom controls dynamically Close #128 --- .../vaadin/addons/googlemaps/GoogleMap.java | 47 +++++++++++++++---- 1 file changed, 37 insertions(+), 10 deletions(-) diff --git a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java index 0ecf69c..13d5f49 100644 --- a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java +++ b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java @@ -42,7 +42,9 @@ import elemental.json.JsonArray; import elemental.json.JsonObject; import elemental.json.JsonValue; +import java.util.HashSet; import java.util.List; +import java.util.Set; import java.util.concurrent.CompletableFuture; import org.apache.commons.lang3.StringUtils; @@ -54,7 +56,9 @@ @JsModule("./googlemaps/geolocation.js") public class GoogleMap extends Component implements HasSize { - private Integer trackLocationId = null; + private Integer trackLocationId = null; + + private Set customControls = new HashSet(); /** Base map types supported by Google Maps. */ public enum MapType { @@ -776,21 +780,44 @@ public void addCustomControls(CustomControl... customControls) { } this.getElement().setPropertyJson("customControls", jsonArray); } - + /** * Sets the custom control buttons to be displayed in the map. * * @param customControls list of custom controls to add to the map */ public void setCustomControls(CustomControl... customControls) { - JsonArray jsonArray = Json.createArray(); - for (int i = 0; i < customControls.length; i++) { - CustomControl customControl = customControls[i]; - jsonArray.set(i, customControl.getJson(i)); - customControl.getControlButton().getElement().setAttribute("slot", "customControlSlot_" + i); - this.getElement().appendChild(customControl.getControlButton().getElement()); - } - this.getElement().setPropertyJson("customControls", jsonArray); + this.getElement().executeJs("this._removeCustomControls()").then((e) -> { + JsonArray jsonArray = Json.createArray(); + for (int i = 0; i < customControls.length; i++) { + CustomControl customControl = customControls[i]; + jsonArray.set(i, customControl.getJson(i)); + customControl.getControlButton().getElement().setAttribute("slot", "customControlSlot_" + i); + this.getElement().appendChild(customControl.getControlButton().getElement()); + this.customControls.add(customControl); + } + this.getElement().setPropertyJson("customControls", jsonArray); + }); + } + + /** + * Adds a custom control to be displayed in the map. + * + * @param customControl the custom control to add to the map + */ + public void addCustomControl(CustomControl customControl) { + this.customControls.add(customControl); + this.setCustomControls(this.customControls.stream().toArray(CustomControl[]::new)); + } + + /** + * Removes a custom control added to the map. + * + * @param customControl the custom control to be removed + */ + public void removeCustomControl(CustomControl customControl) { + this.customControls.remove(customControl); + this.setCustomControls(this.customControls.stream().toArray(CustomControl[]::new)); } /** From 27bfd823f174a3861e14b4bd9141274b1b2ac162 Mon Sep 17 00:00:00 2001 From: Paola De Bartolo Date: Mon, 23 Sep 2024 17:04:17 -0300 Subject: [PATCH 2/7] feat: remove all custom controls --- .../flowingcode/vaadin/addons/googlemaps/GoogleMap.java | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java index 13d5f49..0498b39 100644 --- a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java +++ b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java @@ -820,6 +820,14 @@ public void removeCustomControl(CustomControl customControl) { this.setCustomControls(this.customControls.stream().toArray(CustomControl[]::new)); } + /** + * Removes all custom controls added to the map. + */ + public void removeCustomControls() { + this.customControls.clear(); + this.getElement().executeJs("this._removeCustomControls()"); + } + /** * Adds a FullScreenEvent listener. The listener is called to notify whether the map is in full * screen mode. From 7737151c6ed4244d309f9c48b64dd8bf1059c257 Mon Sep 17 00:00:00 2001 From: Paola De Bartolo Date: Mon, 23 Sep 2024 17:04:46 -0300 Subject: [PATCH 3/7] feat(demo): add demo for adding and removing custom controls --- .../addons/googlemaps/CustomControlsDemo.java | 103 ++++++++++++++++++ .../addons/googlemaps/GooglemapsDemoView.java | 1 + .../custom-controls-demo-styles.css | 31 ++++++ 3 files changed, 135 insertions(+) create mode 100644 src/test/java/com/flowingcode/vaadin/addons/googlemaps/CustomControlsDemo.java create mode 100644 src/test/resources/META-INF/resources/frontend/styles/google-maps/custom-controls-demo-styles.css diff --git a/src/test/java/com/flowingcode/vaadin/addons/googlemaps/CustomControlsDemo.java b/src/test/java/com/flowingcode/vaadin/addons/googlemaps/CustomControlsDemo.java new file mode 100644 index 0000000..e12df5f --- /dev/null +++ b/src/test/java/com/flowingcode/vaadin/addons/googlemaps/CustomControlsDemo.java @@ -0,0 +1,103 @@ +/*- + * #%L + * Google Maps Addon + * %% + * Copyright (C) 2020 - 2024 Flowing Code + * %% + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * #L% + */ + +package com.flowingcode.vaadin.addons.googlemaps; + +import com.flowingcode.vaadin.addons.demo.DemoSource; +import com.flowingcode.vaadin.addons.googlemaps.GoogleMap.MapType; +import com.vaadin.flow.component.button.Button; +import com.vaadin.flow.component.dependency.CssImport; +import com.vaadin.flow.component.orderedlayout.HorizontalLayout; +import com.vaadin.flow.router.PageTitle; +import com.vaadin.flow.router.Route; + +@PageTitle("Custom Controls Demo") +@DemoSource +@DemoSource( + value = "/src/test/resources/META-INF/resources/frontend/styles/google-maps/custom-controls-demo-styles.css", + caption = "custom-controls-demo-styles.css") +@Route(value = "googlemaps/custom-controls", layout = GooglemapsDemoView.class) +@CssImport("./styles/google-maps/custom-controls-demo-styles.css") +@SuppressWarnings("serial") +public class CustomControlsDemo extends AbstractGoogleMapsDemo { + + @Override + protected void createGoogleMapsDemo(String apiKey) { + GoogleMap gmaps = new GoogleMap(apiKey, null, null); + gmaps.setMapType(MapType.ROADMAP); + gmaps.setSizeFull(); + add(gmaps); + + Button customControlButton1 = new Button("Custom Control 1"); + customControlButton1.setClassName("custom-control-button"); + CustomControl customControl1 = + new CustomControl(customControlButton1, ControlPosition.TOP_CENTER); + Button customControlButton2 = new Button("Custom Control 2"); + customControlButton2.setClassName("custom-control-button"); + CustomControl customControl2 = + new CustomControl(customControlButton2, ControlPosition.LEFT_CENTER); + gmaps.setCustomControls(customControl1, customControl2); + + Button customControlButton3 = new Button("Custom Control 3"); + customControlButton3.setClassName("custom-control-button"); + CustomControl customControl3 = + new CustomControl(customControlButton3, ControlPosition.BOTTOM_CENTER); + + Button addCustomControl3Button = createDemoButton("Add Custom Control 3"); + Button removeCustomControl3Button = createDemoButton("Remove Custom Control 3"); + Button removeAllCustomControlsButton = createDemoButton("Remove all controls"); + Button resetButton = createDemoButton("Reset"); + + addCustomControl3Button.addClickListener(e -> { + gmaps.addCustomControl(customControl3); + removeCustomControl3Button.setEnabled(true); // hide-source + removeAllCustomControlsButton.setEnabled(true); // hide-source + }); + + removeCustomControl3Button.addClickListener(e -> { + gmaps.removeCustomControl(customControl3); + addCustomControl3Button.setEnabled(true); // hide-source + }); + removeCustomControl3Button.setEnabled(false); + + removeAllCustomControlsButton.addClickListener(e -> { + gmaps.removeCustomControls(); + addCustomControl3Button.setEnabled(true); // hide-source + removeCustomControl3Button.setEnabled(false); // hide-source + resetButton.setEnabled(true); // hide-source + }); + + resetButton.addClickListener(e -> { + gmaps.setCustomControls(customControl1, customControl2); + removeAllCustomControlsButton.setEnabled(true); // hide-source + addCustomControl3Button.setEnabled(true); // hide-source + removeCustomControl3Button.setEnabled(false); // hide-source + }); + + add(new HorizontalLayout(addCustomControl3Button, removeCustomControl3Button, + removeAllCustomControlsButton, resetButton)); + } + + private Button createDemoButton(String caption) { + Button button = new Button(caption); + button.setDisableOnClick(true); + return button; + } +} diff --git a/src/test/java/com/flowingcode/vaadin/addons/googlemaps/GooglemapsDemoView.java b/src/test/java/com/flowingcode/vaadin/addons/googlemaps/GooglemapsDemoView.java index 2478342..84c3486 100644 --- a/src/test/java/com/flowingcode/vaadin/addons/googlemaps/GooglemapsDemoView.java +++ b/src/test/java/com/flowingcode/vaadin/addons/googlemaps/GooglemapsDemoView.java @@ -48,6 +48,7 @@ public GooglemapsDemoView() { addDemo(CustomizedMarkerIconsDemo.class); addDemo(TrackLocationDemo.class); addDemo(StyleFeaturesDemo.class); + addDemo(CustomControlsDemo.class); setSizeFull(); } } diff --git a/src/test/resources/META-INF/resources/frontend/styles/google-maps/custom-controls-demo-styles.css b/src/test/resources/META-INF/resources/frontend/styles/google-maps/custom-controls-demo-styles.css new file mode 100644 index 0000000..c2721b9 --- /dev/null +++ b/src/test/resources/META-INF/resources/frontend/styles/google-maps/custom-controls-demo-styles.css @@ -0,0 +1,31 @@ +/*- + * #%L + * Google Maps Addon + * %% + * Copyright (C) 2020 - 2024 Flowing Code + * %% + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * #L% + */ + +.custom-control-button { + background: white; + margin: 10px; + height: 40px; + color: black; + cursor: pointer; + font-family: Arial; + font-size: 18px; + border-radius: 0; + box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px; +} \ No newline at end of file From c7c2a597ed6e05300d4c4e82d1c441a400a1449e Mon Sep 17 00:00:00 2001 From: Paola De Bartolo Date: Wed, 25 Sep 2024 17:27:24 -0300 Subject: [PATCH 4/7] build: update web-component version to 3.8.0 --- .../com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java | 2 +- .../flowingcode/vaadin/addons/googlemaps/GoogleMapMarker.java | 2 +- .../flowingcode/vaadin/addons/googlemaps/GoogleMapPoint.java | 2 +- .../com/flowingcode/vaadin/addons/googlemaps/GoogleMapPoly.java | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java index 0498b39..0311065 100644 --- a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java +++ b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java @@ -51,7 +51,7 @@ @SuppressWarnings("serial") @Tag("google-map") @JsModule("@flowingcode/google-map/google-map.js") -@NpmPackage(value = "@flowingcode/google-map", version = "3.7.1") +@NpmPackage(value = "@flowingcode/google-map", version = "3.8.0") @NpmPackage(value = "@googlemaps/markerclusterer", version = "2.0.8") @JsModule("./googlemaps/geolocation.js") public class GoogleMap extends Component implements HasSize { diff --git a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMapMarker.java b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMapMarker.java index aef2a81..ffa8740 100644 --- a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMapMarker.java +++ b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMapMarker.java @@ -39,7 +39,7 @@ @SuppressWarnings("serial") @Tag("google-map-marker") @JsModule("@flowingcode/google-map/google-map-marker.js") -@NpmPackage(value = "@flowingcode/google-map", version = "3.7.1") +@NpmPackage(value = "@flowingcode/google-map", version = "3.8.0") @NpmPackage(value = "@googlemaps/markerclusterer", version = "2.0.8") public class GoogleMapMarker extends Component { diff --git a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMapPoint.java b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMapPoint.java index 7e4994b..e345a46 100644 --- a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMapPoint.java +++ b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMapPoint.java @@ -28,7 +28,7 @@ @SuppressWarnings("serial") @Tag("google-map-point") @JsModule("@flowingcode/google-map/google-map-point.js") -@NpmPackage(value = "@flowingcode/google-map", version = "3.7.1") +@NpmPackage(value = "@flowingcode/google-map", version = "3.8.0") @NpmPackage(value = "@googlemaps/markerclusterer", version = "2.0.8") public class GoogleMapPoint extends Component { diff --git a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMapPoly.java b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMapPoly.java index 055c58d..7007f83 100644 --- a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMapPoly.java +++ b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMapPoly.java @@ -39,7 +39,7 @@ @Tag("google-map-poly") @JsModule("@flowingcode/google-map/google-map-poly.js") @JsModule("@flowingcode/google-map/google-map-point.js") -@NpmPackage(value = "@flowingcode/google-map", version = "3.7.1") +@NpmPackage(value = "@flowingcode/google-map", version = "3.8.0") @NpmPackage(value = "@googlemaps/markerclusterer", version = "2.0.8") public abstract class GoogleMapPoly extends Component { From 2cf597ae927eda6cdd0fd0ac194893c7fceffade Mon Sep 17 00:00:00 2001 From: Paola De Bartolo Date: Wed, 25 Sep 2024 17:30:10 -0300 Subject: [PATCH 5/7] build: update version to 2.2.0-SNAPSHOT --- pom.xml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pom.xml b/pom.xml index 7c48d46..2aad7b4 100644 --- a/pom.xml +++ b/pom.xml @@ -4,7 +4,7 @@ com.flowingcode.vaadin.addons google-maps - 2.1.1-SNAPSHOT + 2.2.0-SNAPSHOT Google Maps Addon Integration of google-map for Vaadin platform From 4fa18e34525bfa4b61053dc105adf85fea23b3c8 Mon Sep 17 00:00:00 2001 From: Paola De Bartolo Date: Thu, 26 Sep 2024 09:59:16 -0300 Subject: [PATCH 6/7] fix: clear custom controls list as first step on setCustomControls --- .../java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java | 1 + 1 file changed, 1 insertion(+) diff --git a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java index 0311065..07c13f6 100644 --- a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java +++ b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java @@ -787,6 +787,7 @@ public void addCustomControls(CustomControl... customControls) { * @param customControls list of custom controls to add to the map */ public void setCustomControls(CustomControl... customControls) { + this.customControls.clear(); this.getElement().executeJs("this._removeCustomControls()").then((e) -> { JsonArray jsonArray = Json.createArray(); for (int i = 0; i < customControls.length; i++) { From 4d7ec711e2e686d1c3af18d4ce8990b9617e8bcd Mon Sep 17 00:00:00 2001 From: Paola De Bartolo Date: Thu, 26 Sep 2024 16:02:06 -0300 Subject: [PATCH 7/7] fix: use List of custom controls instead of Set to preserve order --- .../com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java index 07c13f6..a7517da 100644 --- a/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java +++ b/src/main/java/com/flowingcode/vaadin/addons/googlemaps/GoogleMap.java @@ -42,9 +42,9 @@ import elemental.json.JsonArray; import elemental.json.JsonObject; import elemental.json.JsonValue; -import java.util.HashSet; +import java.util.ArrayList; +import java.util.ArrayList; import java.util.List; -import java.util.Set; import java.util.concurrent.CompletableFuture; import org.apache.commons.lang3.StringUtils; @@ -58,7 +58,7 @@ public class GoogleMap extends Component implements HasSize { private Integer trackLocationId = null; - private Set customControls = new HashSet(); + private List customControls = new ArrayList(); /** Base map types supported by Google Maps. */ public enum MapType {