Add infowindows to markers

Add infowindows corresponding to a marker holding image data (id, username, tags, uploadedAt, metadata).

I was unable to display the image itself, so I included the tag for identification. Please let me know if you disagree with this decision.

src/main/java/NTNU/IDATT1002/controllers/ImageMapFactory.java

@@ -2,12 +2,19 @@ package NTNU.IDATT1002.controllers;
 
 import NTNU.IDATT1002.models.GeoLocation;
 import NTNU.IDATT1002.models.Image;
+import NTNU.IDATT1002.service.TagService;
+import NTNU.IDATT1002.utils.MetadataStringFormatter;
 import com.lynden.gmapsfx.GoogleMapView;
+import com.lynden.gmapsfx.javascript.event.UIEventType;
 import com.lynden.gmapsfx.javascript.object.*;
+import netscape.javascript.JSObject;
 import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
 
+import java.util.Date;
+import java.util.HashMap;
 import java.util.List;
+import java.util.Map;
 import java.util.stream.Collectors;
 
 
@@ -19,19 +26,27 @@ import java.util.stream.Collectors;
  */
 public class ImageMapFactory {
 
-    private static Logger logger = LoggerFactory.getLogger(ImageMapFactory.class);
+    private GoogleMap map;
+    private Logger logger = LoggerFactory.getLogger(ImageMapFactory.class);
+    private Map<LatLong, Image> latLongImageMapping = new HashMap<>();
 
-    private ImageMapFactory() {}
+    /**
+     *
+     */
+    public ImageMapFactory() {
+    }
 
     /**
      * Create a map from given {@link GoogleMapView} with default options.
      *
-     * @param googleMapView the map view to add the map to
+     * @param mapView the map view to add the map to
      * @return the {@link GoogleMap} created to enable further customization
      */
-    public static GoogleMap createMap(GoogleMapView googleMapView) {
+    public GoogleMap createMap(GoogleMapView mapView) {
         MapOptions mapOptions = getMapOptions();
-        return googleMapView.createMap(mapOptions);
+        map = mapView.createMap(mapOptions);
+        logger.info("[x] Map created");
+        return map;
     }
 
     /**
@@ -40,17 +55,15 @@ public class ImageMapFactory {
      *
      * @return the default map options
      */
-    private static MapOptions getMapOptions() {
-        LatLong berlin = new LatLong(52.520008, 13.404954);
+    private MapOptions getMapOptions() {
+        LatLong copenhagen = new LatLong(55.676098, 12.568337);
         return new MapOptions()
-                .center(berlin)
+                .center(copenhagen)
                 .mapType(MapTypeIdEnum.ROADMAP)
                 .overviewMapControl(false)
                 .panControl(false)
-                .rotateControl(false)
-                .scaleControl(false)
                 .streetViewControl(false)
-                .zoomControl(false)
+                .zoomControl(true)
                 .zoom(3);
     }
 
@@ -60,7 +73,7 @@ public class ImageMapFactory {
      * @param images the list of images
      * @return a list of markers created from the images
      */
-    public static List<Marker> createMarkers(List<Image> images) {
+    public List<Marker> createMarkers(List<Image> images) {
         List<LatLong> locations = getLatLongs(images);
         List<Marker> markers = getMarkers(locations);
         logger.info("[x] {} markers created", markers.size());
@@ -73,16 +86,27 @@ public class ImageMapFactory {
      * @param images the list of images
      * @return a list of {@link LatLong}
      */
-    private static List<LatLong> getLatLongs(List<Image> images) {
+    private List<LatLong> getLatLongs(List<Image> images) {
         return images.stream()
-                .map(Image::getGeoLocation)
-                .filter(GeoLocation::hasLatLong)
-                .map(geoLocation -> {
-                    double latitude = Double.parseDouble(geoLocation.getLatitude());
-                    double longitude = Double.parseDouble(geoLocation.getLongitude());
-                    return new LatLong(latitude, longitude);
-                })
-                .collect(Collectors.toList());
+            .filter(image -> image.getGeoLocation().hasLatLong())
+            .map(image -> {
+                LatLong latLong = getLatLong(image);
+                latLongImageMapping.put(latLong, image);
+                return latLong;
+            }).collect(Collectors.toList());
+    }
+
+    /**
+     * Get a {@link LatLong} from a single image.
+     *
+     * @param image the image holding the {@link GeoLocation}
+     * @return the {@link LatLong} created
+     */
+    private LatLong getLatLong(Image image) {
+        GeoLocation geoLocation = image.getGeoLocation();
+        double latitude = Double.parseDouble(geoLocation.getLatitude());
+        double longitude = Double.parseDouble(geoLocation.getLongitude());
+        return new LatLong(latitude, longitude);
     }
 
     /**
@@ -91,15 +115,58 @@ public class ImageMapFactory {
      * @param locations the list containing the locations
      * @return the list of markers created
      */
-    private static List<Marker> getMarkers(List<LatLong> locations) {
+    private List<Marker> getMarkers(List<LatLong> locations) {
         return locations.stream()
-                .map(location -> {
-                    MarkerOptions markerOptions = new MarkerOptions()
-                            .position(location);
-                    logger.info("[x] Marker created for location: {}", location);
-                    return new Marker(markerOptions);
-                })
+                .map(this::getMarker)
                 .collect(Collectors.toList());
     }
 
+    /**
+     * Create {@link Marker} for given location with map zoom and center on click event.
+     *
+     * @param location the location of the marker
+     * @return marker created
+     */
+    private Marker getMarker(LatLong location) {
+        MarkerOptions markerOptions = new MarkerOptions()
+                .position(location)
+                .animation(Animation.DROP);
+
+        logger.info("[x] Marker created for location: {}", location);
+        Marker marker = new Marker(markerOptions);
+
+        InfoWindow infoWindow = getInfoWindow(location);
+        map.addUIEventHandler(marker, UIEventType.click, (JSObject obj) -> {
+           map.setZoom(10);
+           map.setCenter(location);
+           infoWindow.open(map, marker);
+        });
+
+        return marker;
+    }
+
+    /**
+     * Get {@link InfoWindow} with default options to display the
+     * corresponding image data.
+     *
+     * @param location the location corresponding to an image
+     * @return the {@link InfoWindow} created
+     */
+    private InfoWindow getInfoWindow(LatLong location) {
+        Image image = latLongImageMapping.get(location);
+
+        String username = image.getUser().getUsername();
+        String tags = TagService.getTagsAsString(image.getTags());
+        Date uploadedAt = image.getUploadedAt();
+        String metadata = MetadataStringFormatter.format(image.getMetadata(), "<br/>");
+
+        InfoWindowOptions infoWindowOptions = new InfoWindowOptions()
+                .content("<h3>Id: " + image.getId() + "</h3>" +
+                                 "<p><b>User:</b> " + username + "</p>" +
+                                 "<p><b>Tags:</b> " + tags + "</p>" +
+                                 "<p><b>Uploaded at:</b> " + uploadedAt + "</p>" +
+                                 "<p><b>Metadata:</b> <br/>" + metadata + "</p>");
+
+        return new InfoWindow(infoWindowOptions);
+    }
 }