Skip to content

Commit

Permalink
Merge pull request #62 from explooosion/dev
Browse files Browse the repository at this point in the history 
Dev - 0.7.6
  • Loading branch information
@explooosion
explooosion authored Feb 1, 2019
2 parents 00bf567 + 9cc1fd5 commit 4a4c9ee
Show file tree
Hide file tree
Showing 5 changed files with 1,754 additions and 741 deletions.
34 changes: 17 additions & 17 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "agm-direction",
"version": "0.7.5",
"version": "0.7.6",
"description": "directive for agm (not official)",
"main": "./bundles/agm-direction.umd.js",
"module": "./fesm5/agm-direction.js",
Expand Down Expand Up @@ -51,37 +51,37 @@
"@angular/platform-browser": "7.0.0",
"@angular/platform-browser-dynamic": "7.0.0",
"@angular/platform-server": "7.0.0",
"@compodoc/compodoc": "1.1.5",
"@types/jasmine": "2.8.9",
"@types/node": "10.12.0",
"@compodoc/compodoc": "1.1.7",
"@types/jasmine": "3.3.5",
"@types/node": "10.12.18",
"angular2-template-loader": "0.6.2",
"chalk": "2.4.1",
"codelyzer": "4.5.0",
"core-js": "2.5.7",
"css-loader": "1.0.0",
"core-js": "2.6.1",
"css-loader": "2.1.0",
"istanbul-instrumenter-loader": "3.0.1",
"jasmine-core": "3.2.0",
"node-sass": "4.9.4",
"raw-loader": "0.5.1",
"jasmine-core": "3.3.0",
"node-sass": "4.11.0",
"raw-loader": "1.0.0",
"reflect-metadata": "0.1.12",
"rollup": "0.66.6",
"rollup": "1.0.1",
"rollup-plugin-license": "0.7.0",
"rollup-plugin-node-resolve": "3.4.0",
"rollup-plugin-node-resolve": "4.0.0",
"rollup-plugin-sourcemaps": "0.4.2",
"rxjs": "^6.3.3",
"sass-loader": "7.1.0",
"shelljs": "0.8.2",
"shelljs": "0.8.3",
"source-map-loader": "0.2.4",
"to-string-loader": "1.1.5",
"ts-loader": "5.2.2",
"ts-loader": "5.3.2",
"tsickle": "0.33.0",
"tslint": "5.11.0",
"tslint": "5.12.0",
"tslint-angular": "1.1.2",
"tslint-eslint-rules": "^5.4.0",
"typescript": "3.1.3",
"typescript": "3.1.6",
"uglify-js": "3.4.9",
"webpack": "4.21.0",
"webpack-filter-warnings-plugin": "1.2.0",
"webpack": "4.28.3",
"webpack-filter-warnings-plugin": "1.2.1",
"zone.js": "0.8.26"
},
"sideEffects": false
Expand Down
7 changes: 6 additions & 1 deletion playground/src/app/app.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,9 @@
<agm-map [latitude]="lat" [longitude]="lng">
<agm-direction [origin]="origin" [destination]="destination" [renderOptions]="renderOptions" (status)="getStatus($event)">
<agm-direction
[origin]="origin"
[destination]="destination"
[renderOptions]="renderOptions"
[markerOptions]="markerOptions"
>
</agm-direction>
</agm-map>
21 changes: 17 additions & 4 deletions playground/src/app/app.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,22 @@ export class AppComponent {
public origin: any = 'No. 1, Section 1, Taiwan Avenue, Central District, Taichung, Taiwan';
public destination: any = 'No. 1 Guanqian Road, North District, Taichung City';

public renderOptions: object = { polylineOptions: { strokeColor: '#f0f' } };
public renderOptions = {
suppressMarkers: true,
};

getStatus(status) {
console.log('status', status);
}
public markerOptions = {
origin: {
icon: 'https://i.imgur.com/7teZKif.png',
draggable: true,
},
destination: {
icon: 'https://i.imgur.com/7teZKif.png',
draggable: true,
infoWindow: `
<h4>Hello<h4>
<a href='http://www-e.ntust.edu.tw/home.php' target='_blank'>Taiwan Tech</a>
`
},
};
}
131 changes: 88 additions & 43 deletions src/directive/agm-direction.directive.ts
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
import { Directive, Input, Output, OnChanges, OnInit, EventEmitter } from '@angular/core';
import { Directive, Input, Output, OnChanges, OnInit, EventEmitter, OnDestroy } from '@angular/core';
import { GoogleMapsAPIWrapper } from '@agm/core';
import { InfoWindow, GoogleMap } from '@agm/core/services/google-maps-types';
import { InfoWindow, GoogleMap, Marker } from '@agm/core/services/google-maps-types';

declare var google: any;
@Directive({
selector: 'agm-direction',
})
export class AgmDirection implements OnChanges, OnInit {
export class AgmDirection implements OnChanges, OnInit, OnDestroy {

// LatLng | String | google.maps.Place
@Input() origin: any;
Expand Down Expand Up @@ -46,6 +46,10 @@ export class AgmDirection implements OnChanges, OnInit {
// Status of Directions Query (google.maps.DirectionsStatus.OVER_QUERY_LIMIT)
@Output() status: EventEmitter<string> = new EventEmitter<string>();

// Marker drag event handler
@Output() originDrag: EventEmitter<any> = new EventEmitter<any>();
@Output() destinationDrag: EventEmitter<any> = new EventEmitter<any>();

public directionsService: any = undefined;
public directionsDisplay: any = undefined;

Expand Down Expand Up @@ -73,14 +77,8 @@ export class AgmDirection implements OnChanges, OnInit {
*/
if (!this.visible) {
try {
if (typeof this.originMarker !== 'undefined') {
this.originMarker.setMap(null);
this.destinationMarker.setMap(null);
this.waypointsMarker.forEach((w: any) => w.setMap(null));
}
this.directionsDisplay.setPanel(null);
this.directionsDisplay.setMap(null);
this.directionsDisplay = undefined;
this.removeMarkers();
this.removeDirections();
} catch (e) { }
} else {
if (this.isFirstChange) {
Expand All @@ -99,26 +97,23 @@ export class AgmDirection implements OnChanges, OnInit {
*/
if (typeof obj.renderOptions !== 'undefined') {
if (obj.renderOptions.firstChange === false) {
if (typeof this.originMarker !== 'undefined') {
this.originMarker.setMap(null);
this.destinationMarker.setMap(null);
this.waypointsMarker.forEach((w: any) => w.setMap(null));
}
this.directionsDisplay.setPanel(null);
this.directionsDisplay.setMap(null);
this.directionsDisplay = undefined;
this.removeMarkers();
this.removeDirections();
}
}
this.directionDraw();
}
}

ngOnDestroy() {
this.destroyMarkers();
this.removeDirections();
}

/**
* This event is fired when the user creating or updating this direction
*/
private directionDraw() {

this.gmapsApi.getNativeMap().then((map: GoogleMap) => {

if (typeof this.directionsDisplay === 'undefined') {
Expand Down Expand Up @@ -176,30 +171,10 @@ export class AgmDirection implements OnChanges, OnInit {
* Emit The DirectionsResult Object
* https://developers.google.com/maps/documentation/javascript/directions?hl=en#DirectionsResults
*/

// Custom Markers
if (typeof this.markerOptions !== 'undefined') {

// Remove origin markers
try {
if (typeof this.originMarker !== 'undefined') {
google.maps.event.clearListeners(this.originMarker, 'click');
this.originMarker.setMap(null);
}
if (typeof this.destinationMarker !== 'undefined') {
google.maps.event.clearListeners(this.destinationMarker, 'click');
this.destinationMarker.setMap(null);
}
this.waypointsMarker.forEach((w: any) => {
if (typeof w !== 'undefined') {
google.maps.event.clearListeners(w, 'click');
w.setMap(null);
}
});

} catch (err) {
console.error('Can not reset custom marker.', err);
}
this.destroyMarkers();

// Set custom markers
const _route = response.routes[0].legs[0];
Expand All @@ -214,6 +189,14 @@ export class AgmDirection implements OnChanges, OnInit {
this.markerOptions.origin,
_route.start_address,
);

if (this.markerOptions.origin.draggable) {
this.originMarker.addListener('dragend', () => {
this.origin = this.originMarker.position;
this.directionDraw();
this.originDrag.emit(this.origin);
});
}
}
// Destination Marker
if (typeof this.markerOptions.destination !== 'undefined') {
Expand All @@ -225,6 +208,13 @@ export class AgmDirection implements OnChanges, OnInit {
this.markerOptions.destination,
_route.end_address,
);
if (this.markerOptions.destination.draggable) {
this.destinationMarker.addListener('dragend', () => {
this.destination = this.destinationMarker.position;
this.directionDraw();
this.destinationDrag.emit(this.destination);
});
}
}

// Waypoints Marker
Expand Down Expand Up @@ -260,13 +250,13 @@ export class AgmDirection implements OnChanges, OnInit {
console.error('MarkerOptions error.', err);
}
}

break;

default:
// console.warn(status);
break;
} // End switch

});
}
});
Expand All @@ -281,7 +271,7 @@ export class AgmDirection implements OnChanges, OnInit {
* @returns new marker
* @memberof AgmDirection
*/
private setMarker(map: GoogleMap, marker: any, markerOpts: any, content: string) {
private setMarker(map: GoogleMap, marker: any, markerOpts: any, content: string): Marker {
if (typeof this.infoWindow === 'undefined') {
this.infoWindow = new google.maps.InfoWindow({});
this.sendInfoWindow.emit(this.infoWindow);
Expand All @@ -295,4 +285,59 @@ export class AgmDirection implements OnChanges, OnInit {
return marker;
}

/**
* This event is fired when remove markers
*/
private removeMarkers(): void {
if (typeof this.originMarker !== 'undefined') {
this.originMarker.setMap(null);
}
if (typeof this.destinationMarker !== 'undefined') {
this.destinationMarker.setMap(null);
}
this.waypointsMarker.forEach((w: any) => {
if (typeof w !== 'undefined') {
w.setMap(null);
}
});
}

/**
* This event is fired when remove directions
*/
private removeDirections(): void {
this.directionsDisplay.setPanel(null);
this.directionsDisplay.setMap(null);
this.directionsDisplay = undefined;
}

/**
* This event is fired when destroy markers
*/
private destroyMarkers(): void {
// Remove origin markers
try {
if (typeof this.originMarker !== 'undefined') {
google.maps.event.clearListeners(this.originMarker, 'click');
if (this.markerOptions.origin.draggable) {
google.maps.event.clearListeners(this.originMarker, 'dragend');
}
}
if (typeof this.destinationMarker !== 'undefined') {
google.maps.event.clearListeners(this.destinationMarker, 'click');
if (this.markerOptions.origin.draggable) {
google.maps.event.clearListeners(this.destinationMarker, 'dragend');
}
}
this.waypointsMarker.forEach((w: any) => {
if (typeof w !== 'undefined') {
google.maps.event.clearListeners(w, 'click');
}
});
this.removeMarkers();

} catch (err) {
console.error('Can not reset custom marker.', err);
}
}
}
Loading

0 comments on commit 4a4c9ee

Please sign in to comment.