Add the 'disableAutoPan' option to marker (#174)

src/android/plugin/google/maps/GoogleMaps.java

@@ -1063,6 +1063,25 @@ private void onGroundOverlayClick(GroundOverlay groundOverlay, LatLng point) {
   @Override
   public boolean onMarkerClick(Marker marker) {
     this.onMarkerEvent("click", marker);
+
+    JSONObject properties = null;
+    String propertyId = "marker_property_" + marker.getId();
+    PluginEntry pluginEntry = this.plugins.get("Marker");
+    PluginMarker pluginMarker = (PluginMarker)pluginEntry.plugin;
+    if (pluginMarker.objects.containsKey(propertyId)) {
+      properties = (JSONObject) pluginMarker.objects.get(propertyId);
+      if (properties.has("disableAutoPan")) {
+        boolean disableAutoPan = false;
+        try {
+          disableAutoPan = properties.getBoolean("disableAutoPan");
+        } catch (JSONException e) {}
+        if (disableAutoPan) {
+          marker.showInfoWindow();
+          return true;
+        }
+      }
+    }
+
     return false;
   }
 
@@ -1468,12 +1487,19 @@ public View getInfoContents(Marker marker) {
       return null;
     }
 
+    JSONObject properties = null;
     JSONObject styles = null;
-    String styleId = "marker_style_" + marker.getId();
+    String propertyId = "marker_property_" + marker.getId();
     PluginEntry pluginEntry = this.plugins.get("Marker");
     PluginMarker pluginMarker = (PluginMarker)pluginEntry.plugin;
-    if (pluginMarker.objects.containsKey(styleId)) {
-      styles = (JSONObject) pluginMarker.objects.get(styleId);
+    if (pluginMarker.objects.containsKey(propertyId)) {
+      properties = (JSONObject) pluginMarker.objects.get(propertyId);
+
+      if (properties.has("styles")) {
+        try {
+          styles = (JSONObject) properties.getJSONObject("styles");
+        } catch (JSONException e) {}
+      }
     }
 
 

src/android/plugin/google/maps/PluginMarker.java

@@ -13,6 +13,7 @@
 import android.graphics.Bitmap;
 import android.graphics.BitmapFactory;
 import android.os.Bundle;
+import android.util.Log;
 
 import com.google.android.gms.maps.model.BitmapDescriptor;
 import com.google.android.gms.maps.model.BitmapDescriptorFactory;
@@ -74,9 +75,16 @@ private void createMarker(final JSONArray args, final CallbackContext callbackCo
     String id = "marker_" + marker.getId();
     this.objects.put(id, marker);
 
+    JSONObject properties = new JSONObject();
     if (opts.has("styles")) {
-      this.objects.put("marker_style_" + marker.getId(), opts.getJSONObject("styles"));
+      properties.put("styles", opts.getJSONObject("styles"));
     }
+    if (opts.has("disableAutoPan")) {
+      properties.put("disableAutoPan", opts.getBoolean("disableAutoPan"));
+    } else {
+      properties.put("disableAutoPan", false);
+    }
+    this.objects.put("marker_property_" + marker.getId(), properties);
 
     // Prepare the result
     final JSONObject result = new JSONObject();
@@ -223,6 +231,26 @@ protected void setVisible(JSONArray args, CallbackContext callbackContext) throw
     String id = args.getString(1);
     this.setBoolean("setVisible", id, visible, callbackContext);
   }
+  /**
+   * @param args
+   * @param callbackContext
+   * @throws JSONException 
+   */
+  protected void setDisableAutoPan(JSONArray args, CallbackContext callbackContext) throws JSONException {
+    boolean disableAutoPan = args.getBoolean(2);
+    String id = args.getString(1);
+    Marker marker = this.getMarker(id);
+    String propertyId = "marker_property_" + marker.getId();
+    JSONObject properties = null;
+    if (this.objects.containsKey(propertyId)) {
+      properties = (JSONObject)this.objects.get(propertyId);
+    } else {
+      properties = new JSONObject();
+    }
+    properties.put("disableAutoPan", disableAutoPan);
+    this.objects.put(propertyId, properties);
+    callbackContext.success();
+  }
   /**
    * Set title for the marker
    * @param args

www/googlemaps-cdv-plugin.js

@@ -508,6 +508,7 @@ App.prototype.clear = function(callback) {
 App.prototype.remove = function() {
   this.set('div', undefined);
   this.clear();
+  self.empty();
   cordova.exec(null, null, PLUGIN_NAME, 'remove', []);
 };
 
@@ -1004,9 +1005,13 @@ Marker.prototype.remove = function(callback) {
   }, this.errorHandler, PLUGIN_NAME, 'exec', ['Marker.remove', this.getId()]);
   this.off();
 };
-Marker.prototype.setOpacity = function(alpha) {
-  this.set('opacity');
-  cordova.exec(null, this.errorHandler, PLUGIN_NAME, 'exec', ['Marker.setOpacity', this.getId(), alpha]);
+Marker.prototype.setDisableAutoPan = function(disableAutoPan) {
+  this.set('disableAutoPan', disableAutoPan);
+  cordova.exec(null, this.errorHandler, PLUGIN_NAME, 'exec', ['Marker.setDisableAutoPan', this.getId(), disableAutoPan]);
+};
+Marker.prototype.setOpacity = function(opacity) {
+  this.set('opacity', opacity);
+  cordova.exec(null, this.errorHandler, PLUGIN_NAME, 'exec', ['Marker.setOpacity', this.getId(), opacity]);
 };
 Marker.prototype.getOpacity = function() {
   return this.get('opacity');

www/index.html

@@ -39,8 +39,9 @@ <h1 class="ui-title" role="heading">Phonegap-Googlemaps-Plugin</h1>
           <li action="getVisibleRegion">Get visible region?</li>
           <li action="htmlOverlay">Put HTML on the map</li>
           <li data-role="list-divider">Marker</li>
-          <li action="marker">Marker</li>
-          <li action="marker_advance">Marker Advance</li>
+          <li action="marker1">Marker 1</li>
+          <li action="marker2">Marker 2</li>
+          <li action="marker3">Marker 3</li>
           <li data-role="list-divider">Overlays</li>
           <li action="drawOverlays">Polyline, Polygon, Circle</li>
           <li action="groundOverlay">Ground Overlay</li>

www/pages/marker_advance.html → www/pages/marker2.html

@@ -145,13 +145,6 @@ <h4 class="ui-bar ui-bar-a">JavaScript</h4>
       marker.showInfoWindow();
     });
   };
-  map.addMarker({
-    'position': latLng,
-    'title': canvas.toDataURL(),
-    'icon': icon
-  }, function(marker) {
-    marker.showInfoWindow();
-  });
 }
 function textStyle(map, latLng) {
   map.addMarker({

www/pages/marker3.html

@@ -0,0 +1,69 @@
+<h3 class="ui-bar ui-bar-a">Marker Advanced</h3>
+<p>There are some unique feature for Marker.</p>
+<div id="map_canvas"></div>
+<div data-role="tabs" id="tabs">
+  <div data-role="navbar">
+    <ul>
+      <li><a id="disableAutoPan" href="#one" data-ajax="false">Disable Auto Pan</a></li>
+      <li><a id="base64Icon" href="#two" data-ajax="false">Demo2</a></li>
+      <li><a id="textStyle" href="#three" data-ajax="false">Demo3</a></li>
+    </ul>
+  </div>
+  <div id="one" class="ui-body-d ui-content">
+    <input type="checkbox" id="disableAutoPanChkBox" checked="checked">
+    <label for="disableAutoPanChkBox">Disable Auto Pan</label>
+    <h4 class="ui-bar ui-bar-a">JavaScript</h4>
+    <code class="prettyprint">map.addMarker({
+  'position': GOOGLE_TOKYO,
+  'title': 'Google Tokyo!',
+  'disableAutoPan': true
+});</code>
+  </div>
+  <div id="two">
+    <h4 class="ui-bar ui-bar-a">JavaScript</h4>
+    <code class="prettyprint"></code>
+
+  </div>
+  <div id="three" class="ui-body-d ui-content">
+    <h4 class="ui-bar ui-bar-a">JavaScript</h4>
+    <code class="prettyprint"></code>
+  </div>
+</div>
+<script type="text/javascript">
+
+function onPageLoaded(map) {
+
+  $("#disableAutoPan").click(function() {
+    init(map, disableAutoPan);
+  });
+
+  $("#disableAutoPan").click();
+}
+function init(map, next) {
+  const GOOGLE_TOKYO = new plugin.google.maps.LatLng(35.660556,139.729167);
+  map.clear();
+  map.moveCamera({
+    'target': GOOGLE_TOKYO,
+    'tilt': 90,
+    'zoom': 15,
+    'bearing': 0
+  });
+  next(map, GOOGLE_TOKYO);
+}
+function disableAutoPan(map, latLng) {
+  $("#disableAutoPanChkBox").off();
+  map.addMarker({
+    'position': latLng,
+    'title': "Click me!",
+    'disableAutoPan': true
+  }, function(marker) {
+
+    $("#disableAutoPanChkBox").on("change", function() {
+      var isChecked = $(this).is(":checked");
+      marker.setDisableAutoPan(isChecked);
+    });
+
+  });
+}
+
+</script>