// Clientside cluster viewer for pre-calculated clusters by Marcel Tegelaar

function wdmClusterMarker(latlng,  map, count) { 
   google.maps.OverlayView.call(this); 
   this.latlng_ = latlng; 
   this.latlng2_ = new google.maps.LatLng(-34.397, 150.744); 
   this.MarkerCount = count; 
   this.setMap(map); 
} 
  
wdmClusterMarker.prototype = new google.maps.OverlayView(); 
  
wdmClusterMarker.prototype.draw = function() { 
   var me = this; 
  
   var div = this.div_; 
   if (!div) { 
   div = this.div_ = document.createElement('DIV'); 

   // Assign style
   for(var i in styles)
   {
      if(this.MarkerCount > i)
         { this.style = styles[i]; }
      else
         { break; }
   }
     
      // Set styles 
      div.style.position = 'absolute';
      div.style.width = this.style.width+'px';
      div.style.height = this.style.height+'px';
      div.style.lineHeight = div.style.height;
      div.style.background = 'transparent url('+this.style.image+') 50% 50% no-repeat';
      div.style.color = '#FFFFFF';
      div.style.textColor = '#FFFFFF';
		
      // Marker count
      div.style.textAlign = 'center';
      div.style.textAlign = 'center';
      div.style.fontFamily = 'Arial, Helvetica';
      div.style.fontSize = '11px';
      div.style.fontWeight = 'bold';
      div.innerHTML = this.MarkerCount;
		
      // Cursor and onlick
      div.style.cursor = 'pointer';
      google.maps.event.addDomListener(div, 'click', function(event) {
         google.maps.event.trigger(me, "click"); 
      });
	
      this.getPanes().overlayLayer.appendChild(div);
   }

   var position = this.getProjection().fromLatLngToDivPixel(this.latlng_);
   div.style.left = (position.x - parseInt(this.style.width / 2)) + 'px';
   div.style.top = (position.y - parseInt(this.style.height / 2)) + 'px';

}
  

wdmClusterMarker.prototype.remove = function() { 
   if (this.div_) { 
      this.div_.parentNode.removeChild(this.div_); 
      this.div_ = null; 
   } 
}
  
wdmClusterMarker.prototype.hide = function() { 
   if (this.div_) { 
      this.div_.style.visibility = "hidden"; 
   } 
}
 
wdmClusterMarker.prototype.show = function() { 
   if (this.div_) { 
      this.div_.style.visibility = "visible"; 
   } 
}