--- /dev/null
+/**\r
+ *\r
+ * A JQUERY GOOGLE MAPS LATITUDE AND LONGITUDE LOCATION PICKER\r
+ * version 1.2\r
+ *\r
+ * Supports multiple maps. Works on touchscreen. Easy to customize markup and CSS.\r
+ *\r
+ * To see a live demo, go to:\r
+ * http://www.wimagguc.com/projects/jquery-latitude-longitude-picker-gmaps/\r
+ *\r
+ * by Richard Dancsi\r
+ * http://www.wimagguc.com/\r
+ *\r
+ */\r
+\r
+(function($) {\r
+\r
+// for ie9 doesn't support debug console >>>\r
+if (!window.console) window.console = {};\r
+if (!window.console.log) window.console.log = function () { };\r
+// ^^^\r
+\r
+/* local modification */\r
+window.gMapsLatLonPickerState = {};\r
+\r
+$.fn.gMapsLatLonPicker = (function() {\r
+\r
+ var _self = this;\r
+\r
+ ///////////////////////////////////////////////////////////////////////////////////////////////\r
+ // PARAMETERS (MODIFY THIS PART) //////////////////////////////////////////////////////////////\r
+ _self.params = {\r
+ defLat : 0,\r
+ defLng : 0,\r
+ defZoom : 1,\r
+ queryLocationNameWhenLatLngChanges: true,\r
+ queryElevationWhenLatLngChanges: true,\r
+ mapOptions : {\r
+ mapTypeId: google.maps.MapTypeId.ROADMAP,\r
+ /* local modification */\r
+ //mapTypeControl: false,\r
+ disableDoubleClickZoom: true,\r
+ zoomControlOptions: true,\r
+ streetViewControl: false\r
+ },\r
+ strings : {\r
+ markerText : "Drag this Marker",\r
+ error_empty_field : "Couldn't find coordinates for this place",\r
+ error_no_results : "Couldn't find coordinates for this place"\r
+ }\r
+ };\r
+\r
+\r
+ ///////////////////////////////////////////////////////////////////////////////////////////////\r
+ // VARIABLES USED BY THE FUNCTION (DON'T MODIFY THIS PART) ////////////////////////////////////\r
+ _self.vars = {\r
+ ID : null,\r
+ LATLNG : null,\r
+ map : null,\r
+ marker : null,\r
+ geocoder : null\r
+ };\r
+\r
+ ///////////////////////////////////////////////////////////////////////////////////////////////\r
+ // PRIVATE FUNCTIONS FOR MANIPULATING DATA ////////////////////////////////////////////////////\r
+ var setPosition = function(position) {\r
+ _self.vars.marker.setPosition(position);\r
+ _self.vars.map.panTo(position);\r
+\r
+ $(_self.vars.cssID + ".gllpZoom").val( _self.vars.map.getZoom() );\r
+ $(_self.vars.cssID + ".gllpLongitude").val( position.lng() );\r
+ $(_self.vars.cssID + ".gllpLatitude").val( position.lat() );\r
+\r
+ $(_self.vars.cssID).trigger("location_changed", $(_self.vars.cssID));\r
+\r
+ if (_self.params.queryLocationNameWhenLatLngChanges) {\r
+ getLocationName(position);\r
+ }\r
+ if (_self.params.queryElevationWhenLatLngChanges) {\r
+ getElevation(position);\r
+ }\r
+ };\r
+\r
+ // for reverse geocoding\r
+ var getLocationName = function(position) {\r
+ var latlng = new google.maps.LatLng(position.lat(), position.lng());\r
+ _self.vars.geocoder.geocode({'latLng': latlng}, function(results, status) {\r
+ if (status == google.maps.GeocoderStatus.OK && results[1]) {\r
+ $(_self.vars.cssID + ".gllpLocationName").val(results[1].formatted_address);\r
+ } else {\r
+ $(_self.vars.cssID + ".gllpLocationName").val("");\r
+ }\r
+ $(_self.vars.cssID).trigger("location_name_changed", $(_self.vars.cssID));\r
+ });\r
+ };\r
+\r
+ // for getting the elevation value for a position\r
+ var getElevation = function(position) {\r
+ var latlng = new google.maps.LatLng(position.lat(), position.lng());\r
+\r
+ var locations = [latlng];\r
+\r
+ var positionalRequest = { 'locations': locations };\r
+\r
+ _self.vars.elevator.getElevationForLocations(positionalRequest, function(results, status) {\r
+ if (status == google.maps.ElevationStatus.OK) {\r
+ if (results[0]) {\r
+ $(_self.vars.cssID + ".gllpElevation").val( results[0].elevation.toFixed(3));\r
+ } else {\r
+ $(_self.vars.cssID + ".gllpElevation").val("");\r
+ }\r
+ } else {\r
+ $(_self.vars.cssID + ".gllpElevation").val("");\r
+ }\r
+ $(_self.vars.cssID).trigger("elevation_changed", $(_self.vars.cssID));\r
+ });\r
+ };\r
+\r
+ // search function\r
+ var performSearch = function(string, silent) {\r
+ if (string == "") {\r
+ if (!silent) {\r
+ displayError( _self.params.strings.error_empty_field );\r
+ }\r
+ return;\r
+ }\r
+ _self.vars.geocoder.geocode(\r
+ {"address": string},\r
+ function(results, status) {\r
+ if (status == google.maps.GeocoderStatus.OK) {\r
+ $(_self.vars.cssID + ".gllpZoom").val(11);\r
+ _self.vars.map.setZoom( parseInt($(_self.vars.cssID + ".gllpZoom").val()) );\r
+ setPosition( results[0].geometry.location );\r
+ } else {\r
+ if (!silent) {\r
+ displayError( _self.params.strings.error_no_results );\r
+ }\r
+ }\r
+ }\r
+ );\r
+ };\r
+\r
+ // error function\r
+ var displayError = function(message) {\r
+ alert(message);\r
+ };\r
+\r
+ ///////////////////////////////////////////////////////////////////////////////////////////////\r
+ // PUBLIC FUNCTIONS //////////////////////////////////////////////////////////////////////////\r
+ var publicfunc = {\r
+\r
+ // INITIALIZE MAP ON DIV //////////////////////////////////////////////////////////////////\r
+ init : function(object) {\r
+\r
+ if ( !$(object).attr("id") ) {\r
+ if ( $(object).attr("name") ) {\r
+ $(object).attr("id", $(object).attr("name") );\r
+ } else {\r
+ $(object).attr("id", "_MAP_" + Math.ceil(Math.random() * 10000) );\r
+ }\r
+ }\r
+\r
+ _self.vars.ID = $(object).attr("id");\r
+ _self.vars.cssID = "#" + _self.vars.ID + " ";\r
+\r
+ _self.params.defLat = $(_self.vars.cssID + ".gllpLatitude").val() ? $(_self.vars.cssID + ".gllpLatitude").val() : _self.params.defLat;\r
+ _self.params.defLng = $(_self.vars.cssID + ".gllpLongitude").val() ? $(_self.vars.cssID + ".gllpLongitude").val() : _self.params.defLng;\r
+ _self.params.defZoom = $(_self.vars.cssID + ".gllpZoom").val() ? parseInt($(_self.vars.cssID + ".gllpZoom").val()) : _self.params.defZoom;\r
+\r
+ _self.vars.LATLNG = new google.maps.LatLng(_self.params.defLat, _self.params.defLng);\r
+\r
+ _self.vars.MAPOPTIONS = _self.params.mapOptions;\r
+ _self.vars.MAPOPTIONS.zoom = _self.params.defZoom;\r
+ _self.vars.MAPOPTIONS.center = _self.vars.LATLNG;\r
+\r
+ _self.vars.map = new google.maps.Map($(_self.vars.cssID + ".gllpMap").get(0), _self.vars.MAPOPTIONS);\r
+ _self.vars.geocoder = new google.maps.Geocoder();\r
+ _self.vars.elevator = new google.maps.ElevationService();\r
+\r
+ _self.vars.marker = new google.maps.Marker({\r
+ position: _self.vars.LATLNG,\r
+ map: _self.vars.map,\r
+ title: _self.params.strings.markerText,\r
+ draggable: true\r
+ });\r
+\r
+ // Set position on doubleclick\r
+ google.maps.event.addListener(_self.vars.map, 'dblclick', function(event) {\r
+ setPosition(event.latLng);\r
+ });\r
+\r
+ // Set position on marker move\r
+ google.maps.event.addListener(_self.vars.marker, 'dragend', function(event) {\r
+ setPosition(_self.vars.marker.position);\r
+ });\r
+\r
+ // Set zoom feld's value when user changes zoom on the map\r
+ google.maps.event.addListener(_self.vars.map, 'zoom_changed', function(event) {\r
+ $(_self.vars.cssID + ".gllpZoom").val( _self.vars.map.getZoom() );\r
+ $(_self.vars.cssID).trigger("location_changed", $(_self.vars.cssID));\r
+ });\r
+\r
+ // Update location and zoom values based on input field's value\r
+ $(_self.vars.cssID + ".gllpUpdateButton").bind("click", function() {\r
+ var lat = $(_self.vars.cssID + ".gllpLatitude").val();\r
+ var lng = $(_self.vars.cssID + ".gllpLongitude").val();\r
+ var latlng = new google.maps.LatLng(lat, lng);\r
+ _self.vars.map.setZoom( parseInt( $(_self.vars.cssID + ".gllpZoom").val() ) );\r
+ setPosition(latlng);\r
+ });\r
+\r
+ // Search function by search button\r
+ $(_self.vars.cssID + ".gllpSearchButton").bind("click", function() {\r
+ performSearch( $(_self.vars.cssID + ".gllpSearchField").val(), false );\r
+ });\r
+\r
+ // Search function by gllp_perform_search listener\r
+ $(document).bind("gllp_perform_search", function(event, object) {\r
+ performSearch( $(object).attr('string'), true );\r
+ });\r
+\r
+ // Zoom function triggered by gllp_perform_zoom listener\r
+ $(document).bind("gllp_update_fields", function(event) {\r
+ var lat = $(_self.vars.cssID + ".gllpLatitude").val();\r
+ var lng = $(_self.vars.cssID + ".gllpLongitude").val();\r
+ var latlng = new google.maps.LatLng(lat, lng);\r
+ _self.vars.map.setZoom( parseInt( $(_self.vars.cssID + ".gllpZoom").val() ) );\r
+ setPosition(latlng);\r
+ });\r
+\r
+ /* local modification */\r
+ window.gMapsLatLonPickerState[_self.vars.ID] =\r
+ {\r
+ vars : _self.vars,\r
+ params : _self.params\r
+ };\r
+ } // publicfunc\r
+\r
+ }\r
+\r
+ return publicfunc;\r
+});\r
+\r
+}(jQuery));\r
+\r
+$(document).ready( function() {\r
+ $(".gllpLatlonPicker").each(function() {\r
+ $(document).gMapsLatLonPicker().init( $(this) );\r
+ });\r
+});\r
+\r
+$(document).bind("location_changed", function(event, object) {\r
+ console.log("changed: " + $(object).attr('id') );\r
+});\r
projects / freeside.git / blobdiff