diff --git a/.gitignore b/.gitignore
index 309b424..6bdc209 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,2 +1,3 @@
/bower_components
node_modules
+.idea/
diff --git a/ion-google-place.css b/ion-google-place.css
index 8cd1801..5f0f907 100644
--- a/ion-google-place.css
+++ b/ion-google-place.css
@@ -6,6 +6,23 @@
left: 0;
z-index: 20;
display: none;
+ background: rgba(0,0,0,0.4);
+}
+
+.ion-google-place-container .spinner-container{
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ margin: auto;
+ width: 30px;
+ height: 30px;
+ z-index: 10;
+}
+
+.ion-google-place-container .spinner-container .spinner{
+ stroke: #eee;
}
diff --git a/ion-google-place.js b/ion-google-place.js
index 7382ab6..244be3b 100644
--- a/ion-google-place.js
+++ b/ion-google-place.js
@@ -16,42 +16,50 @@ angular.module('ion-google-place', [])
scope: {
ngModel: '=?',
geocodeOptions: '=',
- currentLocation: '@'
+ currentLocation: '@',
+ playServices: "=?"
},
link: function(scope, element, attrs, ngModel) {
var unbindBackButtonAction;
scope.locations = [];
var geocoder = new google.maps.Geocoder();
+ var service = new google.maps.places.AutocompleteService();
+
var searchEventTimeout = undefined;
+ scope.$on('ion-google-place:setViewValue',function(e,args){
+ ngModel.$setViewValue({formatted_address:args.location});
+ ngModel.$render();
+ });
scope.displayCurrentLocation = false;
scope.currentLocation = scope.currentLocation === "true"? true:false;
-
+
if(!!navigator.geolocation && scope.currentLocation){
scope.displayCurrentLocation = true;
}
var POPUP_TPL = [
'
',
- '',
- '',
+ '',
+ '',
'
'
].join('');
@@ -64,12 +72,30 @@ angular.module('ion-google-place', [])
popupPromise.then(function(el){
var searchInputElement = angular.element(el.element.find('input'));
- scope.selectLocation = function(location){
- ngModel.$setViewValue(location);
- ngModel.$render();
- el.element.css('display', 'none');
- $ionicBackdrop.release();
-
+ scope.selectLocation = function (location) {
+ if(scope.playServices){
+ scope.isCallInProgress = true;
+ geocoder.geocode({address: location.description}, function (results, status) {
+ if (status == google.maps.GeocoderStatus.OK) {
+ scope.isCallInProgress = false;
+ scope.$apply(function () {
+ ngModel.$setViewValue(results[0]);
+ ngModel.$render();
+ el.element.css('display', 'none');
+ $ionicBackdrop.release();
+ });
+ } else {
+ scope.isCallInProgress = false;
+ // @TODO: Figure out what to do when the geocoding fails
+ }
+ });
+ }
+ else{
+ ngModel.$setViewValue(location);
+ ngModel.$render();
+ el.element.css('display', 'none');
+ $ionicBackdrop.release();
+ }
if (unbindBackButtonAction) {
unbindBackButtonAction();
unbindBackButtonAction = null;
@@ -117,26 +143,43 @@ angular.module('ion-google-place', [])
});
};
- scope.$watch('searchQuery', function(query){
+ scope.$watch('searchQuery', function (query) {
if (searchEventTimeout) $timeout.cancel(searchEventTimeout);
- searchEventTimeout = $timeout(function() {
- if(!query) return;
- if(query.length < 3);
+ searchEventTimeout = $timeout(function () {
+ if (!query) return;
+ if (query.length < 3);
+ var req = {};
+ req.input = query;
+ if(scope.playServices){
+ scope.isCallInProgress = true;
- var req = scope.geocodeOptions || {};
- req.address = query;
- geocoder.geocode(req, function(results, status) {
- if (status == google.maps.GeocoderStatus.OK) {
- scope.$apply(function(){
- scope.locations = results;
- });
- } else {
- // @TODO: Figure out what to do when the geocoding fails
- }
- });
+ service.getQueryPredictions(req, function (predictions, status) {
+ if (status == google.maps.places.PlacesServiceStatus.OK) {
+ scope.locations = predictions;
+ scope.$apply();
+ }
+ scope.isCallInProgress = false;
+ });
+ }
+ else{
+ scope.isCallInProgress = true;
+ var req = scope.geocodeOptions || {};
+ req.address = query;
+ geocoder.geocode(req, function(results, status) {
+ if (status == google.maps.GeocoderStatus.OK) {
+ scope.$apply(function () {
+ scope.locations = results;
+ scope.isCallInProgress = false;
+ });
+ } else {
+ // @TODO: Figure out what to do when the geocoding fails
+ scope.isCallInProgress = false;
+
+ }
+ });
+ }
}, 350); // we're throttling the input by 350ms to be nice to google's API
});
-
var onClick = function(e){
e.preventDefault();
e.stopPropagation();
@@ -198,9 +241,15 @@ angular.module('ion-google-place', [])
if(!ngModel.$viewValue){
element.val('');
} else {
- element.val(ngModel.$viewValue.formatted_address || '');
+ element.val(ngModel.$viewValue.street_address || ngModel.$viewValue.formatted_address || '');
}
+
};
+ $timeout(function () {
+ //initialize model value
+ ngModel.$setViewValue(ngModel.$modelValue);
+ ngModel.$render();
+ },200);
scope.$on("$destroy", function(){
if (unbindBackButtonAction){