feat(*): Support for Transit Layer

- Added new Directive called <agm-transit-layer>
- Added test

fixes: 1674

Author: bmamey

packages/core/core.module.ts

@@ -15,6 +15,7 @@ import {MapsAPILoader} from './services/maps-api-loader/maps-api-loader';
 import {BROWSER_GLOBALS_PROVIDERS} from './utils/browser-globals';
 import {AgmFitBounds} from './directives/fit-bounds';
 import { AgmPolylineIcon } from './directives/polyline-icon';
+import { AgmTransitLayer } from './directives/transit-layer';
 
 /**
  * @internal
@@ -23,7 +24,7 @@ export function coreDirectives() {
   return [
     AgmMap, AgmMarker, AgmInfoWindow, AgmCircle, AgmRectangle,
     AgmPolygon, AgmPolyline, AgmPolylinePoint, AgmKmlLayer,
-    AgmDataLayer, AgmFitBounds, AgmPolylineIcon
+    AgmDataLayer, AgmFitBounds, AgmPolylineIcon, AgmTransitLayer
   ];
 }
 

packages/core/directives.ts

@@ -4,6 +4,7 @@ export {AgmRectangle} from './directives/rectangle';
 export {AgmInfoWindow} from './directives/info-window';
 export {AgmKmlLayer} from './directives/kml-layer';
 export {AgmDataLayer} from './directives/data-layer';
+export {AgmTransitLayer} from './directives/transit-layer';
 export {AgmMarker} from './directives/marker';
 export {AgmPolygon} from './directives/polygon';
 export {AgmPolyline} from './directives/polyline';

packages/core/directives/map.ts

@@ -15,6 +15,7 @@ import { PolygonManager } from '../services/managers/polygon-manager';
 import { PolylineManager } from '../services/managers/polyline-manager';
 import { KmlLayerManager } from './../services/managers/kml-layer-manager';
 import { DataLayerManager } from './../services/managers/data-layer-manager';
+import { TransitLayerManager } from '../services/managers/transit-layer-manager';
 import { FitBoundsService } from '../services/fit-bounds';
 
 declare var google: any;
@@ -47,7 +48,7 @@ declare var google: any;
   providers: [
     GoogleMapsAPIWrapper, MarkerManager, InfoWindowManager, CircleManager, RectangleManager,
     PolylineManager, PolygonManager, KmlLayerManager, DataLayerManager, DataLayerManager,
-    FitBoundsService
+    TransitLayerManager, FitBoundsService
   ],
   host: {
     // todo: deprecated - we will remove it with the next version

packages/core/directives/transit-layer.ts

@@ -0,0 +1,64 @@
+import { Directive, Input, OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core';
+import { TransitLayerManager } from '../services/managers/transit-layer-manager';
+
+let layerId = 0;
+
+/*
+ * This directive adds a transit layer to a google map instance
+ * <agm-transit-layer [visible]="true|false"> <agm-transit-layer>
+ * */
+@Directive({
+    selector: 'agm-transit-layer'
+})
+
+export class AgmTransitLayer implements OnInit, OnChanges, OnDestroy{
+    private _addedToManager: boolean = false;
+    private _id: string = (layerId++).toString();
+    private static _transitLayerOptions: string[] = [ 'visible'];
+
+    /**
+     * Hide/show transit layer
+     */
+    @Input() visible: boolean = true;
+
+    constructor( private _manager: TransitLayerManager ) {}
+
+    ngOnInit() {
+        if (this._addedToManager) {
+            return;
+        }
+        this._manager.addTransitLayer(this, {visible: this.visible});
+        this._addedToManager = true;
+    }
+
+    ngOnChanges(changes: SimpleChanges) {
+        if (!this._addedToManager) {
+            return;
+        }
+        this._updateTransitLayerOptions(changes);
+    }
+
+    private _updateTransitLayerOptions(changes: SimpleChanges) {
+        const options = Object.keys(changes)
+            .filter(k => AgmTransitLayer._transitLayerOptions.indexOf(k) !== -1)
+            .reduce((obj: any, k: string) => {
+                obj[k] = changes[k].currentValue;
+                return obj;
+            }, {});
+        if (Object.keys(options).length > 0) {
+            this._manager.setOptions(this, options);
+        }
+    }
+
+    /** @internal */
+    id(): string { return this._id; }
+
+    /** @internal */
+    toString(): string { return `AgmTransitLayer-${this._id.toString()}`; }
+
+    /** @internal */
+    ngOnDestroy() {
+        this._manager.deleteTransitLayer(this);
+    }
+
+}

packages/core/services.ts

@@ -11,3 +11,4 @@ export {GoogleMapsScriptProtocol, LAZY_MAPS_API_CONFIG, LazyMapsAPILoader, LazyM
 export {MapsAPILoader} from './services/maps-api-loader/maps-api-loader';
 export {NoOpMapsAPILoader} from './services/maps-api-loader/noop-maps-api-loader';
 export {FitBoundsAccessor, FitBoundsDetails} from './services/fit-bounds';
+export {TransitLayerManager} from './services/managers/transit-layer-manager';

packages/core/services/google-maps-api-wrapper.ts

@@ -104,6 +104,19 @@ export class GoogleMapsAPIWrapper {
     });
   }
 
+  /**
+   * Creates a Google Map transit layer instance add it to map
+   * @param {TransitLayerOptions} options - TransitLayerOptions options
+   * @returns {Promise<TransitLayer>} a new transit layer object
+   */
+  createTransitLayer(options: mapTypes.TransitLayerOptions): Promise<mapTypes.TransitLayer>{
+    return this._map.then((map: mapTypes.GoogleMap) => {
+      let transitLayer: mapTypes.TransitLayer = new google.maps.TransitLayer();
+      transitLayer.setMap(options.visible ? map : null);
+      return transitLayer;
+    });
+  }
+
   /**
    * Determines if given coordinates are insite a Polygon path.
    */

packages/core/services/google-maps-types.ts

@@ -435,6 +435,16 @@ export interface KmlMouseEvent extends MouseEvent {
   pixelOffset: Size;
 }
 
+export interface TransitLayer extends MVCObject {
+  getMap(): GoogleMap;
+  setMap(map: GoogleMap): void;
+  setOptions(options: TransitLayerOptions): void;
+}
+
+export interface TransitLayerOptions {
+  visible: boolean;
+}
+
 export interface Data extends MVCObject {
   features: Feature[];
   addGeoJson(geoJson: Object, options?: GeoJsonOptions): Feature[];

packages/core/services/managers/transit-layer-manager.spec.ts

@@ -0,0 +1,94 @@
+import {NgZone} from '@angular/core';
+import {TestBed, inject, fakeAsync} from '@angular/core/testing';
+import {AgmTransitLayer} from '../../directives/transit-layer';
+import {GoogleMapsAPIWrapper} from '../../services/google-maps-api-wrapper';
+import {TransitLayerManager} from '../../services/managers/transit-layer-manager';
+
+describe('TransitLayerManager', () => {
+    beforeAll(() => {
+        (<any>window).google = {
+            maps: {
+                TransitLayer: class TransitLayer {
+                    setMap = jest.fn();
+
+                    constructor() {
+
+                    }
+                },
+            }
+        };
+    });
+
+    beforeEach(() => {
+
+        TestBed.configureTestingModule({
+            providers: [
+                {provide: NgZone, useFactory: () => new NgZone({enableLongStackTrace: true})},
+                {
+                    provide: GoogleMapsAPIWrapper,
+                    useValue: {
+                        getNativeMap: () => Promise.resolve(),
+                        createTransitLayer: jest.fn()
+                    }
+                },
+                TransitLayerManager,
+
+            ]
+        });
+    }); // end beforeEach
+
+    describe('Create a new TransitLayer', () => {
+
+        it('should call mapsApiWrapper when creating a new transit',
+            fakeAsync(inject(
+                [TransitLayerManager, GoogleMapsAPIWrapper],
+                (transitLayerManager: TransitLayerManager, apiWrapper: GoogleMapsAPIWrapper) => {
+                    const newTransitLayer = new AgmTransitLayer(transitLayerManager);
+                    const opt = {visible: false};
+                    transitLayerManager.addTransitLayer(newTransitLayer, opt);
+                    expect(apiWrapper.createTransitLayer).toHaveBeenCalled();
+
+                })
+            )
+        );
+    });
+
+    describe('Toggling visibility of TransitLayer', () => {
+
+        it('should update that transit layer via setOptions method when the options changes', fakeAsync(
+
+            inject(
+                [TransitLayerManager, GoogleMapsAPIWrapper],
+                (transitLayerManager: TransitLayerManager,
+                 apiWrapper: GoogleMapsAPIWrapper) => {
+                    const newTransitLayer = new AgmTransitLayer(transitLayerManager);
+                    newTransitLayer.visible = true;
+
+                    const transitLayerInstance: any = {
+                        setMap: jest.fn(),
+                        setOptions: jest.fn()
+
+                    };
+
+                    (<jest.Mock>apiWrapper.createTransitLayer).mockReturnValue(
+                        Promise.resolve(transitLayerInstance)
+                    );
+
+                    transitLayerManager.addTransitLayer(newTransitLayer, {visible: true});
+                    expect(apiWrapper.createTransitLayer).toHaveBeenCalledWith({
+                        visible: true
+                    });
+
+                    newTransitLayer.visible = false;
+                    transitLayerManager.setOptions(newTransitLayer, {visible: false}).then(() => {
+                        expect(transitLayerInstance.setMap).toHaveBeenCalledWith(null);
+                    });
+
+                }
+            )
+
+        ));
+
+    });
+
+});

packages/core/services/managers/transit-layer-manager.ts

@@ -0,0 +1,68 @@
+import {Injectable} from '@angular/core';
+import {AgmTransitLayer} from '../../directives/transit-layer';
+import {GoogleMapsAPIWrapper} from '../google-maps-api-wrapper';
+import {TransitLayer, TransitLayerOptions, GoogleMap} from '../google-maps-types';
+
+/**
+ * This class manages a Transit Layer for a Google Map instance.
+ */
+
+@Injectable()
+export class TransitLayerManager {
+    private _layers: Map<AgmTransitLayer, Promise<TransitLayer>> =
+        new Map<AgmTransitLayer, Promise<TransitLayer>>();
+
+    constructor(private _wrapper: GoogleMapsAPIWrapper) {}
+
+    /**
+     * Adds a transit layer to a map and local layer manager
+     * @param {AgmTransitLayer} layer - a transitLayer object
+     * @param {TransitLayerOptions} options - TransitLayerOptions options
+     * @returns void
+     */
+    addTransitLayer(layer: AgmTransitLayer, options: TransitLayerOptions): void {
+        const newLayer = this._wrapper.createTransitLayer(options);
+        this._layers.set(layer, newLayer);
+    }
+
+    /**
+     * Sets layer options
+     * @param {AgmTransitLayer} transitLayer object
+     * @param {options} TransitLayerOptions
+     * @returns Promise<void>
+     */
+    setOptions(layer: AgmTransitLayer, options: TransitLayerOptions): Promise<void> {
+        return this.toggleTransitLayerVisibility(layer, options);
+    }
+
+    /**
+     * Deletes a transit layer
+     * @param {AgmTransitLayer} layer - the transit layer to delete
+     * @returns  Promise<void>
+     */
+    deleteTransitLayer(layer: AgmTransitLayer): Promise<void> {
+        return this._layers.get(layer).then(currentLayer => {
+            currentLayer.setMap(null);
+            this._layers.delete(layer);
+        });
+    }
+
+    /**
+     * Hide/Show a Google Map transit layer
+     * @param {AgmTransitLayer} transitLayer object
+     * @param {options} TransitLayerOptions
+     * @returns Promise<void>
+     */
+    toggleTransitLayerVisibility(layer: AgmTransitLayer, options: TransitLayerOptions): Promise<void> {
+        return this._layers.get(layer).then(currentLayer => {
+            if (!options.visible) {
+                currentLayer.setMap(null);
+                return Promise.resolve();
+            } else {
+               return this._wrapper.getNativeMap().then( (map: GoogleMap) => {
+                    currentLayer.setMap(map);
+                });
+            }
+        });
+    }
+}