// Options for SuperBGImage
	$.fn.superbgimage.options = {
		id: 'superbgimage', // id for the containter
		z_index: 0, // z-index for the container
		inlineMode: 0, // 0-resize to browser size, 1-do not resize to browser-size
		showimage: 1, // number of first image to display
		vertical_center: 1, // 0-align top, 1-center vertical
		transition: 1, // 0-none, 1-fade, 2-slide down, 3-slide left, 4-slide top, 5-slide right, 6-blind horizontal, 7-blind vertical, 90-slide right/left, 91-slide top/down
		transitionout: 1, // 0-no transition for previous image, 1-transition for previous image
		randomtransition: 0, // 0-none, 1-use random transition (0-7)
		showtitle: 0, // 0-none, 1-show title
		slideshow: 0, // 0-none, 1-autostart slideshow
		slide_interval: 5000, // interval for the slideshow
		randomimage: 0, // 0-none, 1-random image
		speed: 'slow', // animation speed
		preload: 1, // 0-none, 1-preload images
		onShow: function(){
			$("body").css("background","none");
		}
	};

	// initialize SuperBGImage
	$('#thumbs').superbgimage();
	
// Wrap a title-div around all h1-titles if page-template is 2col generic.
$(".generic .dynamic-col-2 h1").wrap("<div class='title'></div>");
// Search for parent image paragraph of team pics and float them to the right.
$(".generic .dynamic-col-1 img").parent("p").css("float", "right");
$(".generic .dynamic-col-1 img").parent("p").prev("p").css("min-width", "200px");
$(".generic .dynamic-col-1 img").parent("p").prev("p").last().css("height", "180px");
$(".generic .dynamic-col-1 img").parent("p").last().css("height", "180px");
$(".generic .dynamic-col-1 img").parent("p").last().nextAll("p").css("min-height", "0px");

$(".generic .dynamic-col-1 img").parent("p").css("margin-bottom", "5px");
$(".generic .dynamic-col-1 img").parent("p").prev("p").css("margin-bottom", "5px");

// Get all odd (x2) elements inside impf-loop and apply a left margin to these.
$("div.category-impfungen div.entry-content:odd").css("margin-left", "45px");

// Get all thumbs-group pics from transparent sidebar, wrap them up and apply margins.
$("a.thumbs-group-picture").wrapAll("<div class='thumbs-group'></div>");
$("a.thumbs-group-picture img:odd").css("margin-left","24px");
$("a.thumbs-group-picture").attr("rel", "malaria");
$("a.thumbs-group-picture").fancybox();

$("a.impfungen").fancybox();
$("a.lightbox").fancybox();
$("a.full-lightbox").fancybox({
 transitionIn: "elastic",
 transitionOut: "elastic",
 autoScale: false,
 overlayShow: false,
 hideOnOverlayClick: true,
 hideOnContentClick: true
});

$(".impfungen, .lightbox, .full-lightbox, .thumbs-group-picture").hover(
  function () {
    $(this).stop().animate({opacity:0.6},500);
  },
  function () {
    $(this).stop().animate({opacity:1.0},500);
  }
);

$("ul.menu li:not(.current_page_item) a").hover(
  function () {
    $(this).prev('span').stop().animate({opacity:0.8},500); 
  },
  function () {
    $(this).prev('span').stop().animate({opacity:1.0},500);
  }
);

// Wrap bookmarks and position all elements accordingly to the layout.
$("#wide div.bookmarks li:odd").css("margin-left", "45px");
$("#wide div.bookmarks li a").wrap("<h1>").after("<hr>");

$(document).ready(function() {
	$("#wide").fadeIn(700);
});

// Prepend background image spans to the navigation links
$('li.grad-1').prepend('<span class="grad-1-bg"></span>');
$('li.grad-2').prepend('<span class="grad-2-bg"></span>');
$('li.grad-3').prepend('<span class="grad-3-bg"></span>');
$('li.grad-4').prepend('<span class="grad-4-bg"></span>');
$('li.grad-5').prepend('<span class="grad-5-bg"></span>');

// Manually add navigation highlight for interactive malaria map page
$('.page-template-page_interactive_malaria-php li.menu-item-28').addClass('current_page_item');

/************************************************************************
/************************************** Interactive Malaria Map Functions
/************************************************************************
/***********************************************************************/

function initializeMap(){
	$('#map').fadeOut(500, function(){
		$('div.info-field').stop().hide('slide', { direction: 'right' }, 500, function(){
			$('div.map-wrapper div.info-field div').hide();
			$('div.info-msg').fadeIn();
			$(this).find('span.back-button').fadeIn(200);
		});
		$('div#continent').fadeOut(800, function(){
			$(this).prevAll('div#world').fadeIn(1000);
		});
		$('#map').empty().css({
			width: '768px',
			height: '434px',
			backgroundImage: 'url("http://www.dr-etter.ch/wp-content/themes/tropic/images/world.png")',
			position: 'relative',
			overflow: 'hidden',
			border: '1px solid #686a6b'
		});
		$('#map').load('http://www.dr-etter.ch/wp-content/themes/tropic/interactive-malaria-map/blanks.html', function(){
			mapInteractions();
		});
		$('#map').fadeIn();
	});
}
function mapInteractions(){
	$('div.box').stop().hover(function() {
		$(this).addClass('active');
	}, function () {
		$(this).removeClass('active');	
	});
	$('div#intro-message').click(function(){
		$(this).fadeOut();
	});
	$('span.close-cross').click(function(){
		$(this).parents('div.info-msg').fadeOut();
	});
	$('div.box').click(function() {
		$('div.map-wrapper div.info-field div').hide();
		$('div.info-msg').fadeIn();
		$('div#intro-message').fadeOut();
		var img = $(this).next('img.zoomable'),
			id = $(this).attr('id');
		$(this).removeClass('active');
		img.css("border","1px solid #ebebeb");
		$(this).siblings().hide();
	  	img.hide()
	    	.attr('src', 'http://www.dr-etter.ch/wp-content/themes/tropic/images/' + id + '_ground.png')
	    	.fadeIn('slow');	
	    img.animate({
	      		width: '768px',
	      		height: '434px',
	      		top: '0px',
	      		left: '0px'
	    		}, 1000, '', function(){
	    		$('div#world').fadeOut(800, function(){
	    			$(this).nextAll('div#continent').fadeIn(1000);	
	    		});	
	      		$('#map').css({backgroundImage: 'url(http://www.dr-etter.ch/wp-content/themes/tropic/images/' + id + '_ground.png)'}).empty();
	      		loadBullets(id);
	    });
	});
}	
function loadBullets(id){
	$('#map').load('http://www.dr-etter.ch/wp-content/themes/tropic/interactive-malaria-map/' + id + '.html', function(){
		//place continent title 
		var cTitle = $(this).find('div.big-title').html();
		$('span.continent-title').empty().html(cTitle);
		
		//place bullets
		$(this).children('a.bullet').each(function(){
			var coords = $(this).attr('rel').split('-');
			$(this).css({left: coords[0] + 'px', top: coords[1] + 'px'})
			.hide()
			.fadeIn()
			.click(function(){
				$('a.bullet','#map').removeClass('active');
				$(this).addClass('active');
				showInfo($(this).attr('id'), id);
			});
		});
		//place bullet-pointers
		$(this).children('div.pointer').each(function(){
			var coords = $(this).attr('rel').split('-');
			$(this).css({left: coords[0] + 'px', top: coords[1] + 'px', width: coords[2] + 'px', height: coords[3] + 'px'})
			.hide()
			.fadeIn();
		});
		$('div.info-field').stop().show('slide', { direction: 'right' }, 500);
		//add back-click
		$('span.to-world').click(function(){initializeMap()});
		$('span.to-world').hover(function(){
			$(this).children('span.dotted').addClass('hover');
		}, function() {
			$(this).children('span.dotted').removeClass('hover');
		});
	});
}
function showInfo(id, continent){
	$('div.map-wrapper div.info-field div').fadeOut(100);
	var boxid = '#' + id + '-box-' + continent;
		$(boxid).fadeIn(100);
} 
mapInteractions();
