Merge branch 'adarsh' into 'master'

src/app/address/address.page.html

@@ -22,14 +22,16 @@
         <ion-grid *ngFor="let address of addressService.addressList; let i = index">
             <ion-row>
                 <ion-col size="1">
-                    <input type="radio" id="address_{{i}}" class="address-radio" name="address" (change)="setDefault(address.addressId)" [checked]="address.defaultVal == 1" />
+                    <input type="radio" id="address_{{i}}" class="address-radio" name="address"
+                        (change)="setDefault(address.addressId)" [checked]="address.defaultVal == 1" />
                 </ion-col>
                 <ion-col size="9">
                     <h1>{{address.addressType}}</h1>
-                    <h1>{{address.address}}</h1>
+                    <!-- <h1>{{address.address}}</h1> -->
                     <p>{{address.building}}, {{address.landmark}}</p>
                 </ion-col>
-                <ion-col size="2" [hidden]="address.defaultVal == 1"><button class="show-btn" (click)="addressService.deleteAddress(address.addressId)">
+                <ion-col size="2" [hidden]="address.defaultVal == 1"><button class="show-btn"
+                        (click)="addressService.deleteAddress(address.addressId)">
                         <img src="../../assets/delete.png" /></button></ion-col>
             </ion-row>
         </ion-grid>

src/app/cart/cart.page.html

@@ -321,7 +321,7 @@
                         <p>
                             {{address.building}}, <span
                                 *ngIf="address.landmark && address.landmark!==''">{{address.landmark}},</span>
-                            {{address.address}}
+                            <!--  {{address.address}} -->
                         </p>
                     </div>
                     <div class="clear"></div>

src/app/changeaddress/changeaddress.page.html

@@ -31,12 +31,18 @@
             class="form-horizontal">
             <div class="add_address_wrapper">
                 <h5>DELIVERY</h5>
-                <p>{{address}}</p>
-                <input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building" required
+                <!-- <p>{{address}}</p> -->
+                <!-- <input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building" required
                     placeholder="House No./ Building No" />
                 <div class="md-errors-spacer" [hidden]="building.valid || landmark.pristine" class="ion-padding-start">
                     Building Name is required
-                </div>
+                </div> -->
+                <input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building"
+                    placeholder="House No./ Building No" [value]="address" (keydown.enter)="$event.preventDefault()"
+                    autocorrect="off" autocapitalize="off" spellcheck="off" type="text" #building />
+                <!-- <div class=" md-errors-spacer" [hidden]="building.valid || landmark.pristine" class="ion-padding-start">
+                Building Name is required
+            </div> -->
                 <input [(ngModel)]="addressForm.landmark" name="landmark" #landmark="ngModel" name="landmark"
                     placeholder="Landmark" />
                 <ion-grid>

src/app/changeaddress/changeaddress.page.scss

@@ -2,7 +2,7 @@
     width: 100%;
     height: 100vh;
     .map-inner {
-        height: calc(100% - 348px);
+        height: calc(100% - 375px);
         position: relative;
         .map-pin {
             position: absolute;
@@ -11,8 +11,10 @@
             -webkit-transform: translate(-50%, -50%);
             transform: translate(-50%, -50%);
             width: 20px;
+            height: 40px;
             img {
-                margin-top: -23px;
+                margin-top: -20px;
+                    display: block;
             }
         }
     }
@@ -60,6 +62,7 @@
         margin: 0px;
         padding: 0px;
         font-weight: 800;
+        margin-bottom: 20px;
     }
     input {
         width: 100%;
@@ -143,7 +146,7 @@
             }
         }
         .map-inner {
-            height: calc(100% - 235px);
+            height: calc(100% - 300px);
         }
     }
 }
\ No newline at end of file

src/app/changeaddress/changeaddress.page.ts

@@ -39,6 +39,7 @@ export class ChangeaddressPage implements OnInit {
   lng: any;
   newCenterLat: number;
   newCenterLng: number;
+  @ViewChild('building', { static: false })
   public searchElementRef: ElementRef;
 
   constructor(
@@ -76,6 +77,20 @@ export class ChangeaddressPage implements OnInit {
     this.mapsAPILoader.load().then(() => {
       this.setCurrentLocation();
       this.geoCoder = new google.maps.Geocoder();
+      const autocomplete = new google.maps.places.Autocomplete(this.searchElementRef.nativeElement, {
+        types: ['address']
+      });
+      autocomplete.addListener('place_changed', () => {
+        this.ngZone.run(() => {
+          const place: google.maps.places.PlaceResult = autocomplete.getPlace();
+          if (place.geometry === undefined || place.geometry === null) {
+            return;
+          }
+          this.latitude = place.geometry.location.lat();
+          this.longitude = place.geometry.location.lng();
+          this.zoom = 16;
+        });
+      });
     });
   }
   // google maps zoom level
@@ -160,6 +175,8 @@ export class ChangeaddressPage implements OnInit {
   }
 
   onSubmit(data: any) {
+    console.log();
+    const buildAddress = this.searchElementRef.nativeElement.value;
     this.loader = true;
     this.service.get('order').then(val => {
       console.log(val);
@@ -178,11 +195,12 @@ export class ChangeaddressPage implements OnInit {
         );
         const distanceKM = (distanceNew / 1000).toFixed(2);
         if (distanceKM < This.service.distance) {
+          console.log(buildAddress);
           const orderId = val.orderId;
           const postData: Address = {
-            address: This.address,
             addressType: data.addressType,
-            building: data.building,
+            address: '',
+            building: buildAddress,
             landmark: data.landmark !== undefined ? data.landmark : '',
             defaultVal: 0,
             uid: This.uid,

src/app/home/home.page.html

@@ -141,6 +141,12 @@
         </div>
     </ion-header>
     <ion-content class="sort_wrappper">
+        <div class="location-finder">
+
+            <input type="text" placeholder="Search for location" (keydown.enter)="$event.preventDefault()"
+                autocorrect="off" autocapitalize="off" spellcheck="off" type="text" #building>
+
+        </div>
         <agm-map [zoom]="20" [latitude]="lat" [longitude]="lng" [disableDefaultUI]="false" [zoomControl]="false"
             [backgroundColor]="'rgba(29, 27, 130,0.2)'">
             <agm-marker [latitude]="lat" [longitude]="lng" [iconUrl]="
@@ -173,7 +179,7 @@
                             <p>
                                 {{address.building}}, <span
                                     *ngIf="address.landmark && address.landmark!==''">{{address.landmark}},</span>
-                                {{address.address}}
+                                <!-- {{address.address}} -->
                             </p>
                         </div>
                         <div class="clear"></div>

src/app/home/home.page.scss

@@ -255,6 +255,43 @@
     right: 0px;
     bottom: 0px;
     z-index: 99;
+    .location-finder {
+
+        position: absolute;
+
+        top: 15px;
+
+        left: 0;
+
+        right: 0;
+
+        padding: 0 20px;
+
+        z-index: 1;
+
+        input {
+
+            width: 100%;
+
+            border: 1px solid #e0e0e0;
+
+            outline: none;
+
+            padding: 8px 15px 8px 35px;
+
+            border-radius: 25px;
+
+            background-image: url('/assets/search_2.png');
+
+            background-position: 15px;
+
+            background-repeat: no-repeat;
+
+            background-size: 15px;
+
+        }
+
+    }
     agm-map {
         width: 100%;
         height: 100vh;

src/app/home/home.page.ts

-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, ViewChild, ElementRef, NgZone } from '@angular/core';
 import { Location } from '@angular/common';
 import { trigger, transition, animate, style } from '@angular/animations';
 import { MapsAPILoader, MouseEvent } from '@agm/core';
@@ -35,7 +35,7 @@ import { AuthService } from 'src/config/auth.service';
   ]
 })
 export class HomePage implements OnInit {
-  isShow = false;
+  isShow = true;
   searchShow = false;
   public lat = 51.678418;
   public lng = 7.809007;
@@ -47,6 +47,8 @@ export class HomePage implements OnInit {
   slideOpts = {
     slidesPerView: 1.5
   };
+  @ViewChild('building', { static: false })
+  public searchElementRef: ElementRef;
 
   constructor(
     private router: Router,
@@ -63,11 +65,12 @@ export class HomePage implements OnInit {
     private searchService: SearchService,
     private productsService: ProductsService,
     private subjectService: SubjectService,
-    private authService: AuthService
+    private authService: AuthService,
+    private ngZone: NgZone,
   ) {
     this.loader = false;
     this.address = 'Pick your Location';
-
+    this.isShow = false;
     const users = this.service.get('user').then(data => {
       if (data) {
         data = JSON.parse(data);
@@ -97,6 +100,35 @@ export class HomePage implements OnInit {
     this.menuCtrl.enable(true);
   }
 
+  resetMap() {
+    console.log('called');
+    const This = this;
+    setTimeout(() => {
+      This.mapsAPILoader.load().then(() => {
+        This.setCurrentLocation();
+        This.geoCoder = new google.maps.Geocoder();
+        const autocomplete = new google.maps.places.Autocomplete(This.searchElementRef.nativeElement, {
+          types: ['address']
+        });
+        autocomplete.addListener('place_changed', () => {
+          This.ngZone.run(() => {
+            const place: google.maps.places.PlaceResult = autocomplete.getPlace();
+            if (place.geometry === undefined || place.geometry === null) {
+              return;
+            }
+            This.lat = place.geometry.location.lat();
+            This.lng = place.geometry.location.lng();
+            This.getAddress(This.lat, This.lng);
+            console.log(This.lat, This.lng, This.service.distance);
+            This.centerService.getNearBy(This.lat, This.lng, This.service.distance);
+            This.istoggle();
+          });
+        });
+      });
+    }, 1000);
+
+  }
+
   private setCurrentLocation() {
     const This = this;
     if ('geolocation' in navigator) {
@@ -137,6 +169,8 @@ export class HomePage implements OnInit {
       .setDefaultAddress(address.addressId, this.custId)
       .then(() => {
         this.address = address.address;
+        this.lat = address.latLng.latitude;
+        this.lng = address.latLng.longitude;
         console.log(address.latLng);
         this.centerService.getNearBy(
           address.latLng.latitude,
@@ -190,6 +224,9 @@ export class HomePage implements OnInit {
 
   istoggle() {
     this.isShow = !this.isShow;
+    if (this.isShow) {
+      this.resetMap();
+    }
     console.log(this.isShow, 'Is SHow');
     this.subjectService.setTabData(!this.isShow);
   }

src/app/nearby/nearby.page.html

@@ -20,7 +20,7 @@
 <ion-content>
     <div class="nearby_map">
         <div class="map-inner">
-            <agm-map [latitude]="latitude" [longitude]="longitude" [zoom]="8"
+            <agm-map [latitude]="latitude" [longitude]="longitude" [zoom]="zoom"
                 [backgroundColor]="'rgba(29, 27, 130,0.2)'" (mapReady)="mapReady($event)"
                 (centerChange)="centerChange($event)">
                 <agm-marker [markerDraggable]="true" (dragEnd)="markerDragEnd($event)" [iconUrl]="
@@ -37,12 +37,12 @@
             class="form-horizontal">
             <div class="add_address_wrapper">
                 <h5>DELIVERY</h5>
-                <p>{{address}}</p>
-                <input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building" required
-                    placeholder="House No./ Building No" />
-                <div class="md-errors-spacer" [hidden]="building.valid || landmark.pristine" class="ion-padding-start">
+                <input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building"
+                    placeholder="House No./ Building No" [value]="address" (keydown.enter)="$event.preventDefault()"
+                    autocorrect="off" autocapitalize="off" spellcheck="off" type="text" #building />
+                <!-- <div class=" md-errors-spacer" [hidden]="building.valid || landmark.pristine" class="ion-padding-start">
                     Building Name is required
-                </div>
+                </div> -->
                 <input [(ngModel)]="addressForm.landmark" name="landmark" #landmark="ngModel" name="landmark"
                     placeholder="Landmark" />
                 <ion-grid>

src/app/nearby/nearby.page.scss

@@ -6,7 +6,7 @@
         width: 100%;
         height: 100%;
         .map-inner {
-            height: calc(100% - 348px);
+            height: calc(100% - 324px);
             position: relative;
             .map-pin {
                 position: absolute;
@@ -15,8 +15,10 @@
                 -webkit-transform: translate(-50%, -50%);
                 transform: translate(-50%, -50%);
                 width: 20px;
+                height: 40px;
                 img {
-                    margin-top: -23px;
+                    margin-top: -20px;
+                    display: block;
                 }
             }
         }
@@ -74,6 +76,7 @@
                 margin: 0px;
                 padding: 0px;
                 font-weight: 800;
+                margin-bottom: 20px;
             }
             input {
                 width: 100%;
@@ -166,7 +169,7 @@
                 }
             }
             .map-inner {
-                height: calc(100% - 235px);
+                height: calc(100% - 250px);
             }
         }
     }
\ No newline at end of file

src/app/nearby/nearby.page.ts

@@ -33,6 +33,7 @@ export class NearbyPage implements OnInit {
   uid: string;
   type: any;
   loader: boolean;
+  @ViewChild('building', { static: false })
   public searchElementRef: ElementRef;
 
   newCenterLat: number;
@@ -67,6 +68,20 @@ export class NearbyPage implements OnInit {
     this.mapsAPILoader.load().then(() => {
       this.setCurrentLocation();
       this.geoCoder = new google.maps.Geocoder();
+      const autocomplete = new google.maps.places.Autocomplete(this.searchElementRef.nativeElement, {
+        types: ['address']
+      });
+      autocomplete.addListener('place_changed', () => {
+        this.ngZone.run(() => {
+          const place: google.maps.places.PlaceResult = autocomplete.getPlace();
+          if (place.geometry === undefined || place.geometry === null) {
+            return;
+          }
+          this.latitude = place.geometry.location.lat();
+          this.longitude = place.geometry.location.lng();
+          this.zoom = 16;
+        });
+      });
     });
   }
   // google maps zoom level
@@ -75,14 +90,14 @@ export class NearbyPage implements OnInit {
     console.log('map-called');
     if ('geolocation' in navigator) {
       console.log(navigator);
-      this.latitude = -33.87276;
-      this.longitude = 151.20534;
-      this.zoom = 8;
+      /* this.latitude = -33.87276;
+      this.longitude = 151.20534; */
+      this.zoom = 24;
       this.getAddress(this.latitude, this.longitude);
       navigator.geolocation.getCurrentPosition(position => {
         this.latitude = position.coords.latitude;
         this.longitude = position.coords.longitude;
-        this.zoom = 8;
+        this.zoom = 24;
         this.getAddress(this.latitude, this.longitude);
       });
     }
@@ -104,7 +119,7 @@ export class NearbyPage implements OnInit {
         console.log(status);
         if (status === 'OK') {
           if (results[0]) {
-            this.zoom = 12;
+            this.zoom = 24;
             this.address = results[0].formatted_address;
             console.log(this.address);
           } else {
@@ -144,8 +159,8 @@ export class NearbyPage implements OnInit {
     console.log(data);
     const postData: Address = {
       address: this.address,
-      addressType: data.addressType,
-      building: data.building,
+      addressType: '',
+      building: this.searchElementRef.nativeElement.value,
       landmark: data.landmark !== undefined ? data.landmark : '',
       defaultVal: 0,
       uid: this.uid,

src/app/orderplaced/orderplaced.page.html

@@ -115,7 +115,8 @@
             </div>
 
             <h5 *ngIf="data.deliveryAddress">
-                {{data.deliveryAddress.addressType}},<br />{{data.deliveryAddress.address}},
+                {{data.deliveryAddress.addressType}}
+                <!-- ,<br />{{data.deliveryAddress.address}} -->,
                 <br /> {{data.deliveryAddress.building}}<span
                     *ngIf="data.deliveryAddress.landmark && data.deliveryAddress.landmark!==''"><br />,
                     {{data.deliveryAddress.landmark}}</span>

src/config/center.service.ts

@@ -56,7 +56,7 @@ export class CenterService {
   }
 
   public async getNearBy(latitude, longitude, distance) {
-    console.log(distance);
+    console.log(latitude, longitude, distance);
     const This = this;
     const state = true;
 
@@ -103,7 +103,7 @@ export class CenterService {
           };
           this.nearcenters.push(center);
         });
-        // console.log(this.nearcenters);
+        console.log(this.nearcenters);
       } else {
         // alert('No Orders Found');
       }

src/index.html

@@ -19,7 +19,7 @@
 
 <body>
     <script
-        src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBnCzDk6ec1OJFcW5FYgxP3LWVHMNumGDM&libraries=geometry"></script>
+        src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBnCzDk6ec1OJFcW5FYgxP3LWVHMNumGDM&libraries=geometry,places"></script>
     <app-root></app-root>
 </body>