var SvgMap = new Class({
	
	Implements: [Options, Events],
	
	options: {
		svg:{},
		activeZones:[],
		defaultAttributes:{
	        fill: "#d5e6f2",
	        stroke: "#a8cce4",
	        "stroke-width": 1,
	        "stroke-linejoin": "round"
        },
		activeAttributes:{
            fill: "#339dd9",
            stroke: "#a8cce4",
            "stroke-width": 1,
            "stroke-linejoin": "round"
        },
		hoverColor: "#ea7c07",
		animationTime: 100,
		
		onZoneClick: $empty,
		onZoneHover:$empty,
		onZoneOut:$empty
	},
	
	zones: {},
	selected: undefined,
	
	initialize: function(raphael, options)
	{
		this.setOptions(options);
		this.raphael = raphael;
		this.draw();
		this.parseActiveZones();
	},
	
	draw: function()
	{
		$H(this.options.svg).each(function(path, id){
		    this.zones[id] = this.raphael.path(path);

			if(this.options.activeZones.contains(id))
			{
				this.zones[id].attr(this.options.activeAttributes);
			}
			else
			{
			    this.zones[id].attr(this.options.defaultAttributes);
			}
		},this)
	},
	
	setSelected: function(zone)
	{
		this.selected = zone;
		if(zone == "all")
		{
			this.options.activeZones.each(function(zone){
				this.zones[zone].attr({fill:this.options.hoverColor});
			},this)
			return false;
		}
		
		this.options.activeZones.each(function(zone){
			this.zones[zone].attr(this.options.activeAttributes);
		},this)
		this.zones[zone].attr({fill:this.options.hoverColor});
	},
	
	parseActiveZones: function()
	{
		this.options.activeZones.each(this.setZoneEvents.bind(this));
	},
	
	highlightAll: function()
	{
		this.options.activeZones.each(this.highlight.bind(this));
	},
	
	unHighlightAll: function()
	{
		this.options.activeZones.each(this.unHighlight.bind(this));
	},
	
	highlight: function(zone)
	{
		if(zone == "all")
		{
			this.highlightAll();
		}
		
		if(!$defined(this.zones[zone]) || zone == this.selected || this.selected == "all")
		{
			return false;
		}
		var object = this.zones[zone];
		object.animate({fill: this.options.hoverColor}, this.options.animationTime);
	},
	
	unHighlight: function(zone)
	{
		if(zone == "all")
		{
			this.unHighlightAll();
		}
		
		if(!$defined(this.zones[zone]) || zone == this.selected || this.selected == "all")
		{
			return false;
		}
		var object = this.zones[zone];
		object.animate({fill: this.options.activeAttributes.fill}, this.options.animationTime);
	},
		
	setZoneEvents: function(zone)
	{
		if(!$defined(this.zones[zone]))
		{
			return false;
		}
		
		var element = this.zones[zone][0];
		
		element.style.cursor = "pointer"; 
		
		element.onmouseover = function(){
			this.highlight(zone);
			this.fireEvent("onZoneHover", [zone]);
		}.bind(this);
		
		element.onmouseout = function(){
			this.unHighlight(zone);
			this.fireEvent("onZoneOut", [zone]);
		}.bind(this);
		
		element.onclick = function(){
			this.fireEvent("onZoneClick", [zone]);
		}.bind(this);
	}
	
})