$(document).ready(function(){
	var slider = $("#content-slider");
	var content = $("#content-holder");
	var content_show = $("#content-scroll");
	var LOG_EL = $("#log");
	
	
function log( message ) {
	LOG_EL.append(message+"<br/>");
}


	$('a.lightbox').lightBox({
		fixedNavigation:true,
		txtImage:'Bild',
		txtOf:'von'});

	if ( content_show.height() < content.height() ) {
	
		slider.slider({
			orientation: "vertical",
			animate: true,
			value: 100,
			change: handleSliderChange,
			slide: handleSliderSlide
		});
		content_show.mousewheel(function(event, delta) {
			delta = ( delta < 0 ) ? -1 : 1;
			
			var maxScroll = content.height() - content_show.height();
			var currentScroll = content_show.scrollTop();
			
			var newScroll = currentScroll - 5*delta;
			if ( newScroll > maxScroll ) 
				newScroll = maxScroll;
			if ( newScroll < 0 ) 
				newScroll = 0;
			
			var sliderValue = 100 - (newScroll/maxScroll) * 100;
			
			content_show.scrollTop(newScroll);
			slider.slider( 'option' , 'value' , sliderValue );
			
			log ("currentScroll"+currentScroll);
			log ("newScroll:"+newScroll);
			
			event.stopPropagation();
			event.preventDefault();
		});
	} else {
		slider.hide();
	}
	
	function handleSliderChange(e, ui)
	{
	  var maxScroll = content.height() - content_show.height();
	  var scroll = ui.value;
	  scroll = 100-scroll;
	  scroll = (scroll*maxScroll)/100;
	  
	  log ("MAX SCROLL: "+maxScroll);
	  log ("berechnung: "+scroll);
	  content_show.animate({scrollTop: scroll }, 1000);
	  
	  log ("slider.scrollTop: "+slider.position().left+" / "+slider.position().top);
	}

	function handleSliderSlide(e, ui)
	{
	
	  var maxScroll = content.height() - content_show.height();
	  var scroll = ui.value;
	  scroll = 100-scroll;
	  scroll = (scroll*maxScroll)/100;
	  
	  log ("ui.value: "+ui.value);
		log ("MAX SCROLL: "+maxScroll);
		log ("berechnung: "+scroll);
	  content_show.attr({scrollTop: scroll });
	}
});