$(function() {
	var galleries = $('.ad-gallery').adGallery({
		loader_image: '../../images/loader.gif',
		width: false, // Width of the image, set to false and it will read the CSS width
		height: false, // Height of the image, set to false and it will read the CSS height
		thumb_opacity: 0.6, // Opacity that the thumbs fades to/from, (1 removes fade effect)
							// Note that this effect combined with other effects might be resource intensive
							// and make animations lag
		start_at_index: 0, // Which image should be displayed at first? 0 is the first image
		description_wrapper: false, // Either false or a jQuery object, if you want the image descriptions
									// to be placed somewhere else than on top of the image
		animate_first_image: false, // Should first image just be displayed, or animated in?
		animation_speed: 400, // Which ever effect is used to switch images, how long should it take?
		display_next_and_prev: true, // Can you navigate by clicking on the left/right on the image?
		display_back_and_forward: true, // Are you allowed to scroll the thumb list?
		scroll_jump: 0, // If 0, it jumps the width of the container
		slideshow: {
			enable: true,
			autostart: true,
			speed: 6000,
			start_label: 'Diashow starten',
			stop_label: 'Diashow stoppen',
			stop_on_scroll: true, // Should the slideshow stop if the user scrolls the thumb list?
			countdown_prefix: '[', // Wrap around the countdown
			countdown_sufix: ']',
			onStart: function() {}, // Do something wild when the slideshow starts
			onStop: function() {}// Do something wild when the slideshow stops
		},
		effect: 'slide-hori'
	});
	//$('.ad-back').html('<div class="icon_container"><img src="images/ad_scroll_back.png"></div>');
	//$('<img src="images/ad_scroll_back.png">').insertAfter('.ad-thumbs');
	$('#switch-effect').change(function() {
		galleries[0].settings.effect = $(this).val();
		return false;
	});
	$('#toggle-slideshow').click(function() {
		galleries[0].slideshow.toggle();
		return false;
	});
});