resolve differences and merged changes

vanntastic · Oct 13, 2010 · e6d288b · e6d288b
2 parents 934d3cd + 4b913c9
commit e6d288b
Show file tree

Hide file tree

Showing 2 changed files with 118 additions and 45 deletions.
diff --git a/README.markdown b/README.markdown
@@ -5,7 +5,7 @@ Marky Mark is a quick and simple wrapper for [Google maps V3](http://code.google
 
   - Create single or multiple markers
   - it's super easy to attach info windows to markers
-  - Integrated geocoding without an API key! Hooray!
+  - Integrated geocoding without an API key! Hooray! **NOTE:** the built in geocoding only allows 11 geocode requests per request, please use an external geocoder if you need to make more requests.
   - It can be an alternative to integrating maps without going to google maps and getting the iframe maps
   - Dependency free! You can use this with your favorite JS library if you like (Unless you want to use set_remote_markers)
   - A simple way to create your own map themes!
@@ -122,11 +122,13 @@ An all inclusive method to set map markers, this has built in geocoding (with no
 
 Opts hash options:
 
-    - address: The address to set your marker at, this can be an literal address or an actual location like: 'Powderhorn Park, Minneapolis, MN' (required)
+    - address: The address to set your marker at, this can be an literal address or an actual location like: 'Powderhorn Park, Minneapolis, MN' (required unless latlng set)
+    - latlng: [lat,lng] is the lat and lng of the marker, NOTE: this will take precendence over the address if it is set
     - map: the map object for which you want to apply the map to (required)
     - center: true/false pass whether or not you want the map centered on this marker (optional)
     - icon: the path to an image that you want to set the marker to (optional)
     - info: the content of the info window you want to set on the marker, this can be an id in the form of '#my-elem-id' or actual html content (optional)
+    - auto_open: true/false - automatically opens the marker's info window
 
 Example:
 
@@ -138,7 +140,7 @@ Example:
         info: 'Powderhorn Park!'
       });
 
-set_info_window (info,marker)
+set_info_window (info,marker,auto_open)
 -----------------------------
 
 Sets an info window on a marker. This is usually used in set_marker.
@@ -147,6 +149,7 @@ Options:
 
     - info: the content of the info window, this can be html content or the id of an element.
     - marker: the marker object where you want to place your info window.
+    - auto_open: true/false opens the info window on the marker
 
 Example:
 
@@ -242,4 +245,4 @@ You can add your own themes as well, if you haven't already, [do some reading at
 
 Most themes are based on this article: [http://www.41latitude.com/post/1268734799/google-styled-maps](http://www.41latitude.com/post/1268734799/google-styled-maps)  
 
-Copyright (c) 2010 Vann Ek., released under the MIT license
+Copyright (c) 2010 Vann Ek., released under the MIT license
diff --git a/marky_mark.js b/marky_mark.js
@@ -1,3 +1,7 @@
+// NOTE: make sure that you add the following before including it in your page:
+// <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
+// <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
+
 // GLOBALS
 var GEOCODER = new google.maps.Geocoder();
 
@@ -13,13 +17,17 @@ function create_map (elem,opts) {
     var themeStyles = new google.maps.StyledMapType(theme.set, {name: theme.themeName});
     delete opts.theme;
   }
-  var map = new google.maps.Map(document.getElementById(elem), opts);
-  if (themeEnabled == true) {
-    map.mapTypes.set(theme.themeName, themeStyles);
-    map.setMapTypeId(theme.themeName);
-    console.log("Applying theme: " + theme.themeName)
+  if (document.getElementById(elem)) {
+    var map = new google.maps.Map(document.getElementById(elem), opts);
+    if (themeEnabled == true) {
+      map.mapTypes.set(theme.themeName, themeStyles);
+      map.setMapTypeId(theme.themeName);
+      console.log("Applying theme: " + theme.themeName)
+    };
+    return map;
+  }else{
+    console.log("No element with ID: '" + elem + "' available to create map.");
   };
-  return map;
 }
 
 // set_latlng([lat,lng])
@@ -31,55 +39,112 @@ function set_latlng (latlng) {
 // EX:
 /* 
     set_marker({
-      address: '1234 your address', // required
+      address: '1234 your address', // required unless you have latlng set
+      latlng: [lat,lng], // required unless you have address set, this will take precedence if both address and latlng exist
       map: map, // required
       center: true_or_false, // optional
       icon: icon, // optional
       info: content_or_element_id // optional
+      auto_open: true/false // optional 
     })
     
     NOTE: set_marker will only pinpoint the first address found
 */
+
 function set_marker (opts) {
-  GEOCODER.geocode({'address': opts.address}, function(results, status) {
+  if (is.defined(opts.latlng)) {
+    // latlng setup
+    marker_opts = {
+       map: opts.map,
+       position: set_latlng(opts.latlng)
+     };
+     // set optional defaults right here
+     if (is.defined(opts.icon)) { marker_opts.icon = opts.icon };
+     // set the info var for the infowindow
+     /*
+      TODO : the following pattern should be extracted out into a function ...
+     */
+     if (is.defined(opts.info)) {
+       info = opts.info;
+       delete opts.info;
+     } else {
+       info = undefined;
+     };
+
+     if (is.defined(opts.auto_open)) {
+       auto_open = opts.auto_open;
+       delete opts.auto_open;
+     } else {
+       auto_open = false;
+     };
+
+     // center the map if it's set to true
+     if (is.defined(opts.center)) {
+       opts.map.setCenter(set_latlng(opts.latlng));
+       delete opts.center;
+     };
+
+     marker = new google.maps.Marker(marker_opts);
+
+     // set info windows and events
+     if (is.defined(info)) { set_info_window(info,marker,auto_open) };
 
-    if (status == google.maps.GeocoderStatus.OK) {
-       marker_opts = {
-         map: opts.map,
-         position: results[0].geometry.location
-       };
-       // set optional defaults right here
-       if (is.defined(opts.icon)) { marker_opts.icon = opts.icon };
-       // set the info var for the infowindow
-       if (is.defined(opts.info)) {
-         info = opts.info;
-         delete opts.info;
-       } else {
-         info = undefined;
-       };
-
-       // center the map if it's set to true
-       if (is.defined(opts.center)) {
-         opts.map.setCenter(results[0].geometry.location);
-         delete opts.center;
-       };
-
-       marker = new google.maps.Marker(marker_opts);
-
-       // set info windows and events
-       if (is.defined(info)) { set_info_window(info,marker) };
-
-    } else {
-      alert("Could not geocode address: " + opts.address + " because of: " + status);
-    };
+  } else {
 
-  });
+    GEOCODER.geocode({'address': opts.address}, function(results, status) {
+
+      if (status == google.maps.GeocoderStatus.OK) {
+         marker_opts = {
+           map: opts.map,
+           position: results[0].geometry.location
+         };
+         // set optional defaults right here
+         if (is.defined(opts.icon)) { marker_opts.icon = opts.icon };
+         // set the info var for the infowindow
+         /*
+          TODO : the following pattern should be extracted out into a function ...
+         */
+         if (is.defined(opts.info)) {
+           info = opts.info;
+           delete opts.info;
+         } else {
+           info = undefined;
+         };
+
+         if (is.defined(opts.auto_open)) {
+           auto_open = opts.auto_open;
+           delete opts.auto_open;
+         } else {
+           auto_open = false;
+         };
+
+         // center the map if it's set to true
+         if (is.defined(opts.center)) {
+           opts.map.setCenter(results[0].geometry.location);
+           delete opts.center;
+         };
+
+         marker = new google.maps.Marker(marker_opts);
+
+         // set info windows and events
+         if (is.defined(info)) { set_info_window(info,marker,auto_open) };
+
+      } else {
+        console.log("Could not geocode address: " + opts.address + " because of: " + status);
+        // alert("Could not geocode address: " + opts.address + " because of: " + status);
+      };
+
+    });
+  };
+
 }
 
 // Can either be an id: '#somediv' or actual html content
 // EX: set_info_window('#somediv',marker) # => grabs some div
 //     set_info_window("<div id='cool'>My Map content!</div>",marker)
-function set_info_window (info,marker) {
+// automatically open the info window
+//    set_info_window('My info', marker, true)
+function set_info_window (info,marker,auto_open) {
   // pulls an element's html content
   if (info.charAt(0) == '#') {
     id = info.split('#')[1];
@@ -90,9 +155,14 @@ function set_info_window (info,marker) {
     content: info
   });
 
-  google.maps.event.addListener(marker, 'click', function() {
+  if (auto_open) {
     infowindow.open(marker.map, marker);
-  });
+  }else{
+    google.maps.event.addListener(marker, 'click', function() {
+      infowindow.open(marker.map, marker);
+    });
+  };
+
 }
 
 /*