/*if( isStartpage == true ){
	document.write( '<style type="text/css" media="all">.contentHolderExpanded{display:none;}</style>' );
}*/
window.addEvent('domready', function() {
	$$('.contentHolderExpanded').each(function(myVerticalSlideEx) {
		var vertSlideId = myVerticalSlideEx.id.split('_')[1];
		var myVerticalSlide = new Fx.Slide(myVerticalSlideEx);
		$('toggle_' + vertSlideId).addEvent('click', function(e) {
			if( e != null && typeof e != 'string' ){
				e.stop();
			}
			if( typeof e == 'string' ){
				myVerticalSlide.slideIn().chain( function(){
					img_ = $( 'image_' + vertSlideId );
					img_.set( 'src', tplDir + '/images/minus.gif' );
				} );
			}else{
				myVerticalSlide.toggle().chain( function(){
					img_ = $( 'image_' + vertSlideId );
					img_.set( 'src', tplDir + '/images/' + (img_.get('src').contains('plus') ? 'minus' : 'plus') + '.gif' );
				} );
			}
		});
	});
	/*if( isStartpage == true ){
		var count = 0;
		var maxcount = 3;
	
		if ($$('.contentHolderExpanded').length < 3) maxcount = $$('.contentHolderExpanded').length;
	
		$$( '.contentHolderExpanded' ).each( function( myVerticalSlideEx ){
			var vertSlideId = myVerticalSlideEx.id.split('_')[1];
			var myVerticalSlide = new Fx.Slide( myVerticalSlideEx );
			
			myVerticalSlide.hide();
			img_ = $( 'image_' + vertSlideId );
			img_.set( 'src', tplDir + '/images/' + ( img_.get( 'src' ).contains( 'plus' ) ? 'minus' : 'plus') + '.gif' );
			myVerticalSlideEx.setStyle( 'display', 'block' );
			
			if( count++ < 3 ){
				$( 'toggle_' + vertSlideId ).fireEvent( 'click', 'out', ( ( maxcount + 1 - count ) * 800 ) );
			}
		});
	}*/
	$$('.slideImages').each(function(slideImage) {
		var images = slideImage.getElements('img');
		slideImage.store('length_', images.length);
		var myTransition = new Fx.Transition(Fx.Transitions.Quad);
		var scroll = new Fx.Tween(slideImage, {
			duration: 200,
			transition: myTransition.easeOut
		});
		var thumbs = new Element('div', {'class': 'imgPagnav'});
		for(var i = 0; i < images.length; i++) {
			if( images.length > 1 ){
				var link = new Element('a', {'href': '#','html': '<img border="0" src="' + tplDir + '/images/dark_' + (i + 1) + '.png">'});
				link.store('number_', i);
				link.store('thumbs_', thumbs);
				link.addEvent('mousedown', function(event) {
					event = new Event(event).stop();
				});
				link.addEvent('click', function(event) {
					event = new Event(event).stop();
					clicked = this.retrieve('number_');
					refresh_(this.retrieve('thumbs_'), clicked);
					scroll.start('margin-left', '-' + clicked * 600 + 'px');
				});
				if(i == 0) {
					clickImages = link.getElements('img');
					if(clickImages.length > 0) {
						clickImages[0].set('src', tplDir + '/images/light_1.png');
					}
				}
				slideImage.style.cursor = 'w-resize';
				link.inject(thumbs);
			}
		}
		thumbs.inject(slideImage);
		slideImage.store('thumbs_', thumbs);
		new Drag(slideImage, {
			snap: 0,
			preventDefault: true,
			limit: {
				x: [-((images.length - 1) * 600), 0],
				y: [0, 0]
			},
			modifiers: {
				x: 'margin-left',
				y: 'margin-top'
			},
			onStart: function(e){
				slideImage.store('start_', e.getStyle('margin-left').toInt());
			},
			onComplete: function(e){
				margin = e.getStyle('margin-left').toInt();
				length_ = slideImage.retrieve('length_').toInt();
				start_ = slideImage.retrieve('start_').toInt();
				slot_ = (margin / 600).toInt();

				if(start_ > margin) slot_--;
				if(slot_ > 0) slot_ = 0;
				if(slot_ < -(length_ - 1)) slot_ = -(length_ - 1);

				refresh_(slideImage.retrieve('thumbs_'), -slot_);
				scroll.start('margin-left', slot_ * 600 + 'px');
			}
		});
	});
});
function refresh_(el_, index_) {
	clickImages = el_.getElements('img');
	for(var i = 0; i < clickImages.length; i++) {
		clickImages[i].set('src', tplDir + '/images/' + (index_ == i ? 'light' : 'dark') + '_' + (i + 1) + '.png');
	}
}