import { MapBoxMapProvider } from './providers/MapBox' ; import { IMapManager , MapOptions , IMapProvider , MappingAPI , MapType } from './interfaces/mapping' ; import { Utils } from './../../core/Utils' ; import { Logging , LogLevel } from './../Logging' ; author Christopher Cook
*  copyright import { Injectable } from '@angular/core' ; import { Observable } from 'rxjs' ; import { MapKitMapProvider } from './providers/MapKit' ; import { GeoLatLng , GeoPosition , GeoBounds } from '../../model/GeoPosition' ; import { HttpClient } from '@angular/common/http' ; import { MapTilerMapProvider } from './providers/MapTiler' ; import { Events } from '../../services/Events' ; module @ Injectable ( { providedIn : 'root' , } ) export class Mapping implements IMapManager { public map : any ; public mapCentreMarker : any ; public mapsInitialised : boolean ; public mapAPIReady : boolean ; public mapOptions : MapOptions ; public searchMarker : any ; public errorMessage : string ; public parentAppContext : any ; private mapProvider : IMapProvider ; private debouncedMapPositionUpdate : any ; private events : Events ; private isFocused : boolean = false ; constructor constructor ( events , private logging , private http ) { this . events = events ; this . mapOptions = new MapOptions ( ) ; this . mapAPIReady = false ; this . mapsInitialised = false ; this . setMapAPI ( this . mapOptions . mapAPI ) ; let mapManagerContext = this ; this . debouncedMapPositionUpdate = Utils . debounce ( ( ) => { this . logging . log ( "signaling map position change:" ) ; if ( mapManagerContext . mapProvider . mapReady ) { mapManagerContext . getMapCenter ( ) . subscribe ( ( centerPos ) => { if ( centerPos != null ) { this . logging . log ( "Map centre/zoom changed, updating search position:" + centerPos ) ; this . updateMapCentrePos ( centerPos . coords . latitude , centerPos . coords . longitude , false ) ; } else { this . logging . log ( "Map centre/zoom changed - map not ready to change centre pos:" ) ; } } ) ; } } , 300 , false ) ; } setParentAppContext ( context ) { this . parentAppContext = context ; } setMapAPI ( api ) { this . mapOptions . mapAPI = api ; if ( this . mapOptions . mapAPI == MappingAPI . MAPBOX ) { this . mapProvider = new MapBoxMapProvider ( this . events , this . logging , this . http ) ; } if ( this . mapOptions . mapAPI == MappingAPI . MAPKIT_JS ) { this . mapProvider = new MapKitMapProvider ( this . events , this . logging ) ; } if ( this . mapOptions . mapAPI == MappingAPI . MAPTILER ) { this . mapProvider = new MapTilerMapProvider ( this . events , this . logging , this . http ) ; } } isMapReady ( ) { if ( this . mapProvider != null ) { return this . mapProvider . mapReady ; } else { return false ; } } externalAPILoaded ( mapAPI ) { this . mapAPIReady = true ; this . logging . log ( "Mapping API Loaded: " + MappingAPI [ mapAPI ] ) ; } param mapcanvasID initMap ( mapcanvasID ) { if ( this . isMapReady ( ) ) { return ; } if ( this . mapProvider != null ) { if ( this . mapsInitialised ) { this . logging . log ( "initMap: Map provider already initialised" ) ; } this . logging . log ( "Mapping Manager: Init " + MappingAPI [ this . mapProvider . mapAPIType ] ) ; this . mapProvider . initMap ( mapcanvasID , this . mapOptions , this ) ; } else { if ( this . mapsInitialised ) { this . logging . log ( "initMap: map already initialised" ) ; return ; } else { this . logging . log ( "initMap: " + this . mapOptions . mapAPI ) ; } } } param manipulationType mapManipulationPerformed ( manipulationType ) { this . logging . log ( "map manipulated:" + manipulationType ) ; let mapManagerContext = this ; if ( manipulationType == "drag" || manipulationType == "zoom" ) { this . debouncedMapPositionUpdate ( ) ; } } updateMapSize ( ) { if ( this . mapProvider ) { this . mapProvider . refreshMapLayout ( ) ; } } updateMapCentrePos ( lat , lng , moveMap , zoomLevel ? ) { if ( moveMap ) { if ( this . mapProvider != null ) { this . mapProvider . setMapCenter ( new GeoPosition ( lat , lng ) , zoomLevel ) ; } } this . mapOptions . mapCentre = new GeoPosition ( lat , lng ) ; } moveToMapBounds ( bounds ) { this . mapProvider . moveToMapBounds ( bounds ) ; } refreshMapView ( mapHeight , poiList , searchPos ) { if ( this . mapProvider != null ) { this . logging . log ( "Mapping Manager: renderMap " + MappingAPI [ this . mapProvider . mapAPIType ] ) ; if ( this . isMapReady ( ) ) { this . mapProvider . renderMap ( poiList , mapHeight , this . parentAppContext ) ; } else { this . logging . log ( "refreshMapView: map provider not initialised.." ) ; } } else { this . logging . log ( "Unsupported Map API: refreshMapView" , LogLevel . ERROR ) ; } return true ; } setMapType ( maptype ) { if ( this . mapOptions . mapType == maptype ) { return ; } this . mapOptions . mapType = maptype ; if ( this . isMapReady ( ) && this . mapProvider != null ) { this . logging . log ( "Changing map type:" + maptype ) ; this . mapProvider . setMapType ( maptype ) ; } else { this . logging . log ( "Map type set, maps not initialised yet." ) ; } } unfocusMap ( ) { this . logging . log ( "[mapping] Unfocus Map." ) ; this . isFocused = false ; this . mapProvider . unfocusMap ( ) ; } focusMap ( ) { this . logging . log ( "[mapping] Focus Map." ) ; this . isFocused = true ; this . mapProvider . focusMap ( ) ; } getMapBounds ( ) { return this . mapProvider . getMapBounds ( ) ; } getMapZoom ( ) { return this . mapProvider . getMapZoom ( ) ; } setMapZoom ( zoom ) { this . mapProvider . setMapZoom ( zoom ) ; } getMapCenter ( ) { return this . mapProvider . getMapCenter ( ) ; } showPOIOnStaticMap ( mapcanvasID , poi , includeMapLink = false , isRunningUnderCordova = false , mapWidth = 200 , mapHeight = 200 ) { let mapCanvas = document . getElementById ( mapcanvasID ) ; if ( mapCanvas != null ) { let title = poi . AddressInfo . Title ; let lat = poi . AddressInfo . Latitude ; let lon = poi . AddressInfo . Longitude ; if ( mapWidth > 640 ) { mapWidth = 640 ; } if ( mapHeight > 640 ) { mapHeight = 640 ; } let width = mapWidth ; let height = mapHeight ; let mapImageURL = "https://maps.googleapis.com/maps/api/staticmap?center=" + lat + "," + lon + "&zoom=14&size=" + width + "x" + height + "&maptype=roadmap&markers=color:blue%7Clabel:A%7C" + lat + "," + lon + "&sensor=false" ; let mapHTML = "" ; if ( includeMapLink == true ) { mapHTML += "<div>" + Utils . formatMapLink ( poi , "<div><img width=\"" + width + "\" height=\"" + height + "\" src=\"" + mapImageURL + "\" /></div>" , isRunningUnderCordova ) + "</div>" ; } else { mapHTML += "<div><img width=\"" + width + "\" height=\"" + height + "\" src=\"" + mapImageURL + "\" /></div>" ; } mapCanvas . innerHTML = mapHTML ; } } renderPolyline ( polyline ) { this . mapProvider . renderPolyline ( polyline ) ; } clearPolyline ( ) { this . mapProvider . clearPolyline ( ) ; } clearMarkers ( ) { this . logging . log ( "mapping: clearing markers" ) ; this . mapProvider . clearMarkers ( ) ; } addPOILayer ( data ) { this . mapProvider . addPOILayer ( data ) ; } }