added examples js

marioestrada · May 22, 2012 · 8191a1a · 8191a1a
1 parent 83ba994
commit 8191a1a
Show file tree

Hide file tree

Showing 2 changed files with 111 additions and 78 deletions.
diff --git a/examples.html b/examples.html
@@ -134,87 +134,15 @@ <h3>Code:</h3>
 </div>
 
 <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
-<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
+<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
 <script type="text/javascript" src="jquery.gmap.js"></script>
+<script type="text/javascript" src="examples.js"></script>
 <script type="text/javascript" charset="utf-8">
-$(function()
+$('body').delegate('a[href^="#"]', 'click', function()
 {
-   $('#map').gMap();
-
-   $('#map_controls').gMap(
-   {
-        latitude: -2.206,
-        longitude: -79.897,
-        maptype: 'TERRAIN', // 'HYBRID', 'SATELLITE', 'ROADMAP' or 'TERRAIN'
-        zoom: 8,
-        controls: {
-            panControl: true,
-            zoomControl: false,
-            mapTypeControl: true,
-            scaleControl: false,
-            streetViewControl: false,
-            overviewMapControl: false
-        }
-   });
-
-   $('#map_addresses').gMap({
-        address: "Quito, Ecuador",
-        zoom: 5,
-		markers:[
-			{
-				latitude: -2.2014,
-				longitude: -80.9763,
-				html: "_latlng"
-			},
-			{
-				address: "Guayaquil, Ecuador",
-				html: "My Hometown",
-				popup: true
-			},
-			{
-				address: "Galapagos, Ecuador",
-				html: "_address"
-			}
-		]
-    });
-
-	$("#map_extended").gMap({
-		controls: false,
-		scrollwheel: true,
-		maptype: 'TERRAIN',
-		markers: [
-			{
-				latitude: 47.670553,
-				longitude: 9.588479,
-				icon: {
-					image: "images/gmap_pin_orange.png",
-					iconsize: [26, 46],
-					iconanchor: [12,46]
-				}
-			},
-	        {
-				latitude: 47.65197522925437,
-				longitude: 9.47845458984375
-			},
-			{
-				latitude: 47.594996,
-				longitude: 9.600708,
-				icon: {
-					image: "images/gmap_pin_grey.png",
-					iconsize: [26, 46],
-					iconanchor: [12,46]
-				}
-			}
-		],
-		icon: {
-			image: "images/gmap_pin.png", 
-			iconsize: [26, 46],
-			iconanchor: [12, 46]
-		},
-		latitude: 47.58969,
-		longitude: 9.473413,
-		zoom: 10
-	});
+	var id = $(this).attr('href').replace('#', '');
+	var offset = $('#' + id).offset();
+	$('html, body').animate({ scrollTop: offset.top }, 350);
 });
 </script>
 

diff --git a/examples.js b/examples.js
@@ -0,0 +1,105 @@
+$(function()
+{
+   $('#map').gMap();
+
+   $('#map_controls').gMap(
+   {
+        latitude: -2.206,
+        longitude: -79.897,
+        maptype: 'TERRAIN', // 'HYBRID', 'SATELLITE', 'ROADMAP' or 'TERRAIN'
+        zoom: 8,
+        controls: {
+            panControl: true,
+            zoomControl: false,
+            mapTypeControl: true,
+            scaleControl: false,
+            streetViewControl: false,
+            overviewMapControl: false
+        }
+   });
+
+   $('#map_addresses').gMap({
+        address: "Quito, Ecuador",
+        zoom: 5,
+		markers:[
+			{
+				latitude: -2.2014,
+				longitude: -80.9763,
+				html: "_latlng"
+			},
+			{
+				address: "Guayaquil, Ecuador",
+				html: "My Hometown",
+				popup: true
+			},
+			{
+				address: "Galapagos, Ecuador",
+				html: "_address"
+			}
+		]
+    });
+
+	$("#map_extended").gMap({
+		controls: false,
+		scrollwheel: true,
+		maptype: 'TERRAIN',
+		markers: [
+			{
+				latitude: 47.670553,
+				longitude: 9.588479,
+				icon: {
+					image: "images/gmap_pin_orange.png",
+					iconsize: [26, 46],
+					iconanchor: [12,46]
+				}
+			},
+	        {
+				latitude: 47.65197522925437,
+				longitude: 9.47845458984375
+			},
+			{
+				latitude: 47.594996,
+				longitude: 9.600708,
+				icon: {
+					image: "images/gmap_pin_grey.png",
+					iconsize: [26, 46],
+					iconanchor: [12,46]
+				}
+			}
+		],
+		icon: {
+			image: "images/gmap_pin.png", 
+			iconsize: [26, 46],
+			iconanchor: [12, 46]
+		},
+		latitude: 47.58969,
+		longitude: 9.473413,
+		zoom: 10
+	});
+
+	// Detect user location
+	if(navigator.geolocation) {
+		navigator.geolocation.getCurrentPosition(function(position)
+		{
+			$('#map_controls').gMap('addMarker', {
+				latitude: position.coords.latitude,
+				longitude: position.coords.longitude,
+				content: 'You are here!',
+				icon: {
+					image: "images/gmap_pin.png", 
+					iconsize: [26, 46],
+					iconanchor: [12, 46]
+				},
+				popup: true
+			});
+			$('#map_controls').gMap('centerAt', {
+				latitude: position.coords.latitude,
+				longitude: position.coords.longitude,
+				zoom: 8
+			});
+		}, function()
+		{
+			//console.log('Couldn\'t find you :(');
+		});
+	}
+});