fix: google object grometry issue fix when tryig to access it and min…

…or enhancement

demo/demo.component.html

@@ -64,7 +64,7 @@ <h3 class="panel-title">Example 3 (without showing current location and change p
   <div class="col-xs-12 col-md-6">
   	<div class="panel panel-primary">
 		  <div class="panel-heading">
-		    <h3 class="panel-title">Example 4 (without search button and changed place icons.)</h3>
+		    <h3 class="panel-title">Example 4 (without search button and changed place icons and with 8 recent search result to be saved.)</h3>
 		  </div>
 		  <div class="panel-body">
 		  	<div class="well">

demo/demo.component.ts

@@ -24,7 +24,8 @@ export class DemoComponent {
         showSearchButton: false,
         currentLocIconUrl: 'https://cdn4.iconfinder.com/data/icons/proglyphs-traveling/512/Current_Location-512.png',
         locationIconUrl: 'http://www.myiconfinder.com/uploads/iconsets/369f997cef4f440c5394ed2ae6f8eecd.png',
-        recentStorageName: 'componentData4'
+        recentStorageName: 'componentData4',
+        noOfRecentSearchSave: 8
     };
     public userSettings5: any = {
         useGoogleGeoApi: false,

demo/index.ejs

@@ -38,6 +38,7 @@
     <div class="container-fluid container-demo">
       <ng2geo-autocomplete-demoapp>Loading demo...</ng2geo-autocomplete-demoapp>
     </div>
-    <script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=true&key=AIzaSyARZV20YYnYyyW-sUc0WorytUkX49-CwH8&libraries=places&language=en-US"></script>
+    <script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=true&key=AIzaSyA6n0R4Oz5qysS15Yw-A7sF5Shn8S0fGCo&libraries=places&language=en-US"></script>
+    <!-- <script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=true&key=AIzaSyARZV20YYnYyyW-sUc0WorytUkX49-CwH8&libraries=places&language=en-US"></script> -->
   </body>
 </html>

src/auto-complete.component.ts

@@ -18,6 +18,7 @@ export interface Settings {
   showRecentSearch?: boolean;
   showCurrentLocation?: boolean;
   recentStorageName?: string;
+  noOfRecentSearchSave?: number;
   currentLocIconUrl?: string;
   searchIconUrl?: string;
   locationIconUrl?: string;
@@ -29,7 +30,7 @@ export interface Settings {
     <div class="custom-autocomplete" *ngIf="!isSettingsError">
       <div class="custom-autocomplete__container" >
         <div class="custom-autocomplete__input" [ngClass]="{'button-included':settings.showSearchButton}">
-          <input  [(ngModel)]="locationInput" (click)="searchinputCallback($event)"  (keyup)="searchinputCallback($event)" (keyup.enter)="processSearchQuery()" 
+          <input  [(ngModel)]="locationInput" (click)="searchinputClickCallback($event)"  (keyup)="searchinputCallback($event)" 
            type="search" name="search" id="search_places" placeholder="{{settings.inputPlaceholderText}}" autocomplete="off">
           <button class="search-icon" *ngIf="settings.showSearchButton" (click)="userQuerySubmit()">
             <i *ngIf="settings.searchIconUrl" [ngStyle]="{'background-image': 'url(' + settings.searchIconUrl + ')'}"></i>
@@ -304,6 +305,7 @@ export class AutoCompleteComponent implements OnInit {
     showRecentSearch: true,
     showCurrentLocation: true,
     recentStorageName: 'recentSearches',
+    noOfRecentSearchSave: 5,
     currentLocIconUrl: '',
     searchIconUrl: '',
     locationIconUrl: ''
@@ -340,6 +342,12 @@ export class AutoCompleteComponent implements OnInit {
     }
   }
 
+  //function called when click event happens in input box. (Binded with view)
+  searchinputClickCallback(event: any): any {
+    event.target.select();
+    this.searchinputCallback(event);
+  }
+
   //function called when there is a change in input. (Binded with view)
   searchinputCallback(event: any): any {
     let inputVal: any = this.locationInput;
@@ -397,17 +405,6 @@ export class AutoCompleteComponent implements OnInit {
     }
   }
 
-  //function to process the search query when pressed enter.
-  processSearchQuery(): any {
-    if (this.queryItems.length) {
-      if (this.selectedDataIndex > -1) {
-        this.selectedListNode(this.selectedDataIndex);
-      }else {
-        this.selectedListNode(0);
-      }
-    }
-  }
-
   //function to get user current location from the device.
   currentLocationSelected(): any {
     if (isPlatformBrowser(this.platformId)) {
@@ -423,6 +420,17 @@ export class AutoCompleteComponent implements OnInit {
     }
   }
 
+  //function to process the search query when pressed enter.
+  private processSearchQuery(): any {
+    if (this.queryItems.length) {
+      if (this.selectedDataIndex > -1) {
+        this.selectedListNode(this.selectedDataIndex);
+      }else {
+        this.selectedListNode(0);
+      }
+    }
+  }
+
   //function to set user settings if it is available.
   private setUserSettings(): Settings {
     let _tempObj: any = {};
@@ -500,6 +508,8 @@ export class AutoCompleteComponent implements OnInit {
         arrayIndex = this.queryItems.length - 1;
       }
       this.activeListNode(arrayIndex);
+    } else {
+      this.processSearchQuery();
     }
   }
 
@@ -543,12 +553,13 @@ export class AutoCompleteComponent implements OnInit {
 
   //function to store the selected user search in the localstorage.
   private setRecentLocation(data: any): any {
+    data = JSON.parse(JSON.stringify(data));
     data.description = data.description ? data.description : data.formatted_address;
     data.active = false;
     this.selectedDataIndex = -1;
     this.locationInput = data.description;
     if (this.settings.showRecentSearch) {
-      this._autoCompleteSearchService.addRecentList(this.settings.recentStorageName, data);
+      this._autoCompleteSearchService.addRecentList(this.settings.recentStorageName, data, this.settings.noOfRecentSearchSave);
       this.getRecentLocations();
     }
     this.userSelectedOption = data;

src/auto-complete.service.ts

@@ -162,7 +162,7 @@ export class AutoCompleteSearchService {
     });
   }
 
-  addRecentList(localStorageName: string, result: any): any {
+  addRecentList(localStorageName: string, result: any, itemSavedLength:number): any {
     this.getRecentList(localStorageName).then((data: any) => {
       if (data) {
         for (let i: number = 0; i < data.length; i++) {
@@ -172,7 +172,7 @@ export class AutoCompleteSearchService {
           }
         }
         data.unshift(result);
-        if (data.length > 5) {
+        if (data.length > itemSavedLength) {
           data.pop();
         }
         this._localStorageService.setItem(localStorageName, JSON.stringify(data));