function resizeStartPageImage() {
	
	var headerHeight = 3 * $('.border').outerHeight() + $('#logotype').outerHeight() + $('#navigation .left').outerHeight() + 3 * 11;
	var contentHeight = $('body').innerHeight() - headerHeight;

	imageToResize = $('#content .user-damrandomimage-pi1 a img');
	
	imageToResize.css({'height':  contentHeight -60 + 'px'});
	
	// 133 px = 3x border 1px + #logotype 2 x 11 + 69px + navigation 7 + 4 + 28 px
	// $('#logotype p').html('header=' + headerHeight.toString() + ' / content=' + contentHeight.toString());
	$('#bottom-placeholder').css({ 'display': 'none'});
}


function resizeGalleryImage(image) {
	
	var controlsDiv = $('#controls')
	var controlsDivHeight = controlsDiv.height()
	
	var enclosingDiv = $('#gallery .slideshow');
	var enclosingDivAspectRatio = enclosingDiv.width() / (enclosingDiv.height() - controlsDivHeight);
	
	
	// Get image aspect ratio
	var imageToResize;
	if (image != undefined) {
		imageToResize = image;
	} else {
		imageToResize = $('div#gallery div.slideshow img');
	}
	var imageToResizeAspectRatio = imageToResize.width() / imageToResize.height()

	
	if ($.cookie('image-display') == 'fill') {
		// Fill window with image
		if (imageToResizeAspectRatio < 1 || imageToResizeAspectRatio > enclosingDivAspectRatio) {  // Aspect ratio < 1 or wide image
			// imageToResize.css({'height': '100%', 'width': 'auto'});
			imageToResize.css({'height': (enclosingDiv.height() - controlsDivHeight) + 'px', 'width': 'auto'});
			imageToResize.css({ 'margin-top': 0, 'margin-left': ($('body').innerWidth() - imageToResize.outerWidth()) / 2 }); // Adjust (negative) margin-left to center image vertically
		} else   {  // Tall image
			imageToResize.css({'height': 'auto', 'width': '100%'});
			imageToResize.css({ 'margin-top': ($('body').innerHeight() - imageToResize.outerHeight()) / 2, 'margin-left': 0 }); // Adjust (negative) margin-top to center image vertically
		}
	} else {
		// Fit image inside window
		if (imageToResizeAspectRatio < enclosingDivAspectRatio) {  // Taller image
			// imageToResize.css({'height': '100%', 'width': 'auto'});
			imageToResize.css({'height': (enclosingDiv.height() - controlsDivHeight) + 'px', 'width': 'auto'});
			imageToResize.css({ 'margin-top': 0, 'margin-left': ($('body').innerWidth() - imageToResize.outerWidth()) / 2 }); // Adjust (negative) margin-left to center image vertically
		} else   {  // Wider image
			imageToResize.css({'height': 'auto', 'width': '100%'});
			imageToResize.css({ 'margin-top': ($('body').innerHeight() - controlsDivHeight - imageToResize.outerHeight()) / 2, 'margin-left': 0 }); // Adjust (negative) margin-top to center image vertically
		}
	}

	
}

function setImageDisplay(mode) {
	
	var modeControls = $('#controls .image-display li');

	if (mode != undefined) {
		for (var i = 0; i < modeControls.length; i++) {
			var control = modeControls[i];
			if ($(control).attr('class') == mode) {
				$(control).css({'display': 'none'});
			} else {
				$(control).css({'display': 'block'});
			}
		}
	} else {
		// Toggle mode
		var modes = [];
		for (var i = 0; i < modeControls.length; i++) {
			modes.push($(modeControls[i]).attr('class'));
		}
		// NOT FINISHED
	}

	$.cookie('image-display', mode, { path: '/'});
	resizeGalleryImage();
}



$(window).resize(function(){
	if ($('#content .user-damrandomimage-pi1').length > 0) {
		resizeStartPageImage();
	} else {
		resizeGalleryImage();
	}
});

	
$(document).ready(function() {
// jQuery(document).ready(function($) {
	
	if ($('#content div.user-damrandomimage-pi1').length > 0) {
		
		resizeStartPageImage();
		
	} else {

		// Show gallery when title or floorplan has been clicked
		$('#content .title').css({ 'cursor': 'pointer' });
		$('#content .title').click(function() { showGallery(); });
		$('#content .subtitle').css({ 'cursor': 'pointer' });
		$('#content .subtitle').click(function() { showGallery(); });
		$('#content .artists').css({ 'cursor': 'pointer' });
		$('#content .artists').click(function() { showGallery(); });
		
		$('#content .csc-textpic-imagewrap li a').click(function () { showGallery(); return false; });
		$('#bottom .exit-gallery a').click(function () { hideGallery(); return false; });
		function showGallery() {
			$('div#top').css({'display': 'none'});
			$('div#content').css({'display': 'none'});
			$('div#gallery').css({'display': 'block'});
			$('div#bottom').css({'display': 'block'});
			// $('#body').css({'overflow': 'none'})
			resizeGalleryImage();
		}
		function hideGallery() {
			$('div#top').css({'display': 'block'});
			$('div#content').css({'display': 'block'});
			$('div#gallery').css({'display': 'none'});
			$('div#bottom').css({'display': 'none'});
			// $('#body').css({'overflow': 'hidden'})
			// resizeGalleryImage();
		}
		
		// Hide/show content of search field
		$('#navigation input').focus(
			function() {
				if ($(this).val() == 'search') $(this).val('');		
			}
		);
		$('#navigation input').blur(
			function() {
				if ($(this).val() == '') $(this).val('search');		
			}
		);
	
	
	
		// Hide/show preview images
		var hidePreviews = { 'height': '0px', 'padding-top': '50px'};
		var showPreviews = { 'height': '50px', 'padding-top': '0px'};
		$('#previews ul.thumbs').css(hidePreviews);
		$('#bottom').hover(
			function() {  // Show
				// $('#bottom .padding .border').animate({ 'opacity': '1' });
				$('#previews ul.thumbs').stop(true, false).animate(showPreviews);  // .stop(). : Avoid animation queue buildup.
			},
			function() {  // Hide
				// $('#bottom .padding .border').animate({ 'opacity': '0' });
				$('#previews ul.thumbs').stop(true, false).animate(hidePreviews);
			}
		);
		$('#previews').click(
			function() {
				$('div#content').css({ 'display': 'none' });
				$('div#gallery').css({ 'display': 'block' });
			
				// resizeGallery();
				// fitImage();
			
				// $('#fullscreen').show();
				// var galleryHeight = $('body').innerHeight() - 3 * $('.border').outerHeight() - $('#logotype').outerHeight() - $('#navigation div').outerHeight() - $('#bottom').outerHeight() - 100;
				// $('#gallery img').css({'height': galleryHeight + 'px'});
			
			}
		);
	
	
		// function resizeGallery() {
		//	var galleryHeight = $('body').innerHeight() - 3 * $('div.border').height() - $('#logotype').height() - $('#navigation div.left').height() - 130;
		//	$('#gallery').css({'height': galleryHeight + 'px'});
		//	$('#gallery img').css({'height': galleryHeight + 'px'});
		// }

	

	
		if ($('#previews div.thumbs').length > 0) {

			// Initially set opacity on thumbs and add
			// additional styling for hover effect on thumbs
			var onMouseOutOpacity = 0.5;
			$('#previews ul.thumbs li').opacityrollover({
				mouseOutOpacity:   onMouseOutOpacity,
				mouseOverOpacity:  1.0,
				fadeSpeed:		   'fast',
				exemptionSelector: '.selected'
			});

			// Initialize Galleriffic Gallery
			var gallery = $('#previews div.thumbs').galleriffic({
				delay:						5000, // in milliseconds
				numThumbs:					20, // The number of thumbnails to show page
				preloadAhead:				40, // Set to -1 to preload all images
				enableTopPager:				false,
				enableBottomPager:			true,
				maxPagesToShow:				7,  // The maximum number of pages to display in either the top or bottom pager
				// imageContainerSel:			'#gallery #slideshow', // The CSS selector for the element within which the main slideshow image should be rendered
				imageContainerSel:			'#gallery .slideshow', // The CSS selector for the element within which the main slideshow image should be rendered
				captionContainerSel:		'#gallery .caption', // The CSS selector for the element within which the captions should be rendered
				loadingContainerSel:		'#gallery .loading', // The CSS selector for the element within which should be shown when an image is loading
				controlsContainerSel:		'#controls .galleriffic', // The CSS selector for the element within which the slideshow controls should be rendered
				renderSSControls:			true, // Specifies whether the slideshow's Play and Pause links should be rendered
				renderNavControls:			false, // Specifies whether the slideshow's Next and Previous links should be rendered
				playLinkText:				'Play Slideshow',
				pauseLinkText:				'Pause Slideshow',
				prevLinkText:				'&lt;',
				nextLinkText:				'&gt;',
				nextPageLinkText:			'Next &rsaquo;',
				prevPageLinkText:			'&lsaquo; Prev',
				enableHistory:				false, // Specifies whether the url's hash and the browser's history cache should update when the current slideshow image changes
				enableKeyboardNavigation:	true, // Specifies whether keyboard navigation is enabled
				autoStart:					false, // Specifies whether the slideshow should be playing or paused when the page first loads
				syncTransitions:			false, // Specifies whether the out and in transitions occur simultaneously or distinctly
				defaultTransitionDuration:	500, // If using the default transitions, specifies the duration of the transitions
				// onSlideChange:			undefined, // accepts a delegate like such: function(prevIndex, nextIndex) { ... }
				onSlideChange:				function(prevIndex, nextIndex) {
												// 'this' refers to the gallery, which is an extension of $('#thumbs')
												this.find('ul.thumbs').children()
													.eq(prevIndex).stop(true, false).fadeTo('fast', onMouseOutOpacity).end()
													.eq(nextIndex).stop(true, false).fadeTo('fast', 1.0);
												// fitImage();
											},
				// http://txptips.com/galleriffic-image-gallery
				// http://www.vorlagen.uni-erlangen.de/vorlagen/bildergalerien/galleriffic.shtml
										
				// onTransitionOut:			undefined, // accepts a delegate like such: function(slide, caption, isSync, callback) { ... }
				// onTransitionIn:				undefined, // accepts a delegate like such: function(slide, caption, isSync) { ... }
				onTransitionOut: 			function(previousSlide, previousCaption, isSync, transitionOutCallback) {
												// Transition from the previous image
												previousSlide.fadeTo(this.getDefaultTransitionDuration(isSync), 0.0, transitionOutCallback);
												if (previousCaption) {
													previousCaption.stop(true, false).fadeTo(this.getDefaultTransitionDuration(isSync), 0.0);
												}
											},
				onTransitionIn:				function(nextSlide, nextCaption, isSync) {
												// Transition to the next image
												nextSlide.fadeTo(this.getDefaultTransitionDuration(isSync), 1.0);
												if (nextCaption) {
													nextCaption.stop(true, false).fadeTo(this.getDefaultTransitionDuration(isSync), 1.0);
												}
											
												var nextImage = nextSlide.find('img');
												resizeGalleryImage(nextImage);
												// // $('#previews').css('background-color', 'red');
												// var zIndex = parseInt($('#fullscreen').css('z-index'));
												// $('#fullscreen').css('z-index', --zIndex);
											},
				onPageTransitionOut:		undefined, // accepts a delegate like such: function(callback) { ... }
				onPageTransitionIn:			undefined, // accepts a delegate like such: function() { ... }
				onImageAdded:				undefined, // accepts a delegate like such: function(imageData, $li) { ... }
				onImageRemoved:				undefined  // accepts a delegate like such: function(imageData, $li) { ... }
			});
		}
	}
	
	
	
	// Init image display mode (fit/fill) ...
	setImageDisplay('fill');
	// ... and setup controls
	$('#controls .image-display li').each(
		function () {
			$(this).click(function () {
				setImageDisplay($(this).attr('class'));
			});
		}
	);

	
	
	// Disable context menu click
	$('#gallery .slideshow').bind("contextmenu", function (event) {
		return false;
	});
	$('.user-damrandomimage-pi1 a img').bind("contextmenu", function (event) {  // Random image on startpage
		return false;
	});
	
	
	// Configure form validation
	validationSetup = {
		
		rules: {
			name: { required: true, minlength: 3 },
			email: { required: true, email: true },
			exhibition: { required: true, minlength: 3 }
		},
		messages: {
			email: "Please enter a valid email address."
		},		
		errorPlacement: function(error, element) {
			error.insertAfter(element.next());
				if (element.is(":radio")) {
					error.insertAfter(element.parent().next().next());
				} else if (element.is(":checkbox")) {
					error.insertAfter(element.next());
				} else if (element.is(":input")) {
					error.insertAfter(element);
				}
		}	
	};
	$("#newsletterSubscriptionForm").validate(validationSetup);
	$("#submitYourShowForm").validate(validationSetup);
});

