Watching map events

[wpalahnuk]

Currently there doesn't seem to be any way to track most of the map events, such as clicking on the map, map idling, drag_end, etc.

It seems the only map events currently tracked are:

      controller.addMapListener('drag', updateScope);
      controller.addMapListener('zoom_changed', updateScope);
      controller.addMapListener('center_changed', updateScope);
      controller.addMapListener('bounds_changed', updateScope);
      controller.addMapListener('maptypeid_changed', updateScope);
      controller.addMapListener('resize', updateScope);

I'm wondering, are there any plans to add in this functionality?

I've added in the ability to watch these on the version I'm using, and I could clean up the changes I've made and submit a PR, I just don't want to duplicate any work someone is currently doing, or submit an unwanted PR.

[dylanfprice]

Hey,

What's your use case and which events do you need to track? I'm sure you have good reasons to want to track events I just can't think of it off the top of my head right now, and I want to convince myself that this feature is really needed.

Likely the way I would want to implement this is the same way as gmMarkers, i.e. you add a gm-on-*event* property to the gm-map element. If that's the way you implemented it in your version, then PR away!

Dylan

[wpalahnuk]

My current use case is that I need to add a marker when a user clicks somewhere on the map. Similar to the "Drag Marker" plnkr example, but there is no maker initially, and you can click somewhere to reposition the marker in addition to dragging.

That's exactly how I have it implemented, for example;

gm-on-click="addMarkerEvent($event)"

[dylanfprice]

Perfect that sounds great. I'll be looking forward to your PR.

[hxu]

I had a similar use case and was taking a look at this, thinking that I might be able to contribute, but I ran into a few issues when working on it. Maybe you guys have some ideas?

• Can't test the same way as for Markers - Because the addListener call in the directive runs in a $timeout block, the unit tests compile the element, attach spies on to addListener, then flushes the timeouts, which allows the spy to catch the calls. However, the addMapListener calls in the map directive attach listeners on compile, so it doesn't seem possible to attach spies before the calls. I thought a way to get around this was to wrap the addMapListener call in $timeout in the map directive, but this is solely to make it testable. Is there another way to test that is better?
• Problems with events with underscores - Some events from the Google Maps API have underscores in them (like zoom_changed. The attrs variable in a directive link function appears to be stripping out the underscores in the normalization process. How do you deal with this in the Marker case, or is it unhandled (i.e. you currently are unable to bind an event to position_changed on the marker)?

[wpalahnuk]

I haven't looked into the testing yet, but from a quick look it looks like events with underscores on markers are currently unhandled.

Can't really think of a good way of handling this. The easiest solution I can think of is to just substitute a character for the underscore and have the function getEventHandlers(attrs) substitute a underscore back in.

[hxu]

I've started a pull request for this. It's fixes the getEventHandlers issue, and I'm still working on the actual meat of the map listener issue.

[hxu]

Actually maybe it would be easier to modify how the listeners are stored. Currently they're pushed onto the _listeners array in the controller. Maybe we could make it a hash with key names as the event names. This would make it easier to test for the presence of a listener, and would also make it easier to get references to listeners, if you needed to do that. What do you think, @dylanfprice

[wpalahnuk]

I must be missing something, the pull request code isn't working for me.

I'm getting event = 'zoomchanged' instead of event = 'zoom_changed'

It seems to me that angular takes out the capital before you can convert it to the underscore, like how it strips out the original underscore. Though I could just be missing something here.

[hxu]

Seems to be working for me. I added another test to make sure that it works on compiling the directive here: https://github.com/hxu/angular-gm/blob/5774909c16e0bb3b8bc620276126bc6ecfa9fce6/test/unit/directives/gmMarkersSpec.js#L209

[hxu]

My pull request is complete, and I think the feature has been fully implemented. I'm still kind of new to this, so though I wrote tests that I were similar to the tests that existed on the Markers, I'm not sure if they're properly testing the feature.

For the events with underscores, it is probably better to put them in the html as 'gm-on-center-changed', instead of 'gm-on-center_changed' for style reasons, so the docs should maybe recommend this.

@wpalahnuk can you check again if the code is working for you? If not, can you write a failing test case?

Thanks!

[wpalahnuk]

It seems I misunderstood the implementation, underscored events are now working for me.

For the new map event listeners, what I'm doing for testing is just checking if the functions provided for the listeners are called when I fire off events on the map. This seems to be how the current map events are tested.

//new map listener
gm-on-click="click($event)"
//in the test
var mouseEvent = {
  stop: null,
  latLng: new google.maps.LatLng(40.0,-90.0)
}
google.maps.event.trigger(map, 'click', mouseEvent);
$timeout.flush();
expect(scope.click).toHaveBeenCalled();

Edit: ignore this, you already have it implemented

[dylanfprice]

Hey guys,

Sorry I haven't been following this, I've been out of town this last week. This is looking really good, thanks for your work so far! @hxu I will merge your pull request sometime this week, I just need to find a time to sit down and fully read through it.