adding track names

masks/messages.html

@@ -22,7 +22,6 @@ oSpot.pageInit = function(asHash)
 	/* TODO
 	- keep tooltip open so pictures can be clicked on (use popup?)
 	- apply 30 % offset to all re-centering
-	- Track Names
 	*/
 	
 	self.tmp('$Map', $('#map'));
@@ -99,26 +98,6 @@ oSpot.pageInit = function(asHash)
 			layers: [oMapBoxSat],
 			attributionControl: false,
 			zoomControl: false
-			/*mapTypeId: google.maps.MapTypeId.SATELLITE,
-			
-			scaleControl: true,
-			scaleControlOptions: {
-				position: google.maps.ControlPosition.TOP_LEFT
-			},
-			mapTypeControl: true,
-			mapTypeControlOptions: {
-				style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
-				position: google.maps.ControlPosition.TOP_LEFT
-			},
-			zoomControl: true,
-			zoomControlOptions: {
-				position: google.maps.ControlPosition.LEFT_TOP
-			},
-			fullscreenControl: true,
-			fullscreenControlOptions: {
-				position: google.maps.ControlPosition.LEFT_BOTTOM
-			},
-			streetViewControl: false*/
 		});
 		
 		//Swap tile layers on zoom level
@@ -141,11 +120,22 @@ oSpot.pageInit = function(asHash)
 					var $Legend = $(oLegend);
 					asColors[$Legend.attr('class').replace('line', '').trim()] = $Legend.css('border-top-color');
 				});
-				
-				//Assign track color
+
+				//Assign track color & tooltip
 				L.geoJson(aoTracks, {
-				    style: function(oTrack) {return {color: asColors[oTrack.properties.type]};}
-				}).addTo(oMap);
+				    	style: function(oTrack) {return {color: asColors[oTrack.properties.type]};}
+				})
+				//.bindPopup(function (layer) {
+				//	return layer.feature.properties.description;
+				//})
+				.bindTooltip(function(oLayer) {
+					var asProperties = oLayer.feature.properties;
+					var $Tooltip = $('<div>', {'class':'track_tooltip'});
+					$('<p>', {'class':'name'}).text(asProperties.Name).appendTo($Tooltip);
+					if(asProperties.Name != asProperties.description) $('<p>', {'class':'description'}).text(asProperties.description).appendTo($Tooltip);
+    				return $Tooltip[0];
+    			})
+    			.addTo(oMap);
 			}
 		});