examples/bootstrap/LocationPicker.js
[roojs1] / examples / bootstrap / LocationPicker.js
1
2
3 Roo.example = Roo.example || {};
4
5 Roo.example.locationpicker = new Roo.XComponent({
6     part     :  ["layout","viewpanel"],
7     order    : '001-viewpanel',
8     region   : '',
9     parent   : '#bootstrap',
10     name     : "unnamed module",
11     disabled : false, 
12     permname : '', 
13     _tree : function()
14     {
15         
16         this.parent = {
17             el : new Roo.bootstrap.Body()
18         }
19         this.parent.el.layout = false;
20         this.parent.el.render(document.body);
21         
22         var _this = this;
23         var MODULE = this;
24         
25         return {
26             xtype: 'Body',
27             xns: Roo.bootstrap,
28             items :
29             [
30                 {
31                     xtype : 'Container',
32                     xns : Roo.bootstrap,
33                     cls : 'col-md-12',
34                     items : [
35                         {
36                             xtype : 'LocationPicker',
37                             xns: Roo.bootstrap,
38                             style : 'width:500px; height: 400px; border: 1px solid #000;margin:50px auto;',
39                             latitude : 46.15242437752303,
40                             longitude : 2.7470703125,
41                             radius : 300,
42                             listeners : {
43                                 render : function (_self) {
44                                     _this.picker = _self;
45                                 },
46                                 positionchanged : function (_self, location) {
47                                     Roo.log(this);
48                                     Roo.log(location);
49
50                                 }
51                             }
52                         }
53                     ]
54                 },
55                 {
56                     xtype : 'Container',
57                     xns : Roo.bootstrap,
58                     cls : 'col-md-12',
59                     style : 'margin:auto;',
60                     items : [
61                         {
62                             xtype : 'Column',
63                             xns: Roo.bootstrap,
64                             md : 3,
65                             cls : 'col-md-offset-3',
66                             items : [
67                                 {
68                                     xtype : 'Input',
69                                     xns: Roo.bootstrap,
70                                     fieldLabel : 'Latitude',
71                                     labelAlign : 'top'
72                                 }
73                             ]
74                         },
75                         {
76                             xtype : 'Column',
77                             xns: Roo.bootstrap,
78                             md : 3,
79                             items : [
80                                 {
81                                     xtype : 'Input',
82                                     xns: Roo.bootstrap,
83                                     fieldLabel : 'Longitude',
84                                     labelAlign : 'top'
85                                 }
86                             ]
87                         }
88                     ]
89                 }
90             ]
91         }
92     }
93 });