Commit 65072452 authored by Ratnadeep Rajendra Kharade's avatar Ratnadeep Rajendra Kharade
Browse files

Merge branch '66-highlight-selected-route-from-list-of-different-routes' into 'master'

Resolve "Highlight selected route from list of different routes"

Closes #66

See merge request 92khra1mst/hft_awado_app!54
parents ef48e15a 81349089
......@@ -79,7 +79,7 @@
<div class="routes-list-wrapper">
<div class="routes-list-inner">
<div class="route-option-wrapper" *ngFor="let route of routeList | keyvalue; let i = index">
<div class="route-option-inner" (click)="selectRoute(route.value.route, i)">
<div class="route-option-inner" [ngClass]="{'selected': route.value.selected}" (click)="selectRoute(route.value.route, i)">
<div class="route-heading">{{getRouteType(route.value.mode)}}:</div>
<div class="route-summary">{{route.value.summary}}</div>
<div class="route-prediction"></div>
......
......@@ -18,13 +18,22 @@
color: #444444;
.route-option-wrapper{
padding: 8px;
border-bottom: 1px solid #ddd;
font-size: 14px;
.route-heading{
font-weight: 500;
margin-bottom: 5px;
.route-option-inner{
padding: 8px;
border-bottom: 1px solid #ddd;
font-size: 14px;
&.selected{
background-color: rgba(102, 157, 246, 1);
color: white;
font-weight: 500!important;
}
.route-heading{
font-weight: 500;
margin-bottom: 5px;
}
}
}
}
......
......@@ -210,6 +210,7 @@ export class HirebikePage implements OnInit {
}
gotRouteOptions = false;
routesResponse = {};
getRouteOptions() {
var waypoint0 = this.bikePosition.lat + ',' + this.bikePosition.lng;
......@@ -219,11 +220,17 @@ export class HirebikePage implements OnInit {
let url = 'http://193.196.52.237:8081/routing?startlng='+ this.bikePosition.lng + '&startlat=' + this.bikePosition.lat + '&destinationlng='+ this.destinationPosition.lng + '&destinationlat=' + this.destinationPosition.lat;
const headers = new HttpHeaders().set("Authorization", "Bearer " + token);
let bikeApi = this.httpClient.get(url, { headers });
bikeApi.subscribe((resp) => {
bikeApi.subscribe((resp:any) => {
console.log('my data: ', resp);
this.loadingService.hideLoader();
this.isBikeHired = true;
this.displayRouteOptions(resp);
this.routesResponse = resp;
this.displayRouteOptions(resp, 0);
this.displayRouteSummaryAtTop(resp);
this.isRouteSelected = true;
let firstRouteResp = JSON.parse(resp.data.routes[0].route);
let firstRoute = firstRouteResp.response.route[0];
this.selectedRoute = firstRoute;
this.gotRouteOptions = true;
}, (error) => {
console.log(error);
......@@ -262,15 +269,22 @@ export class HirebikePage implements OnInit {
// }
}
displayRouteOptions(resp){
for (let i = 0; i < resp.data.routes.length; i++) {
displayRouteOptions(resp, selectedRouteIndex){
for (let i = resp.data.routes.length - 1; i >= 0 ; i--) {
let routeResp = JSON.parse(resp.data.routes[i].route);
let route = routeResp.response.route[0];
//console.log(route);
this.setRouteOptions(route, i, resp.data.routes[i].mode);
this.drawRouteLine(route, i);
this.setRouteOptions(route, i, resp.data.routes[i].mode, selectedRouteIndex);
if(i !== selectedRouteIndex) {
this.drawRouteLine(route, i);
}
}
let routeResp = JSON.parse(resp.data.routes[selectedRouteIndex].route);
let route = routeResp.response.route[0];
this.drawRouteLine(route, selectedRouteIndex, 'rgba(102, 157, 246, 0.9)');
}
displayRouteSummaryAtTop(resp){
let firstRoute = JSON.parse(resp.data.routes[0].route).response.route[0];
console.log(firstRoute);
let waypointLabels = [];
......@@ -282,12 +296,16 @@ export class HirebikePage implements OnInit {
routeList = {};
setRouteOptions(route, index, mode) {
setRouteOptions(route, index, mode, selectedRouteIndex) {
let content = '';
let selected = false;
content += 'Total distance: ' + route.summary.distance + 'm. ';
content += 'Travel Time: ' + Math.floor(route.summary.travelTime / 60) + ' min';
console.log(content);
this.routeList[index] = {route:route, summary:content, mode:mode};
if(index === selectedRouteIndex) {
selected = true;
}
this.routeList[index] = {route:route, summary:content, mode:mode, selected: selected};
}
isRouteSelected = false;
......@@ -295,10 +313,24 @@ export class HirebikePage implements OnInit {
selectRoute(route, index) {
let routeLine = this.routeLines[index];
this.map.removeObject(routeLine);
this.drawRouteLine(route, index, 'rgba(102, 157, 246, 0.9)');
//this.map.removeObject(routeLine);
this.removeRouteLines();
// for(let i=0; i<this.routesResponseArr.length; i++) {
// if(index !== i) {
// let routeResp = JSON.parse(this.routesResponseArr[i].route);
// let route = routeResp.response.route[0];
// this.drawRouteLine(route, index);
// }
// }
// if(this.oldIndex) {
// this.map.removeObject(this.routeLines[this.oldIndex]);
// this.map.removeObject(this.routeLines[index]);
// }
//this.drawRouteLine(route, index, 'rgba(102, 157, 246, 0.9)');
this.isRouteSelected = true;
this.selectedRoute = route;
this.routeLines = {};
this.displayRouteOptions(this.routesResponse, index)
}
routeLines = {};
......@@ -324,6 +356,12 @@ export class HirebikePage implements OnInit {
this.map.addObject(polyline);
}
removeRouteLines(){
for(let key in this.routeLines) {
this.map.removeObject(this.routeLines[key]);
}
}
getRouteType(mode){
if (mode === "NORMAL") {
return "Fastest Route";
......@@ -742,4 +780,13 @@ export class HirebikePage implements OnInit {
alert(error);
});
}
ionViewDidLeave(){
if(this.mapElement) {
this.mapElement.nativeElement.remove();
}
// if(this.locationService.liveLocationSubject) {
// this.locationService.liveLocationSubject.unsubscribe();
// }
}
}
......@@ -289,4 +289,13 @@ export class HomePage implements OnInit, OnDestroy {
//this.locationService.liveLocationSubject.unsubscribe();
}
ionViewDidLeave(){
if(this.mapElement) {
this.mapElement.nativeElement.remove();
}
// if(this.locationService.liveLocationSubject) {
// this.locationService.liveLocationSubject.unsubscribe();
// }
}
}
......@@ -346,4 +346,13 @@ export class MyreservationPage implements OnInit {
else
this.router.navigateByUrl('/hirebike');
}
ionViewDidLeave(){
if(this.mapElement) {
this.mapElement.nativeElement.remove();
}
// if(this.locationService.liveLocationSubject) {
// this.locationService.liveLocationSubject.unsubscribe();
// }
}
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment