From f9f8fdc3000042ba5b4504d91870dc9a32ef25eb Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Wed, 16 May 2012 01:00:22 -0700 Subject: Squashed master into dom-architecture Signed-off-by: Valerio Virgillito --- node_modules/montage-google/map.reel/map.css | 9 + node_modules/montage-google/map.reel/map.html | 46 ++++ node_modules/montage-google/map.reel/map.js | 289 ++++++++++++++++++++++++++ 3 files changed, 344 insertions(+) create mode 100644 node_modules/montage-google/map.reel/map.css create mode 100644 node_modules/montage-google/map.reel/map.html create mode 100644 node_modules/montage-google/map.reel/map.js (limited to 'node_modules/montage-google/map.reel') diff --git a/node_modules/montage-google/map.reel/map.css b/node_modules/montage-google/map.reel/map.css new file mode 100644 index 00000000..45307593 --- /dev/null +++ b/node_modules/montage-google/map.reel/map.css @@ -0,0 +1,9 @@ +/* + This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ +.montage-google-map { + width: 100%; + height: 100%; +} \ No newline at end of file diff --git a/node_modules/montage-google/map.reel/map.html b/node_modules/montage-google/map.reel/map.html new file mode 100644 index 00000000..fee3a38e --- /dev/null +++ b/node_modules/montage-google/map.reel/map.html @@ -0,0 +1,46 @@ + + + + + + + + + + + + + + + + +

MAP

+ + + diff --git a/node_modules/montage-google/map.reel/map.js b/node_modules/montage-google/map.reel/map.js new file mode 100644 index 00000000..3ba7fff7 --- /dev/null +++ b/node_modules/montage-google/map.reel/map.js @@ -0,0 +1,289 @@ +/* + This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ +/** + + @requires montage/core/core + @requires montage/ui/component +*/ +var Montage = require("montage").Montage, + Component = require("montage/ui/component").Component; + +/** + @class module:"montage/ui/google/map.reel".Map + @extends module:montage/ui/component.Component + */ +var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/toggle-switch.reel".ToggleSwitch# */ { + + didCreate: { + value: function() { + var self = this; + window.initialize = function initialize() { + console.log('google maps api loaded'); + self._mapLoaded = true; + self._geoCoder = new google.maps.Geocoder(); + self.needsDraw = true; + }; + } + }, + + _geoCoder: {value: null}, + + // HTMLElement to load the Map into + mapEl: {value: null}, + + _mapLoaded: { + enumerable: false, + value: false + }, + _map: { + enumerable: false, + value: false + }, + + // Sunnyvale, CA + defaultLatLng: { + value: {lat: 37.37, lng: -122.03} + }, + + _latLng: { + value: this.defaultLatLng, + distinct: true + }, + latLng: { + get: function() { + return this._latLng; + }, + set: function(value) { + if(value) { + this._latLng = value; + // refresh the map + this.needsDraw = true; + } + } + }, + + // {lat, lon} Or a String representing the location (eg: Paris, France) + center: { + get: function() { + return this._center; + }, + set: function(value) { + if(value) { + var self = this, geocoder = this._geoCoder; + this._center = value; + if(this._mapLoaded) { + + if(String.isString(value)) { + // geocode + geocoder.geocode( { 'address': value}, function(results, status) { + if (status == google.maps.GeocoderStatus.OK) { + var loc = results[0].geometry.location; + self.latLng = {lat: loc.lat(), lng: loc.lng()}; + } else { + console.log('Geocode was not successful : ' + status); + } + }); + } else if(value.lat && value.lng) { + this.latLng = value; + } else { + // default location + this.latLng = this.defaultLatLng; + } + + } + + } + + } + }, + + category: { + get: function() { + return this._category; + }, + set: function(value) { + console.log('category set: ' + value); + if(value) { + this._category = value; + this._getPlaces(this._category); + this.needsDraw = true; + } + } + }, + + trafficLayer: {value: null}, + _traffic: {value: null}, + traffic: { + get: function() { + return this._traffic; + }, + set: function(value) { + if(value !== this._traffic) { + this._traffic = value; + this.needsDraw = true; + } + } + }, + + + zoomValue: { + value: 8 + }, + + __places: {value: null}, + _places: { + get: function() { + return this.__places; + }, + set: function(value) { + if(value) { + this.__places = value; + this.needsDraw = true; + } + } + }, + + _getPlaces: { + value: function(type, keyword) { + var self = this; + var request = { + location: new window.google.maps.LatLng(this.latLng.lat, this.latLng.lng), + radius: 5000, + types: [type] + }; + if(!this._infoWindow) { + this._infoWindow = new google.maps.InfoWindow(); + } + var service = new google.maps.places.PlacesService(this._map); + service.search(request, function(results, status) { + console.log('got places for ', self.category, status, results); + if (status == google.maps.places.PlacesServiceStatus.OK) { + self._places = results; + } else { + self._places = []; + } + }); + } + }, + + _infoWindow: {value: null}, + _markers: {value: null}, + _createMarker: { + value: function(place) { + var placeLoc = place.geometry.location, map = this._map; + var icon, image; + switch(this.category) { + case 'restaurant': + icon = '48-fork-and-knife.png'; + break; + case 'hospital': + icon = '10-medical.png'; + break; + case 'bar': + icon = '88-beer-mug.png'; + break; + case 'grocery_or_supermarket': + icon = '80-shopping-cart.png'; + break; + case 'museum': + icon = '41-picture-frame.png'; + break; + case 'gas_station': + icon = '47-fuel.png'; + break; + }; + if(icon) { + image = new google.maps.MarkerImage('images/' + icon); + } + var options = { + map: map, + position: place.geometry.location + }; + if(image) { + options.icon = image; + } + + var marker = new google.maps.Marker(options); + if(!this._markers) { + this._markers = []; + } + this._markers.push(marker); + + var infoWindow = this._infoWindow; + google.maps.event.addListener(marker, 'click', function() { + infoWindow.setContent(place.name + '
' + place.vicinity); + infoWindow.open(map, this); + }); + } + }, + + _removeAllMarkers: { + value: function() { + if(this._markers && this._markers.length > 0) { + var i=0, len = this._markers.length; + for(i; i< len; i++) { + this._markers[i].setMap(null); + } + this._markers = []; + } + } + }, + + +/** + Description TODO + @function + */ + draw: { + enumerable: false, + value: function () { + + if(this._mapLoaded) { + var latLng = this.latLng || this.defaultLatLng; + if(!this._map) { + var map; + var myOptions = { + zoom: this.zoomValue, + center: new window.google.maps.LatLng(latLng.lat, latLng.lng), + mapTypeId: window.google.maps.MapTypeId.ROADMAP + }; + + this._map = new window.google.maps.Map(this.mapEl, myOptions); + } else { + var map = this._map; + map.setZoom(10); + var latLng = new window.google.maps.LatLng(latLng.lat, latLng.lng); + map.setCenter(latLng); + var marker = new google.maps.Marker({ + map: map, + position: latLng + }); + + var places = this._places; + if(places && places.length > 0) { + map.setZoom(13); + this._removeAllMarkers(); + for (var i = 0; i < places.length; i++) { + this._createMarker(places[i]); + } + } + + if(this.traffic === true) { + this.trafficLayer = new google.maps.TrafficLayer(); + this.trafficLayer.setMap(map); + } else { + if(this.trafficLayer) { + this.trafficLayer.setMap(null); + } + } + } + + } + + //window.google.maps.event.addDomListener(window, 'load', initialize); + } + } +}); -- cgit v1.2.3 From 2ea84629a355a02d7eaa33464a0298ec4999073c Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Thu, 31 May 2012 10:14:22 -0700 Subject: updating the google components serialization to enable saving Signed-off-by: Valerio Virgillito --- node_modules/montage-google/map.reel/map.js | 70 ++++++++++++++++------------- 1 file changed, 39 insertions(+), 31 deletions(-) (limited to 'node_modules/montage-google/map.reel') diff --git a/node_modules/montage-google/map.reel/map.js b/node_modules/montage-google/map.reel/map.js index 3ba7fff7..fc104df5 100644 --- a/node_modules/montage-google/map.reel/map.js +++ b/node_modules/montage-google/map.reel/map.js @@ -28,12 +28,12 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ }; } }, - - _geoCoder: {value: null}, - + + _geoCoder: {value: null}, + // HTMLElement to load the Map into mapEl: {value: null}, - + _mapLoaded: { enumerable: false, value: false @@ -42,14 +42,14 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ enumerable: false, value: false }, - + // Sunnyvale, CA defaultLatLng: { value: {lat: 37.37, lng: -122.03} }, _latLng: { - value: this.defaultLatLng, + value: this.defaultLatLng, distinct: true }, latLng: { @@ -75,7 +75,7 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ var self = this, geocoder = this._geoCoder; this._center = value; if(this._mapLoaded) { - + if(String.isString(value)) { // geocode geocoder.geocode( { 'address': value}, function(results, status) { @@ -92,9 +92,9 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ // default location this.latLng = this.defaultLatLng; } - + } - + } } @@ -113,7 +113,7 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ } } }, - + trafficLayer: {value: null}, _traffic: {value: null}, traffic: { @@ -127,12 +127,12 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ } } }, - - + + zoomValue: { value: 8 }, - + __places: {value: null}, _places: { get: function() { @@ -145,11 +145,11 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ } } }, - + _getPlaces: { value: function(type, keyword) { var self = this; - var request = { + var request = { location: new window.google.maps.LatLng(this.latLng.lat, this.latLng.lng), radius: 5000, types: [type] @@ -168,7 +168,7 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ }); } }, - + _infoWindow: {value: null}, _markers: {value: null}, _createMarker: { @@ -192,20 +192,20 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ icon = '41-picture-frame.png'; break; case 'gas_station': - icon = '47-fuel.png'; + icon = '47-fuel.png'; break; }; if(icon) { image = new google.maps.MarkerImage('images/' + icon); - } + } var options = { map: map, position: place.geometry.location }; if(image) { options.icon = image; - } - + } + var marker = new google.maps.Marker(options); if(!this._markers) { this._markers = []; @@ -219,7 +219,7 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ }); } }, - + _removeAllMarkers: { value: function() { if(this._markers && this._markers.length > 0) { @@ -231,7 +231,7 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ } } }, - + /** Description TODO @@ -240,11 +240,11 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ draw: { enumerable: false, value: function () { - + if(this._mapLoaded) { var latLng = this.latLng || this.defaultLatLng; if(!this._map) { - var map; + var map; var myOptions = { zoom: this.zoomValue, center: new window.google.maps.LatLng(latLng.lat, latLng.lng), @@ -258,9 +258,9 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ var latLng = new window.google.maps.LatLng(latLng.lat, latLng.lng); map.setCenter(latLng); var marker = new google.maps.Marker({ - map: map, + map: map, position: latLng - }); + }); var places = this._places; if(places && places.length > 0) { @@ -269,8 +269,8 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ for (var i = 0; i < places.length; i++) { this._createMarker(places[i]); } - } - + } + if(this.traffic === true) { this.trafficLayer = new google.maps.TrafficLayer(); this.trafficLayer.setMap(map); @@ -278,12 +278,20 @@ var Map = exports.Map = Montage.create(Component, /** @lends module:"montage/ui/ if(this.trafficLayer) { this.trafficLayer.setMap(null); } - } + } } - - } + + } //window.google.maps.event.addDomListener(window, 'load', initialize); } + }, + + serializeProperties: { + value: function(serializer) { + serializer.set("element", this.element); + serializer.set("category", this.category); + serializer.set("center", this.center); + } } }); -- cgit v1.2.3