var regions = ['scotland','northeast','lancashire','yorkshire','wales','central','east','london','southeast','southwest'];
var region_images = {};

var region_links = document.getElementById('region-list').getElementsByTagName('a');
var region_areas = document.getElementById('region-map').getElementsByTagName('area');

function initRegions() {

	for (var i=0; i<regions.length; i++) {
		var r = parseInt(i) + 1;

		region_images[r] = new Image(136,229);
		region_images[r].src = '/images/register/regions/'+ regions[i] +'.gif';

		region_links[i].regionId = r;
		region_links[i].onmouseover = showRegion;
		region_links[i].onmouseout = hideRegion;
		region_links[i].onclick = setRegion;

		region_areas[i].regionId = r;
		region_areas[i].onmouseover = showRegion;
		region_areas[i].onmouseout = hideRegion;
		region_areas[i].onclick = setRegion;
	}

	region_images[0] = new Image(136,229);
	region_images[0].src = '/images/spacer.gif';

	if(r = document.getElementById('regionId').value) {
		setRegionLink(r);
		setRegionArea(r);
	}
}
addLoadEvent(initRegions);

function showRegion() {
	if (document.getElementById('regionId').value) return;
	setRegionLink(this.regionId);
	setRegionArea(this.regionId);
}

function hideRegion() {
	if (document.getElementById('regionId').value) return;
	setRegionLink(0);
	setRegionArea(0);
}

function setRegion() {
	document.getElementById('regionId').value = this.regionId;

	setRegionLink(this.regionId);
	setRegionArea(this.regionId);

	this.blur();
	return false;
}

function setRegionLink(r) {
	for (var i=0; i<regions.length; i++) {
		var on = (region_links[i].regionId == r);
		region_links[i].style.color = (on) ? '#c00':'#666';
		region_links[i].style.fontWeight = (on) ? 'bold':'normal';
	}
}

function setRegionArea(r) {
	var o = document.getElementById('region-map');
	o = o.getElementsByTagName('img')[0];
	o.src = region_images[r].src;
}