From 9de6bd2d2570d8f4edecdeb92947462205937c78 Mon Sep 17 00:00:00 2001 From: alen <alen@techware.in> Date: Thu, 14 Jun 2018 13:01:00 +0530 Subject: [PATCH] ride route --- src/app/app.component.ts | 5 +++-- src/pages/home/home.ts | 8 +++++++- src/pages/map/map.html | 10 +++++----- src/pages/map/map.ts | 74 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-------------- src/pages/ridedetail/ridedetail.html | 45 +++------------------------------------------ src/pages/ridedetail/ridedetail.ts | 11 +++++++++-- src/pages/ridesummary/ridesummary.html | 105 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ src/pages/ridesummary/ridesummary.module.ts | 13 +++++++++++++ src/pages/ridesummary/ridesummary.scss | 616 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ src/pages/ridesummary/ridesummary.ts | 92 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 10 files changed, 913 insertions(+), 66 deletions(-) create mode 100644 src/pages/ridesummary/ridesummary.html create mode 100644 src/pages/ridesummary/ridesummary.module.ts create mode 100644 src/pages/ridesummary/ridesummary.scss create mode 100644 src/pages/ridesummary/ridesummary.ts diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 36667d6..37d9405 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -30,7 +30,7 @@ export class MyApp { if(data){ this.rootPage = 'HomePage' this.local = data - console.log(this.local) + // console.log(this.local) } else this.rootPage = 'LandingPage' @@ -86,7 +86,8 @@ export class MyApp { // do something when a notification is opened }); - this.oneSignal.endInit();} + this.oneSignal.endInit(); + } enableLoc(){ this.locationAccuracy.canRequest().then((canRequest: boolean) => { diff --git a/src/pages/home/home.ts b/src/pages/home/home.ts index 60e3931..3c19241 100644 --- a/src/pages/home/home.ts +++ b/src/pages/home/home.ts @@ -31,6 +31,7 @@ export class HomePage { geocoder: any; local:user directionsDisplay:any; + locRef: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) { @@ -73,7 +74,8 @@ export class HomePage { //drivers loc var This = this - firebase.database().ref().child('/drivers/').orderByChild("status").equalTo('online').on("value", function (snapshot) { + This.locRef = firebase.database().ref().child('/drivers/') + This.locRef.orderByChild("status").equalTo('online').on("value", function (snapshot) { var res_arr = (<any>Object).entries(snapshot.val()).map(e => Object.assign(e[1], { key: e[0] })); //placing marker for each driver @@ -217,4 +219,8 @@ export class HomePage { modal.present(); } + ionViewWillLeave(){ + this.locRef.off("value"); + } + } diff --git a/src/pages/map/map.html b/src/pages/map/map.html index 2267372..db28f34 100644 --- a/src/pages/map/map.html +++ b/src/pages/map/map.html @@ -9,15 +9,15 @@ <ion-content> <div #map id="map"></div> - <!-- <div class="jr_bottom_distance_card"> + <div class="jr_bottom_distance_card" *ngIf="temp"> <div class="jr_bottom_inside"> - <input class="jr_dest_input from" placeholder="HSR Layout, Kormangala,Bengalure" [(ngModel)]="bookData."> - <input class="jr_dest_input to" placeholder="Jalihalli, Outercity, Bengaluru"> + <input class="jr_dest_input from" placeholder="From" [(ngModel)]="bookData.pickArea" [readonly]="true"> + <input class="jr_dest_input to" placeholder="To" [(ngModel)]="bookData.dropArea" [readonly]="true"> </div> - </div> --> + </div> </ion-content> -<ion-footer> +<ion-footer *ngIf="!temp"> <div class="jr_bottom_button_bay"> <button ion-button class="jr_offer_ride2" (click)="cancel()">Cancel</button> </div> diff --git a/src/pages/map/map.ts b/src/pages/map/map.ts index 42ed3a2..b762a84 100644 --- a/src/pages/map/map.ts +++ b/src/pages/map/map.ts @@ -15,6 +15,9 @@ export class MapPage { map: any; directionsDisplay: any; bookData:any; + temp:boolean = false; + locSubs:any; + driver:any; constructor(public navCtrl: NavController, public navParams: NavParams, private data: dataService, private geolocation: Geolocation) { } @@ -28,27 +31,33 @@ export class MapPage { } ionViewDidEnter(){ - var driver = this.data.getdriverData(); + this.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 locRef = firebase.database().ref().child('/drivers/'); + + locRef.orderByChild("id").equalTo(Number(This.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); - }); + if (res_arr[0].started == true){ + + locRef.off("value"); + This.startRide(); + } + else{ + 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); + + This.calculateAndDisplayRoute(directionsService, This.directionsDisplay, pickLoc, driverLoc); + } + }); } // ionViewDidLoad() { @@ -91,7 +100,44 @@ export class MapPage { }); } + startRide(){ + this.temp = true + console.log('started') + var This= this; + + This.locSubs = this.geolocation.watchPosition() + .filter((p) => p.coords !== undefined) //Filter Out Errors + .subscribe(position => { + console.log(position.coords.longitude + ' ' + position.coords.latitude); + + var directionsService = new google.maps.DirectionsService; + + This.directionsDisplay.setMap(This.map); + + var destLoc = new google.maps.LatLng(This.bookData.dropLat, This.bookData.dropLng); + var myLoc = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); + + // if (google.maps.geometry.spherical.computeDistanceBetween(myLoc, destLoc) < 50){ + var locRef = firebase.database().ref().child('/drivers/'); + + locRef.orderByChild("id").equalTo(Number(This.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]) + if (res_arr[0].started == false) { + locRef.off("value"); + This.navCtrl.setRoot('RidesummaryPage') + } + }) + // } + This.calculateAndDisplayRoute(directionsService, This.directionsDisplay, myLoc, destLoc); + }); + } + cancel(){ this.navCtrl.pop(); } + + ionViewWillLeave(){ + this.locSubs.unsubscribe(); + } } diff --git a/src/pages/ridedetail/ridedetail.html b/src/pages/ridedetail/ridedetail.html index 3ba33d5..8eac6d0 100644 --- a/src/pages/ridedetail/ridedetail.html +++ b/src/pages/ridedetail/ridedetail.html @@ -36,11 +36,9 @@ </div> <hr> <br> - <!-- <div class="jr_search_bottom_bay jr_padding0"> - <div class="loader"></div> - </div> --> -<span *ngIf="driver"> - <div class="jr_search_bottom_bay jr_padding0"> + + + <div class="jr_search_bottom_bay jr_padding0" *ngIf="driver"> <div class="jr_search_profile"> <img [src]=driver.image> </div> @@ -51,43 +49,6 @@ </div> <div class="jr_clear"></div> </div> - <br> - </span> - <!-- <hr> - <div class="jr_car_info"> - <div class=""> - <ion-grid class="jr_padding0"> - <ion-row> - <ion-col col-2 class="jr_padding0"> - <div class="jr_car_info_photo"><img src="assets/img/jr_car_img.png"></div> - </ion-col> - <ion-col col-4 class=""> - <div class="jr_car_info_detail jr_padding0"> - <h6>Audi A8</h6> - <p>Blue - Luxury</p> - </div> - <div class="jr_clear"></div> - </ion-col> - <ion-col col-3 class="jr_padding0"> - <div class="jr_car_info_detail jr_padding0"> - <p>Total</p> - <h6>300 km</h6> - </div> - <div class="jr_clear"></div> - </ion-col> - <ion-col col-3 class="jr_padding0 right"> - <div class="jr_car_info_detail jr_padding0"> - <p>Total Price</p> - <h6>300 km</h6> - </div> - <div class="jr_clear"></div> - </ion-col> - </ion-row> - </ion-grid> - </div> - <div class="jr_clear"></div> - </div> --> <div class="jr_bottom_button_bay"> <button ion-button class="jr_offer_ride2" (click)="track()">Track Driver</button> diff --git a/src/pages/ridedetail/ridedetail.ts b/src/pages/ridedetail/ridedetail.ts index d27aaa9..fa5228f 100644 --- a/src/pages/ridedetail/ridedetail.ts +++ b/src/pages/ridedetail/ridedetail.ts @@ -50,6 +50,8 @@ export class RidedetailPage { // this.myservice.load_post(bdata, 'book_cab').subscribe(response => { // if (response.status == 'success') { // this.bkid = response.data + this.book.bookingId = this.bkid + this.data.setbookingData(this.book); this.checkResp(); // } // else { @@ -73,12 +75,17 @@ export class RidedetailPage { This.geocoder.geocode({ 'latLng': latlng }, function (results, status) { if (status == google.maps.GeocoderStatus.OK) { if (results[0]) { + // console.log(results) if (i == 0) { - This.loc.from = results[0].address_components[0].short_name + var temp = This.book.pickArea.split(',') + // This.loc.from = results[0].address_components[0].short_name + This.loc.from = temp[0] This.loc.fromAd = results[0].formatted_address } else { - This.loc.to = results[0].address_components[0].short_name + var temp = This.book.dropArea.split(',') + This.loc.to = temp[0] + // This.loc.to = results[0].address_components[0].short_name This.loc.toAd = results[0].formatted_address This.zone.run(() => { }); } diff --git a/src/pages/ridesummary/ridesummary.html b/src/pages/ridesummary/ridesummary.html new file mode 100644 index 0000000..168077d --- /dev/null +++ b/src/pages/ridesummary/ridesummary.html @@ -0,0 +1,105 @@ +<style> + .left { + text-align: left !important; + } + + .right { + text-align: right !important; + } +</style> + + +<ion-header class="jr_theme_color jr_header"> + <button ion-button class="jr_left jr_header_btn jr_back_icon" (click)="goBack()"></button> + <div class="jr_header_title"> + <h4>Quickride Details</h4> + </div> + <button ion-button class="jr_right jr_header_btn"></button> + <div class="jr_clear"></div> +</ion-header> + + +<ion-content padding> + <div class="jr_profile_content1"> + <div class="jr_from_to"> + <li> + <div class="child1 from">From + <div class="jr_box1"></div> + </div> + <div class="child2"> + <strong>{{loc.from}}</strong> + <p>{{loc.fromAd}}</p> + </div> + <div class="jr_clear"></div> + </li> + <li> + <div class="child1 to">To</div> + <div class="child2"> + <strong>{{loc.to}}</strong> + <p>{{loc.toAd}}</p> + </div> + <div class="jr_clear"></div> + </li> + </div> + <hr> + <br> + + <span *ngIf="driver"> + <div class="jr_search_bottom_bay jr_padding0"> + <div class="jr_search_profile"> + <img [src]=driver.image> + </div> + <div class="jr_search_profile_detail"> + <br> + <h6>{{driver.name}} {{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> + </span> + <hr> + <div class="jr_car_info"> + <div class=""> + <ion-grid class="jr_padding0"> + <ion-row> + <!-- <ion-col col-2 class="jr_padding0"> + <div class="jr_car_info_photo"><img src="assets/img/jr_car_img.png"></div> + </ion-col> + <ion-col col-4 class=""> + <div class="jr_car_info_detail jr_padding0"> + <h6>Audi A8</h6> + <p>Blue + Luxury</p> + </div> + <div class="jr_clear"></div> + </ion-col> --> + <ion-col col-3 class="jr_padding0"> + <div class="jr_car_info_detail jr_padding0"> + <p>Total</p> + <h6>300 km</h6> + </div> + <div class="jr_clear"></div> + </ion-col> + <ion-col col-3 class="jr_padding0 right"> + <div class="jr_car_info_detail jr_padding0"> + <p>Total Price</p> + <h6>300 km</h6> + </div> + <div class="jr_clear"></div> + </ion-col> + </ion-row> + </ion-grid> + </div> + <div class="jr_clear"></div> + </div> + + <div class="jr_bottom_button_bay"> + <button ion-button class="jr_offer_ride2" (click)="track()">Track Driver</button> + </div> + </div> + +</ion-content> \ No newline at end of file diff --git a/src/pages/ridesummary/ridesummary.module.ts b/src/pages/ridesummary/ridesummary.module.ts new file mode 100644 index 0000000..54053f6 --- /dev/null +++ b/src/pages/ridesummary/ridesummary.module.ts @@ -0,0 +1,13 @@ +import { NgModule } from '@angular/core'; +import { IonicPageModule } from 'ionic-angular'; +import { RidesummaryPage } from './ridesummary'; + +@NgModule({ + declarations: [ + RidesummaryPage, + ], + imports: [ + IonicPageModule.forChild(RidesummaryPage), + ], +}) +export class RidesummaryPageModule {} diff --git a/src/pages/ridesummary/ridesummary.scss b/src/pages/ridesummary/ridesummary.scss new file mode 100644 index 0000000..7eb9ebe --- /dev/null +++ b/src/pages/ridesummary/ridesummary.scss @@ -0,0 +1,616 @@ +page-ridesummary { + + +.jr_theme_color{background: #ff9000 !important;border:1px solid #ff9000;} +.jr_theme_color1{background:#f1672f !important;} +.jr_left{float: left !important;} +.jr_right{float: right !important;} +.jr_clear{clear: both;} +.jr_text_center{text-align: center !important;} +.jr_padding0{padding:0px !important;} +.jr_paddingtop0{padding-top:0px !important;} +.jr_margin0{margin:0px !important;} +.jr_paddingbtm0{padding-bottom:0px !important;} +.jr_marginbtm0{margin-bottom:0px !important;} +.jr_margintop0{margin-top:0px !important;} +.jr_bordernone{border:none !important;} +.jr_bg_none{background:none !important;} +.jr_transparent{background:rgba(0,0,0,0.8) !important;} +.button-md.activated {background-color:none !important;box-shadow:none !important;} +.button-md{box-shadow: none !important;} + + +/*LANDING-PAGE*/ + +.jr_landing_bg{background:url("../assets/img/jr_landing_bg.png") !important;background-repeat: no-repeat !important;background-position: center bottom !important;background-size: 100% !important;position: relative;} +.jr_login_bg{background:url("../assets/img/jr_login_bg.png") !important;background-repeat: no-repeat !important;background-position: center bottom !important;background-size: 100% !important;position: relative;} +.jr_sidemenu_bg{background:url("../assets/img/jr_sidemenu_bg.png") !important;background-repeat: no-repeat !important;height: 100%;background-position: center bottom !important; padding: 50px; +background-size:cover !important;position: relative;} +.jr_landing_overlay{background:linear-gradient(rgba(241, 103, 46, 0.8), rgba(239, 89, 124, 0.8));} +.jr_landing_overlay1{background:linear-gradient(rgba(32, 119, 163, 0.8), rgba(43, 30, 65, 0.8));} +.jr_slide{text-align: center;} +.jr_slide img{width:200px;margin-top: 10px;} +.jr_slide h4{color: #fff;font-size:24px;font-weight:200;margin:0px;} +.jr_slide h3{color: #fff;font-size:35px;margin:0px;padding-top:5px;padding-bottom: 5px;} +.jr_slide p{color: #fff;font-size:14px;font-weight:300; padding-top: 15px; line-height: 20px;} +.jr_space{width:100%;height:0px;} +.jr_landing_btm{position: fixed;width:100%;bottom:50px;z-index: 9; text-align: center;left:0px;right:0px;} +.jr_slide hr{border:1px solid #fff;width:40px;border-bottom: 1px solid #fff;border-top: 1px solid #fff;border-radius: 5px; margin-top: 25px;height: 0px;} +.jr_btm_btn{height:40px;border-radius:20px;background: #000000;color: #fff;font-family: 'Roboto', sans-serif;padding-left: 20px;padding-right: 20px;-webkit-transition: width 2s; /* For Safari 3.1 to 6.0 */ + transition: width 2s;width: 120px;margin: 0 auto;text-align: center;font-size: 15px;padding: 10px;border:none; text-transform: capitalize;} +.jr_slider_inner{width:80%;margin:0 auto;position: absolute;left:0px;right:0px;top:10%;} +.jr_btm_btn img{width:8px;} +.jr_icon_bar{display: inline-block;width:100%;text-align: center;} +.jr_icon_bar span{display: inline-block;margin-left: 5px;margin-right: 5px;} +.jr_icon_bar span img{width:30px;} +.jr_last_slide_btn_bar{width:100%;text-align: center;} +.jr_strtd_btn{height:40px;border-radius:20px;background: #ffba00;color: #382c59;font-family: 'Roboto', sans-serif;padding-left: 20px;padding-right: 20px;-webkit-transition: width 2s; /* For Safari 3.1 to 6.0 */ + transition: width 2s;width: 140px;margin: 0 auto;text-align: center;font-size: 15px;padding: 10px;border:none; } +.jr_sign_bar{width:100%;text-align: center;} +.jr_sign_bar ul{margin:0px;padding:0px;} +.jr_sign_bar ul li{display: inline-block;border:1px solid #fff;color: #fff;height:40px;border-radius:20px;padding-left: 20px;padding-right: 20px;text-align: center;font-size: 15px;padding: 10px;background: transparent !important;width:115px !important;margin:20px;} +.swiper-pagination{display: block !important;} +.swiper-pagination-bullet{background: #fff;border:1px solid #fff;} + +/*HOME*/ + +.jr_header_btn{width:40px;height:40px;background: transparent;box-shadow: none;} +.jr_sidemenu_icon{background:url("../assets/img/jr_sidemenu_icon.png") !important;background-repeat: no-repeat !important;background-position: center !important;background-size:20px !important;} +.jr_back_icon{background:url("../assets/img/jr_back_arrow_icon.png") !important;background-repeat: no-repeat !important;background-position: center !important;background-size:12px !important;} +.jr_close_icon{background:url("../assets/img/jr_close.png") !important;background-repeat: no-repeat !important;background-position: center !important;background-size:12px !important;} +.jr_mail_icon{background:url("../assets/img/jr_mail.png") !important;background-repeat: no-repeat !important;background-position: center !important;background-size:20px !important;} +.jr_profile_icon{background:url("../assets/img/jr_profile.png") !important;background-repeat: no-repeat !important;background-position: center !important;background-size:20px !important;} +.jr_alert_icon{background:url("../assets/img/jr_alert.png") !important;background-repeat: no-repeat !important;background-position: center !important;background-size:20px !important;} +.jr_header_title{float: left;height:40px;margin-top: 5px;padding: 8px;padding-left: 0px;} +.jr_header_title h4{font-family: 'Roboto', sans-serif;color: #fff;margin:0px;font-weight: 300;font-size: 16px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis; position: relative;top:2px;} +.jr_header{padding-left:5px;padding-right:5px;box-shadow: none !important;background-image: none !important;} +.jr_body_wrapper{width:100%;height:100%;} +.jr_div_half{width:100%;height:50%;position: relative;} +.jr_div_half img{object-fit: cover;object-position: center;width:100%;height:100%;} +.jr_div_overlay{background: rgba(0,0,0,0.7);position: absolute;top:0px;left:0px;right:0px;bottom: 0px;text-align: center;padding: 15px;} +.jr_div_overlay p{text-align: center;color: #bababa;} +.jr_offer_ride{height:35px;width:130px;border-radius:20px;border:none; +background: -webkit-linear-gradient(left, #6a449b , #1379a1); + background: -o-linear-gradient(right, #6a449b, #1379a1); + background: -moz-linear-gradient(right, #6a449b, #1379a1); + background: linear-gradient(to right, #6a449b , #1379a1); + text-transform: capitalize !important; + font-size: 14px; +font-weight: 400; + line-height: 5px; +} +.jr_offer_ride1{height:45px;width:130px;border:none; +background:#4d4d4d; +border-radius: 0px; + + text-transform: capitalize !important; + font-size: 14px; +font-weight: 400; + line-height: 5px; +} +.jr_offer_ride2{height:45px;width:100%; + margin: 0px; + border:none; + border-radius: 0px; +background:#4d4d4d; + text-transform: capitalize !important; + font-size: 14px; +font-weight: 400; + line-height: 5px; +} +.jr_offer_ride3{height:45px;width:100%; + border:none; + border-radius: 0px; + background:#4d4d4d; + text-transform: capitalize !important; + font-size: 14px; +font-weight: 400; + line-height: 5px; +} +.jr_offer_ride4{height:35px;width:100%;border:none; +background:#2874a2; + text-transform: capitalize !important; + font-size: 14px; +font-weight: 400; + line-height: 5px; +} +.jr_offer_ride5{height:35px;width:100%;border:none; +background:#ff7200; + text-transform: capitalize !important; + font-size: 14px; +font-weight: 400; + line-height: 5px; +} +.jr_over_inner{width:100%;position: relative;top: 25%;} +.jr_home_tab_content{width:100%;height:100%;} +.jr_home_tab_bay{width:100%;padding:5px;padding-top: 0px;} +.jr_home_tab_bay ul{width:100%;text-align: center;padding:5px;margin:0px;} +.jr_home_tab_bay ul li{width:40%;display: inline-block;text-align: center;color: #fff;padding: 4px;} +.jr_home_tab_bay ul .active{border:1px solid #fff;border-radius: 20px;} + +/*OFFER-FIND-RIDE*/ + +.jr_ride_wrapper{width:100%; padding-top: 5px;height: 100%;} +.jr_ride_wrapper h5{text-align: center;color: #717171;font-weight: 300;} +.jr_offer_bg{width:100%;padding-top:20px;} +.jr_offer_bg img{} +.jr_ride_form{width:90%;margin:0 auto;padding-top:25px;position: relative;padding-bottom:60px;} +.jr_ride_input1{width:100%;height:30px;border:1px solid #959595;border-radius:20px;background:url("../assets/img/jr_blue_circle.png"),url("../assets/img/jr_loc.png") !important;font-family: 'Roboto', sans-serif;background-repeat: no-repeat !important;background-position: left 7px top 5px,right 8px top 5px!important;background-size:18px !important; padding-left: 35px;} +.jr_ride_input2{width:100%;height:30px;border:1px solid #959595;border-radius:20px;background:url("../assets/img/jr_orange_circle.png") !important;font-family: 'Roboto', sans-serif;background-repeat: no-repeat !important;background-position:7px,6px !important;background-size:18px !important; padding-left: 35px;} +.jr_box{height:15px;width:20px;border-left:1px dotted #959595;position: absolute;top:56px;left:17px;} +.jr_custom label {display: inline-block;cursor: pointer;position: relative;padding-left: 25px;margin-right: 15px;color: #8b8b8b;font-size: 13px;font-family: 'Roboto', sans-serif;font-weight:400;} +.jr_custom label:before {content: "";display: inline-block;width: 14px;height: 14px;margin-right: 10px;position: absolute;left: 0;bottom: 1px;background-color: #ffffff;border-radius:0px !important;border:1px solid #959595;border-radius:3px !important;} +.jr_custom label:before {border-radius: 8px;} +.jr_custom input[type=checkbox] {display: none;} +.jr_custom label:before {border-radius: 3px;} +.jr_custom input[type=checkbox]:checked + label:before {content: "\2713";font-size: 14px;color: #6a449b;text-align: center;line-height:16px;font-weight:600;} +.jr_custom{padding-top: 30px;padding-bottom: 30px; padding-left: 5px;} +.jr_time_div{width:100%;} +.jr_date{width:65%;float: left;} +.jr_time{width: 35%;float: left;padding-left: 10px;} +.jr_input3{width:100%;border:none;min-height:30px !important;border-bottom:1px solid #959595;font-family: 'Roboto', sans-serif;padding: 0px !important;} +.jr_select{width:100%;border:none;height:30px;border-bottom:1px solid #959595;font-family: 'Roboto', sans-serif;color: #8b8b8b;-webkit-appearance: none;-moz-appearance: none;background:url("../assets/img/jr_dwn_arw.png");background-position: right;background-repeat: no-repeat;background-size: 15px; font-size: 16px;} +.jr_select option{color: #8b8b8b;font-family: 'Roboto', sans-serif;} +.jr_input3 .datetime-ios{padding: 0px !important;color: #646464;font-family: 'Roboto', sans-serif;} +.jr_input3 .datetime-md{padding: 0px !important;color: #646464;font-family: 'Roboto', sans-serif;} +.jr_bottom_button_bay{width:100%;position: fixed;bottom: 0px;padding:0px;left:0px;right:0px;text-align: center;} +.jr_seat_number{width:100%;padding-top:15px;} +.jr_seat_number ul{padding: 0px;margin:0px;} +.jr_seat_number ul li{display: inline-block;width:32px !important;height:32px;border-radius:50%;border:1px solid #4a4a4a;background:none !important;color: #4a4a4a;text-align: center;font-family: 'Roboto', sans-serif; font-size: 18px;padding: 6px !important; margin: 5px;} +.jr_seat_number ul li:hover{background:#4a4a4a;color: #fff;} +.jr_seat_number ul li:focus{background:#4a4a4a !important;color: #fff !important;} +.jr_seat_number span{color: #8b8b8b;font-family: 'Roboto', sans-serif;font-size: 16px;padding-right: 20px;} +.header-md::after, .tabs-md[tabsPlacement="top"] > .tabbar::after, .footer-md::before, .tabs-md[tabsPlacement="bottom"] > .tabbar::before{background-image: none !important;} +.jr_ride_wrapper p{text-align: center;color: #fff;font-weight: 200;} +.jr_archive_btn{height:30px;border-radius:20px;background: rgba(0,0,0,0.4) !important;font-weight: 200;font-size: 13px;padding-left: 20px;padding-right:20px;} + +/*OFFER-RIDE-DETAILS*/ + +.jr_offerride_details{width: 100%;padding: 15px;padding-top: 0px !important;padding-bottom: 30px;} +.jr_offerride_details ul{margin:0px;padding:0px;} +.jr_offerride_details ul li{width: 100%;list-style: none;border-bottom:1px solid #d0d0d0;padding-bottom: 15px;padding-top: 15px;padding-left: 0px !important;} +.jr_offerride_details ul li h4{margin:0px;font-family: 'Roboto', sans-serif;color: #717171;font-size:17px;font-weight: 400;padding-bottom: 10px;padding-top: 10px;} +.jr_offerride_details ul li h4 img{width:18px;position: relative;top: 3px;margin-right:10px;} +.jr_offerride_detail_content{width:100%;} +.jr_offerride_detail_content_left{width:60%;float: left;} +.jr_offerride_detail_content_right{width:40%;float: right;height:50px;border-left:1px solid #d0d0d0;} +.jr_offerride_price_tag{text-align:right;padding-top: 5px;} +.jr_offer_price{font-family: 'Roboto', sans-serif;color: #2078a2;font-size:30px;font-weight: 600;padding-left:7px;padding-right:7px;} +.jr_offerride_price_tag img{width:20px;} +.jr_destination{padding-top:7px;} +.jr_destination span{font-family: 'Roboto', sans-serif;color: #717171;font-size:16px;font-weight: 400;} +.jr_destination span img{width:12px;margin-right:10px;} +.jr_offerride_details ul li h5{font-family: 'Roboto', sans-serif;color: #717171;margin-top:0px;font-weight: 400;font-size: 16px;padding-left: 30px;} +.jr_offerride_details ul li p{font-family: 'Roboto', sans-serif;color: #7d7d7d;padding-left: 30px;line-height: 18px; margin-top: 0px;} +.jr_addcomment_btn{font-family: 'Roboto', sans-serif;color: #fff;font-weight: 300;font-size: 14px;border-radius:20px;height: 30px;background: #363636;padding-left: 20px;padding-right: 20px;text-transform: capitalize;margin-top:15px;} +.jr_select_offer_outter{padding-left:25px;padding-bottom: 20px;} +.jr_select_offer{width:100%;border:none;background: transparent;color: #363636;font-family: 'Roboto', sans-serif; font-size: 20px;-webkit-appearance: none;-moz-appearance: none;background:url("../assets/img/jr_dwn_arw.png");background-position: right;background-repeat: no-repeat;background-size: 15px;} +.jr_input_comment{width:100%;font-family: 'Roboto', sans-serif;border:none;font-size: 16px;margin-top:10px;} +.jr_tick{margin:0 auto;} +.jr_tick img{width:50px;} +.jr_theme_trans_bg{background: rgba(35,119,162,0.9);} +.jr_almost_wrapper{text-align: center; position: absolute;width: 100%;top: 15%;} +.jr_almost_wrapper h3{color: #fff;font-size: 24px;font-weight: 300;} +.jr_almost_wrapper p{color: #fff;font-size: 16px;font-weight: 300;} +.jr_almost_wrapper hr{border:2px solid #85b5cc;height:0px;width:50px;margin:0 auto;border-top:none;margin-top: 30px;margin-bottom: 30px;} +.jr_loginpop_btn{height:35px;border-radius:20px;background: #fff;width:110px;margin:0 auto;color: #2077a3;font-weight: 500;font-size: 15px;margin:5px;} +.jr_signpop_btn{height:35px;border-radius:20px;background:transparent;width:110px;margin:0 auto;color: #fff;font-weight: 500;font-size: 15px;border:1px solid #fff;margin:5px;} +.jr_more_pop_up{position: absolute;top:15px;right:10px;background: transparent;} +.jr_more_pop_up img{height: 20px;} +.jr_profile_banner{width:100%;height:200px;background:url("../assets/img/jr_profile_banner.png") !important;background-size:100% !important;background-position: center !important;background-repeat: no-repeat !important;text-align: center;} +.jr_profile_photo{width:100px;height:100px;border-radius:50%;background-color: #2874a2 !important;margin:0 auto;background:url("../assets/img/jr_avatar.png");background-position: center;background-repeat: no-repeat; background-size: 30px !important; position: relative;top: 110px;} +.jr_profile_photo img{width:100%;height:100%;border-radius:50%;object-fit: cover;object-position: center;} +.jr_profile_photo1{width:100px;height:100px;border-radius:50%;background-color: #2874a2 !important;margin:0 auto;background:url("../assets/img/jr_avatar.png");background-position: center;background-repeat: no-repeat; background-size: 30px !important; position: relative;top: 130px;} +.jr_profile_photo1 img{width:100%;height:100%;border-radius:50%;object-fit: cover;object-position: center;} +.jr_profile_photo_edit{position: absolute;top:0px;right:0px;} +.jr_profile_photo_edit img{width:30px;} +.jr_profile_content{width:85%;margin:0 auto;padding-bottom: 30px;} +.jr_profile_content h4{text-align: center;color: #555555;width:100%;padding-top:25px;font-weight: 300;font-size: 16px;} +.jr_profile_content hr{border:2px solid #ff7200;width:40px;margin:0 auto;border-radius:5px;height:0px;margin-top: 15px;} +.jr_profile_tab_bay{width:100%;border-radius:20px;height:30px;border:1px solid #a1a1a1;margin-top: 30px;} +.jr_profile_tab_bay li{width:50%;display: inline-block;text-align: center;float: left;height: 100%;color: #555555;padding: 5px;font-size: 15px;border-radius:20px;} +.jr_profile_tab_bay .active{background: #434343;color: #fff;} +.jr_profile_tab_content{width:100%;padding-bottom: 30px;} +.jr_profile_tab_content h4{text-align: left;color: #434343;font-weight: 500;margin:0px;margin-bottom: 15px;font-size: 17px;} +.jr_profile_tab_content ul{width:100%;margin:0px;padding:0px;} +.jr_profile_tab_content ul li{width:100%;list-style: none;color: #777676;font-size: 17px;font-weight: 300;padding-bottom: 7px;padding-top: 7px;background:url("../assets/img/jr_right_arw.png");background-position: right !important;background-repeat: no-repeat !important;background-size: 10px;} +.jr_profile_tab_content hr{border:1px solid #dcdcdc;width:100%;margin:0 auto;border-radius:5px;height:0px;margin-top:25px;border-top:none;} +.jr_profile_tab_content ul .verified{background:url("../assets/img/jr_verified1.png");background-size: 15px;} +.verified{background:url("../assets/img/jr_verified1.png");background-size: 15px;background-position: right !important;background-repeat: no-repeat !important;} + +/*POPOVER*/ + +.jr_popover_wrapper{background-color: rgba(0,0,0,0.7);width:100%;} +.jr_popover_wrapper ul{margin:0px;padding:5px;} +.jr_popover_wrapper ul li{list-style: none;color: #d3d3d3;font-size: 16px;padding: 5px;} +.popover-content{background: transparent !important;box-shadow: none !important;border-radius:0px !important;} +.popover-arrow::after{background:rgba(0,0,0,0.7) !important;border:none;} + +/*EDIT-PROFILE*/ + +.jr_edit_row{padding-bottom:20px;} +.jr_edit_row h5{color:#434343;font-weight: 400;font-size: 16px; margin-top: 0px;margin:0px;} +.jr_edit_select{border:1px solid #b7b7b7;border-radius:20px;height: 30px;width: 170px;padding-left: 25px;padding-right: 10px;margin-left:15px;background:url("../assets/img/jr_down_arrow.png") !important;background-position: right 15px top 10px !important;background-repeat: no-repeat !important;-webkit-appearance: none;-moz-appearance: none; background-size: 20px !important;} +.jr_edit_profile_input{border:none;border-bottom: 1px solid #959595 !important;width:100% !important;height:30px; margin-top: 5px;} +.jr_width25{width:25%;float: left;} +.jr_width5{width:5%;float: left;} +.jr_width40{width:40%;float: left;} +.jr_edit_select1{margin-top:8px;border:1px solid #b7b7b7;border-radius:20px;height: 30px;width:100%;padding-left:10px;padding-right: 10px;background:url("../assets/img/jr_down_arrow.png") !important;background-position: right 15px top 10px !important;background-repeat: no-repeat !important;-webkit-appearance: none;-moz-appearance: none; background-size: 20px !important;} +.jr_edit_row p{color: #7d7d7d;text-align: justify;font-size: 15px;line-height: 20px;margin-bottom: 0px;} +.jr_width70{width:70%;float: left;padding-left: 10px;} +.jr_width30{width:30%;float: left;} +.jr_profile_content h3{color:#636363;} +.jr_pre_input{width:100%;height:30px;} +.jr_width15{width:15%;float: left;} +.jr_width85{width:85%;float: left;} +.jr_width15 span img{ width: 35px;} +.jr_pre_select1 { + border: 1px solid #b7b7b7; + border-radius: 20px; + height: 35px; + width: 100%; + padding-left:20px; + padding-right: 10px; + background: url(../assets/img/jr_down_arrow.png) !important; + background-position: right 15px top 10px !important; + background-repeat: no-repeat !important; + -webkit-appearance: none; + -moz-appearance: none; + background-size: 20px !important; + color: #717171; +} +.jr_chooseid{width:100px;position: relative;top: 90px;} +.jr_proofs_list{width:100%;} +.jr_proofs_list li{width:100%;list-style: none;padding-bottom: 10px;padding-top: 10px;} +.jr_proofs_list li p{float: left;color: #777676;padding: 0px;margin:0px;font-size: 18px;} +.jr_radio_id{float:right;} +.jr_radio_id .radio-icon{border-color:#ff7200 !important;} +.jr_radio_id .radio-inner{background-color:#ff7200 !important;} +.jr_confidential{width:100%;border-top:1px solid #959595;padding-top:25px;padding-bottom: 50px;} +.jr_confidential_left{width:25%;float: left;text-align: center;border-right:1px solid #959595;} +.jr_confidential_left img{width:30px;} +.jr_confidential_right{width:75%;float: right;padding-right:15px;} +.jr_confidential_right p{color:#989797;margin:0px;padding-left: 10px;} +.jr_upload_img{width:100%;} +.jr_chooseid1{width: 100px;position: relative;top:45px;} +.jr_country_code{width:20%;float: left;} +.jr_phone_number{width:75%;float: right;} +.jr_car_pic{width:60px;height:60px;border-radius:50%;background-color: #ff7200 !important; background: url(../assets/img/jr_cam.png);background-position: center !important;background-repeat: no-repeat;background-size:20px;float: left;position: relative;} +.jr_car_name{float: left; padding-left: 10px;position: relative;top: 10px;} +.jr_car_name h5{margin:0px;font-size: 16px;} +.jr_edit1{position: absolute;top:0px;right:0px;} +.jr_edit1 img{width:20px;} +.jr_car_name p{margin:0px;font-size: 12px;padding-top: 5px;} +.jr_no_seat{padding-top: 10px;} +.jr_no_seat h4{margin:0px;padding:0px;text-align: left;font-family: 'Roboto', sans-serif;color: #8b8b8b;font-size: 16px;} +.jr_no_seat h4 img{ width: 18px;margin-right:10px;} +.jr_close{} +.jr_close img{width:40px;margin-top:20px;} +.jr_space_height{height:100px;} +.jr_add_car_bg{background-color:#fff !important;background:url("../assets/img/jr_profile_banner.png");background-repeat: no-repeat !important;background-position: center bottom !important;background-size: 150% !important;} +.jr_upload_image_car{width:180px;height:180px;border-radius:50%;margin:0 auto;} +.jr_upload_image_car img{width:100%;height:100%;border-radius:50%;} +.jr_profile_banner1 { + width: 100%; + height: 200px; + background: url(../assets/img/jr_public_bg.png) !important; + background-size: 100% !important; + background-position: center !important; + background-repeat: no-repeat !important; + text-align: center; +} +.jr_age1{width:100%;margin:0px;text-align: center;color:#555555; font-size: 16px;} +.jr_notification{width:100%;} +.jr_notification ul{width:100%;margin:0px;padding:0px; padding-top: 10px;} +.jr_notification ul li{width:100%;background: none !important;} +.jr_notification ul li .child1{float:left;width:80%;} +.jr_notification ul li .child2{float:right;width:20px;} +.jr_custom1 label {display: inline-block;cursor: pointer;position: relative;padding-left: 25px;margin-right: 15px;color: #8b8b8b;font-size: 13px;font-family: 'Roboto', sans-serif;font-weight:400;} +.jr_custom1 label:before {content: "";display: inline-block;width: 14px;height: 14px;position: absolute;left: 0;bottom: 1px;background-color: #ffffff;border-radius:0px !important;border:1px solid #959595;border-radius:3px !important;} +.jr_custom1 label:before {border-radius: 8px;} +.jr_custom1 input[type=checkbox] {display: none;} +.jr_custom1 label:before {border-radius: 3px;} +.jr_custom1 input[type=checkbox]:checked + label:before {content: "\2713";font-size: 14px;color: #6a449b;text-align: center;line-height:16px;font-weight:600;border:1px solid #ff7200;} +.jr_custom1{width:15px;position: relative;top: 4px;} +.jr_profile_tab_content h6{color: #a8a8a8; font-size: 14px;margin:0px;font-weight: 300;} +.jr_message_wrapper{} +.jr_home_tab_bay1 {width: 100%;padding: 5px;padding-top: 0px;} +.jr_home_tab_bay1 ul {width:85%;text-align: center;padding: 0px;margin: 0 auto;border:1px solid #144b6d;border-radius:20px;margin-bottom: 5px;} +.jr_home_tab_bay1 ul li {width: 50%;display: inline-block;text-align: center;color: #fff;padding:5px;float: left;} +.jr_home_tab_bay1 ul .active {background:#144b6d;border-radius: 20px;} +.jr_no_msg{padding-top:75px;} +.jr_notification_main{width:100%;} +.jr_notification_main ul{margin:0px;padding:0px;width:100%; padding-top: 10px;} +.jr_notification_main ul li{width:100%;list-style: none;text-align: left;border-bottom: 1px solid #dcdcdc;padding-bottom: 5px;} +.jr_notification_main ul li h4{color: #144b6d;text-align: left;padding: 0px;font-weight: 400;} +.jr_notification_main ul li p{color: #8e8e8e;text-align: left;font-weight: 300;} +.jr_not_left{float: left; width: 80%;} +.jr_not_close{float: right; position: relative;top: 30px;} +.jr_not_close img{width:20px;} + +/*SEARCH-RESULT*/ + +.jr_duration{width:100%;padding-top: 20px;padding-bottom: 20px;border-bottom:1px solid #bbbbbb;} +.jr_avg_duration{width: 50%;float: left;text-align: right !important;background:url("../assets/img/jr_clock.png");background-repeat: no-repeat !important;background-position:left !important;background-size: 25px !important;padding-right: 15px;} +.jr_avg_price{width:50%;float: left;text-align: left !important; padding-left: 15px;border-left:1px solid #bbbbbb;} +.jr_duration p{margin:0px;padding:0px;color: #818181;font-size: 11px;font-weight: 300;} +.jr_duration h4{margin:0px;padding:0px;color: #279a80; font-size: 13px;} +.jr_avg_duration p{text-align: right !important;} +.jr_avg_duration h4{text-align: right !important;padding-top: 4px;} +.jr_avg_price p{text-align: left !important;padding-bottom: 3px;} +.jr_avg_price h4{text-align: left !important;} +.jr_avg_price h4 strong{ font-size: 15px;} +.jr_search_main{width:100%;} +.jr_search_main h5{margin:0px;color: #434343;font-size: 16px;padding-top: 15px;padding-bottom:5px;} +.jr_search_main ul{margin:0px;padding: 0px;} +.jr_search_main ul li{list-style: none;background: #f5f5f5;margin-bottom: 3px;} +.jr_search_top_bay{width:100%;padding: 10px;border-bottom: 1px solid #e7e7e7;} +.jr_search_top_bay_left{float: left;} +.jr_search_top_bay_right{float: right;} +.jr_search_top_bay_left h6{color: #434343;margin:0px;padding: 0px; font-size: 12px;font-weight: 500;padding-bottom: 3px;} +.jr_search_top_bay_left h6 strong{color: #767676;margin:0px;padding: 0px;font-size: 14px;font-weight: 500;padding-left:8px;} +.jr_search_top_bay_right h6{text-align: right;color: #2078a2;margin:0px;padding: 0px;} +.jr_search_bottom_bay{width:100%;padding: 10px;} +.jr_search_profile{float: left;width:75px;height:75px;border-radius:50%;border:1px solid #2078a2;position: relative;} +.jr_search_profile img{width:100%;height:100%;border-radius:50%;object-fit: cover;object-position: center;} +.jr_search_profile_detail{float: left;padding-left: 15px;} +.jr_search_verified{position:absolute;top:0px;right:0px;} +.jr_search_verified img{width: 20px;border:none;} +.jr_search_profile_detail h6{margin:0px;color: #585858;font-weight: 400;font-size: 13px;padding-bottom: 5px;} +.jr_star_ratting{color: #585858;font-weight: 300;} +.jr_star_ratting strong{padding-left:5px;padding-right: 10px;} +.jr_star_ratting img{width: 14px; position: relative;top: 1px} +.jr_search_profile_detail ul{margin:0px;padding: 0px;padding-top:10px;} +.jr_search_profile_detail ul li{display: inline-block;width:30px;height:30px;border:1px solid #2078a2;border-radius:50%;color: #585858;font-size: 10px;padding-top: 4px;text-align: center;} +.jr_search_profile_detail ul li span{position: relative;top:2px;} +.jr_filter_icon{width:50px;height:50px;background:url("../assets/img/jr_filter_icon.png");background-repeat: no-repeat !important;background-size: cover !important;position: fixed;bottom: 10px;right:20px;border-radius:50%;} +.jr_filter_okay{width:50px;height:50px;background:url("../assets/img/jr_filter_okay.png");background-repeat: no-repeat !important;background-size: cover !important;position: fixed;bottom: 10px;right:80px;border-radius:50%;} +.jr_filter_close{width:50px;height:50px;background:url("../assets/img/jr_filter_close.png");background-repeat: no-repeat !important;background-size: cover !important;position: fixed;bottom: 10px;right:20px;border-radius:50%;} +.jr_bookonline{height: 30px;border-radius:20px;border:none;background: #f16730;color: #fff;text-transform: capitalize;margin-top: 10px; font-size: 12px;} +.jr_preference_bay{width:100%;} +.jr_preference_bay ul{width:100%;text-align: left;padding: 0px;margin:0px;} +.jr_preference_bay ul li{display: inline-block;} +.jr_preference_bay ul li img{width: 30px;margin-right: 5px;} +.jr_verification{margin:0px;padding: 0px;padding-top: 5px;} +.jr_verification li {width: 100%;list-style: none;color: #777676;font-size: 17px;font-weight: 300;padding-bottom: 7px;padding-top: 7px;padding-left:30px;background-position:left !important;background-repeat: no-repeat !important;background-size: 10px;} +.jr_verification .verified{background:url("../assets/img/jr_verified1.png");background-size: 15px;} +.jr_verification .response{background:url("../assets/img/jr_response.png");background-size: 15px;} +.jr_verification .time{background:url("../assets/img/jr_time.png");background-size: 15px;} +.jr_verification .loca{background:url("../assets/img/jr_loca.png");background-size: 15px;} +.child1{width:40%;float: left;} +.child2{width:60%;float: left;} +.jr_time_schedule{padding-top: 0px;padding-bottom: 15px;} +.jr_time_schedule h5{color:#464646;font-weight: 300;font-size: 24px;} +.jr_from_to{width:100%;} +.jr_from_to li{list-style: none;width:100%; padding-bottom: 15px} +.jr_from_to .child1{width:25%;float: left; font-size: 16px;color: #464646;position: relative;} +.jr_from_to .child2{width:75%;float: left;padding-left: 20px;} +.jr_from_to .child2 strong{color: #595959;font-size: 16px;} +.jr_from_to .child2 p{color: #595959;font-weight: 300;margin: 0px; font-size: 15px;} +.jr_from_to .from{border-radius: 20px;background: url(../assets/img/jr_blue_circle.png) !important;font-family: 'Roboto', sans-serif;background-repeat: no-repeat !important;background-position:right 8px top 2px !important;background-size: 16px !important;} +.jr_from_to .to{border-radius: 20px;background: url(../assets/img/jr_orange_circle.png)!important;font-family: 'Roboto', sans-serif;background-repeat: no-repeat !important;background-position:right 8px top 2px !important;background-size: 16px !important;} +// .jr_box1 {height: 50px;width: 20px;border-right: 1px solid #b6b6b6;position: absolute;top: 20px;right: 19%;} +.jr_available_seats{width:100%;color: #838383;font-size: 18px;padding-top: 20px;padding-bottom: 20px;} +.jr_available_seats strong{color: #464646;} +.jr_seats_left{float: left;width:50%;} +.jr_seats_right{float: right;width:50%;text-align: right;} +.jr_contact_btn{width: 100%;height:35px;border:1px solid #1d78a3;border-radius: 20px;color: #1d78a3;background: transparent;font-size: 15px;background: url(../assets/img/jr_call.png) !important;background-repeat: no-repeat !important;background-size: 20px !important;background-position: 15% !important;} +.jr_contact_btn span img{} +.jr_profile_content1{padding-bottom: 60px;} +.jr_profile_content1 h5{margin: 0px;color: #434343;font-size: 16px;padding-top: 15px;padding-bottom: 5px;} +.jr_profile_content1 p{color: #595959;font-weight: 300;margin: 0px;font-size: 15px;padding-top: 10px;padding-bottom:10px;} +.jr_verification .loca1{background:url("../assets/img/jr_loca1.png");background-size: 15px;} +.jr_verification .detour{background:url("../assets/img/jr_detour.png");background-size: 15px;} +.jr_verification .flex{background:url("../assets/img/jr_flex.png");background-size: 15px;} +.jr_verification .seat1{background:url("../assets/img/jr_seat1.png");background-size: 15px;} +.jr_car_info{width:100%;padding-top: 15px;} +.jr_car_info_left{width:50%;float: left;} +.jr_car_info_right{width:50%;float: right;} +.jr_car_info_right p img{width:30px;} +.jr_car_info_right p span{position: relative; position: relative;bottom: 10px;left: 5px;} +.jr_car_info_photo{float: left;width:50px;height:50px;border-radius:50%;} +.jr_car_info_photo img{width:100%;height:100%;border-radius:50%;object-fit: cover;object-position: center;} +.jr_car_info_detail{float: left; padding: 10px;padding-left: 20px;padding-top: 0px;} +.jr_car_info_detail h6{margin:0px;} +.jr_car_info_detail p{margin:0px;padding: 0px;} +.jr_car_info_detail p img{width:20px;} +.jr_report{height:35px;border:1px solid #000000;border-radius:20px;padding-left:20px;padding-right:20px;text-transform: capitalize;background: transparent;color: #000000;} +.jr_bottom_button_bay1{text-align: center;} + +.jr_book_pop_up_wrapper{width:70%;margin:0 auto;background: #ffffff;border-radius:20px; padding: 25px;margin-top:50px;} + +.jr_book_pop_up_wrapper h4 {text-align: center;color: #555555;width: 100%;padding-top: 30px; font-weight: 300;font-size: 16px;} +.jr_book_pop_up_wrapper h3 {color: #636363;} +.jr_book_pop_up_wrapper hr {border: 2px solid #ff7200;width: 40px;margin: 0 auto;border-radius: 5px;height: 0px;margin-top: 15px;} +.jr_counter{width:100%;text-align: center; padding-top: 15px;} +.jr_count_item{} +.jr_count_item img{width:20px;} +.jr_count{color:#1188ca;font-size: 35px;font-weight: 300; padding-left: 10px;padding-right: 10px;} +.jr_bottom_send{background: #343434;color: #fff;border-radius:20px;height:35px;border:none;color: #fff;font-size: 14px;padding-left: 40px;padding-right: 40px;text-transform: capitalize; line-height: 13px;} +.jr_bottom_send span img{width: 16px;margin-left: 10px;} +.jr_text_msg{width:100%;position: relative;margin-bottom: 50px;} +.jr_send_msg{width:100%;border:none;border-bottom: 1px solid #bcbcbc;height:35px;font-size: 16px;} +.jr_send_msg::-webkit-input-placeholder { color:#8c8c8c;} +.jr_send_msg::moz-input-placeholder { color:#8c8c8c;} +.jr_attch{position: absolute;right:0px;top:0px;} +.jr_attch span img{height:25px;margin-left: 10px;} +.jr_no_ride{width:100%;} +.jr_no_ride p{text-align: center;color: #7d7d7d;} +.jr_ride_wrapper h3{color: #2078a2;font-weight: 300;text-align: justify; font-size: 18px;} +.jr_ride_wrapper ul{padding: 0px;margin:0px;} +.jr_ride_wrapper ul li{list-style: none;color: #717171; font-size: 16px;font-weight: 300;padding-left: 30px;background-position: left !important;background-repeat: no-repeat !important;} +.jr_ride_wrapper .from{ background: url(../assets/img/jr_blue_circle.png);background-size: 15px;} +.jr_ride_wrapper .to{ background: url(../assets/img/jr_orange_circle.png);background-size: 15px;} +.jr_rangebar{padding: 0px;} +.jr_rangebar .item-inner{padding: 0px !important;} +.jr_rangebar .range-knob{background: #2077a3 !important;} +.jr_rangebar .range-bar-active{background: #2077a3 !important;} +.jr_rangebar .range-pin{background: #2077a3 !important;color: #fff;} +.jr_rangebar .range-pin::before{background: #2077a3 !important;color: #fff;} +.jr_rangebar h6{color: #464646; position: relative;top: 30px;} +.jr_member_rate{height: 35px;border-radius:20px;width:100%;border:none;color: #fff;text-transform: capitalize;background: #4d4d4d; font-size: 15px;font-weight: 400;} +.jr_inside_bg{width:100%;height:100%;background:#2b7091;} +.jr_sidemenu_top{width:100%;text-align: center;} +.jr_sidemenu_photo{width:100px;height:100px;border:2px solid #fff;border-radius:50%;} +.jr_sidemenu_photo img{width:100%;height:100%;border:1px solid #fff;border-radius:50%;object-fit:cover;object-position: center;} +.jr_sidemenu_detail{} +.jr_sidemenu_detail h4{color: #fff;font-weight: 300;font-size:18px;} +.jr_sidemenu_detail p{color: #fff;font-weight: 400;font-size: 14px; margin-top: 0px;} +.jr_side_edit{border-radius:20px;background: #11445b;padding-left:20px;padding-right: 20px;color: #fff;font-size: 16px;height:30px;} +.jr_sidemenu_detail ul{margin:0px;padding:0px; padding-top: 50px;} +.jr_sidemenu_detail ul li{color: #fff;list-style: none;padding-bottom: 20px;} +.jr_sidemenu_detail ul li img{height: 18px;margin-right: 15px;} +.jr_sidemenu_detail ul li span{font-size: 16px;font-weight: 300;} +.jr_home_active{width:100%;height:100%;background:url("../assets/img/jr_home_active.png") !important;background-repeat: no-repeat !important;background-position: center bottom !important;background-size:cover !important;position: relative;} +.jr_home_offer_ride{width:100%; padding-top: 20px; +} +.jr_home_offer_ride ul{margin:0px;padding:0px;position:relative;} +.jr_home_offer_ride ul li{width:100%;list-style: none;background: #fff;border-radius:8px;margin-bottom: 10px;position:relative;padding:10px;position: relative;} +.jr_offer_ride_top{ + background: -webkit-linear-gradient(left, #1379a1 , #6a449b); + background: -o-linear-gradient(right, #1379a1, #6a449b); + background: -moz-linear-gradient(right, #1379a1, #6a449b); + background: linear-gradient(to right, #1379a1 , #6a449b); + color: #fff; + padding:11px;border-radius:10px; + font-weight: 300;font-size: 16px; + position: relative; + top: 10px; +height:50px; +} +.jr_book_ride_top{ + background: -webkit-linear-gradient(left, #f16436 , #ef548d); + background: -o-linear-gradient(right, #f16436, #ef548d); + background: -moz-linear-gradient(right, #f16436, #ef548d); + background: linear-gradient(to right, #f16436 , #ef548d); + color: #fff; + padding:11px;border-radius:10px; + font-weight: 300;font-size: 16px; + position: relative; + top: 10px; +height:50px; +} +.jr_home_offer_photo{width:60px;height:60px;border-radius:50%;float: left;} +.jr_home_offer_photo img{width:100%;height:100%;border-radius:50%;} +.jr_home_offer_detail{float:right; padding-left: 15px;position: relative;width:75%;} +.jr_home_offer_detail h5{margin:0px;padding: 0px;color: #2077a3;font-weight: 300;text-align: left;} +.jr_home_offer_detail h6{margin:0px;padding: 0px;color: #757575;padding-top: 3px;padding-bottom: 3px;font-weight:300;} +.jr_home_offer_detail p{margin:0px;padding: 0px;color: #9d9d9d;font-weight: 300;text-align: left;} +.jr_home_offer_detail p span{margin-left:10px;margin-right:10px;} +.jr_home_offer_detail p span img{width:8px;} +.jr_edit_more{position: absolute;bottom:10px;right:10px;} +.jr_edit_more img{width: auto;height:16px;} +.jr_home_btm{background:url("../assets/img/jr_exclam.png") !important;background-repeat: no-repeat !important; background-position: left 10px top 5px !important;background-size: 18px !important;color: #e9801a;text-align: center;font-weight: 300;} +.jr_home_btm hr{width:100%;border:1px solid #b3b3b3;border-top:none;height:0px;} +.jr_home_btm p{text-align: center;margin:0px;color: #e9801a;padding-top: 5px;} +.jr_your_booking{width:100%;} +.jr_request_confirm{width:100%;padding-bottom: 15px;border-bottom:1px solid #dcdcdc;padding-top: 10px;} +.jr_request_left{width:20%;float: left;text-align:center;} +.jr_request_left img{ width: 30px;margin:0 auto;padding-top: 20px;} +.jr_request_right{width:80%;float: right;border-left:1px solid #dcdcdc;padding-left: 15px;} +.jr_request_right h5{color: #699ab8;margin:0px;padding: 0px;font-size: 18px;} +.jr_request_right p{color: #949494;margin:0px;padding: 0px; padding-top: 10px;font-size: 12px;padding-bottom: 3px;} +.jr_request_right h6{color: #464646;margin:0px;padding: 0px;font-size:15px;} +.jr_time_schedule p{color: #f16730;padding:0px;margin:0px;font-weight: 400;} +.jr_summary{width:100%;} +.jr_summary h6{font-size: 13px;padding-top: 5px;padding-bottom: 5px;} +.jr_summary_details{width:100%;} +.jr_summary_details h5{font-size:16px;padding-bottom: 15px;} +.jr_summary_details h5 span img{height:13px;margin-left:15px;} +.jr_summary_details p{font-size: 14px;padding-bottom:5px;padding-top: 5px;} +.jr_summary_msg{width:100%;background:url("../assets/img/jr_summary_msg.png") !important;background-repeat: no-repeat !important;color: #3c83a9; font-size: 16px;padding-left: 30px; background-size: 20px !important;} +.jr_login_wrapper{width:100%;padding-top: 35px;} +.jr_logo{width:100%;text-align: center;} +.jr_logo img{width: 100px;} +.jr_login_detail{width:100%;padding-top: 20px;text-align: center;} +.jr_login_detail h5{color: #fff;text-align: center;margin:0px;font-weight: 300;font-size: 20px;} +.jr_login_detail h4{color: #fff;text-align: center;margin:0px;font-weight: 600;padding: 0px;font-size: 25px;padding-bottom: 10px;padding-top:0px;} +.jr_login_detail p{color: #fff;text-align: center;margin:0px;font-size: 14px;font-weight: 300;} +.jr_login_detail hr{border-color: #fff !important;margin-top: 30px;margin-bottom: 50px;} +.jr_login_input{height:35px;border:1px solid #1379a1;border-radius:20px;width:100%;background: transparent;padding-left:20px;padding-right: 15px;margin-bottom: 15px;color: #fff;} +.jr_login_input::-webkit-input-placeholder {color:#fff;} +.jr_login_input::-moz-placeholder {color:#fff;} +.jr_login_input:-ms-input-placeholder {color:#fff;} +.jr_login_input:-moz-placeholder {color:#fff;} +.jr_btm_btn1 {height: 40px;border-radius:50%;background: #1379a1;color: #fff;font-family: 'Roboto', sans-serif;transition: width 2s;width: 40px;margin: 0 auto;text-align: center;font-size: 15px;padding: 10px; border: none;text-transform: capitalize;} +.jr_btm_btn2 {height: 40px;border-radius:50%;background: #f05e5a;color: #fff;font-family: 'Roboto', sans-serif;transition: width 2s;width: 40px;margin: 0 auto;text-align: center;font-size: 15px;padding: 10px; border: none;text-transform: capitalize;} +.jr_btm_btn1 img {width: 8px;} +.jr_btm_btn2 img {width: 8px;} +.jr_login_input1{height:35px;border:1px solid #f16823;border-radius:20px;width:100%;background: transparent;padding-left:20px;padding-right: 15px;margin-bottom: 15px;color: #fff;} +.jr_login_input1::-webkit-input-placeholder {color:#fff;} +.jr_login_input1::-moz-placeholder {color:#fff;} +.jr_login_input1:-ms-input-placeholder {color:#fff;} +.jr_login_input1:-moz-placeholder {color:#fff;} +.jr_passcode{padding-bottom: 50px;} +.jr_passcode ul{margin:0px;padding: 0px;width:100%;text-align: center;} +.jr_passcode ul li{display: inline-block;width:50px;height:50px;border-radius:50%;text-align: center; margin: 5px;} +.jr_passcode_select{width:100%;height:100%;border-radius:50%;border:1px solid #fff;background: transparent;color: #fff; -webkit-appearance: none;-moz-appearance: none;text-align: center; font-size: 16px;padding-left: 18px;} +.jr_passcode_select option{color: #fff;text-align: center;} +.jr_passcode_select:focus{width:100%;height:100%;border-radius:50%;border:1px solid #f16823;} +.jr_passcode_select option:focus{color:#f16823;width:100%;text-align: center !important;} +.jr_submit_signup{height: 35px; border-radius: 20px; border: none;background: linear-gradient(to right, #f16823, #ef519d);text-transform: capitalize !important;font-size: 14px;font-weight: 400; line-height: 5px;padding-left: 25px;padding-right:25px;margin:0 auto;margin-bottom: 15px;} +.jr_pick_drop{width:100%;height:100%;} +.jr_map{width:100%;height:60%;background:url("../assets/img/jr_map_bg.png") !important;background-repeat: no-repeat;background-position: center;background-size: cover !important;} +.jr_pick_drop_detail{width:100%;height:40%;box-shadow: 10px 10px 60px 15px #888888;padding: 10px;} +.jr_up_arw{width:100%;text-align: center;} +.jr_up_arw img{width: 20px;} +.jr_pick_drop_detail ul{width:80%;margin:0px;padding:0px;margin: 0 auto;padding-top: 15px;padding-bottom: 15px;} +.jr_pick_drop_detail ul li{width:100%;margin:0px;padding:0px;list-style: none;width:100%;padding-bottom: 7px;padding-top: 7px;} +.jr_pick_drop_detail ul li p{float: left;color: #777676;font-size:16px;margin:0px;padding-top: 5px;padding-left: 15px;} +.jr_pick_drop_detail ul hr{width:100%;height:0px;margin-top:20px;border-bottom:1px solid #e7e7e7;border-top:none;height:0px;} +.jr_pick_drop_detail h5{text-align: center;color: #777676;font-size: 20px;font-weight: 300;} +.jr_pick_drop_detail hr{width:40px;border:2px solid #ff7200;border-radius:20px;height:0px;margin:0 auto;} +.jr_loc_no{float: left;width:30px;height:30px;background:url("../assets/img/jr_loc1.png") !important;font-size:12px;background-repeat: no-repeat !important;background-position:center !important;color: #fff;text-align: center;background-size: 25px !important;padding-top:7px;} +.jr_other_place{border:1px solid #2078a2;color: #2078a2;height:35px;padding-left: 20px;padding-right: 20px;border-radius:20px;background: transparent;} +.jr_loc_no1 .jr_radio_id {float: right;position: relative;top: 4px;} + +/*CHAT*/ + +.jr_chat_div{} +.jr_chat_div ul{margin:0px;padding:0px;} +.jr_chat_div ul li{list-style: none;width:100%;padding-top: 10px;padding-bottom: 10px;} +.jr_chat_div .jr_sender{} +.jr_chat_div .jr_receiver{} +.jr_search_profile{} +.chat_i{width:20px;height:20px;position: absolute;background-position: center !important;background-size:30px;background-repeat: no-repeat !important;} +.jr_sender .chat_i{left:-9px;top:3px;background:url("../assets/img/jr_chat_left.png") !important; background-repeat: no-repeat !important;} +.jr_receiver .chat_i{right:-9px;top:3px;background:url("../assets/img/jr_chat_right.png") !important; background-repeat: no-repeat !important; background-size: 20px !important;} +.jr_chat_detail{ padding-top: 8px;} +.jr_message{border-radius:20px;color: #fff;padding:8px;position:relative;} +.jr_chat_top{padding-bottom: 10px;} +.jr_chat_top strong{color: #585858;font-weight: 500;font-size: 13px;} +.jr_chat_top span{color: #8a8a8a;font-weight: 400;font-size: 13px;} + +.jr_chat_detail .jr_chat_top{margin:0px;} +.jr_chat_detail .jr_chat_top strong{color: #585858;} +.jr_chat_detail .jr_chat_top span{color: #8a8a8a;} + +.jr_sender .jr_search_profile{float: left;} +.jr_receiver .jr_search_profile{float: right;} +.jr_sender .jr_chat_detail{float: left;padding-left: 20px;} +.jr_receiver .jr_chat_detail{float: right;padding-right:20px;} +.jr_sender .jr_message{background: #2077a3;padding-left: 15px;} +.jr_receiver .jr_message{background: #166086;text-align: right;padding-right: 15px;} +.jr_sender .jr_chat_detail .jr_chat_top{text-align: left;} +.jr_receiver .jr_chat_detail .jr_chat_top{text-align: right;} +.jr_sender .jr_chat_detail .jr_chat_top strong{float: left;margin-right:20px;} +.jr_sender .jr_chat_detail .jr_chat_top span{float: left;} +.jr_receiver .jr_chat_detail .jr_chat_top strong{float: right;margin-left:20px;} +.jr_receiver .jr_chat_detail .jr_chat_top span{float: right;} + +.jr_driver_profile{background:#f0f0f0; padding: 10px;} +.jr_driver_profile .jr_search_profile_detail{} +.jr_driver_profile .jr_search_profile_detail h6{font-size: 16px;} +.jr_driver_profile .jr_search_profile_detail h6 span{float: right;font-size: 12px;position: relative;top: 3px;} +.jr_driver_profile .jr_home_offer_photo{border:1px solid #2078a2;} +.jr_avia{width:100%;} +.jr_avia .left{float: left;} +.jr_avia .right{float:left;} +.jr_avia img{width:15px; position: relative;top: 4px;margin-right: 10px;} +.jr_approve_btn_bay{width:100%;} +.jr_approve_btn{width:49%;float: left;height:35px;border-radius:20px;background: #49a11e;color: #fff;font-size: 16px;text-transform: capitalize;} +.jr_decline_btn{width:49%;float: right;height:35px;border-radius:20px;background: #515151;color: #fff;font-size: 16px;text-transform: capitalize;} +.jr_edit_btn{width:49%;float: left;height:35px;border-radius:20px;background:transparent;color: #f7941d;font-size: 16px;border:1px solid #f7941d;text-transform: capitalize;} +.jr_delete_btn{width:49%;float: right;height:35px;border-radius:20px;background:transparent;color: #d52a2a;font-size: 16px;border:1px solid #d52a2a;text-transform: capitalize;} +.jr_p{color: #717171 !important;text-align: left !important;font-size: 16px;font-weight: 400 !important;} +} diff --git a/src/pages/ridesummary/ridesummary.ts b/src/pages/ridesummary/ridesummary.ts new file mode 100644 index 0000000..6d96d96 --- /dev/null +++ b/src/pages/ridesummary/ridesummary.ts @@ -0,0 +1,92 @@ +import { Component, NgZone } from '@angular/core'; +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() +@Component({ + selector: 'page-ridesummary', + templateUrl: 'ridesummary.html', +}) +export class RidesummaryPage { + book: any; + geocoder: any; + loc = { from: '', to: '', fromAd: '', toAd: '' } + local: user + public unregisterBackButtonAction: any; + driver: any; + ride:any; + + 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.initializeBackButtonCustomHandler(); + this.storage.get('user_data').then(data => { + if (data) { + this.local = data + this.book = this.data.getbookingData() + console.log(this.book) + + this.driver = this.data.getdriverData() + console.log(this.driver) + + + this.geocoder = new google.maps.Geocoder(); + for (let i = 0; i < 2; i++) { + if (i == 0) { + var lat = this.book.pickLat + var lng = this.book.pickLng + } + else { + var lat = this.book.dropLat + var lng = this.book.dropLng + } + var latlng = new google.maps.LatLng(lat, lng); + var This = this; + This.geocoder.geocode({ 'latLng': latlng }, function (results, status) { + if (status == google.maps.GeocoderStatus.OK) { + if (results[0]) { + if (i == 0) { + var temp = This.book.pickArea.split(',') + This.loc.from = temp[0] + This.loc.fromAd = results[0].formatted_address + } + else { + var temp = This.book.dropArea.split(',') + This.loc.to = temp[0] + This.loc.toAd = results[0].formatted_address + This.zone.run(() => { }); + } + } + } + else { + console.log("Geocoder failed due to: " + status); + } + }); + } + } + }) + + this.myservice.load_post({ bookingId: this.book.bookingId},'getRideDetails').subscribe(resp=>{ + if(resp.status == 'success'){ + this.ride = resp.data + } + }) + } + + public initializeBackButtonCustomHandler(): void { + this.unregisterBackButtonAction = this.platform.registerBackButtonAction(() => { + // this.customHandleBackButton(); + }, 10); + } + + ionViewWillLeave() { + this.unregisterBackButtonAction && this.unregisterBackButtonAction(); + } + +} -- libgit2 0.27.1