aboutsummaryrefslogtreecommitdiff
path: root/node_modules/montage/ui/map.reel
diff options
context:
space:
mode:
Diffstat (limited to 'node_modules/montage/ui/map.reel')
-rw-r--r--node_modules/montage/ui/map.reel/map.css9
-rw-r--r--node_modules/montage/ui/map.reel/map.html58
-rw-r--r--node_modules/montage/ui/map.reel/map.js283
3 files changed, 350 insertions, 0 deletions
diff --git a/node_modules/montage/ui/map.reel/map.css b/node_modules/montage/ui/map.reel/map.css
new file mode 100644
index 00000000..45307593
--- /dev/null
+++ b/node_modules/montage/ui/map.reel/map.css
@@ -0,0 +1,9 @@
1/* <copyright>
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */
6.montage-google-map {
7 width: 100%;
8 height: 100%;
9} \ No newline at end of file
diff --git a/node_modules/montage/ui/map.reel/map.html b/node_modules/montage/ui/map.reel/map.html
new file mode 100644
index 00000000..a6ac5303
--- /dev/null
+++ b/node_modules/montage/ui/map.reel/map.html
@@ -0,0 +1,58 @@
1<!DOCTYPE html>
2<!-- <copyright>
3 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
4 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
5 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
6 </copyright> -->
7<html>
8<head>
9 <title></title>
10 <link rel="stylesheet" type="text/css" href="map.css">
11 <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&callback=initialize&libraries=places"></script>
12
13
14 <script type="text/montage-serialization">
15 {
16 "types": {
17 "prototype": "montage/ui/select-input.reel",
18 "properties": {
19 "element": {"#": "types"}
20 }
21 },
22 "owner": {
23 "prototype": "montage/ui/map.reel",
24 "properties": {
25 "element": {"#": "map-container"},
26 "mapEl": {"#": "map"}
27 },
28 "bindings": {
29 "category": {
30 "boundObject": {"@": "types"},
31 "boundObjectPropertyPath": "value"
32 }
33 }
34 }
35 }
36 </script>
37
38</head>
39<body>
40
41 <div data-montage-id="map-container">
42 <div>
43 Show:
44 <select data-montage-id="types">
45 <option value=''>Select a Category</option>
46 <option value='cafe'>Coffee</option>
47 <option value='hospital'>Hospitals</option>
48 <option value='museum'>Museums</option>
49 <option value='restaurant'>Restaurants</option>
50
51 </select>
52 </div>
53 <div data-montage-id="map" id="map" class="montage-google-map">MAP</div>
54
55 </div>
56
57</body>
58</html>
diff --git a/node_modules/montage/ui/map.reel/map.js b/node_modules/montage/ui/map.reel/map.js
new file mode 100644
index 00000000..1e4f452c
--- /dev/null
+++ b/node_modules/montage/ui/map.reel/map.js
@@ -0,0 +1,283 @@
1/* <copyright>
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */
6/**
7
8 @requires montage/core/core
9 @requires montage/ui/component
10*/
11var Montage = require("montage").Montage,
12 Component = require("ui/component").Component;
13
14/**
15 @class module:"montage/ui/google/map.reel".Map
16 @extends module:montage/ui/component.Component
17 */
18var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/toggle-switch.reel".ToggleSwitch# */ {
19
20 didCreate: {
21 value: function() {
22 var self = this;
23 window.initialize = function initialize() {
24 console.log('google maps api loaded');
25 self._mapLoaded = true;
26 self._geoCoder = new google.maps.Geocoder();
27 self.needsDraw = true;
28 };
29 }
30 },
31
32 _geoCoder: {value: null},
33
34 // HTMLElement to load the Map into
35 mapEl: {value: null},
36
37 _mapLoaded: {
38 enumerable: false,
39 value: false
40 },
41 _map: {
42 enumerable: false,
43 value: false
44 },
45 _latitude: {
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
74 defaultLatLng: {
75 value: {lat: -34.397, lng: 150.644}
76 },
77
78 _latLng: {
79 value: this.defaultLatLng,
80 distinct: true
81 },
82 latLng: {
83 get: function() {
84 return this._latLng;
85 },
86 set: function(value) {
87 if(value) {
88 this._latLng = value;
89 // refresh the map
90 this.needsDraw = true;
91 }
92 }
93 },
94
95 // {lat, lon} Or a String representing the location (eg: Paris, France)
96 center: {
97 get: function() {
98 return this._center;
99 },
100 set: function(value) {
101 if(value) {
102 var self = this, geocoder = this._geoCoder;
103 this._center = value;
104 if(this._mapLoaded) {
105
106 if(String.isString(value)) {
107 // geocode
108 geocoder.geocode( { 'address': value}, function(results, status) {
109 if (status == google.maps.GeocoderStatus.OK) {
110 var loc = results[0].geometry.location;
111 self.latLng = {lat: loc.lat(), lng: loc.lng()};
112 } else {
113 console.log('Geocode was not successful : ' + status);
114 }
115 });
116 } else if(value.lat && value.lng) {
117 this.latLng = value;
118 } else {
119 // default location
120 this.latLng = this.defaultLatLng;
121 }
122
123 }
124
125 }
126
127 }
128 },
129
130 category: {
131 get: function() {
132 return this._category;
133 },
134 set: function(value) {
135 if(value) {
136 this._category = value;
137 this._getPlaces(this._category);
138 this.needsDraw = true;
139 }
140 }
141 },
142
143 zoom: {
144 value: 8
145 },
146
147 __places: {value: null},
148 _places: {
149 get: function() {
150 return this.__places;
151 },
152 set: function(value) {
153 if(value) {
154 this.__places = value;
155 this.needsDraw = true;
156 }
157 }
158 },
159
160 _getPlaces: {
161 value: function(type, keyword) {
162 var self = this;
163<