Skip to content

C
Callmycab-Userapp
Commit ec14c3b7 by Alen Jose
Options

Merge branch 'alen' into 'master'

ridenow map See merge request alen/CMC_revamp!8
parents 3870b18c f48319b3
Showing with 210 additions and 40 deletions
src/pages/confirmride/confirmride.ts
......@@ -27,7 +27,7 @@ export class ConfirmridePage {
this.book = this.data.getbookingData()
console.log(this.book)
var bdata = { 'book_date': this.book.date, 'drop_area': this.book.dropArea, 'pickup_area': this.book.pickArea, 'taxi_type': this.book.carDetails.car_type, 'amount': '', 'km': '', 'promocode': this.book.promocode, 'token': this.local.token, 'userid': this.local.id, 'type': 'later' }
var bdata = { 'book_date': this.book.date, 'drop_area': this.book.dropArea, 'pickup_area': this.book.pickArea, 'taxi_type': this.book.carDetails.car_type, 'amount': '', 'km': '', 'promocode': this.book.promocode, 'token': this.local.token, 'userid': this.local.id, 'type': 'later', 'drivers': [] }
this.myservice.load_post(bdata, 'book_cab').subscribe(response => {
this.myservice.hide_loader()
......
src/pages/home/home.ts
......@@ -30,6 +30,7 @@ export class HomePage {
locForm: FormGroup
geocoder: any;
local:user
directionsDisplay:any;
constructor(public navCtrl: NavController, public navParams: NavParams, public modalCtrl: ModalController, public storage: Storage, private geolocation: Geolocation, private firebase: fireService, private db: AngularFireDatabase, private formBuilder: FormBuilder, private data: dataService, private myservice:Myservice) {
......@@ -40,9 +41,6 @@ export class HomePage {
}
ionViewDidEnter() {
this.myservice.load_post({},'test').subscribe(response=>{
})
this.data.setbookingData('')
this.storage.get('user_data').then(data=>{
......@@ -109,7 +107,6 @@ export class HomePage {
this.markers[0].setMap(null);
}
var place = autocomplete.getPlace();
console.log(place)
var lat = place.geometry.location.lat();
var lng = place.geometry.location.lng();
......@@ -126,25 +123,27 @@ export class HomePage {
if (type == 0) {
this.p_lat = lat
this.p_lng = lng
this.markers[1] = marker
this.locForm.controls['pickLoc'].setValue(place.name)
}
else if (type == 1) {
this.d_lat = lat
this.d_lng = lng
this.markers[2] = marker
this.locForm.controls['dropLoc'].setValue(place.name)
}
if (this.p_lat && this.d_lat) {
var directionsService = new google.maps.DirectionsService;
var directionsDisplay = new google.maps.DirectionsRenderer;
directionsDisplay.setMap(this.map);
this.directionsDisplay.setMap(this.map);
var start = new google.maps.LatLng(this.p_lat, this.p_lng);
var dest = new google.maps.LatLng(this.d_lat, this.d_lng);
this.calculateAndDisplayRoute(directionsService, directionsDisplay, start, dest);
this.calculateAndDisplayRoute(directionsService, this.directionsDisplay, start, dest);
}
else{
this.loadMap(lat,lng)
......@@ -167,14 +166,17 @@ export class HomePage {
this.markers.push(marker)
this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions);
marker.setMap(this.map);
for (var i = 0; i < this.driverMarkers.length; i++) {
this.driverMarkers[i].setMap(this.map);
}
this.directionsDisplay = new google.maps.DirectionsRenderer
}
calculateAndDisplayRoute(directionsService, directionsDisplay, start, dest) {
console.log(this.markers)
for (var i = 0; i < this.markers.length; i++) {
if (this.markers[i])
this.markers[i].setMap(null);
......
src/pages/map/map.html
<ion-header class="jr_theme_color jr_header">
<button ion-button class="jr_left jr_header_btn jr_back_icon" (click)="goBack()"></button>
<!-- <button ion-button class="jr_left jr_header_btn jr_back_icon" (click)="goBack()"></button> -->
<div class="jr_header_title">
<h4>Map</h4>
</div>
......@@ -9,16 +9,16 @@
<ion-content>
<div #map id="map"></div>
<div class="jr_bottom_distance_card">
<!-- <div class="jr_bottom_distance_card">
<div class="jr_bottom_inside">
<input class="jr_dest_input from" placeholder="HSR Layout, Kormangala,Bengalure">
<input class="jr_dest_input from" placeholder="HSR Layout, Kormangala,Bengalure" [(ngModel)]="bookData.">
<input class="jr_dest_input to" placeholder="Jalihalli, Outercity, Bengaluru">
</div>
</div>
</div> -->
</ion-content>
<ion-footer>
<div class="jr_bottom_button_bay">
<button ion-button class="jr_offer_ride2">Cancel</button>
<button ion-button class="jr_offer_ride2" (click)="cancel()">Cancel</button>
</div>
</ion-footer>
src/pages/map/map.ts
import { Component, ViewChild, ElementRef } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { dataService } from "../../providers/common.service";
import * as firebase from 'firebase';
import { Geolocation } from '@ionic-native/geolocation';
declare var google;
@IonicPage()
@Component({
......@@ -9,16 +13,51 @@ declare var google;
export class MapPage {
@ViewChild('map') mapElement: ElementRef;
map: any;
constructor(public navCtrl: NavController, public navParams: NavParams) {
directionsDisplay: any;
bookData:any;
constructor(public navCtrl: NavController, public navParams: NavParams, private data: dataService, private geolocation: Geolocation) {
}
ionViewWillEnter(){
this.geolocation.getCurrentPosition().then((resp) => {
this.loadMap(resp.coords.latitude, resp.coords.longitude);
}).catch((error) => {
console.log('Error getting location', error);
});
}
ionViewDidLoad() {
this.loadMap();
ionViewDidEnter(){
var driver = this.data.getdriverData();
this.bookData = this.data.getbookingData();
console.log(this.bookData)
var This = this;
firebase.database().ref().child('/drivers/').orderByChild("id").equalTo(Number(driver.driverId)).on("value", function (snapshot) {
var res_arr = (<any>Object).entries(snapshot.val()).map(e => Object.assign(e[1], { key: e[0] }));
console.log(res_arr[0])
var directionsService = new google.maps.DirectionsService;
This.directionsDisplay.setMap(This.map);
var pickLoc = new google.maps.LatLng(This.bookData.pickLat, This.bookData.pickLng);
var driverLoc = new google.maps.LatLng(res_arr[0].lat, res_arr[0].lng);
// if (google.maps.geometry.spherical.computeDistanceBetween(driverLoc, pickLoc) < 50) {
// }
This.calculateAndDisplayRoute(directionsService, This.directionsDisplay, pickLoc, driverLoc);
});
}
loadMap(){
// ionViewDidLoad() {
// this.loadMap();
// }
loadMap(lat,lng){
let latLng = new google.maps.LatLng(-34.9290, 138.6010);
let latLng = new google.maps.LatLng(lat, lng);
let mapOptions = {
center: latLng,
......@@ -27,7 +66,32 @@ export class MapPage {
}
this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions);
this.directionsDisplay = new google.maps.DirectionsRenderer({
map: this.map,
preserveViewport: true
});
}
calculateAndDisplayRoute(directionsService, directionsDisplay, start, dest) {
var This = this
directionsService.route({
origin: start,
destination: dest,
travelMode: 'DRIVING'
}, function (response, status) {
if (status === 'OK') {
directionsDisplay.setDirections(response);
var bounds = response.routes[0].bounds;
This.map.fitBounds(bounds);
This.map.setCenter(bounds.getCenter());
} else {
window.alert('Directions request failed due to ' + status);
}
});
}
cancel(){
this.navCtrl.pop();
}
}
src/pages/ridedetail/ridedetail.html
......@@ -39,19 +39,21 @@
<!-- <div class="jr_search_bottom_bay jr_padding0">
<div class="loader"></div>
</div> -->
<!-- <div class="jr_search_bottom_bay jr_padding0">
<span *ngIf="driver">
<div class="jr_search_bottom_bay jr_padding0">
<div class="jr_search_profile">
<img src="assets/img/e_img14.png">
<img [src]=driver.image>
</div>
<div class="jr_search_profile_detail">
<br>
<h6>MARIA LORENZA&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;37 Y/O</h6>
<span class="jr_star_ratting"><img src="assets/img/jr_star.png"><strong>3/5</strong>1 Rattings</span><br>
<h6>{{driver.name}}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{driver.age}} Y/O</h6>
<span class="jr_star_ratting"><img src="assets/img/jr_star.png"><strong>{{driver.rating}}/5</strong>{{driver.ratingCount}} Ratings</span><br>
</div>
<div class="jr_clear"></div>
</div>
<br>
<hr>
</span>
<!-- <hr>
<div class="jr_car_info">
<div class="">
<ion-grid class="jr_padding0">
......@@ -86,8 +88,9 @@
</div>
<div class="jr_clear"></div>
</div> -->
<div class="jr_bottom_button_bay">
<button ion-button class="jr_offer_ride2">Track Driver</button>
<button ion-button class="jr_offer_ride2" (click)="track()">Track Driver</button>
</div>
</div>
......
src/pages/ridedetail/ridedetail.ts
import { Component, NgZone } from '@angular/core';
import { IonicPage, NavController, NavParams, Platform } from 'ionic-angular';
import { IonicPage, NavController, NavParams, Platform, LoadingController, AlertController } from 'ionic-angular';
import { dataService } from "../../providers/common.service";
import { Myservice } from "../../providers/myservice";
import { Storage } from "@ionic/storage";
import { user } from "../../models/mymodel";
import * as firebase from 'firebase';
declare var google;
@IonicPage()
......@@ -17,29 +18,45 @@ export class RidedetailPage {
loc = { from: '', to: '', fromAd: '', toAd: '' }
local: user
public unregisterBackButtonAction: any;
count:number = 0;
loader:any;
driver:any;
bkid:any = 10;
drivers = []
constructor(public navCtrl: NavController, public navParams: NavParams, private data: dataService, private zone: NgZone, private myservice: Myservice, private storage: Storage, public platform: Platform) {
constructor(public navCtrl: NavController, public navParams: NavParams, private data: dataService, private zone: NgZone, private myservice: Myservice, private storage: Storage, public platform: Platform, public loadingCtrl: LoadingController, private alertCtrl:AlertController) {
}
ionViewDidEnter() {
// this.myservice.show_loader()
this.initializeBackButtonCustomHandler();
this.storage.get('user_data').then(data => {
if (data) {
this.local = data
this.book = this.data.getbookingData()
console.log(this.book)
var bdata = { 'book_date': this.book.date, 'drop_area': this.book.dropArea, 'pickup_area': this.book.pickArea, 'taxi_type': this.book.carDetails.car_type, 'amount': '', 'km': '', 'promocode': this.book.promocode, 'token': this.local.token, 'userid': this.local.id, 'type':'now' }
this.myservice.load_post(bdata, 'book_cab').subscribe(response => {
this.myservice.hide_loader()
if (response.status == 'success') {
this.myservice.load_post({},'checkBookingStatus')
}
else {
this.myservice.show_alert('Failed', 'Please try again')
this.navCtrl.pop()
}
})
this.findDrivers()
var bdata = { 'book_date': this.book.date, 'drop_area': this.book.dropArea, 'pickup_area': this.book.pickArea, 'taxi_type': this.book.carDetails.car_type, 'amount': '', 'km': '', 'promocode': this.book.promocode, 'token': this.local.token, 'userid': this.local.id, 'type':'now','drivers':[] }
this.loader = this.loadingCtrl.create({
content: "Searching for driver"
});
this.loader.present();
bdata.drivers = this.drivers;
console.log(bdata)
// this.myservice.load_post(bdata, 'book_cab').subscribe(response => {
// if (response.status == 'success') {
// this.bkid = response.data
this.checkResp();
// }
// else {
// this.myservice.show_alert('Failed', 'Please try again')
// this.navCtrl.pop()
// }
// })
this.geocoder = new google.maps.Geocoder();
for (let i = 0; i < 2; i++) {
......@@ -76,6 +93,76 @@ export class RidedetailPage {
})
}
findDrivers(){
var This = this
firebase.database().ref().child('/drivers/').orderByChild("status").equalTo('online').once("value", function (snapshot) {
var res_arr = (<any>Object).entries(snapshot.val()).map(e => Object.assign(e[1], { key: e[0] }));
console.log(res_arr)
This.drivers = [];
for (let i = 0; i < res_arr.length; i++) {
var mypos = new google.maps.LatLng(This.book.pickLat, This.book.pickLng);
let driverLoc = new google.maps.LatLng(res_arr[i].lat, res_arr[i].lng)
if (google.maps.geometry.spherical.computeDistanceBetween(driverLoc, mypos) < 5000) {
This.drivers.push(res_arr[i].id)
}
}
});
}
showAlert(){
let alert = this.alertCtrl.create({
title: 'No drivers found',
message: 'Please search again.',
buttons: [
{
text: 'Cancel',
role: 'cancel',
handler: () => { }
},
{
text: 'Search',
handler: () => {
this.loader = this.loadingCtrl.create({
content: "Searching for driver"
});
this.loader.present();
this.findDrivers()
var This = this;
setTimeout(() => {
This.myservice.load_post({ taxiType: This.book.carDetails.car_type, type:'now',driversid: This.drivers }, 'driverPush').subscribe(data => {
if(data.status == 'success')
This.checkResp();
})
}, 500);
}
}
]
});
alert.present();
}
checkResp(){
var This = this;
var intrvl = setInterval(function () {
This.count++;
This.myservice.load_post({ bkid: This.bkid }, 'checkBookingStatus').subscribe(resp => {
console.log(resp.data.assigned_for)
if (resp.data.assigned_for) {
This.driver = resp.data
clearInterval(intrvl)
This.loader.dismissAll();
}
})
if (This.count == 12) {
clearInterval(intrvl)
This.loader.dismissAll();
This.showAlert();
}
}, 5000)
}
public initializeBackButtonCustomHandler(): void {
this.unregisterBackButtonAction = this.platform.registerBackButtonAction(() => {
// this.customHandleBackButton();
......@@ -85,4 +172,9 @@ export class RidedetailPage {
ionViewWillLeave() {
this.unregisterBackButtonAction && this.unregisterBackButtonAction();
}
track(){
this.data.setdriverData(this.driver)
this.navCtrl.push('MapPage')
}
}
src/providers/common.service.ts
......@@ -5,6 +5,7 @@ export class dataService {
bookingData:any;
rateData:any;
driverData:any;
constructor() { }
......@@ -23,6 +24,13 @@ rateData:any;
public getrateData(){
return this.rateData;
}
public setdriverData(val){
this.driverData = val;
}
public getdriverData(){
return this.driverData;
}
}
\ No newline at end of file
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