add proper tooltips to map

source/Ox.UI/js/Map/Ox.MapMarker.js

@@ -45,7 +45,7 @@ Ox.MapMarker = function(options) {
     that.marker = new google.maps.Marker({
         raiseOnDrag: false,
         shape: {coords: [8, 8, 8], type: 'circle'},
-        title: that.place.name,
+        //title: that.place.name,
         //zIndex: 1000
     });
 
@@ -183,6 +183,17 @@ Ox.MapMarker = function(options) {
         }
     }
 
+    function mouseover(e) {
+        var offset = that.map.offset(),
+            xy = that.map.overlayView.getProjection()
+                .fromLatLngToContainerPixel(e.latLng);        
+        that.tooltip.show(offset.left + xy.x - 4, offset.top + xy.y + 20);
+    }
+
+    function mouseout() {
+        that.tooltip.hide();
+    }
+
     function setOptions() {
         // workaround to prevent marker from appearing twice
         // after setting draggable from true to false (google maps bug)
@@ -218,6 +229,20 @@ Ox.MapMarker = function(options) {
                 that.marker.setVisible(true);
             }, 0);
         }
+        setTooltip();
+    }
+
+    function setTooltip() {
+        var country = Ox.getCountryByGeoname(that.place.geoname);
+        that.tooltip = Ox.Tooltip({
+            title: '<img src="'
+                + Ox.getImageByGeoname('icon', 16, that.place.geoname)
+                + '" style="float: left; margin: 1px 0 1px -1px; border-radius: 4px"/>'
+                + '<div style="float: left; margin: 4px -1px 0 4px; font-size: 9px;">'
+                + that.place.name
+                + (country && country.name != that.place.name ? ', ' + country.name : '')
+                + '</div>'
+        });        
     }
 
     /*@
@@ -228,6 +253,8 @@ Ox.MapMarker = function(options) {
         that.marker.setMap(that.map.map);
         google.maps.event.addListener(that.marker, 'click', click);
         google.maps.event.addListener(that.marker, 'dblclick', dblclick);
+        google.maps.event.addListener(that.marker, 'mouseover', mouseover);
+        google.maps.event.addListener(that.marker, 'mouseout', mouseout);
         return that;
     };