var data = [
		{
			id: 'pop-bristol',
			popup: [35, 95]
		},
		{
			id: 'pop-felixstowe',
			popup: [155, 115]
		},
		{
			id: 'pop-hamshall',
			popup: [70, 145]
		},
				{
			id: 'pop-immingham',
			popup: [110, 195]
		},
		{
			id: 'pop-leeds',
			popup: [85, 200]
		},
		{
			id: 'pop-liverpool',
			popup: [27, 190]
		},
		{
			id: 'pop-manchester',
			popup: [55, 195]
		},
		{
			id: 'pop-northampton',
			popup: [90, 125]
		},
		{
			id: 'pop-southshields',
			popup: [75, 260]
		},
		{
			id: 'pop-southampton',
			popup: [70, 60]
		},
		{
			id: 'pop-thamesport',
			popup: [115, 85]
		},
		{
			id: 'pop-tilbury',
			popup: [137, 85]
		}
	];

jQuery(function($) {
	var popup = $("#MapPopUps");
	var map = $("#map");
	var mapItems = $(".mapItem");
	var listItems = $(".listItem");
	var locked = false;
	var details = '';
	
	var BR = {bottom: 5, left: 85};
	
	function getData(item){
		for(var i=0; i< data.length; i++){
			if(item == data[i].id) return data[i];
		}
		return false;
	}
	
	// Click opens the popup, positions, and selects the correct sub-item.
	function open(e) {
		details = $(this.hash);
		
		var adjust = {
			bottom: e.pageY - map.offset().top,
			left: e.pageX - map.offset().left
		};	

		jQuery.each(jQuery.browser, function(i, val) {
			if(i=="msie" && jQuery.browser.version.substr(0,3)=="7.0"){
				BR = {
					bottom: 25,
					left: 85
				};
			}
		});
		
		popup.children().hide();
		popup.show();
		details.show();
		
		popup.css({
			bottom: map.height() - adjust.bottom + BR.bottom,
			left: adjust.left-80,
			//left: adjust.left - (popup.width() - BR.left),
			position: 'absolute',
			'z-index': 999
		});		
		
		return false;
	}

	function listOpen(e){
		var item = $(this.hash).attr('id');	
		var current = getData(item);
		
		if(current.id == item){
			details = $('#' + item);
			
			popup.children().hide();
			popup.show();
			details.show();
			popup.css({
				bottom: current.popup[1],
				left: current.popup[0],
				position: 'absolute',
				'z-index': 999
			});
		}
		
		return false;
	}
	
	
	mapItems.hover(function(e){
		if(locked){
			return false;
		}
		return open.call(this, e);
	},
	function(e){
		if (locked) {
			return;
		}
		details.hide();
		popup.children().hide();
		popup.hide();

	});
	
	listItems.hover(function(e){
		if(locked){
			return false;
		}
		return listOpen.call(this, e);
	},
	function(e){
		if (locked) {
			return;
		}
		details.hide();
		popup.children().hide();
		popup.hide();

	});


	mapItems.click(function(e) {
		locked = true;
		return open.call(this, e);
	});
		
	listItems.click(function(e){
		locked = true;
		return listOpen.call(this, e);
	});

	// Click to hide again.
	popup.bind("click", function() {
		locked = false;
		details.hide();
		popup.children().hide();
		popup.hide();
	});
});