diff options
Diffstat (limited to 'node_modules/montage/ui/map.reel')
-rw-r--r-- | node_modules/montage/ui/map.reel/map.html | 31 | ||||
-rw-r--r-- | node_modules/montage/ui/map.reel/map.js | 41 |
2 files changed, 15 insertions, 57 deletions
diff --git a/node_modules/montage/ui/map.reel/map.html b/node_modules/montage/ui/map.reel/map.html index 5cd3a5b5..b255ac1e 100644 --- a/node_modules/montage/ui/map.reel/map.html +++ b/node_modules/montage/ui/map.reel/map.html | |||
@@ -13,24 +13,13 @@ | |||
13 | 13 | ||
14 | <script type="text/montage-serialization"> | 14 | <script type="text/montage-serialization"> |
15 | { | 15 | { |
16 | "types": { | 16 | |
17 | "prototype": "montage/ui/select-input.reel", | ||
18 | "properties": { | ||
19 | "element": {"#": "types"} | ||
20 | } | ||
21 | }, | ||
22 | "owner": { | 17 | "owner": { |
23 | "prototype": "montage/ui/map.reel", | 18 | "prototype": "montage/ui/map.reel", |
24 | "properties": { | 19 | "properties": { |
25 | "element": {"#": "map-container"}, | 20 | "element": {"#": "map-container"}, |
26 | "mapEl": {"#": "map"} | 21 | "mapEl": {"#": "map"} |
27 | }, | 22 | } |
28 | "bindings": { | ||
29 | "category": { | ||
30 | "boundObject": {"@": "types"}, | ||
31 | "boundObjectPropertyPath": "value" | ||
32 | } | ||
33 | } | ||
34 | } | 23 | } |
35 | } | 24 | } |
36 | </script> | 25 | </script> |
@@ -49,20 +38,8 @@ | |||
49 | </head> | 38 | </head> |
50 | <body> | 39 | <body> |
51 | 40 | ||
52 | <div data-montage-id="map-container"> | 41 | <div data-montage-id="map-container"> |
53 | <div> | 42 | <div data-montage-id="map" id="map" class="montage-google-map">MAP</div> |
54 | Show: | ||
55 | <select data-montage-id="types"> | ||
56 | <option value=''>Select a Category</option> | ||
57 | <option value='cafe'>Coffee</option> | ||
58 | <option value='hospital'>Hospitals</option> | ||
59 | <option value='museum'>Museums</option> | ||
60 | <option value='restaurant'>Restaurants</option> | ||
61 | |||
62 | </select> | ||
63 | </div> | ||
64 | <div data-montage-id="map" id="map" class="montage-google-map">MAP</div> | ||
65 | |||
66 | </div> | 43 | </div> |
67 | 44 | ||
68 | </body> | 45 | </body> |
diff --git a/node_modules/montage/ui/map.reel/map.js b/node_modules/montage/ui/map.reel/map.js index c03d51c5..305ae181 100644 --- a/node_modules/montage/ui/map.reel/map.js +++ b/node_modules/montage/ui/map.reel/map.js | |||
@@ -42,34 +42,7 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ | |||
42 | enumerable: false, | 42 | enumerable: false, |
43 | value: false | 43 | value: false |
44 | }, | 44 | }, |
45 | _latitude: { | 45 | |
46 | enumerable: false, | ||
47 | value: -34.397 | ||
48 | }, | ||
49 | latitude: { | ||
50 | enumerable: false, | ||
51 | set: function(value) { | ||
52 | this._latitude = value; | ||
53 | this.needsDraw = true; | ||
54 | }, | ||
55 | get: function() { | ||
56 | return this._latitude; | ||
57 | } | ||
58 | }, | ||
59 | _longitude: { | ||
60 | enumerable: false, | ||
61 | value: -34.397 | ||
62 | }, | ||
63 | longitude: { | ||
64 | enumerable: false, | ||
65 | set: function(value) { | ||
66 | this._longitude = value; | ||
67 | this.needsDraw = true; | ||
68 | }, | ||
69 | get: function() { | ||
70 | return this._longitude; | ||
71 | } | ||
72 | }, | ||
73 | 46 | ||
74 | defaultLatLng: { | 47 | defaultLatLng: { |
75 | value: {lat: -34.397, lng: 150.644} | 48 | value: {lat: -34.397, lng: 150.644} |
@@ -132,6 +105,7 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ | |||
132 | return this._category; | 105 | return this._category; |
133 | }, | 106 | }, |
134 | set: function(value) { | 107 | set: function(value) { |
108 | console.log('category set: ' + value); | ||
135 | if(value) { | 109 | if(value) { |
136 | this._category = value; | 110 | this._category = value; |
137 | this._getPlaces(this._category); | 111 | this._getPlaces(this._category); |
@@ -170,6 +144,7 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ | |||
170 | } | 144 | } |
171 | var service = new google.maps.places.PlacesService(this._map); | 145 | var service = new google.maps.places.PlacesService(this._map); |
172 | service.search(request, function(results, status) { | 146 | service.search(request, function(results, status) { |
147 | console.log('got places for ', self.category, status, results); | ||
173 | if (status == google.maps.places.PlacesServiceStatus.OK) { | 148 | if (status == google.maps.places.PlacesServiceStatus.OK) { |
174 | self._places = results; | 149 | self._places = results; |
175 | } else { | 150 | } else { |
@@ -192,12 +167,18 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ | |||
192 | case 'hospital': | 167 | case 'hospital': |
193 | icon = '10-medical.png'; | 168 | icon = '10-medical.png'; |
194 | break; | 169 | break; |
195 | case 'cafe': | 170 | case 'bar': |
196 | icon = '34-coffee.png'; | 171 | icon = '88-beer-mug.png'; |
172 | break; | ||
173 | case 'grocery_or_supermarket': | ||
174 | icon = '80-shopping-cart.png'; | ||
197 | break; | 175 | break; |
198 | case 'museum': | 176 | case 'museum': |
199 | icon = '41-picture-frame.png'; | 177 | icon = '41-picture-frame.png'; |
200 | break; | 178 | break; |
179 | case 'gas_station': | ||
180 | icon = '47-fuel.png'; | ||
181 | break; | ||
201 | }; | 182 | }; |
202 | if(icon) { | 183 | if(icon) { |
203 | image = new google.maps.MarkerImage('images/' + icon); | 184 | image = new google.maps.MarkerImage('images/' + icon); |