document.observe("dom:loaded", function() {

	// adding click event handler to the thumb-links
	$$('.pattern-thumb-link').each(function(element) { 
		element.observe('click', function(event) {
			event.stop();
			// setting the src of the main image (to the one of the thumb image, cutting out the '-thumb' from the filename)
			$('pattern-main-image').writeAttribute('src', element.firstDescendant().readAttribute('src').replace('-thmb', ''));
			
			// removing the 'active border' from all thumbs
			$$('.pattern-thumb-link').each(function(link) { 
				link.removeClassName('active'); 
			});
		// setting the current thumb active	
		element.addClassName('active');
		});
	});
	
	// adding click event handler to the main dress chooser
	$$('.main-dress').each(function(element) { 
		element.observe('click', function(event) {
			event.stop();
			$$('.main-dress').each(function(link) {
				link.removeClassName('active');
			});
			$$('.detail-dress').each(function(link) { 
				link.addClassName('invisible'); 
			});
			element.addClassName('active');
			var ul_element = $$('ul.' + element.readAttribute('id'))[0];
			ul_element.removeClassName('invisible');
			
			$$('.pattern-thumb-link').each(function(link) { 
				link.removeClassName('active'); 
			});
			var first_thumb_image_link = $$('ul.' + element.readAttribute('id') +' > li > a')[0];
			first_thumb_image_link.addClassName('active');
			
			// setting all info div's invisible
			$$('.dress-text').each(function(textdiv) {
				textdiv.addClassName('invisible');
			});
			// setting the current text div visible
			$(element.readAttribute('id') + '-text').removeClassName('invisible');
			
			$$('.dress-title').each(function(textdiv) {
				textdiv.addClassName('invisible');
			});
			
			$(element.readAttribute('id') + '-title').removeClassName('invisible');
			
			// setting the main image to the first thumb image
			var first_thumb_image = $$('ul.' + element.readAttribute('id') +' > li > a > img')[0];
			$('pattern-main-image').writeAttribute('src', first_thumb_image.readAttribute('src').replace('-thmb', ''));
		});
	});
		
});