// $Id: default.js 51 2008-11-04 15:25:55Z mlambert $
window.addEvent('domready', function() {
	$$('#content div.raellinge img').each( function( item, index ) {
		item.addEvent('mouseenter', function(e){
			e.stop();
			var vorne		= item.get('src');
			var hinten		= vorne.replace(/vorne/g, 'hinten');
			item.setProperty('src', hinten);
		});
		item.addEvent('mouseleave', function(e){
			e.stop();
			var hinten		= item.get('src');
			var vorne		= hinten.replace(/hinten/g, 'vorne');
			item.setProperty('src', vorne);
		});
		item.addEvent('click', function(e){
			// Detail-Bilder ermitteln
			var vorne			= item.get('src');
			var vorne_gross		= vorne.replace(/vorne|hinten/g, 'vorne_gross');
			var hinten_gross	= vorne_gross.replace(/vorne_gross/g, 'hinten_gross');

			// Informationen der Details zusammenstellen
			var htmlOutput	= '';
			htmlOutput	+= '<img src="' + vorne_gross + '" width="140" height="165" alt="' + item.getParent().getElement('div h6').get('html') + '" style="float:left;" />';
			htmlOutput	+= '<div style="float:left; padding-left:10px;">'
			htmlOutput	+= '<h6>' + item.getParent().getElement('div h6').get('html') + '</h6>';
			htmlOutput	+= '<p>' + item.getParent().getElements('div p')[0].get('html') + '</p>';
			htmlOutput	+= '<p>' + item.getParent().getElements('div p')[1].get('html') + '</p>';
			htmlOutput	+= '<p>' + item.getParent().getElements('div p')[2].get('html') + '</p>';
			htmlOutput	+= '</div>';
			htmlOutput	+= '<img src="' + hinten_gross + '" width="140" height="165" alt="' + item.getParent().getElement('div h6').get('html') + '" style="float:right;" />';
			htmlOutput	+= '<img src="' + close + '" class="close" />';
			$$('#content div.details').set( 'html', htmlOutput );

			// Schließen-Knopf der Details aktivieren
			$$('#content div.details').addEvent('click', function(e){
				$$('#content div.details').setStyle('display', 'none');
			});

			// Details positionieren und einblenden
			var scroll_y	= window.getScroll().y;
			if ( scroll_y < 200 ) {scroll_y = 200} // Mindestens 180 Pixel Abstand von oben
			$$('#content div.details').setStyle('top', scroll_y + 'px');
			$$('#content div.details').setStyle('display', 'block');
		});
	});
});