examples/bootstrap/LocationPicker.js
[roojs1] / examples / bootstrap / LocationPicker.js
index 869993c..e3a9869 100644 (file)
@@ -28,6 +28,27 @@ Roo.example.locationpicker = new Roo.XComponent({
             items :
             [
                 {
+                    xtype : 'Container',
+                    xns : Roo.bootstrap,
+                    items : [
+                        {
+                            xtype : 'Column',
+                            xns: Roo.bootstrap,
+                            md : 6,
+                            cls : 'col-md-offset-3',
+                            style : 'margin-top: 50px',
+                            items : [
+                                {
+                                    xtype : 'Header',
+                                    xns: Roo.bootstrap,
+                                    level : 1,
+                                    html : "This requires an API now"
+                                }
+                            ]
+                        }
+                    ]
+                },
+               {
                     xtype : 'Container',
                     xns : Roo.bootstrap,
                     items : [
@@ -67,26 +88,26 @@ Roo.example.locationpicker = new Roo.XComponent({
                                 render : function (_self) {
                                     _this.picker = _self;
                                     
-//                                    this.gMapContext.autocomplete = new google.maps.places.Autocomplete(_this.location.inputEl().dom);
-//                                    
-//                                    google.maps.event.addListener(this.gMapContext.autocomplete, "place_changed", function() {
-//                                        var place = _this.picker.gMapContext.autocomplete.getPlace();
-//                                        if (!place.geometry) {
-//                                            Roo.log('location not found');
-//                                            return;
-//                                        }
-//                                        _this.picker.setPosition(place.geometry.location);
-//                                    });
+                                    this.gMapContext.autocomplete = new google.maps.places.Autocomplete(_this.location.inputEl().dom);
+                                    
+                                    google.maps.event.addListener(this.gMapContext.autocomplete, "place_changed", function() {
+                                        var place = _this.picker.gMapContext.autocomplete.getPlace();
+                                        if (!place.geometry) {
+                                            Roo.log('location not found');
+                                            return;
+                                        }
+                                        _this.picker.setPosition(place.geometry.location);
+                                    });
                                     
                                 },
                                 positionchanged : function (_self, location) {
-//                                    if(_this.latitude){
-//                                        _this.latitude.setValue(location.lat());
-//                                    }
-//                                    
-//                                    if(_this.longitude){
-//                                        _this.longitude.setValue(location.lng());
-//                                    }
+                                    if(_this.latitude){
+                                        _this.latitude.setValue(location.lat());
+                                    }
+                                    
+                                    if(_this.longitude){
+                                        _this.longitude.setValue(location.lng());
+                                    }
                                 }
                             }
                         }