Merge pull request #47 from Pear-Trading/finn/trailchoicechange
Changed from dropdown to modal
This commit is contained in:
commit
7e69c111e7
4 changed files with 40 additions and 5 deletions
|
@ -2,6 +2,8 @@
|
|||
|
||||
# Next Release
|
||||
|
||||
* Changed Story Trail choosing to modals
|
||||
|
||||
# v0.0.7
|
||||
|
||||
* Added ESTA to Story Trail
|
||||
|
|
|
@ -4,11 +4,39 @@
|
|||
<div class="card">
|
||||
<div class="card-header">
|
||||
<strong>Story Trail</strong>
|
||||
<small>Click a marker to get location details.</small>
|
||||
<select type="text" [(ngModel)]="assocMap" (ngModelChange)="viewBoundsChanged()">
|
||||
<option value="lis" selected>Lancaster Independent Story</option>
|
||||
<option value="esta">ESTA</option>
|
||||
</select>
|
||||
<div class="row">
|
||||
|
||||
<div class="col-12 col-sm-6 mb-3">
|
||||
<small>Select a Story Trail to see all the businesses in that story on the map.<br>
|
||||
Click an icon on the map to get more information.</small>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6 order-12">
|
||||
<button type="button" class="btn btn-outline-info btn-lg float-right" (click)="openModalAssoc(templateAssoc)">Select Story Trail</button>
|
||||
</div>
|
||||
</div>
|
||||
<ng-template #templateAssoc>
|
||||
<div class="modal-header">
|
||||
<h4 class="modal-title pull-left">Select View</h4>
|
||||
<button type="button" class="close pull-right" aria-label="Close" (click)="modalRef2.hide()">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="row">
|
||||
<div class="col-12 col-sm-6 text-center">
|
||||
<img src="assets/img/association/lis-logo.png" class="w-50" alt="lis logo"><br>
|
||||
<button type="button" class="btn btn-success mt-3" (click)="modalRef2.hide(); assocMap = 'lis'">Lancaster Independent Story</button>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6 text-center">
|
||||
<img src="assets/img/association/esta-logo.png" class="w-50" alt="lis logo"><br>
|
||||
<button type="button" class="btn btn-success mt-3" (click)="modalRef2.hide(); assocMap = 'esta'">ESTA Association</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-danger" (click)="modalRef2.hide()">Close</button>
|
||||
</div>
|
||||
</ng-template>
|
||||
</div>
|
||||
<div class="modal fade" bsModal #statusModal="bs-modal" [config]="{backdrop: false, animated: false}"
|
||||
tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
|
||||
|
|
|
@ -14,6 +14,7 @@ export class TrailMapComponent implements OnInit, AfterViewInit {
|
|||
lng: number = -2.8007;
|
||||
zoom: number = 12;
|
||||
public modalRef: BsModalRef;
|
||||
public modalRef2: BsModalRef;
|
||||
clickedMarker: any;
|
||||
assocMap = 'lis';
|
||||
assocLogo: string;
|
||||
|
@ -45,6 +46,10 @@ export class TrailMapComponent implements OnInit, AfterViewInit {
|
|||
this.modalRef = this.modalService.show(template);
|
||||
}
|
||||
|
||||
openModalAssoc(templateAssoc: TemplateRef<any>) {
|
||||
this.modalRef2 = this.modalService.show(templateAssoc);
|
||||
}
|
||||
|
||||
public onMarkerClick(clickedMarker, template: TemplateRef<any>) {
|
||||
console.log(clickedMarker);
|
||||
this.clickedMarker = clickedMarker;
|
||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 19 KiB |
Reference in a new issue