function switchColour(el, holder, t) {
	var holder = $(holder);
	if (! holder) return false;
	var title = $(t);
	title.innerHTML = el.title;
	setTimeout(function () { this.holder.style.backgroundImage = 'url('+this.el.href+')'; }.bind({holder:holder,el:el}), 350 );
	el.onclick = function() { return false };
	return false;
}

function switchTab(el, tab1, t) {
	var p1 = $('crosspolo_notice');
	var p2 = $('pologti_notice');
	if (tab1 == 'colour_holder2') {
		if (p1) { p1.style.display = 'block'; }
		if (p2) { p2.style.display = 'none'; }
	} else {
		if (p1) { p1.style.display = 'none'; }
		if (p2) { p2.style.display = 'block'; }
	}
	var h = $('colour_holder'); h.style.display = 'none';
	h = $('colour_holder2'); if (h) { h.style.display = 'none'; }
	h = $('colour_holder3'); if (h) { h.style.display = 'none'; }
	h = $(tab1);
	if (! h) return false;
	h.style.display = 'block';
	var swatches = h.getElementsByTagName('a');
	switchColour(swatches[0], tab1, t);
	var els = el.parentNode.parentNode.getElementsByTagName('a');
	for (var i=0; i < els.length; i++) {
		els[i].className = (els[i] == el) ? 'active' : '';
	}
}

function handle_onload() {
	var holder = $('colour_holder');
	if (!holder) return false;
	var swatches = holder.getElementsByTagName('a');
	for (var i=0; i < swatches.length; i++) {
		swatches[i].onmouseup = function() {
			switchColour(this, 'colour_holder', 'colour_title');
		}
	}
	if ($('colour_ranges')) {
		switchTab($('colour_ranges').getElementsByTagName('a')[0], 'colour_holder', 'colour_title');
	} else {
		switchColour(swatches[0], 'colour_holder', 'colour_title');
	}

	/* exception for CrossPolo */
	var holder = document.getElementById('colour_holder2');
	if (!holder) return false;
	var swatches = holder.getElementsByTagName('a');
	for (var i=0; i < swatches.length; i++) {
		swatches[i].onmouseup = function() {
			switchColour(this, 'colour_holder2', 'colour_title2');
		}
	}

	/* exception for Polo GTI */
	var holder = document.getElementById('colour_holder3');
	if (!holder) return false;
	var swatches = holder.getElementsByTagName('a');
	for (var i=0; i < swatches.length; i++) {
		swatches[i].onmouseup = function() {
			switchColour(this, 'colour_holder3', 'colour_title3');
		}
	}
}

Event.observe(window, 'load', handle_onload);
