jQuery(document).ready( function() {

	// handler to open map
	if(jQuery('#show_region_select_map')){
//		if(!jQuery.support.objectAll){
//			alert(jQuery('#show_region_select_map').val());
//		}
	jQuery('#show_region_select_map').click(showRegionSelectMap);
	}
	// handler for reset button
	jQuery('#resetMapForm').click(resetMapFormHandler);
	
	var region_select_map_open = false;
	var the_selected_region = 0;

	function resetMapFormHandler(event){
		jQuery('#regionSelect').val(0);
		jQuery('#results_entry').remove();
		jQuery('#map_sidebar').html('<div class="text_below_map">'+sl_instruction_message+'</div>');
		sl_load();
	}
	
	function mouseOverLinkEventHandler(event){
			var orginal_id = this.id;
			var target_id = orginal_id.replace('_link','');
			jQuery('.map_overlay').css('display', 'none');
			jQuery('#'+target_id).css('display', 'inline');

	}

	function mouseOverMapEventHandler(event){
		var offset = jQuery(this).offset();
		var mapX = event.pageX - offset.left;
		var mapY = event.pageY - offset.top;
		var selected_region = getRegion(mapX, mapY);
		var display_region = 'unselected'
		switch(selected_region){
			case 0:
				display_region = 'unselected';
			break;
			case 1:
				display_region = 'highlands';
			break;
			case 2:
				display_region = 'north';
			break;
			case 3:
				display_region = 'tayside';
			break;
			case 4:
				display_region = 'west';
			break;
			case 5:
				display_region = 'east';
			break;
			case 6:
				display_region = 'south';
			break;
		}
		jQuery('.map_overlay').css('display', 'none');
		jQuery('#'+display_region).css('display', 'inline');
	}

	// handlers to close map and set selection
	function clickLinkEventHandler(event){
		event.preventDefault();
		// store the result in search form and close map
		var orginal_id = this.id;
		switch(orginal_id){
			case 'unselected':
				the_selected_region = 0;
			break;
			case 'highlands_link':
				the_selected_region = 1;
			break;
			case 'north_link':
				the_selected_region = 2;
			break;
			case 'tayside_link':
				the_selected_region = 3;
			break;
			case 'west_link':
				the_selected_region = 4;
			break;
			case 'east_link':
				the_selected_region = 5;
			break;
			case 'south_link':
				the_selected_region = 6;
			break;
		}
		submitFormHandler(event);
	}
	
	function clickMapEventHandler(event){
		var offset = jQuery(this).offset();
		var mapX = event.pageX - offset.left;
		var mapY = event.pageY - offset.top;
		the_selected_region = getRegion(mapX, mapY);
		// store the result in search form and close map
		submitFormHandler(event);
	}

	function submitFormHandler(event){
		event.preventDefault();
		setDropDown();
		removeForm();
		removeOverlay();
		region_select_map_open = false;
		jQuery('#addressSubmit').click();
	}
	
	function closeFormHandler(event){
		event.preventDefault();
		//setDropDown();
		removeForm();
		removeOverlay();
		region_select_map_open = false;
	}
	
	function setDropDown(){
		jQuery('#regionSelect').val(the_selected_region);
	}
	
	function removeForm(){
		jQuery('#region_map_wrapper').remove();
	}
	
	function removeOverlay(){
		jQuery('#darklight').remove();
	}
	
	// function to work out what region the mouse event occured in
	function getRegion(mapX, mapY){
		var selected_region = 0;
		if(mapX < 50){
			if (mapY < 134){
				selected_region = 1; //'highlands';
			}else if(mapY < 176){
				selected_region = 4; //'west';
			}
			else if(mapY < 220){
				selected_region = 6; //'south';
			}
		}
		else if(mapX >49 && mapX < 69){
			if(mapY < 119){
				selected_region = 1; //'highlands';
			} 
			else if(mapY < 168){
				selected_region = 4; // 'west';
			}
			else if(mapY < 220){
				selected_region = 6; // 'south';
			}
		}
		else if( mapX > 68 && mapX < 75){
			if(mapY < 112){
				selected_region = 1; // 'highlands';
			} else if(mapY < 141){
				selected_region = 3; // 'tayside';
			} else if(mapY < 176){
				selected_region = 4; // 'west';
			} else if(mapY < 220){
				selected_region = 6; // 'south';
			}
		} else if(mapX > 74 && mapX < 82){
			if(mapY < 107){
				selected_region = 1; // 'highlands';
			}
/*			else if(mapY < 131){
				selected_region = 3; // 'tayside';
			} else if(mapY < 134){
				selected_region = 3; // 'tayside';
			}*/
			else if(mapY < 141){
				selected_region = 3; // 'tayside';
			} else if(mapY < 158){
				selected_region = 4; // 'west';
			} else if(mapY < 220){
				selected_region = 6; //'south';
			}
		}
		else if(mapX > 81 && mapX < 92){
			if(mapY < 107){
				selected_region = 1; // 'highlands';
			} else if(mapY < 141){
				selected_region = 3 // 'tayside';
			} else if(mapY < 158){
				selected_region = 4; // 'west';
			} else if(mapY < 220){
				selected_region = 6; // 'south';
			}
		}
		else if(mapX > 91 && mapX < 99){
			if(mapY < 112){
				selected_region = 2; //'north';
			} else if(mapY < 134){
				selected_region = 3; //'tayside';
			} else if(mapY < 149){
				selected_region = 5; //'east';
			} else if(mapY < 220){
				selected_region = 6; // 'south';
			}
		}
		else if(mapX > 98 && mapX < 150){
			if(mapY < 112){
				selected_region = 2; // 'north';
			} else if(mapY < 134){
				selected_region = 3; // 'tayside';
			} else if(mapY < 149){
				selected_region = 5 // 'east';
			} else if(mapY < 220){
				selected_region = 6 // 'south';
			}
		}
		return selected_region;
	}

	function showRegionSelectMap(event){
		//global region_select_map_open;
		event.preventDefault();
		
		if(region_select_map_open){
			return;
		}else{
			region_select_map_open = true;
		}
		// append this some where !
		var regionSelectMapArray = new Array();
		regionSelectMapArray.push("<div id='region_map_wrapper'>");
		regionSelectMapArray.push("	<div id='region_map'>");
		regionSelectMapArray.push("		<img src='wp-content/plugins/store-locator/addons/unselected.gif' alt='select region' name='unselected' width='150' height='220' class='map_overlay' id='unselected' />");
		regionSelectMapArray.push("		<img src='wp-content/plugins/store-locator/addons/highlands_and_islands.gif' alt='highlands and islands' name='highlands' width='150' height='220' class='map_overlay' id='highlands' />");
		regionSelectMapArray.push("		<img src='wp-content/plugins/store-locator/addons/north_east_scotland_orkney_and_shetland.gif' alt='north east scotland orkney and shetland' name='north' width='150' height='220' class='map_overlay' id='north' />");
		regionSelectMapArray.push("		<img src='wp-content/plugins/store-locator/addons/tayside_and_central_scotland.gif' alt='tayside and central scotland' name='tayside' width='150' height='220' class='map_overlay' id='tayside' />");
		regionSelectMapArray.push("		<img src='wp-content/plugins/store-locator/addons/glasgow_and_west_of_scotland.gif' alt='glasgow and west of scotland' name='west' width='150' height='220' class='map_overlay' id='west' />");
		regionSelectMapArray.push("		<img src='wp-content/plugins/store-locator/addons/edinburgh_fife_east_of_scotland.gif' alt='edinburgh fife east of scotland' name='east' width='150' height='220' class='map_overlay' id='east' />");
		regionSelectMapArray.push("		<img src='wp-content/plugins/store-locator/addons/south_of_scotland.gif' alt='south of scotland' name='south' width='150' height='220' class='map_overlay' id='south' />");
		regionSelectMapArray.push("	</div>");
		regionSelectMapArray.push("	<div id='region_labels'>");
		regionSelectMapArray.push("		<ul>");
		regionSelectMapArray.push("			<li><a href='#' id='highlands_link' class='region_link'>Highlands &amp; Islands</a></li>");
		regionSelectMapArray.push("			<li><a href='#' id='north_link' class='region_link'>NE Scotland, Orkney &amp; Shetland</a></li>");
		regionSelectMapArray.push("			<li><a href='#' id='tayside_link' class='region_link'>Tayside &amp; Central Scotland</a></li>");
		regionSelectMapArray.push("			<li><a href='#' id='west_link' class='region_link'>Glasgow &amp; West of Scotland</a></li>");
		regionSelectMapArray.push("			<li><a href='#' id='east_link' class='region_link'>Edinburgh, Fife &amp; East of Scotland</a></li>");
		regionSelectMapArray.push("			<li><a href='#' id='south_link' class='region_link'>South of Scotland</a></li>");
		regionSelectMapArray.push("		</ul>");
		regionSelectMapArray.push("	</div>");
		regionSelectMapArray.push("<p id='region-form-submit'>");
		//regionSelectMapArray.push("<input type='button' id='regionSubmit' class='submit-comment button' value='Search Locations'>");
		//regionSelectMapArray.push("&nbsp;");
		regionSelectMapArray.push("<input type='button' class='submit-comment button cancel-submit' id='cancel_submit' value='Close' />");
		regionSelectMapArray.push("</p>");
		regionSelectMapArray.push("<div class='clear' style='float:left; clear: both;'><!-- clear --></div>");
		regionSelectMapArray.push("</div>");
		regionSelectMapArray.push("<div id='darklight'>");
		regionSelectMapArray.push("</div>");
		
		regionSelectMap = regionSelectMapArray.join('');
		jQuery('#show_region_select_map').after(regionSelectMap);
		// attach event handlers to menu links
		jQuery('.region_link').mouseover(mouseOverLinkEventHandler); 
		jQuery('.region_link').click(clickLinkEventHandler); 
		// attach event handlers to map
		jQuery('#region_map').mousemove(mouseOverMapEventHandler); 
		jQuery('#region_map').click(clickMapEventHandler); 
		// attach event handlers to form controls
		jQuery('#regionSubmit').click(submitFormHandler);
		jQuery('#cancel_submit').click(closeFormHandler);
	}
	
})