jQuery.noConflict();

// MSIE 6/7 Erkennung
msie6 = 0;
msie7 = 0;
if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) {
	var ieversion=new Number(RegExp.$1);
	if (ieversion<7 && ieversion>=6) {
		msie6 = 1;
	} else {
		if (ieversion<8 && ieversion>=7) {
			msie7 = 1;
		}
	}
}

// Variablen
var max_items    = 3;
var offset_x     = 60;
var offset_y     = 30;
var maxwidth     = 680;
var allitemwidth = 0;
var fadetime     = 500;
var dragtop      = "108px";
if (msie7) {
	dragtop        = "48px";
}
if (msie6) {
	dragtop        = "-36px";
}
var dragoffset   = 285;
var max_height   = 0;

jQuery(document).ready(function(){
	// Ermittle die Gesamtbreite aller Elemente
	lastpos   = jQuery('#history_select ul li:last').position();
	lastwidth = jQuery('#history_select ul li:last').find('img').width();
	allitemwidth = lastpos.left + lastwidth;
	jQuery('#history_select ul').css('width',allitemwidth);
	
	// Aktiven Zustand für erstes Element setzen
	if(!jQuery('#history_select ul li img').hasClass('active')) {
		jQuery('#history_select ul li img:eq(0)').addClass('active');
		jQuery('#history_select ul li:eq(0)').css('background','url(/fileadmin/template_yo/img/geschichte_hover.gif) top center no-repeat');
		jQuery('div.icebox_container:eq(0)').show();
		jQuery('#history_year img:eq(0)').show();
	}
	
	jQuery('#history_select ul li img').click(
		function() {
			
			jQuery('#history_select ul li img').css('top','0px');
			jQuery('#history_select ul li').css('background','none');
			jQuery(this).parent().css('background','url(/fileadmin/template_yo/img/geschichte_hover.gif) top center no-repeat');
			jQuery('img.active').removeClass('active');
			jQuery(this).addClass('active');
			
			var pos_img = jQuery('#history_select ul li img.active').offset();  
			var pos_content = jQuery('#contentarea').offset();  
			var width = jQuery('#history_select ul li img.active').width() - 35;
			jQuery('#draggable').css({'top':dragtop, 'left':(pos_img.left - pos_content.left + width/2) + 'px'});
			
			var index = jQuery('#history_select ul li img').index(this);
			jQuery('div.icebox_container').hide();
			jQuery('#history_year img').fadeOut(fadetime);
			newpos = setTimeout(function() {
				jQuery('div.icebox_container:eq('+index+')').fadeIn(fadetime);
				jQuery('#history_year img:eq('+index+')').fadeIn(fadetime);
			}, fadetime);
		}
	);
	
	// Scrollen nur, wenn maximale Breite aller Elemente größer als Anzeigebereich ist
	if (allitemwidth <= maxwidth) {
		jQuery('#history_right').css('display','none');
		jQuery('#history_left').css('display','none');
	}
	
	jQuery('#history_right img').hover(
		function() {
			moveBar('-')
		},
		function() {
			jQuery('#history_select ul').stop();
			jQuery('#draggable').stop();
		}
	);
	
	jQuery('#history_left img').hover(
		function() {
			moveBar('+')
		},
		function() {
			jQuery('#history_select ul').stop();
			jQuery('#draggable').stop();
		}
	);
	
	// Drag and drop
	jQuery('#draggable').draggable({
		revert: 'invalid'
	});
	
	jQuery('#history_select ul li img').droppable({
		drop: function(event, ui) {
			jQuery('#history_select ul li img').css('top','0px');
			jQuery('#history_select ul li').css('background','none');
			jQuery(this).parent().css('background','url(/fileadmin/template_yo/img/geschichte_hover.gif) top center no-repeat');
			jQuery('img.active').removeClass('active');
			jQuery(this).addClass('active');
			
			var pos_img = jQuery('#history_select ul li img.active').offset();  
			var pos_content = jQuery('#contentarea').offset();  
			var width = jQuery('#history_select ul li img.active').width() - 35;
			jQuery('#draggable').css({'top':dragtop, 'left':(pos_img.left - pos_content.left + width/2) + 'px'});
			
			var index = jQuery('#history_select ul li img').index(this);
			jQuery('div.icebox_container').hide();
			jQuery('#history_year img').fadeOut(fadetime);
			newpos = setTimeout(function() {
				jQuery('div.icebox_container:eq('+index+')').fadeIn(fadetime);
				jQuery('#history_year img:eq('+index+')').fadeIn(fadetime);
			}, fadetime);
		}
	});
});

function moveBar(direction) {
	var items        = jQuery('#history_select ul li').length;
	var outsidewidth = allitemwidth - maxwidth;
	var position     = jQuery('#history_select ul').position();
	
	// Scrollen nur, wenn maximale Breite aller Elemente größer als Anzeigebereich ist
	if (allitemwidth > maxwidth) {
		if(direction == '-') {
			// Pfeil nach rechts
			if(position.left > direction+outsidewidth) {
				var move_right  = direction+'='+offset_x;
				var dragpos     = jQuery('#draggable').position();
				var activepos   = jQuery('#history_select ul li img.active').parent().position();
				
				// Finde heraus, ob das aktive Element aus dem Bild gerutscht ist
				if (activepos.left + position.left < 35) {
					// Aktiviere das nächste Element
					jQuery('#history_select ul li img').css('top','0px');
					jQuery('#history_select ul li').css('background','none');
					jQuery('#history_select ul li img.active').parent().next().css('background','url(/fileadmin/template_yo/img/geschichte_hover.gif) top center no-repeat');
					jQuery('#history_select ul li img.active').parent().next().find('img').addClass('active');
					jQuery('img.active:eq(0)').removeClass('active');
					
					var pos_img = jQuery('#history_select ul li img.active').offset();  
					var pos_content = jQuery('#contentarea').offset();  
					var width = jQuery('#history_select ul li img.active').width() - 35;
					jQuery('#draggable').css({'top':dragtop, 'left':(pos_img.left - pos_content.left + width/2) + 'px'});
					
					var index = jQuery('#history_select ul li img.active').parent().index();
					jQuery('div.icebox_container').hide();
					jQuery('#history_year img').fadeOut(fadetime);
					newpos = setTimeout(function() {
						jQuery('div.icebox_container:eq('+index+')').fadeIn(fadetime);
						jQuery('#history_year img:eq('+index+')').fadeIn(fadetime);
					}, fadetime);
				}

				if (dragpos.left > 35) {
					jQuery('#draggable').animate({
						left: move_right
					}, fadetime, 'linear');
				} else {
					jQuery('#draggable').stop();
				}
				jQuery('#history_select ul').animate({
					left: move_right
				}, fadetime, 'linear', function() {
					position = jQuery('#history_select ul').position();
					if(position.left > direction+outsidewidth) {
						moveBar(direction);
					}
				});
			}
		} else {
			// Pfeil nach links
			if(position.left < 0) {
				var move_left = direction+'='+offset_x;
				if((position.left + (direction+outsidewidth)) < 0) {
					move_left = 0;
				}
				var dragpos     = jQuery('#draggable').position();
				var activepos   = jQuery('#history_select ul li img.active').parent().position();
				var activewidth = jQuery('#history_select ul li img.active').width();
				
				// Finde heraus, ob das aktive Element aus dem Bild gerutscht ist
				if (activepos.left - maxwidth + activewidth + position.left > -35) {
					// Aktiviere das vorige Element
					jQuery('#history_select ul li img').css('top','0px');
					jQuery('#history_select ul li').css('background','none');
					jQuery('#history_select ul li img.active').parent().prev().css('background','url(/fileadmin/template_yo/img/geschichte_hover.gif) top center no-repeat');
					jQuery('#history_select ul li img.active').parent().prev().find('img').addClass('active');
					jQuery('img.active:eq(1)').removeClass('active');
					
					var pos_img = jQuery('#history_select ul li img.active').offset();  
					var pos_content = jQuery('#contentarea').offset();  
					var width = jQuery('#history_select ul li img.active').width() - 35;
					jQuery('#draggable').css({'top':dragtop, 'left':(pos_img.left - pos_content.left + width/2) + 'px'});
					
					var index = jQuery('#history_select ul li img.active').parent().index();
					jQuery('div.icebox_container').hide();
					jQuery('#history_year img').fadeOut(fadetime);
					newpos = setTimeout(function() {
						jQuery('div.icebox_container:eq('+index+')').fadeIn(fadetime);
						jQuery('#history_year img:eq('+index+')').fadeIn(fadetime);
					}, fadetime);
				}
				
				if (dragpos.left - dragoffset < maxwidth - 35) {
					jQuery('#draggable').animate({
						left: move_left
					}, fadetime, 'linear');
				} else {
					jQuery('#draggable').stop();
				}
				jQuery('#history_select ul').animate({
					left: move_left
				}, fadetime, 'linear', function() {
					position = jQuery('#history_select ul').position();
					if(position.left < 0) {
						moveBar(direction);
					}
				});
			}
		}
	}
}