Merge branch 'master' into search_functionality

# Conflicts:
#	src/app/hirebike/hirebike.page.html

src/app/app-routing.module.ts

@@ -29,6 +29,10 @@ const routes: Routes = [
   {
     path: 'hirebike',
     loadChildren: () => import('./hirebike/hirebike.module').then( m => m.HirebikePageModule)
+  },
+  {
+    path: 'ridehistory',
+    loadChildren: () => import('./ridehistory/ridehistory.module').then( m => m.RidehistoryPageModule)
   }
 
   

src/app/app.component.ts

@@ -28,12 +28,16 @@ export class AppComponent {
       title: 'My Reservation',
       url: '/myreservation',
       icon: 'clipboard'
-    },
-    {
+    }, {
       title: 'My Rides',
       url: '/hirebike',
       icon: 'clipboard'
     },
+    {
+      title: 'Ride History',
+      url: '/ridehistory',
+      icon: 'clipboard'
+    },
     {
       title: 'Logout',
       url: '/login',

src/app/hirebike/hirebike.page.html

@@ -11,22 +11,28 @@
 
 <ion-content>
   <ion-searchbar [(ngModel)]="searchValue" (search)="searchValueChanged()"></ion-searchbar>
-  <div *ngIf="true">
+  <div *ngIf="isSearched">
     <ion-list>
       <ion-item *ngFor="let item of list_to_show; let i = index">
-        <ion-label (click)="click_item(i)">{{ item.label }}</ion-label>
+        <ion-label (click)="click_item(item)" [innerHTML]="item.address.city +', '+ item.address.district+', '+item.address.street"></ion-label>
       </ion-item>
     </ion-list>
   </div>
-  <div #mapElement style="width: 100%; height: 100%" id="mapContainer" *ngIf="!is3DChecked"></div>
-  <ion-fab class="get-position" vertical="bottom" horizontal="end" (click)="getCurrentPosition()" slot="fixed">
+  
+  <ion-card *ngIf="!isBikeReserved">
+    <ion-card-content>
+      No ride found
+    </ion-card-content>
+  </ion-card>
+  <div #mapElement style="width: 100%; height: 100%" id="mapContainer" *ngIf="isBikeReserved"></div>
+  <ion-fab *ngIf="isBikeReserved" class="get-position" vertical="bottom" horizontal="end" (click)="getCurrentPosition()" slot="fixed">
     <ion-fab-button>
       <ion-icon name="locate"></ion-icon>
     </ion-fab-button>
   </ion-fab>
 </ion-content>
 <ion-footer>
-  <div class="bike-details-container">
+  <div class="bike-details-container" *ngIf="isBikeReserved">
     <div class="inner">
       <div class="button-container">
 

src/app/hirebike/hirebike.page.ts

@@ -27,6 +27,8 @@ export class HirebikePage implements OnInit {
   isBikeHired = false;
   noReservation = true;
 
+  isBikeReserved = true;
+
   currentRoute: any;
   routeSummary: any;
   wayPointsInfo: any;
@@ -182,6 +184,7 @@ export class HirebikePage implements OnInit {
             this.bikeDetails = resp.data;
             this.noReservation = false;
             this.reverseGeocode(this.platform, this.bikeDetails.lat, this.bikeDetails.lon);
+            this.isBikeReserved = true;
 
             //pass reserved bike subject here map
             this.gotReservedBikeSubject.next(resp.data);
@@ -189,16 +192,23 @@ export class HirebikePage implements OnInit {
           }, (reservedBikeError) => {
             console.log(reservedBikeError);
             this.loadingService.hideLoader();
+            this.isBikeReserved = false;
           });
+        } else {
+          this.loadingService.hideLoader();
+          this.isBikeReserved = false;
         }
       }, (bikeDetailsError) => {
         console.log(bikeDetailsError);
         this.loadingService.hideLoader();
+        this.isBikeReserved = false;
       });
     });
   }
 
-  startTrip1() {
+  startTrip() {
+    this.isBikeHired = true;
+    this.startRideSubject.next('some value');
     this.loadingService.showLoader();
     this.storage.get('token').then((token) => {
       let url = 'http://193.196.52.237:8081/rent' + '?bikeId=' + this.bikeDetails.id;
@@ -218,7 +228,7 @@ export class HirebikePage implements OnInit {
 
   }
 
-  startTrip() {
+  startTrip1() {
     this.isBikeHired = true;
     this.startRideSubject.next('some value');
   }
@@ -546,9 +556,69 @@ export class HirebikePage implements OnInit {
     });
   }
 
+  // getLatLngFromLocationId() {
+
+  //   geocode(this.platform) {
+  //     var geocoder = this.platform.getGeocodingService(),
+  //       parameters = {
+  //         locationid: 'NT_Opil2LPZVRLZjlWNLJQuWB_0ITN',
+  //         gen: '8'
+  //       };
+
+  //     geocoder.geocode(parameters,
+  //       function (result) {
+  //         alert(result);
+  //       }, function (error) {
+  //         alert(error);
+  //       });
+  //   }
+  // }
+
+  click_item(item) {
+    console.log(item.locationId);
+    var geocoder = this.platform.getGeocodingService(),
+      parameters = {
+        locationid: item.locationId,
+        gen: '8'
+      };
+
+    geocoder.geocode(parameters,
+      (result) => {
+        this.isSearched = false;
+        let coord = {
+          lat : result.Response.View[0].Result[0].Location.DisplayPosition.Latitude,
+          lng : result.Response.View[0].Result[0].Location.DisplayPosition.Longitude
+        }
+        this.destinationPosition = { lat: coord.lat, lng: coord.lng };
+        console.log(result.Response.View[0].Result[0].Location.DisplayPosition);
+        if (this.destinationMarker) {
+          this.destinationMarker.setGeometry({ lat: coord.lat, lng: coord.lng })
+        } else {
+          let icon = new H.map.Icon('../../../assets/images/current_location.png');
+          // Create a marker using the previously instantiated icon:
+          this.destinationMarker = new H.map.Marker({ lat: coord.lat, lng: coord.lng }, { icon: icon });
+          // Add the marker to the map:
+          if (!this.locationsGroup) {
+            this.locationsGroup = new H.map.Group();
+          }
+          this.locationsGroup.addObjects([this.destinationMarker]);
+          this.setZoomLevelToPointersGroup();
+        }
+      }, function (error) {
+        console.log(error);
+      });
+  }
+
+
+
+
+
+
+
   AUTOCOMPLETION_URL = 'https://autocomplete.geocoder.api.here.com/6.2/suggest.json';
   ajaxRequest = new XMLHttpRequest();
   query = '';
+  isSearched = false;
 
   /**
    * If the text in the text box  has changed, and is not empty,
@@ -572,7 +642,7 @@ export class HirebikePage implements OnInit {
           '&beginHighlight=' + encodeURIComponent('<mark>') + //  Mark the beginning of the match in a token. 
           '&endHighlight=' + encodeURIComponent('</mark>') + //  Mark the end of the match in a token. 
           '&maxresults=5' +  // The upper limit the for number of suggestions to be included 
-          '&prox=' + this.currentUserPosition.lat +','+this.currentUserPosition.lng +',1000' +
+          '&prox=' + this.currentUserPosition.lat + ',' + this.currentUserPosition.lng + ',10000' +
           // in the response.  Default is set to 5.
           '&app_id=' + 'YSAnHxghC6xWxaZ7Wehn' +
           '&app_code=' + 'mQFi1FqoEypbfQDJjMENPg';
@@ -580,6 +650,7 @@ export class HirebikePage implements OnInit {
         bikeReservationStatusApi.subscribe((resp: any) => {
           console.log('Search Results', resp);
           this.list_to_show = resp.suggestions;
+          this.isSearched = true;
         }, (bikeDetailsError) => {
           console.log(bikeDetailsError);
         });
@@ -600,13 +671,13 @@ export class HirebikePage implements OnInit {
   }
 
   // Get an instance of the geocoding service:
- geocoder: any;
+  geocoder: any;
 
- onSearchResult(result) {
+  onSearchResult(result) {
     var locations = result.Response.View[0].Result,
-        position,
-        marker;
-    
+      position,
+      marker;
+
     console.log(result);
     // Add a marker for each location found
     // for (let i = 0;  i < locations.length; i++) {
@@ -617,5 +688,5 @@ export class HirebikePage implements OnInit {
     //   marker = new H.map.Marker(position);
     //   this.map.addObject(marker);
     // }
- }
+  }
 }

src/app/home/home.page.ts

@@ -160,7 +160,8 @@ export class HomePage implements OnInit, OnDestroy {
         this.showBikesOnMap();
         this.loadingService.hideLoader();
       }, (error) => {console.log(error)
-        this.loadingService.hideLoader();});
+        this.loadingService.hideLoader();
+      });
     });
   }
 

src/app/myreservation/myreservation.page.html

@@ -16,7 +16,7 @@
     </ion-card-content>
   </ion-card>
   <div #mapElement style="width: 100%; height: 100%" id="mapContainer" *ngIf="isBikeReserved"></div>
-  <ion-fab class="get-position" vertical="bottom" horizontal="end" (click)="getCurrentPosition()" slot="fixed">
+  <ion-fab *ngIf="isBikeReserved" class="get-position" vertical="bottom" horizontal="end" (click)="getCurrentPosition()" slot="fixed">
     <ion-fab-button>
       <ion-icon name="locate"></ion-icon>
     </ion-fab-button>

src/app/myreservation/myreservation.page.ts

@@ -167,6 +167,9 @@ export class MyreservationPage implements OnInit {
             console.log(reservedBikeError);
             this.isBikeReserved = false;
           });
+        } else {
+          this.loadingService.hideLoader();
+          this.isBikeReserved = false;
         }
       }, (bikeDetailsError) => {
         this.loadingService.hideLoader();

src/app/ridehistory/ridehistory-routing.module.ts

+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { RidehistoryPage } from './ridehistory.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: RidehistoryPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class RidehistoryPageRoutingModule {}

src/app/ridehistory/ridehistory.module.ts

+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { RidehistoryPageRoutingModule } from './ridehistory-routing.module';
+
+import { RidehistoryPage } from './ridehistory.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    RidehistoryPageRoutingModule
+  ],
+  declarations: [RidehistoryPage]
+})
+export class RidehistoryPageModule {}

src/app/ridehistory/ridehistory.page.html

+<ion-header>
+    <ion-toolbar>
+      <ion-buttons slot="start">
+        <ion-menu-button></ion-menu-button>
+      </ion-buttons>
+      <ion-title slot="start">
+        Ride History
+      </ion-title>
+    
+    </ion-toolbar>
+  </ion-header>
+<ion-content>
+  <div class="ride-list-container" >
+      <div class="ride-container" *ngFor="let ride of rides">
+    <ion-grid>
+      <ion-row  >
+        <ion-col>
+          Bike ID
+
+        </ion-col>
+        <ion-col>
+          {{ride.bikeId}}
+        </ion-col>
+
+      </ion-row>
+      <ion-row>
+          <ion-col>
+           Price
+  
+          </ion-col>
+          <ion-col>
+            {{ride.price}}
+          </ion-col>
+          
+        </ion-row>
+        <ion-row>
+            <ion-col>
+           Distance
+    
+            </ion-col>
+            <ion-col>
+              {{ride.distance}}
+            </ion-col>
+            
+          </ion-row>
+          <ion-row>
+              <ion-col>
+                Start-Date
+      
+              </ion-col>
+              <ion-col>
+                {{ride.startDate}}
+              </ion-col>
+              
+            </ion-row>
+            <ion-row>
+                <ion-col>
+                 End-Date
+        
+                </ion-col>
+                <ion-col>
+                  {{ride.endDate}}
+                </ion-col>
+                
+              </ion-row>
+    </ion-grid>
+    </div>
+  </div>
+
+
+
+</ion-content>
\ No newline at end of file

src/app/ridehistory/ridehistory.page.scss

+.ride-list-container{
+    position: relative;
+  
+    .bike-list-expander{
+      position: absolute;
+      font-size: 32px;
+      color: gray;
+      z-index: 200;
+      left: 46%;
+      top: -32px;
+    }
+  }
+  .ride-container{
+    height: 191px;
+    width: 100%;
+    border: 1px solid #aaaaaa;
+    border-radius: 5px;
+    box-sizing: border-box;
+    float: left;
+      width: 100%;
+      clear: both;
+  
+    div {
+      height: inherit;
+      float: left;
+    }
+  }
+  
\ No newline at end of file

src/app/ridehistory/ridehistory.page.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { RidehistoryPage } from './ridehistory.page';
+
+describe('RidehistoryPage', () => {
+  let component: RidehistoryPage;
+  let fixture: ComponentFixture<RidehistoryPage>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ RidehistoryPage ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(RidehistoryPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/ridehistory/ridehistory.page.ts

+import { Component, OnInit } from '@angular/core';
+import { HttpHeaders, HttpClient } from '@angular/common/http';
+import { Observable } from 'rxjs';
+import { Storage } from '@ionic/storage';
+import { Router } from '@angular/router';
+import { RestService } from '../rest.service';
+import { ToastService } from '../services/toast.service';
+@Component({
+  selector: 'app-ridehistory',
+  templateUrl: './ridehistory.page.html',
+  styleUrls: ['./ridehistory.page.scss'],
+})
+export class RidehistoryPage implements OnInit {
+  rides = [];
+  rideApi: Observable<any>;
+  isRideActive=false;
+  constructor(
+    private router: Router,
+    public restService: RestService,
+    public httpClient: HttpClient,
+    private storage: Storage,
+    private toastService: ToastService
+  ) { }
+
+  ngOnInit() {
+    this.showrideHistory();
+  }
+  showrideHistory() {
+    
+
+      this.storage.get('token').then((token) => {
+        let url = 'http://193.196.52.237:8081/rent-history'
+        const headers = new HttpHeaders().set("Authorization", "Bearer " + token);
+        this.rideApi = this.httpClient.get(url, { headers });
+        this.rideApi.subscribe((resp) => {
+          console.log("rides response", resp);
+          this.rides = resp.data;
+          for (let i = 0; i < this.rides.length; i++) {
+            this.rides[i] = this.rides[i];
+            if(this.rides[i].active)
+            this.isRideActive=true;
+        }
+      });
+    }, er => {
+      //alert('Can not retrieve location');
+    }).catch((error) => {
+      //alert('Error getting location - ' + JSON.stringify(error));
+    });
+  }
+
+}