$(function(){
	$("div.JLibMap").each(function(){
		new JLibMap(this);
	});
	$('#parishes').find('area').click(function(){
		if(this.href.indexOf('#') == -1){
			var t = this.title || this.name || null;
			var a = this.href;
			var g = this.rel || false;
			tb_show(t,a,g);
			this.blur();
			return false;
		}
	});
});

function JLibMap(oDiv){

	this.id = oDiv.id;
	this.key = $('#JLibKey-' + this.id);
	this.oDiv = $(oDiv);
	this.oImg = this.oDiv.find('img:eq(0)');
	this.oMap = this.oDiv.find('map:eq(0)');
	this.oAreas = this.oDiv.find('area');
	this.height = this.oImg.height();
	this.width = this.oImg.width();
	this.imagePath = this.oImg.attr('src').substr(0, this.oImg.attr('src').lastIndexOf('/'));
	this.loadingImage = this.imagePath.substr(0, this.imagePath.lastIndexOf('/')) + '/loading.gif';
	this.images = [];
	this.preloadCount = 0;

	this.setup();
}

JLibMap.prototype.setup = function(){

	this.oDiv.css({
		background: 'url(' + this.imagePath + '/outline.gif) no-repeat 0 0',
		height: this.height + 'px'
	});
	this.oImg.remove();
	this.oDiv.append('<div class="JMapLoader"><img src="' + this.loadingImage + '" alt="Loading Maps" /></div>');
	this.oDiv.find(".JMapLoader").css({
		opacity: '0.75',
		height: this.height + 'px',
		width: this.width + 'px'
	});

	var oThis = this;
	this.oAreas.each(function(i){
		var img = this.className.substr(5);
		if($.inArray(img, oThis.images) == -1){
			oThis.images[oThis.images.length] = img;
		}
	});
	$.each(this.images, function(){
			var path = oThis.imagePath + '/' + this + '.gif';
			var oImage = new Image;
			oImage.onload = function() { oThis.imgLoaded();  }
			oThis.oDiv.append('<img src="' + path + '" id="' + oThis.id + '-' + this + '" />');
			$('#' + oThis.id + '-' + this).hide();
			oImage.src = path;
	});

}

JLibMap.prototype.imgLoaded = function(){
	this.preloadCount++;
	if((this.images.length == this.preloadCount)) {
		this.oDiv.append('<img src="' + this.imagePath + '/spacer.gif' + '" class="JMapOverlay" />');
		this.oDiv.find('.JMapOverlay').css({
			width: this.width + 'px',
			height: this.height + 'px'
		}).attr('useMap', '#' + this.id).hide();
		this.init();
	}else {
		//alert(this.imageCount + ' !== ' + this.preloadCount);
	}
}

JLibMap.prototype.init = function(){
	var mapID = this.id;
	var hasKey = (this.key && this.key.length);
	var oThis = this;
	this.oAreas.mouseover(function(e){
		var map = $('#' + oThis.id + '-' + this.className.substr(5));
		map.stop();
		map.fadeTo(300, 1);
		if(hasKey){
			oThis.key.find('li.' + oThis.id + '-' + this.className.substr(5)).addClass('mo');
		}
	});
	this.oAreas.mouseout(function(e){
		var map = $('#' + oThis.id + '-' + this.className.substr(5));
		map.stop();
		map.fadeTo(1000, 0);
		if(hasKey){
			oThis.key.find('li.' + oThis.id + '-' + this.className.substr(5)).removeClass('mo');
		}
	});
	if(hasKey){
		var oLis = oThis.key.find('li');
		oLis.mouseover(function(e){
			$('#' + this.className).stop().fadeTo(300, 1);
			$(this).find('a').addClass('mo');
		});
		oLis.mouseout(function(e){
			$('#' + this.className).stop().fadeTo(1000, 0);
			$(this).find('a').removeClass('mo');
		});
	}
	this.oDiv.find('.JMapOverlay').show();
	this.oDiv.find('.JMapLoader').fadeOut('normal', function() { oThis.oDiv.find('.JMapLoader').remove(); } );
	
}