Close infoWindow emitter #27

README.md

@@ -105,44 +105,6 @@ getDirection() {
 }
 ```
 
-## Allow only one marker Infowindow to be open at one time 
-
-HTML
-
-```html
-<agm-map [latitude]="lat" [longitude]="lng">
-  <agm-direction [origin]="origin" [destination]="destination" [infowindow]="infowindow" (sendInfowindow)="obtainInfowindow($event)">
-  </agm-direction>
-</agm-map>
-```
-
-TS
-
-```typescript
-public lat: Number = 24.799448
-public lng: Number = 120.979021
-
-public origin: {}
-public destination: {}
-public infowindow: InfoWindow = undefined
-
-ngOnInit() {
-  this.getDirection()
-}
-
-getDirection() {
-  this.origin = { lat: 24.799448, lng: 120.979021 }
-  this.destination = { lat: 24.799524, lng: 120.975017 }
-
-  // this.origin = 'Taipei Main Station'
-  // this.destination = 'Taiwan Presidential Office'
-}
-
-obtainInfowindow(window: InfoWindow) {
-  this.infowindow = window
-}
-```
-
 ## Document
 - Document [Agm-Direction-Docs](https://robby570.tw/Agm-Direction-Docs/)
 - Less useful [AgmDirectionModule](https://robby570.tw/Agm-Direction/)

package.json

@@ -1,7 +1,7 @@
 {
   "name": "agm-direction",
   "description": "directive for agm (not official)",
-  "version": "0.5.7",
+  "version": "0.5.8",
   "scripts": {
     "build": "gulp build",
     "build:watch": "gulp",

playground/app.component.html

@@ -5,7 +5,7 @@ <h1>Agm-Direction Playground -
 <input type="text" [(ngModel)]="destination">
 <br />
 <agm-map [latitude]="lat" [longitude]="lng">
-    <agm-direction [origin]="origin" [destination]="destination" [waypoints]="waypoints" [renderOptions]="renderOptions" [markerOptions]="markerOptions" [infowindow]="infowindow"
-        (onChange)="dirChange($event)" (sendInfowindow)="obtainInfowindow($event)">
+    <agm-direction [origin]="origin" [destination]="destination" [waypoints]="waypoints" [renderOptions]="renderOptions" [markerOptions]="markerOptions"
+        (onChange)="dirChange($event)">
     </agm-direction>
 </agm-map>

playground/index.ts

@@ -8,7 +8,6 @@ import { Component } from '@angular/core';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 
 import { AgmCoreModule } from '@agm/core';
-import { InfoWindow } from '@agm/core/services/google-maps-types';
 import { AgmDirectionModule } from '../dist';
 
 @Component({
@@ -33,22 +32,13 @@ class AppComponent {
     },
     destination: {
       icon: 'https://i.imgur.com/7teZKif.png',
-      infoWindow: `
-      <h4>Hello<h4>
-      <a href='http://www-e.ntust.edu.tw/home.php' target='_blank'>Taiwan Tech</a>
-      `
     },
   };
 
-  infowindow: InfoWindow = undefined;
-
   dirChange(event: any) {
     console.log(event);
   }
 
-  obtainInfowindow(window: InfoWindow) {
-    this.infowindow = window
-  }
 }
 
 @NgModule({

src/agm-direction.directive.ts

@@ -1,6 +1,6 @@
 import { Directive, Input, Output, OnChanges, OnInit, EventEmitter } from '@angular/core';
 import { GoogleMapsAPIWrapper } from '@agm/core';
-import { InfoWindow } from '@agm/core/services/google-maps-types';
+import { InfoWindow, Marker, GoogleMap } from '@agm/core/services/google-maps-types';
 
 declare var google: any;
 @Directive({
@@ -30,18 +30,18 @@ export class AgmDirection implements OnChanges, OnInit {
   @Input() visible: boolean = true;
   @Input() panel: object | undefined;
   @Input() markerOptions: { origin: any, destination: any };
-  @Input() infowindow: InfoWindow = undefined;
+  @Input() infoWindow: InfoWindow = undefined;
 
   @Output() onChange: EventEmitter<any> = new EventEmitter<any>();
-  @Output() sendInfowindow: EventEmitter<InfoWindow> = new EventEmitter<InfoWindow>();
+  // @Output() sendInfowindow: EventEmitter<InfoWindow> = new EventEmitter<InfoWindow>();
 
   public directionsService: any = undefined;
   public directionsDisplay: any = undefined;
 
   private isFirstChange: boolean = true;
 
-  private originMarker = undefined;
-  private destinationMarker = undefined;
+  private originMarker: Marker = undefined;
+  private destinationMarker: Marker = undefined;
 
   constructor(
     private gmapsApi: GoogleMapsAPIWrapper,
@@ -96,7 +96,7 @@ export class AgmDirection implements OnChanges, OnInit {
    */
   private directionDraw() {
 
-    this.gmapsApi.getNativeMap().then((map: any) => {
+    this.gmapsApi.getNativeMap().then((map: GoogleMap) => {
 
       if (typeof this.directionsDisplay === 'undefined') {
         this.directionsDisplay = new google.maps.DirectionsRenderer(this.renderOptions);
@@ -129,6 +129,7 @@ export class AgmDirection implements OnChanges, OnInit {
         avoidHighways: this.avoidHighways,
         avoidTolls: this.avoidTolls,
       }, (response: any, status: any) => {
+
         if (status === 'OK') {
           this.directionsDisplay.setDirections(response);
 
@@ -190,26 +191,24 @@ export class AgmDirection implements OnChanges, OnInit {
    * Custom Origin and Destination Icon
    * 
    * @private
-   * @param {object} map map
-   * @param {object} marker marker
-   * @param {object} markerOpts properties
-   * @param {string} content marker's infowindow content
-   * @returns {object} marker
+   * @param {GoogleMap} map map
+   * @param {Marker} marker marker
+   * @param {Object} markerOpts properties
+   * @param {String} content marker's infowindow content
+   * @returns {Marker} new marker
    * @memberof AgmDirection
    */
-  private setMarker(map: any, marker: any, markerOpts: any, content: string) {
-    if (this.infowindow === undefined) { 
-      this.infowindow = new google.maps.InfoWindow({});
-      this.sendInfowindow.emit(this.infowindow);
+  private setMarker(map: GoogleMap, marker: Marker, markerOpts: any, content: string) {
+    if (typeof this.infoWindow === 'undefined') {
+      this.infoWindow = new google.maps.InfoWindow({});
+      // this.sendInfowindow.emit(this.infoWindow);
     }
     marker = new google.maps.Marker(markerOpts);
     marker.addListener('click', () => {
       const infowindoContent: string = typeof markerOpts.infoWindow === 'undefined' ? content : markerOpts.infoWindow
-      this.infowindow.setContent(infowindoContent);
-      this.infowindow.open(map, marker);
+      this.infoWindow.setContent(infowindoContent);
+      this.infoWindow.open(map, marker);
     });
     return marker;
   }
 }
-
-

src/package.json

@@ -1,7 +1,7 @@
 {
   "name": "agm-direction",
   "description": "directive for agm (not official)",
-  "version": "0.5.7",
+  "version": "0.5.8",
   "repository": {
     "type": "git",
     "url": "https://github.com/explooosion/Agm-Direction"