function injectSwatches(evt) {
	//debugger;
	try {
		var sizeSelect = $('op1_OPT_ID8_1');
		var largeCentreSelect = $('op1_OPT_ID13_1');
		if (sizeSelect && largeCentreSelect) {
			for (var i = 0; i < largeCentreSelect.options.length; i++) {
				var elem = largeCentreSelect.options[i];
				if (elem.text == 'Option Available With 3 Seater Only!') {
					Element.remove(elem);
					break;
				}
			}
			Event.observe(sizeSelect, 'change', onSizeChange);
		}
		var swatchSelect = $('op1_OPT_ID9_1');
		if (swatchSelect) {
			insertSwatchHTML(swatchSelect, 'swatch');
			Event.observe(swatchSelect, 'change', onSwatchChange);
		}
		var scatterSelect = $('op1_OPT_ID10_1');
		if (scatterSelect) {
			insertSwatchHTML(scatterSelect, 'scatter');
			Event.observe(scatterSelect, 'change', onScatterChange);
		}
		var baseSelect = $('op1_OPT_ID11_1');
		if (baseSelect) {
			insertSwatchHTML(baseSelect, 'base');
			Event.observe(baseSelect, 'change', onBaseChange);
		}
		var smallScatterSelect = $('op1_OPT_ID12_1');
		if (smallScatterSelect) {
			insertSwatchHTML(smallScatterSelect, 'smallScatter');
			Event.observe(smallScatterSelect, 'change', onSmallScatterChange);
		}
		var largeScatterSelect = $('op1_OPT_ID13_1');
		if (largeScatterSelect) {
			insertSwatchHTML(largeScatterSelect, 'largeScatter');
			Event.observe(largeScatterSelect, 'change', onLargeScatterChange);
		}
		var petFabricSelect = $('op1_OPT_ID20_1');
		if (petFabricSelect) {
			insertSwatchHTML(petFabricSelect, 'petFabric');
			Event.observe(petFabricSelect, 'change', onPetFabricChange);
		}
		
		insertListeners();
		if (sizeSelect && largeCentreSelect) {
			if (sizeSelect.options[sizeSelect.selectedIndex].text == '2 Seater')
				hideThreeSeaterOption();			
		}
	} catch (e) {}
}

function insertSwatchHTML(selectInput, divId) {
	var html = '<div id="'+divId+'"></div>';
	new Insertion.After(selectInput.up('.option'), html);
	var swatch = $(divId);
	for (var i = 0; i < selectInput.options.length; i++) {
		var swatchId = selectInput.options[i].value;
		var swatchText = selectInput.options[i].text;
		var theClass = i != selectInput.selectedIndex ? 'swatchItem' : 'swatchItem swatchItemSelected';
		var swatchItem = '<img src="/images/swatch/'+swatchText+'.gif" width="75" height="75" class="'+theClass+'" id="swatchItem_'+swatchId+'" />';
		new Insertion.Bottom(swatch, swatchItem)
	}
}

function insertListeners() {
	var swatchItems = $$('div#swatch img.swatchItem');
	for (var i = 0; i < swatchItems.length; i++) {
		Event.observe(swatchItems[i], 'click', onSwatchSelect);
	}
	
	swatchItems = $$('div#scatter img.swatchItem');
	for (var i = 0; i < swatchItems.length; i++) {
		Event.observe(swatchItems[i], 'click', onScatterSelect);
	}
	
	swatchItems = $$('div#base img.swatchItem');
	for (var i = 0; i < swatchItems.length; i++) {
		Event.observe(swatchItems[i], 'click', onBaseSelect);
	}
	
	swatchItems = $$('div#smallScatter img.swatchItem');
	for (var i = 0; i < swatchItems.length; i++) {
		Event.observe(swatchItems[i], 'click', onSmallScatterSelect);
	}
	
	swatchItems = $$('div#largeScatter img.swatchItem');
	for (var i = 0; i < swatchItems.length; i++) {
		Event.observe(swatchItems[i], 'click', onLargeScatterSelect);
	}
	
	swatchItems = $$('div#petFabric img.swatchItem');
	for (var i = 0; i < swatchItems.length; i++) {
		Event.observe(swatchItems[i], 'click', onPetFabricSelect);
	}
}

function onSizeChange(evt) {
	var source = $('op1_OPT_ID8_1');
	if (source.options[source.selectedIndex].text == '2 Seater') {
		hideThreeSeaterOption();
	} else {
		showThreeSeaterOption();
	}
}

function hideThreeSeaterOption() {
	//debugger;
	var largeCentreSelect = $('op1_OPT_ID13_1');
	if (largeCentreSelect) {
		largeCentreSelect.up('.option').hide();
	}
	var largeDiv = $('largeScatter');
	if (largeDiv) {
		largeDiv.hide();	
	}
}

function showThreeSeaterOption() {
	var largeCentreSelect = $('op1_OPT_ID13_1');
	if (largeCentreSelect) {
		largeCentreSelect.up('.option').show();
	}
	var largeDiv = $('largeScatter');
	if (largeDiv) {
		largeDiv.show();	
	}
}

function onSwatchChange(evt) {
	onSwatchItemChange(evt, 'swatch');
}

function onScatterChange(evt) {
	onSwatchItemChange(evt, 'scatter');
}

function onBaseChange(evt) {
	onSwatchItemChange(evt, 'base');
}

function onSmallScatterChange(evt) {
	onSwatchItemChange(evt, 'smallScatter');
}

function onLargeScatterChange(evt) {
	onSwatchItemChange(evt, 'largeScatter');
}

function onPetFabricChange(evt) {
	onSwatchItemChange(evt, 'petFabric');
}

function onSwatchItemChange(evt, divId) {
	var source = Event.element(evt);
	var selectedId = source.options[source.selectedIndex].value;
	var previousSelected = $$('div#'+divId+' img.swatchItemSelected');
	for (var i = 0; i < previousSelected.length; i++) {
		previousSelected[i].removeClassName('swatchItemSelected');
		previousSelected[i].addClassName('swatchItem');
	}
	var selectedItem = $('swatchItem_'+selectedId);
	if (selectedItem) {
		selectedItem.addClassName('swatchItemSelected');
	}
}

function onSwatchSelect(evt) {
	var source = Event.element(evt);
	var swatchId = source.id.replace('swatchItem_', '');
	var swatchSelect = $('op1_OPT_ID9_1');
	if (swatchSelect) {
		for (var i = 0; i < swatchSelect.options.length; i++) {
			if (swatchSelect.options[i].value == swatchId) {
				swatchSelect.selectedIndex = i;
				break;
			}
		}
	}
	var previousSelected = $$('div#swatch img.swatchItemSelected');
	for (var i = 0; i < previousSelected.length; i++) {
		previousSelected[i].removeClassName('swatchItemSelected');
		previousSelected[i].addClassName('swatchItem');
	}
	source.addClassName('swatchItemSelected');
}

function onScatterSelect(evt) {
	var source = Event.element(evt);
	var scatterId = source.id.replace('swatchItem_', '');
	var scatterSelect = $('op1_OPT_ID10_1');
	if (scatterSelect) {
		for (var i = 0; i < scatterSelect.options.length; i++) {
			if (scatterSelect.options[i].value == scatterId) {
				scatterSelect.selectedIndex = i;
				break;
			}
		}
	}
	var previousSelected = $$('div#scatter img.swatchItemSelected');
	for (var i = 0; i < previousSelected.length; i++) {
		previousSelected[i].removeClassName('swatchItemSelected');
		previousSelected[i].addClassName('swatchItem');
	}
	source.addClassName('swatchItemSelected');
}

function onBaseSelect(evt) {
	var source = Event.element(evt);
	var scatterId = source.id.replace('swatchItem_', '');
	var scatterSelect = $('op1_OPT_ID11_1');
	if (scatterSelect) {
		for (var i = 0; i < scatterSelect.options.length; i++) {
			if (scatterSelect.options[i].value == scatterId) {
				scatterSelect.selectedIndex = i;
				break;
			}
		}
	}
	var previousSelected = $$('div#base img.swatchItemSelected');
	for (var i = 0; i < previousSelected.length; i++) {
		previousSelected[i].removeClassName('swatchItemSelected');
		previousSelected[i].addClassName('swatchItem');
	}
	source.addClassName('swatchItemSelected');
}

function onSmallScatterSelect(evt) {
	var source = Event.element(evt);
	var scatterId = source.id.replace('swatchItem_', '');
	var scatterSelect = $('op1_OPT_ID12_1');
	if (scatterSelect) {
		for (var i = 0; i < scatterSelect.options.length; i++) {
			if (scatterSelect.options[i].value == scatterId) {
				scatterSelect.selectedIndex = i;
				break;
			}
		}
	}
	var previousSelected = $$('div#smallScatter img.swatchItemSelected');
	for (var i = 0; i < previousSelected.length; i++) {
		previousSelected[i].removeClassName('swatchItemSelected');
		previousSelected[i].addClassName('swatchItem');
	}
	source.addClassName('swatchItemSelected');
}

function onLargeScatterSelect(evt) {
	var source = Event.element(evt);
	var scatterId = source.id.replace('swatchItem_', '');
	var scatterSelect = $('op1_OPT_ID13_1');
	if (scatterSelect) {
		for (var i = 0; i < scatterSelect.options.length; i++) {
			if (scatterSelect.options[i].value == scatterId) {
				scatterSelect.selectedIndex = i;
				break;
			}
		}
	}
	var previousSelected = $$('div#largeScatter img.swatchItemSelected');
	for (var i = 0; i < previousSelected.length; i++) {
		previousSelected[i].removeClassName('swatchItemSelected');
		previousSelected[i].addClassName('swatchItem');
	}
	source.addClassName('swatchItemSelected');
}

function onPetFabricSelect(evt) {
	var source = Event.element(evt);
	var scatterId = source.id.replace('swatchItem_', '');
	var scatterSelect = $('op1_OPT_ID20_1');
	if (scatterSelect) {
		for (var i = 0; i < scatterSelect.options.length; i++) {
			if (scatterSelect.options[i].value == scatterId) {
				scatterSelect.selectedIndex = i;
				break;
			}
		}
	}
	var previousSelected = $$('div#petFabric img.swatchItemSelected');
	for (var i = 0; i < previousSelected.length; i++) {
		previousSelected[i].removeClassName('swatchItemSelected');
		previousSelected[i].addClassName('swatchItem');
	}
	source.addClassName('swatchItemSelected');
}

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