(function(){

var extend = {
    circle:function(aX, aY, aDiameter){
        this.ellipse(aX, aY, aDiameter, aDiameter);
    },
    fillCircle:function(aX, aY, aDiameter){
        this.beginPath();
        this.circle(aX, aY, aDiameter);
        this.fill();
    },
    strokeCircle:function(aX, aY, aDiameter){
        this.beginPath();
        this.circle(aX, aY, aDiameter);
        this.stroke();
    },
    ellipse:function(aX, aY, aWidth, aHeight){
        var hB = (aWidth / 2) * .5522848,
            vB = (aHeight / 2) * .5522848,
            eX = aX + aWidth,
            eY = aY + aHeight,
            mX = aX + aWidth / 2,
            mY = aY + aHeight / 2;
        this.moveTo(aX, mY);
        this.bezierCurveTo(aX, mY - vB, mX - hB, aY, mX, aY);
        this.bezierCurveTo(mX + hB, aY, eX, mY - vB, eX, mY);
        this.bezierCurveTo(eX, mY + vB, mX + hB, eY, mX, eY);
        this.bezierCurveTo(mX - hB, eY, aX, mY + vB, aX, mY);
        this.closePath();
    },
    fillEllipse:function(aX, aY, aWidth, aHeight){
        this.beginPath();
        this.ellipse(aX, aY, aWidth, aHeight);
        this.fill();
    },
    strokeEllipse:function(aX, aY, aWidth, aHeight){
        this.beginPath();
        this.ellipse(aX, aY, aWidth, aHeight);
        this.stroke();
    }
};
for(var key in extend)
    CanvasRenderingContext2D.prototype[key] = extend[key];
if(!this.G_vmlCanvasManager)
    G_vmlCanvasManager = {init:function(){}, initElement:function(el){return el}};
})();

$(document).ready(function(){
	var has_VML, create_canvas_for, add_shape_to, clear_canvas, shape_from_area,
		canvas_style, fader, hex_to_decimal, css3color, is_image_loaded;
	var counter = 0;

	//has_VML = document.namespaces;
	has_canvas = document.createElement('canvas');
	has_canvas = has_canvas && has_canvas.getContext;

	if(!(has_canvas || has_VML)) {
		$.fn.maphilight = function() { return this; };
		return;
	}	
	// not IE
	if(has_canvas){
        //var myCanvas = G_vmlCanvasManager.initElement(document.createElement("canvas"));
        //document.getElementById('magazyny_map').appendChild(myCanvas);
	
		fader = function(element, opacity, interval) {
			if(opacity <= 1) {
				element.style.opacity = opacity;
				window.setTimeout(fader, 10, element, opacity + 0.1, 10);
			}
		};
		
		hex_to_decimal = function(hex) {
			return Math.max(0, Math.min(parseInt(hex, 16), 255));
		};
		css3color = function(color, opacity) {
			return 'rgba('+hex_to_decimal(color.substr(0,2))+','+hex_to_decimal(color.substr(2,2))+','+hex_to_decimal(color.substr(4,2))+','+opacity+')';
		};
		create_canvas_for = function(img) {
            var c = document.getElementsByTagName('canvas')[0];
            clear_canvas(c);            
            return c;
		};
		
		add_shape_to = function(canvas, shape, coords, options, name){				
			var i, context = canvas.getContext('2d');
			context.beginPath();
			
			if(shape == 'rect'){
				context.rect(coords[0], coords[1], coords[2] - coords[0], coords[3] - coords[1]);
			} 
			else if(shape == 'poly'){
				context.moveTo(coords[0], coords[1]);

				for(i=2; i < coords.length; i+=2){
					context.lineTo(coords[i], coords[i+1]);
				}				
			} 
			else if(shape == 'circ'){
				context.arc(coords[0], coords[1], coords[2], 0, Math.PI * 2, false);
			}						
			context.closePath();
			
			if(options.fill){
				context.fillStyle = css3color(options.fillColor, options.fillOpacity);
				context.fill();
			}
			if(options.stroke){
				context.strokeStyle = css3color(options.strokeColor, options.strokeOpacity);
				context.lineWidth = options.strokeWidth;
				context.stroke();
			}
			if(options.fade){
				fader(canvas, 0);
			}
		};		
		
        clear_canvas = function(canvas){
            var ctx = canvas.getContext('2d');
			ctx.clearRect(0, 0, canvas.width,canvas.height);
            
            //dla kazdej area rysujemy miasto wojewodzkie
            ctx = canvas.getContext('2d');
            
            $('map').find('area[coords]').each(function(){
                //jesli coordsy sa dluzsze niz 2 zrobic forloopa i wybrac kolejne x'y i y'ki
                var coords = $(this)[0].getAttribute('wojewodztwo'),
                x = coords.split(',')[0], y = coords.split(',')[1],
                active = $(this)[0].getAttribute('active'), points,
                shape;
				
				if(coords.split(',').length > 2){
					var x2= coords.split(',')[2];
					var y2= coords.split(',')[3];
					//alert(x2);
				}

                if(active){
                    shape = shape_from_area(this);
                    points = shape[1];
                    
                    ctx.moveTo(points[0], points[1]);
                    for(i=2; i < points.length; i+=2){
                        ctx.lineTo(points[i], points[i+1]);
                    }
                
                    ctx.closePath();
                    ctx.fillStyle = '#E36969';
                    ctx.fill();
                    
                    ctx.fillStyle = "white";
                    ctx.beginPath();
                    ctx.arc(x, y, 5, 0, Math.PI*2, false);
					if(x2 && y2)
						ctx.arc(x2, y2, 5, 0, Math.PI*2, false);
                    ctx.closePath();
                    ctx.fill();               
                }
                else{
                    ctx.fillStyle = "#C61414";
                    ctx.beginPath();
                    ctx.arc(x, y, 5, 0, Math.PI*2, false);
					if(x2 && y2)
						ctx.arc(x2, y2, 5, 0, Math.PI*2, false);
                    ctx.closePath();
                    ctx.fill();
                }
            });
            
		};
	} 
	// IE
	else {   
		document.createStyleSheet().addRule("v\\:*", "behavior: url(#default#VML); antialias: true;"); 
		document.namespaces.add("v", "urn:schemas-microsoft-com:vml"); 
			
		create_canvas_for = function(img){
			return $('<var id="iemainvmlcontainer" style="zoom:1;overflow:hidden;display:block;width:'+img.width+'px;height:'+img.height+'px;"></var>').get(0);
		};
		
		add_shape_to = function(canvas, shape, coords, options, name, id){
			var fill, stroke, opacity, e;					
			fill = '<v:fill color="#'+options.fillColor+'" opacity="'+(options.fill ? options.fillOpacity : 0)+'" />';			
			stroke = (options.stroke ? 'strokeweight="'+options.strokeWidth+'" stroked="t" strokecolor="#'+options.strokeColor+'"' : 'stroked="f"');		
			opacity = '<v:stroke opacity="'+options.strokeOpacity+'"/>';
			
			if(shape == 'rect'){
				e = $('<v:rect id="canvas_' + id + '" name="'+name+'" filled="t" '+stroke+' style="zoom:1;margin:0;padding:0;display:block;position:absolute;left:'+coords[0]+'px;top:'+coords[1]+'px;width:'+(coords[2] - coords[0])+'px;height:'+(coords[3] - coords[1])+'px;"></v:rect>');
			} 
			else if(shape == 'poly'){
   			e = $('<v:shape id="canvas_' + id + '" name="'+name+'" filled="t" '+stroke+' coordorigin="0,0" coordsize="'+canvas.width+','+canvas.height+'" path="m '+coords[0]+','+coords[1]+' l '+coords.join(',')+' x e" style="zoom:1;margin:0;padding:0;display:block;position:absolute;top:0px;left:0px;width:'+canvas.width+'px;height:'+canvas.height+'px;"></v:shape>');
			} 
			else if(shape == 'circ'){
				e = $('<v:oval id="canvas_' + id + '" name="'+name+'" filled="t" '+stroke+' style="zoom:1;margin:0;padding:0;display:block;position:absolute;left:'+(coords[0] - coords[2])+'px;top:'+(coords[1] - coords[2])+'px;width:'+(coords[2]*2)+'px;height:'+(coords[2]*2)+'px;"></v:oval>');
			}
			e.get(0).innerHTML = fill+opacity;
			$(canvas).append(e);
		};
		
		clear_canvas = function(canvas){
			$(canvas).find('[name=highlighted]').remove();
		};
	}
	
	shape_from_area = function(area){
		var i, coords = area.getAttribute('coords').split(',');
		for (i=0; i < coords.length; i++) { 
            coords[i] = parseFloat(coords[i]); 
        }		
		return [area.getAttribute('shape').toLowerCase().substr(0,4), coords];
	};
	
	is_image_loaded = function(img){
		if(!img.complete) { return false; } // IE
		if(typeof img.naturalWidth != "undefined" && img.naturalWidth == 0) { return false; } // Others
		return true;
	}

	canvas_style = {
		position: 'absolute',
		left: 0,
		top: 0,
		padding: 0,
		border: 0
	};
	
	$.fn.maphilight = function(opts) {
		opts = $.extend({}, $.fn.maphilight.defaults, opts);
		
		return this.each(function() {		
			var img, wrap, options, map, canvas, canvas_always, mouseover, highlighted_shape;
			img = $(this);
		
			if(!is_image_loaded(this)) {
				return window.setTimeout(function() {
					img.maphilight(opts);
				}, 200);
			}

			options = $.metadata ? $.extend({}, opts, img.metadata()) : opts;
			map = $('map[name="'+img.attr('usemap').substr(1)+'"]');

			if(!(img.is('img') && img.attr('usemap') && map.size() > 0)){ 
                return; 
            }

			if(img.hasClass('maphilighted')){
				var wrapper = img.parent();
				img.insertBefore(wrapper);
				wrapper.remove();
			}

			wrap = $('<div>').css({display:'block',background:'url('+this.src+')',position:'relative',padding:0,width:this.width,height:this.height});
			img.before(wrap).css('opacity', 0).css(canvas_style).remove();
			
			if($.browser.msie) { 
                img.css('filter', 'Alpha(opacity=0)'); 
            }
			
			wrap.append(img);			
			canvas = create_canvas_for(this);
			$(canvas).css(canvas_style);
			canvas.height = this.height;
			canvas.width = this.width;
			canvas.id = this.id;
					
			mouseover = function(e){
                $.cursorMessage($(this)[0].getAttribute('name'), { hideTimeout:0 });
                $(this).mouseout($.hideCursorMessage);
                    
				var shape, area_options;
				area_options = $.metadata ? $.extend({}, options, $(this).metadata()) : options,
                coords = $(this)[0].getAttribute('wojewodztwo'),
                x = coords.split(',')[0], y = coords.split(',')[1],
                active = $(this)[0].getAttribute('active');                
				
				if(coords.split(',').length > 2){
					var x2= coords.split(',')[2];
					var y2= coords.split(',')[3];
					//alert(x2);
				}
				
				if (area_options.linked){
					var thislinked = area_options.linked;
					
					$(map).find('area[coords]').each(function(){
						var shape, area_options, object;
						area_options = $.metadata ? $.extend({}, options, $(this).metadata()) : options;		
									
						if (thislinked == area_options.linked) {
							shape = shape_from_area(this);
                            clear(canvas, shape[1]);
							add_shape_to(canvas, shape[0], shape[1], area_options, "highlighted", null);												
						}																									
					});              
				}
				else{
					shape = shape_from_area(this);
                    clear(canvas, shape[1]);
					add_shape_to(canvas, shape[0], shape[1], area_options, "highlighted", null);                  
				}

                if(active){
                    var ctx = canvas.getContext('2d');
                    ctx.beginPath();
                    ctx.fillStyle = "white";
                    ctx.arc(x, y, 7, 0, Math.PI*2, false);
					if(x2 && y2)
						ctx.arc(x2, y2, 7, 0, Math.PI*2, false);
                    ctx.closePath();
                    ctx.fill();                 
                }
                else{
                    var ctx = canvas.getContext('2d');
                    ctx.beginPath();
                    ctx.fillStyle = "#C61414";
                    ctx.arc(x, y, 7, 0, Math.PI*2, false);
					if(x2 && y2)
						ctx.arc(x2, y2, 7, 0, Math.PI*2, false);
                    ctx.closePath();
                    ctx.fill();                 
                }                
			}

            clear = function(canvas, points){
                var ctx = canvas.getContext('2d'),
                x_max = points[0], y_max = points[1],
                x_min = points[0], y_min = points[1];
                
                //czyszczenie powierzchni pod podswietlonym wojewodztwem
                /*for(i=2; i < points.length; i+=2){
                    if(points[i] > x_max){
                        x_max = points[i];
                    }
                    if(points[i+1] > y_max){
                        y_max = points[i+1];
                    }
                    if(points[i] < x_min){
                        x_min = points[i];
                    }
                    if(points[i+1] < y_min){
                        y_min = points[i+1];
                    }                        
                }*/

                ctx.clearRect(x_min, y_min, x_max-x_min, y_max-y_min);                
            }			
			
			draw = function(object){
				var shape, area_options, object;
				area_options = $.metadata ? $.extend({}, options, $(this).metadata()) : options;					
				// not Ie
				if(has_canvas){
					canvas_always = create_canvas_for(img.get());			
					$(canvas_always).css(canvas_style);
					canvas_always.width = img.width();
					canvas_always.height = img.height();
					canvas_always.id = 'canvas_' + $(object).attr("id");														
					img.before(canvas_always);
				}
									
				shape = shape_from_area(object);
				
				// ie!
				if ($.browser.msie){
					add_shape_to(canvas, shape[0], shape[1], area_options, "", $(object).attr("id"));
				} 
				else{
					add_shape_to(canvas_always, shape[0], shape[1], area_options, "");
				}
			}
			
			mouseclick = function(e,id){
				var shape, area_options, object;
				area_options = $.metadata ? $.extend({}, options, $(this).metadata()) : options;	
								
				if (id){
					object = id;
				}
				else{
					object = this;
				}
				
				if (!$('#canvas_' + $(object).attr('id')).attr('id')){
					if (area_options.linked){
						var thislinked = area_options.linked;
						
						$(map).find('area[coords]').each(function(){
							var shape, area_options, object;
							area_options = $.metadata ? $.extend({}, options, $(this).metadata()) : options;		
										
							if (thislinked == area_options.linked){
								draw(this);				
							}																																														
						});
					}
					else{
						draw(object);
					}
				}
				else{
					if (area_options.linked){
						var thislinked = area_options.linked;
						
						$(map).find('area[coords]').each(function(){
							var shape, area_options, object;
							area_options = $.metadata ? $.extend({}, options, $(this).metadata()) : options;		
										
							if (thislinked == area_options.linked){
								$('#canvas_' + $(this).attr('id')).remove();
							}																			
						});
						clear_canvas(canvas);
					}
					else{
						$('#canvas_' + $(object).attr('id')).remove();
						clear_canvas(canvas);	
					}
				}
			}
					
			if(options.alwaysOn){
				$(map).find('area[coords]').each(mouseover);
			} 
            else{
				if($.metadata){
					$(map).find('area[coords]').each(function() {											
						var shape, area_options;
						area_options = $.metadata ? $.extend({}, options, $(this).metadata()) : options;
						
						if(area_options.alwaysOn){
							draw(this);							
						}
					});
				}
				$(map).find('area[coords]').mouseover(mouseover).mouseout(function(e) { clear_canvas(canvas); });
				$(map).find('area[coords]').click(mouseclick); 
			}
			img.before(canvas);
			img.addClass('maphilighted');
            clear_canvas(canvas);
		});
	};

	$.fn.maphilight.defaults = {
		fill: true,
		fillColor: 'cfcfcf',
		fillOpacity: 1,
		stroke: false,
		//fade: true,
		alwaysOn: false
	};
});

