From 00221149862d027088b68808de67913b0483faaf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20M=C3=BCller?= <info@sebastian-mueller.net>
Date: Sat, 5 Mar 2016 19:51:34 +0100
Subject: [PATCH] feat(SebmGoogleMap): triggering resize events

SebmGoogleMap now supports triggering resize events
on the google map instance. This is usefull when you intially
hide the map (for example in a tab) and then want to show
the map:

```
<div [hidden]="!showMap">
	<sebm-google-map #myMap></sebm-google-map>
</div>
<button (click)="showMap = true; myMap.triggerResize()">resize</button>
```

Closes #166
---
 src/directives/google-map.ts            | 14 ++++++++++++++
 src/services/google-maps-api-wrapper.ts |  7 +++++++
 2 files changed, 21 insertions(+)

diff --git a/src/directives/google-map.ts b/src/directives/google-map.ts
index da918210a..716d0b46c 100644
--- a/src/directives/google-map.ts
+++ b/src/directives/google-map.ts
@@ -116,6 +116,20 @@ export class SebmGoogleMap implements OnChanges,
     }
   }
 
+  /**
+   * Triggers a resize event on the google map instance.
+   * Returns a promise that gets resolved after the event was triggered.
+   */
+  triggerResize(): Promise<void> {
+    // Note: When we would trigger the resize event and show the map in the same turn (which is a
+    // common case for triggering a resize event), then the resize event would not
+    // work (to show the map), so we trigger the event in a timeout.
+    return new Promise<void>((resolve) => {
+      setTimeout(
+          () => { return this._mapsWrapper.triggerMapEvent('resize').then(() => resolve()); });
+    });
+  }
+
   /**
    * Sets the zoom level of the map. The default value is `8`.
    */
diff --git a/src/services/google-maps-api-wrapper.ts b/src/services/google-maps-api-wrapper.ts
index 31cf63a84..cdaee1d5a 100644
--- a/src/services/google-maps-api-wrapper.ts
+++ b/src/services/google-maps-api-wrapper.ts
@@ -68,4 +68,11 @@ export class GoogleMapsAPIWrapper {
   }
 
   getMap(): Promise<mapTypes.GoogleMap> { return this._map; }
+
+  /**
+   * Triggers the given event name on the map instance.
+   */
+  triggerMapEvent(eventName: string): Promise<void> {
+    return this._map.then((m) => google.maps.event.trigger(m, eventName));
+  }
 }