feat(google-maps): add missing features and fix wrong definitions

[wf9a5m75]

https://stackoverflow.com/questions/45137375/ionic-2-use-htmlinfowindow-in-native-cordova-plugin-googlemaps

[wf9a5m75]

The bindTo() method synchronizes the value between objectA and objectB.
Sorry I forgot to write this method explain at the document repo.

https://github.com/mapsplugin/cordova-plugin-googlemapsdoc/blob/master/v2.0.0/class/BaseClass/bindTo/README.md

[ihadeed]

Question, how to access the Spherical and Encoding objects? Is it something like this:

new plugin.google.maps.geometry.Spherical();
new plugin.google.maps.geometry.Encoding();

[wf9a5m75]

Actually that are static methods.

The class name of original version is all lower case plugin.google.maps.geometry.spherical, but ci/circleci did not accept lower case, so I changed to Spherical

var radius = plugin.google.maps.geometry.spherical.computeDistanceBetween(center, newValue);

https://github.com/mapsplugin/cordova-plugin-googlemaps-doc/tree/master/v2.0.0/class/utilities/geometry/spherical

https://github.com/mapsplugin/cordova-plugin-googlemaps-doc/tree/master/v2.0.0/class/utilities/geometry/encoding

[ihadeed]

Ok, in that case, pluginRef needs to be plugin.google.maps.geometry.spherical and instead of using CordovaInstance decorator, use Cordova. Apply same fix to the Encoder class.

[wf9a5m75]

Um, the pluginRef is needed in the original plugin code, or the ionic wrapper code?
I'm not familiar with ionic at all (as you may know).

[ihadeed]

By pluginRef I meant this line here: https://github.com/ionic-team/ionic-native/pull/1815/files#diff-e65e72a6b528c5e19ecc3c9793cdfd7fR896

pluginRef is basically a reference to the object that contains the original methods. (in this case plugin.google.maps.geometry.spherical)

The @Cordova decorator calls the method plugin.google.maps.geometry.spherical.computeDistanceBetween with the arguments provided. It takes the pluginRef and adds the method name to it. Depending on the config passed to the decorator, it can convert callbacks to a promise/observable.

[wf9a5m75]

Oh, I see. Thank you for the fixing.

[ihadeed]

Ok, I made a few fixes. It good to go now, unless if you wanted to add something else to the PR.

[wf9a5m75]

Let me try one more thing.

[wf9a5m75]

I have a question.

  @InstanceCheck()
  addMarker(options: MarkerOptions): Promise<Marker | any> {
    return new Promise<Marker>((resolve, reject) => {
      this._objectInstance.addMarker(options, (marker: any) => {
        if (marker) {
          resolve(new Marker(this, marker));   <--- Does the keyword `this` indicate the wrapper plugin itself at this line?
        } else {
          reject();
        }
      });
    });
  }

The reason of this is the getMap() methods return the instance of original plugin, but I guess the most ionic developers except the instance of the wrapper plugin.

[wf9a5m75]

The getMap() method is designed for OOP.

For instance, you can do like this:

document.addEventListener("deviceready", function() {

  var map = plugin.google.maps.Map.getMap(mapDiv);

  map.on(plugin.google.maps.event.MAP_READY, function() {
     map.addMarker({
        ...
     }, onMarkerAdded);
  });

});

function onMarkerAdded() {
   var marker = this;
   var map = marker.getMap();
}

As you can see, in the above code, I don't need to create a global instance for the map.

[wf9a5m75]

@ihadeed I did. If you have no problem, please merge this pull request. Thanks.

[ihadeed]

Remove the @CordovaIntance decorator from the getMap methods.

Cordova, CordovaInstance, CordovaProperty and InstanceProperty decorators override your custom definition. Since you are defining your own functionality here, you have to remove the decorators.

[wf9a5m75]

Could you tell me how different each decorators Cordova, CordovaInstance, CordovaProperty and InstanceProperty?
Where should I read the document?

[wf9a5m75]

@ihadeed Could you accept this pull request at once?
Many people affect by the current wrapper plugin... :(

[wf9a5m75]

Thank you!

[ihadeed]

Will publish a release some time tonight.

[wf9a5m75]

Thank you so much

[ihadeed]

Sorry, forgot to update this thread.

Published 4.1.0 last night with this fix included.

npm i --save @ionic-native/google-maps@latest should do that job.

[wf9a5m75]

Thank you for the update. And could you tell me when this document page is updated?
https://ionicframework.com/docs/native/google-maps/

[ihadeed]

@wf9a5m75 this repo updates the staging site automatically, the production site is updated manually by the Ionic Team.

[wf9a5m75]

I see.
Since the document of the production site has many wrong points, (such as no isAvailable method),I appreciate if the page is updated at once.
Thank you for considering.

[kisimita]

Hi,
Hope I put my problem right place.
I use the code to create HtmlInfoWindow with Ionic as below

`let htmlInfoWindow = new HtmlInfoWindow();

let html = [
'This is <b>Html</b> {parkingPlace.placeName}',
'<br>',
'<button onclick="javascript:alert('clicked!');">click here</button>',
].join("");
htmlInfoWindow.setContent(html);
...`

But I got the a exception
file:///android_asset/www/build/polyfills.js: Line 3 : Error: Uncaught (in promise): TypeError: GoogleMaps.getPlugin(...).HtmlInfoWindow is not a constructor TypeError: GoogleMaps.getPlugin(...).HtmlInfoWindow is not a constructor at new HtmlInfoWindow (file:///android_asset/www/build/vendor.js:83623:37) at HomePage.webpackJsonp.572.HomePage.addParkingPlaceMaker (file:///android_asset/www/build/3.js:180:30) at HomePage.webpackJsonp.572.HomePage.addParkingPlaceMarkers (file:///android_asset/www/build/3.js:172:22) at file:///android_asset/www/build/3.js:144:19 at t.invoke (file:///android_asset/www/build/polyfills.js:3:9283) at r.run (file:///android_asset/www/build/polyfills.js:3:4452) at file:///android_asset/www/build/polyfills.js:3:14076 at t.invokeTask (file:///android_asset/www/build/polyfills.js:3:9967) at r.runTask (file:///android_asset/www/build/polyfills.js:3:5143) at o (file:///android_asset/www/build/polyfills.js:3:2203)

I uninstalled old map plugin and reinstalled but the exception still occurred.
Did I do somethings wrong?
Please help
Thanks

[wf9a5m75]

#1834