snazzy info added, logo added

src/app/dashboard/dashboard.module.ts

@@ -6,6 +6,7 @@ import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
 import { NgxPaginationModule } from 'ngx-pagination';
 import { AgmCoreModule, GoogleMapsAPIWrapper } from '@agm/core';
 import { AgmJsMarkerClustererModule } from '@agm/js-marker-clusterer';
+import { AgmSnazzyInfoWindowModule } from '@agm/snazzy-info-window';
 
 import { CurrencyPipe } from '@angular/common';
 
@@ -45,6 +46,7 @@ import { environment } from '../../environments/environment';
       apiKey: environment.mapApiKey
     }),
     AgmJsMarkerClustererModule,
+    AgmSnazzyInfoWindowModule,
     BsDropdownModule,
     NgxPaginationModule,
     DashboardRoutingModule,

src/app/dashboard/trail-map.component.html

@@ -25,13 +25,17 @@
               <agm-marker-cluster maxZoom="13" imagePath="https://raw.githubusercontent.com/googlemaps/v3-utility-library/master/markerclustererplus/images/m">
                 <agm-marker
                     *ngFor="let m of markers"
+                    [iconUrl]="'/assets/img/map-pin-lis.png'"
                     [latitude]="m.latitude"
-                    [longitude]="m.longitude"
-                    [label]="m.name[0]">
-
-                  <agm-info-window>
-                    <strong>{{m.name}}</strong>
-                  </agm-info-window>
+                    [longitude]="m.longitude">
+                  <agm-snazzy-info-window
+                  [maxWidth]="500"
+                  [closeWhenOthersOpen]="true">
+                    <ng-template>
+                      <h4><strong>{{m.name}}</strong></h4>
+                      <img src="assets/img/avatars/default.png" class="img-avatar" alt="avatar-image">
+                    </ng-template>
+                  </agm-snazzy-info-window>
                 </agm-marker>
               </agm-marker-cluster>
             </agm-map>

src/app/dashboard/trail-map.component.ts

@@ -5,7 +5,7 @@ import { AgmCoreModule } from '@agm/core';
 import 'rxjs/add/operator/map';
 
 @Component({
-  templateUrl: 'map.component.html',
+  templateUrl: 'trail-map.component.html',
 })
 export class TrailMapComponent implements OnInit {