diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 4723981d5aeef4f7783865519c428124f403c1ee..bbe16becd17b705cacd56b60fa9b75a481a2b399 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -12,6 +12,8 @@ import { Geolocation } from '@ionic-native/geolocation/ngx'; import { HttpClientModule } from '@angular/common/http'; +import { RestService } from './rest.service'; + @NgModule({ declarations: [AppComponent], entryComponents: [], @@ -25,6 +27,7 @@ import { HttpClientModule } from '@angular/common/http'; Geolocation, StatusBar, SplashScreen, + RestService, { provide: RouteReuseStrategy, useClass: IonicRouteStrategy } ], bootstrap: [AppComponent] diff --git a/src/app/auth/login/login.page.ts b/src/app/auth/login/login.page.ts index 57284beeac3c198f1199406f99500e7314f199fc..130a489100e569a90e2ee16c0068141cf9479c86 100644 --- a/src/app/auth/login/login.page.ts +++ b/src/app/auth/login/login.page.ts @@ -4,6 +4,8 @@ import { Router } from '@angular/router'; import { Observable } from 'rxjs'; import { HttpClient } from '@angular/common/http'; +import { RestService } from '../../rest.service'; + @Component({ selector: 'app-login', templateUrl: './login.page.html', @@ -15,7 +17,7 @@ export class LoginPage implements OnInit { correctCredentials = false; loginApi: Observable<any>; - constructor(private router: Router, public httpClient: HttpClient) { + constructor(private router: Router, public httpClient: HttpClient, public restService: RestService) { } @@ -35,6 +37,7 @@ export class LoginPage implements OnInit { this.loginApi .subscribe((data) => { console.log('my data: ', data); + this.restService.setToken(data.token); this.router.navigateByUrl('/home'); }, (error) => { console.log(error); diff --git a/src/app/home/home.page.html b/src/app/home/home.page.html index b5ef913a8a1596199ac205969bbc08d89a17208b..1f9fafd8a9d15d9e251c18fc17a98b295532dc26 100644 --- a/src/app/home/home.page.html +++ b/src/app/home/home.page.html @@ -21,17 +21,17 @@ <ion-footer> <div class="bike-list-container"> <ion-icon class="bike-list-expander" name="arrow-dropup-circle" (click)="expandBikeList()"></ion-icon> - <div class="bike-container" *ngFor="let i of tempArr"> + <div class="bike-container" *ngFor="let bike of bikes"> <div class="bike-name"> - Bike 1 + {{bike.name}} </div> <div class="battery-info"> <div><ion-icon class="battery-icon" name="battery-charging"></ion-icon></div> - <div>100%</div> + <div>{{bike.batteryPercentage + " %"}}</div> </div> <div class="address-info"> - <div class="disance">56m</div> - <div class="address">Schllingstrasse 129</div> + <div class="disance">{{bike.distance + "m"}}</div> + <div class="address">{{bike.address}}</div> </div> </div> </div> diff --git a/src/app/home/home.page.ts b/src/app/home/home.page.ts index 0f2722c6aa24c53ef3ee86ea30f67957d5a1a8d2..d9111a77ceb1841fbf11abc4bac469749b3b5907 100644 --- a/src/app/home/home.page.ts +++ b/src/app/home/home.page.ts @@ -1,5 +1,10 @@ import { Component, OnInit, ViewChild, ElementRef } from '@angular/core'; import { Geolocation } from '@ionic-native/geolocation/ngx'; +import { RestService } from '../rest.service'; +import { Observable } from 'rxjs'; +import { HttpClient, HttpHeaders } from '@angular/common/http'; + + declare var H: any; @Component({ selector: 'app-home', @@ -9,6 +14,9 @@ declare var H: any; export class HomePage { private platform: any; private map: any; + bikes = []; + bikeApi: Observable<any>; + private currentLocation = { lat: 0, lng: 0 }; public is3DChecked = false; @@ -29,15 +37,20 @@ export class HomePage { //@ViewChild("mapElement", { static: false }) //public mapElement: ElementRef; - public constructor(private geolocation: Geolocation) { + constructor(private geolocation: Geolocation, + public restService: RestService, + public httpClient: HttpClient) { + this.platform = new H.service.Platform({ 'apikey': 'tiVTgBnPbgV1spie5U2MSy-obhD9r2sGiOCbBzFY2_k' }); } - public ngOnInit() { } + ngOnInit() { + this.getBikesList(); + } - public ngAfterViewInit() { + ngAfterViewInit() { setTimeout(() => { this.loadmap("2D"); }, 1000); @@ -45,6 +58,30 @@ export class HomePage { window.addEventListener('resize', () => this.map.getViewPort().resize()); } + getBikesList() { + this.geolocation.getCurrentPosition( + { + maximumAge: 1000, timeout: 5000, + enableHighAccuracy: true + } + ).then((resp) => { + this.currentLocation.lat = resp.coords.latitude; + this.currentLocation.lng = resp.coords.longitude; + let url = 'http://193.196.52.237:8081/admin/bikes' + '?lat=' + this.currentLocation.lat + '&lng=' + this.currentLocation.lng; + const headers = new HttpHeaders().set("Authorization", "Bearer " + this.restService.getToken()); + this.bikeApi = this.httpClient.get(url, {headers}); + this.bikeApi + .subscribe((resp) => { + console.log('my data: ', resp); + this.bikes = resp.data; + }, (error) => console.log(error)); + }, er => { + alert('Can not retrieve Location') + }).catch((error) => { + alert('Error getting location - ' + JSON.stringify(error)) + }); + } + loadmap(style) { // Obtain the default map types from the platform object var mapStyle = "raster"; @@ -91,8 +128,8 @@ export class HomePage { mapSettings.setAlignment('top-right'); zoom.setAlignment('left-top'); - if(style === "3D") { - this.map.getViewModel().setLookAtData({tilt: 60}); + if (style === "3D") { + this.map.getViewModel().setLookAtData({ tilt: 60 }); } this.getLocation(this.map); var img = ['../../../assets/images/ic_high.png', '../../../assets/images/ic_medium.png', '../../../assets/images/ic_low.png']; diff --git a/src/app/rest.service.spec.ts b/src/app/rest.service.spec.ts new file mode 100644 index 0000000000000000000000000000000000000000..5d2ff3c1bba160a56083f905f65c2b5d540d3528 --- /dev/null +++ b/src/app/rest.service.spec.ts @@ -0,0 +1,12 @@ +import { TestBed } from '@angular/core/testing'; + +import { RestService } from './rest.service'; + +describe('RestService', () => { + beforeEach(() => TestBed.configureTestingModule({})); + + it('should be created', () => { + const service: RestService = TestBed.get(RestService); + expect(service).toBeTruthy(); + }); +}); diff --git a/src/app/rest.service.ts b/src/app/rest.service.ts new file mode 100644 index 0000000000000000000000000000000000000000..1110494c33fca62ae1da790eb6fa7390317e0124 --- /dev/null +++ b/src/app/rest.service.ts @@ -0,0 +1,19 @@ +import { Injectable } from '@angular/core'; + +@Injectable({ + providedIn: 'root' +}) +export class RestService { + + token: String; + + constructor() { } + + setToken(token) { + this.token = token; + } + + getToken() { + return this.token; + } +}