Skip to content

C
Callmycab-Driverapp
Commit 26911884 by Alen Jose
Options

Merge branch 'alen' into 'master'

pick user See merge request alen/CMC-driver!2
parents 94229b82 d4de1fab
Showing with 334 additions and 68 deletions
src/app/app.module.ts
......@@ -18,6 +18,7 @@ import { Geolocation } from '@ionic-native/geolocation';
import { fireService } from "../providers/firebase.service";
import { AngularFireDatabase } from 'angularfire2/database';
import { AngularFireModule } from 'angularfire2';
import { dataService } from "../providers/common.service";
export const firebaseConfig = {
apiKey: "AIzaSyDLrbLd4RCCh86xuTVu7-cfJ28We_cG1sU",
......@@ -54,6 +55,7 @@ export const firebaseConfig = {
Geolocation,
fireService,
AngularFireDatabase,
dataService,
]
})
export class AppModule {}
src/pages/home/home.ts
......@@ -2,7 +2,7 @@ import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Storage } from "@ionic/storage";
import { Myservice } from "../../providers/myservice";
import { dataService } from "../../providers/common.service";
@IonicPage()
@Component({
selector: 'page-home',
......@@ -14,7 +14,7 @@ upcoming:any;
completed:any;
baseurl = this.myservice.base_url
constructor(public navCtrl: NavController, public navParams: NavParams, private storage:Storage, private myservice:Myservice) {
constructor(public navCtrl: NavController, public navParams: NavParams, private storage: Storage, private myservice: Myservice, private data:dataService) {
}
ionViewDidEnter(){
......@@ -42,6 +42,7 @@ tab_swap(type) {
}
rideDetails(data){
this.navCtrl.push('RidedetailsPage',{data:data})
this.data.setrideData(data)
this.navCtrl.push('RidedetailsPage')
}
}
src/pages/payment/payment.html 0 → 100644
<ion-header class="theme_dark_bg">
<button ion-button class="nav_btn theme_color floatLeft"(click)="dismiss()">
<ion-icon name="ios-arrow-back"></ion-icon>
</button>
<div class="nav_header_title floatLeft">Payment Details</div>
<div class="clear"></div>
</ion-header>
<ion-content padding class="cab_coupon_bg">
<div class="cab_trip_detail_wrapper">
<h4 class="text_white">Pickup Point</h4>
<!-- <p class="floatLeft textLeft width50">{{book.from}}</p> -->
<!-- <p class="floatRight textRight width50">11 :23 am, 02-08-2017</p> -->
<div class="clear"></div>
<br>
<h4 class="text_white">Drop Point</h4>
<!-- <p class="floatLeft textLeft width50">{{book.to}}</p> -->
<!-- <p class="floatRight textRight width50">12 :00 am, 02-08-2017</p> -->
<div class="clear"></div>
<br>
<br>
</div>
<div class="cab_coupon_content">
<p style="padding-top: 0px;margin-top: 0px;margin-bottom: 0px;">Payment Details</p>
<li>
<div class="child textLeft">Total</div>
<!-- <div class="child textRight">Rs. {{ride.amount}}</div> -->
<div class="clear"></div>
</li>
<li>
<div class="child textLeft">Discount</div>
<!-- <div class="child textRight">Rs. {{ride.discount}}</div> -->
<div class="clear"></div>
</li>
<li>
<div class="child textLeft">Due after service</div>
<!-- <div class="child textRight">Rs. {{ride.amount - ride.discount}}</div> -->
<div class="clear"></div>
</li>
</div>
</ion-content>
<ion-footer>
<div class="theme_bgcolor p10 text_white">
<p class="floatLeft text_size_18">Total</p>
<!-- <p class="floatRight text_size_18">Rs.{{ride.amount - ride.discount}}</p> -->
<div class="clear"></div>
</div>
<button ion-button class="cab_footer_btn width100 text_white" (click)="done()">Completed</button>
</ion-footer>
src/pages/payment/payment.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { PaymentPage } from './payment';
@NgModule({
declarations: [
PaymentPage,
],
imports: [
IonicPageModule.forChild(PaymentPage),
],
})
export class PaymentPageModule {}
src/pages/payment/payment.scss 0 → 100644
page-payment {
.cab_trip_detail_wrapper{width:100%;padding-top: 20px;}
.cab_trip_detail_wrapper h4{margin:0px;color:#404041;font-weight: 400;font-size: 16px;}
.cab_trip_detail_wrapper p{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;margin-top: 10px;font-size: 14px !important;color: #a8a8a8;font-weight:300;padding-bottom: 0px;margin-bottom: 0px;bottom: 0px !important;letter-spacing: 1px !important;}
.cab_trip_detail_wrapper hr{border:1px solid #f7941e;height:0px;border-radius:5px;position: relative;bottom: 22px; z-index: -9;}
.cab_trip_detail_wrapper .to{width:50px;height:30px;border-radius:50%;background:#fff;color: #f7941e;text-align: center;margin:0 auto; padding: 3px;font-size:23px; z-index: 9;letter-spacing: 3px;padding-top: 5px;padding-left: 6px;margin-top: 20px;margin-bottom: 20px;}
.cab_trip_detail_wrapper p strong{background:#f7941e;color: #fff;padding-left: 10px;padding-right: 10px;border-radius: 4px;font-weight: 400;}
.cab_ratting{padding-top: 25px;padding-bottom:25px;text-align: center; width:205px;margin: 0 auto;}
.cab_ratting:not(:checked) > input {position:absolute;top:-9999px;clip:rect(0,0,0,0);}
.cab_ratting:not(:checked) > label {float:right;width:1em;padding:0 .1em;overflow:hidden;white-space:nowrap;cursor:pointer;font-size: 40px;line-height:1.2;color:#ddd;}
.cab_ratting:not(:checked) > label:before {content: '★ ';}
.cab_ratting > input:checked ~ label {color: #f70;}
.cab_ratting:not(:checked) > label:hover,
.cab_ratting:not(:checked) > label:hover ~ label {color: gold;}
.cab_ratting > input:checked + label:hover,
.cab_ratting > input:checked + label:hover ~ label,
.cab_ratting > input:checked ~ label:hover,
.cab_ratting > input:checked ~ label:hover ~ label,
.cab_ratting > label:hover ~ input:checked ~ label {color: #ea0;}
.cab_ratting > label:active {position:relative;top:2px;left:2px;}
.cab_coupon_wrapper{padding-top:20%;}
.cab_pop_detail_left{width:65px;height:50px;background-position:left;background-size: 65px;background-repeat: no-repeat;}
.cab_pop_details{padding: 3px;width:calc(100% - 65px);}
.cab_coupon_box{width:80%;margin:0 auto;height:50px;text-align:center;border:2px solid #353639;border-radius:0px;background:#28292c;}
.cab_coupon_input{width:100%;height:100%;background:transparent !important;border:none;text-align:center;color:#ff9000; font-size: 20px;font-weight: 300;}
.cab_coupon_input::-webkit-input-placeholder {color:#ff9000;}
.cab_coupon_input::-moz-placeholder {color:#ff9000;}
.cab_coupon_input:-ms-input-placeholder {color:#ff9000;}
.cab_coupon_input:-moz-placeholder {color:#ff9000;}
.cab_coupon_bg{background:#2e2f32 !important;}
.cab_coupon_wrapper p{color:#fff;text-align:center;margin:0px;line-height: 18px;font-weight: 300;letter-spacing: 1px;padding-top: 40px;padding-bottom: 40px;}
.cab_coupon_apply{width:100%;height:50px;border-radius:0px;text-align:center;background:#ff9000;font-size:18px;font-weight: 400;color:#fff;letter-spacing: 4px;}
.cab_coupon_content{width:100%;}
.cab_coupon_content li{width:100%;list-style:none !important;padding-top: 10px;padding-bottom: 10px;border-bottom:1px solid #353639;}
.cab_coupon_content li .child{width:50%;float:left;color:#8d8c8c;font-size: 15px;}
.cab_coupon_content p{color:#ff9000;text-align:left;padding-bottom:20px;padding-top:20px;font-size: 18px;}
.footer p{padding:0px;margin: 0px;}
}
src/pages/payment/payment.ts 0 → 100644
import { Component, NgZone } from '@angular/core';
import { IonicPage, NavController, NavParams, Platform } from 'ionic-angular';
import { dataService } from "../../providers/common.service";
import { Myservice } from "../../providers/myservice";
import { Storage } from "@ionic/storage";
import * as firebase from 'firebase';
declare var google;
@IonicPage()
@Component({
selector: 'page-payment',
templateUrl: 'payment.html',
})
export class PaymentPage {
book = this.data.getrideData()
geocoder: any;
public unregisterBackButtonAction: any;
ride: any;
waypoints = this.data.getwaypointData()
constructor(public navCtrl: NavController, public navParams: NavParams, private data: dataService, private zone: NgZone, private myservice: Myservice, private storage: Storage, public platform: Platform) {
}
ionViewDidEnter() {
// this.myservice.hide_loader();
this.initializeBackButtonCustomHandler();
console.log(this.book)
var directionsService = new google.maps.DirectionsService;
var pick = this.book.pickup_latlng.split(',')
var drop = this.book.drop_latlng.split(',')
var start = new google.maps.LatLng(Number(pick[0]), Number(pick[1]));
var dest = new google.maps.LatLng(Number(drop[0]), Number(drop[1]));
var This = this
directionsService.route({
origin: start,
destination: dest,
travelMode: 'DRIVING',
waypoints: This.waypoints
}, function (response, status) {
if (status === 'OK') {
var totalDist = 0;
var myroute = response.routes[0];
console.log(myroute)
for (let i = 0; i < myroute.legs.length; i++) {
totalDist += myroute.legs[i].distance.value;
}
totalDist = totalDist / 1000.
console.log(totalDist)
This.myservice.load_post({},'updateRideDetails').subscribe(response=>{
if(response.status == 'success'){
}
else
This.myservice.show_alert('',response.message)
})
} else {
window.alert('Directions request failed due to ' + status);
}
});
}
public initializeBackButtonCustomHandler(): void {
this.unregisterBackButtonAction = this.platform.registerBackButtonAction(() => {
// this.customHandleBackButton();
}, 10);
}
ionViewWillLeave() {
this.unregisterBackButtonAction && this.unregisterBackButtonAction();
}
done() {
}
}
src/pages/ridedetails/ridedetails.ts
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Myservice } from "../../providers/myservice";
import { dateDataSortValue } from 'ionic-angular/umd/util/datetime-util';
import { dataService } from "../../providers/common.service";
@IonicPage()
@Component({
......@@ -9,10 +9,10 @@ import { dateDataSortValue } from 'ionic-angular/umd/util/datetime-util';
templateUrl: 'ridedetails.html',
})
export class RidedetailsPage {
details = this.navParams.get('data')
details = this.data.getrideData()
baseurl = this.myservice.base_url
constructor(public navCtrl: NavController, public navParams: NavParams, private myservice: Myservice) {
constructor(public navCtrl: NavController, public navParams: NavParams, private myservice: Myservice, private data:dataService) {
}
......@@ -26,6 +26,8 @@ export class RidedetailsPage {
this.details.to = temp[0]
this.details.toAd = this.details.drop_area
console.log(this.details)
this.data.setrideData(this.details)
}
back(){
......@@ -33,7 +35,8 @@ export class RidedetailsPage {
}
pick(){
this.navCtrl.push('UserlocationPage',{ data: this.details})
this.myservice.show_loader()
this.navCtrl.push('UserlocationPage')
}
}
src/pages/userlocation/userlocation.html
......@@ -9,13 +9,16 @@
<div #map id="map"></div>
<div class="jr_bottom_distance_card" *ngIf="temp">
<div class="jr_bottom_inside">
<input class="jr_dest_input from" placeholder="From" [(ngModel)]="loc.from">
<input class="jr_dest_input to" placeholder="To" [(ngModel)]="loc.to">
<input class="jr_dest_input from" placeholder="From" [(ngModel)]="loc.from" [readonly]="true">
<input class="jr_dest_input to" placeholder="To" [(ngModel)]="loc.to" [readonly]="true">
</div>
</div>
</ion-content>
<ion-footer>
<div class="jr_bottom_button_bay" *ngIf="temp">
<button ion-button class="cab_footer_btn">Start Ride</button>
<div class="jr_bottom_button_bay" *ngIf="!started">
<button ion-button class="cab_footer_btn" (click)="startRide()">Start Ride</button>
</div>
<div class="jr_bottom_button_bay" *ngIf="temp && started">
<button ion-button class="cab_footer_btn" (click)="complete()">Finish Ride</button>
</div>
</ion-footer>
\ No newline at end of file
src/pages/userlocation/userlocation.ts
import { Component, ViewChild, ElementRef } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { IonicPage, NavController, NavParams, MenuController } from 'ionic-angular';
import { Geolocation } from '@ionic-native/geolocation';
import * as firebase from 'firebase';
import { AngularFireDatabase } from 'angularfire2/database';
import { driver } from "../../models/mymodel";
import { Storage } from "@ionic/storage";
import { Myservice } from "../../providers/myservice";
import { dataService } from "../../providers/common.service";
declare var google;
......@@ -12,60 +18,56 @@ declare var google;
export class UserlocationPage {
@ViewChild('map') mapElement: ElementRef;
map: any;
directionsDisplay:any;
geocoder:any;
details = this.navParams.get('data')
locSubs:any;
temp:boolean = false;
loc = {'from':'','to':''}
i:number = 0;
constructor(public navCtrl: NavController, public navParams: NavParams, private geolocation: Geolocation) {
this.geolocation.getCurrentPosition().then((resp) => {
this.loadMap(resp.coords.latitude, resp.coords.longitude);
})
directionsDisplay: any;
geocoder: any;
details = this.data.getrideData()
locSubs: any;
temp: boolean = false;
loc = { 'from': '', 'to': '' }
pushId: string;
local: driver
started: boolean = false;
myloc = []
waypoints = []
constructor(public navCtrl: NavController, public navParams: NavParams, private geolocation: Geolocation, private db: AngularFireDatabase, private storage: Storage, private myservice: Myservice, private menu: MenuController, private data: dataService) {
this.loadMap()
}
ionViewDidEnter() {
var This = this
var drop = This.details.drop_latlng.split(',')
This.geocoder = new google.maps.Geocoder();
This.locSubs = This.geolocation.watchPosition()
.filter((p) => p.coords !== undefined) //Filter Out Errors
.subscribe(position => {
This.i++;
var directionsService = new google.maps.DirectionsService;
This.directionsDisplay.setMap(This.map);
This.directionsDisplay.setOptions({ suppressMarkers: true });
this.menu.swipeEnable(false);
var pickLoc = new google.maps.LatLng(Number(drop[0]), Number(drop[1]));
var driverLoc = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
var dimage = {
url: 'assets/img/map_label.png',
scaledSize: new google.maps.Size(50, 22),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(25, 12)
};
this.getStorage()
var marker = new google.maps.Marker({
position: driverLoc,
map: This.map,
icon: dimage
});
var pick = this.details.pickup_latlng.split(',')
var drop = this.details.drop_latlng.split(',')
if (This.i == 5) {
// if (google.maps.geometry.spherical.computeDistanceBetween(pickLoc, driverLoc) < 100) {
This.temp = true
}
this.geocoder = new google.maps.Geocoder();
var This = this
This.locSubs = This.geolocation.watchPosition().filter((p) => p.coords !== undefined) //Filter Out Errors
.subscribe(position => {
firebase.database().ref("drivers/" + this.pushId + "/").update({ lat: Number(position.coords.latitude), lng: Number(position.coords.longitude) })
This.calculateAndDisplayRoute(directionsService, This.directionsDisplay, pickLoc, driverLoc);
This.myloc[0] = position.coords.latitude
This.myloc[1] = position.coords.longitude
if (This.started == false)
This.gotoDirection(pick, This.myloc)
else {
This.gotoDirection(drop, This.myloc)
This.waypoints.push({ location: new google.maps.LatLng(position.coords.latitude, position.coords.longitude)})
}
})
}
loadMap(lat, lng) {
loadMap() {
this.geolocation.getCurrentPosition().then((resp) => {
var lat = resp.coords.latitude
var lng = resp.coords.longitude
let latLng = new google.maps.LatLng(lat, lng);
......@@ -81,14 +83,49 @@ export class UserlocationPage {
map: this.map,
preserveViewport: true
});
})
}
back(){
gotoDirection(dest, myloc) {
console.log('gtd')
var This = this;
var directionsService = new google.maps.DirectionsService;
This.directionsDisplay.setMap(This.map);
This.directionsDisplay.setOptions({ suppressMarkers: true });
var destLoc = new google.maps.LatLng(Number(dest[0]), Number(dest[1]));
var driverLoc = new google.maps.LatLng(Number(myloc[0]), Number(myloc[1]));
var dimage = {
url: 'assets/img/map_label.png',
scaledSize: new google.maps.Size(50, 22),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(25, 12)
};
var marker = new google.maps.Marker({
position: driverLoc,
map: This.map,
icon: dimage
});
// if (google.maps.geometry.spherical.computeDistanceBetween(destLoc, driverLoc) < 100) {
This.loc.to = This.details.drop_area
This.loc.from = This.details.pickup_area
This.temp = true
// }
This.calculateAndDisplayRoute(directionsService, This.directionsDisplay, destLoc, driverLoc);
}
back() {
this.navCtrl.pop();
}
calculateAndDisplayRoute(directionsService, directionsDisplay, start, dest) {
var This = this
directionsService.route({
origin: start,
destination: dest,
......@@ -105,6 +142,42 @@ export class UserlocationPage {
});
}
startRide() {
this.started = true;
this.temp = false
var This = this;
firebase.database().ref("drivers/" + This.pushId + "/").update({ started: true })
var drop = This.details.drop_latlng.split(',')
This.gotoDirection(drop, This.myloc)
}
complete() {
var This = this;
This.data.setwaypointData(This.waypoints)
firebase.database().ref("drivers/" + This.pushId + "/").update({ started: false })
This.navCtrl.push('PaymentPage')
// console.log(This.locSubs)
}
getStorage() {
this.storage.get('driver_data').then(data => {
if (data) {
this.myservice.hide_loader();
this.local = data
var This = this
var query = firebase.database().ref("drivers/").orderByChild("id").equalTo((data.id))
query.once("child_added", function (snapshot) {
This.pushId = snapshot.val().push_id
console.log(This.pushId)
});
}
})
}
ionViewWillLeave() {
this.locSubs.unsubscribe();
}
......
src/providers/common.service.ts
......@@ -3,26 +3,26 @@ import { Injectable } from '@angular/core';
@Injectable()
export class dataService {
bookingData:any;
rateData:any;
rideData:any;
waypointData:any;
driverData:any;
constructor() { }
public setbookingData(val){
this.bookingData = val;
public setrideData(val){
this.rideData = val;
}
public getbookingData(){
return this.bookingData;
public getrideData(){
return this.rideData;
}
public setrateData(val){
this.rateData = val;
public setwaypointData(val){
this.waypointData = val;
}
public getrateData(){
return this.rateData;
public getwaypointData(){
return this.waypointData;
}
public setdriverData(val){
......
src/providers/firebase.service.ts
......@@ -19,9 +19,7 @@ export class fireService {
constructor(
private db: AngularFireDatabase,) {
// console.log(this.currentUser);
// console.log('hhhh');
private db: AngularFireDatabase) {
}
pushItem(url,data){
......@@ -29,7 +27,7 @@ export class fireService {
var new_node = url + "/" + key;
data.push_id = key;
this.updateItem(new_node, data)
return 'success';
return key;
}
updateItem(url,data){
......
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