/*-----------------------------------------------------------------------------------
 	My Custom JS for SuperBgImage Script Wordpress Theme
-----------------------------------------------------------------------------------*/
/*
	1. =General Settings
*/


// Init jQuery on page load
jQuery(document).ready(function($) {

	//defining some global variables	
	$fullsize 	   	= $('#fullsize');
	$scrollerItems 	= $('#fullsize .item');
	$cntItems 		= $scrollerItems.length;
	$fullsizeTimer 	= $('#fullsizeTimer');
	$fullsizeStart 	= $('#fullsizeStart');
	$fullsizeStop 	= $('#fullsizeStop');


/*-----------------------------------------------------------------------------------*/
/*	1. =General Settings
/*-----------------------------------------------------------------------------------*/

	$.fn.stopTimer = function() {
		$(this).stop().css({ width: 0 });
		$fullsizeStart.show();
		$fullsizeStop.hide();		
	}

	$.fn.startTimer = function( timer ) {	
		
		$actItem = $('#fullsize .item.activeslide');
		$ind = 	$('a.activeslide').index("#fullsize .item") + 1;
		
		if( $ind == 1){
			$fullsize.animate({ marginLeft: 0 });
		}
		
		$(this).css({ width: 0 }).stop(true).animate({ 
			width:  $(window).width()
		}, {
			duration: timer,
			specialEasing: { 
				width: "linear" 
			}
		});
		$fullsizeStart.hide();
		$fullsizeStop.show();
	};
	

	$( '#thumbnails' ).css({ opacity : 0 });

	// set opacity of thumbnails
	$( '#fullsize a' ).animate({ opacity: 0.5, top: 0 });
	
	// add hover effect to the thumbnails
	$( '#fullsize a').hover(
		function() { 
			$(this).not('.activeslide').stop().animate({ opacity: 1 })
		},
		function( ) {
			$(this).not('.activeslide').stop().animate({ opacity: 0.5 })
		}
	)
		
	// calculate container width on window load
	$contWidth = 0;	
	$(window).load( function() {
		
		$( '#thumbnailContainer a' ).each(function() { 
			$contWidth = $contWidth + $( this ).outerWidth( true );
		})

 		if( $contWidth > $( '#thumbnails' ).width() ){
			$( '#thumbnails .pulldown-items' ).width( $contWidth );
			$( '#thumbnails .scroll-link' ).fadeIn();
		}
		
		// reset opacity and visibility
		$( '#thumbnails' ).animate({ opacity : 0, bottom: - $('#thumbnails').outerHeight( true ) + $('#colophon').outerHeight() + 1 }, 0, function(){ 
			$(this).show().stop().animate({ opacity: 1 });
		});
				
		//scrollpane parts
		var scrollPane = $( "#thumbnailContainer" ),
			scrollContent = $fullsize;
		
			setScrollerWidth();
									
		var slide_handler = function(e, ui) {			
			if ( scrollContent.width() > scrollPane.width() ) {
				scrollContent.css( "margin-left", Math.round(
					ui.value / 100 * ( scrollPane.width() - scrollContent.width() )
				) + "px" );
			} else {
				scrollContent.css( "margin-left", 0 );
			}
		};					
					
		//build slider
		var scrollbar = $( ".scroll-bar" ).slider({
			slide: slide_handler,
			change: slide_handler
		});
					
		$('.scroll-content-item:last').css({marginRight: 0});
				
		// Mousewheel plugin
		scrollPane.mousewheel(function(event, delta) {
			var value = scrollbar.slider('option', 'value');
		
			if (delta > 0) { value += 10; }
			else if (delta < 0) { value -= 10; }
				
			// Ensure that its limited between 0 and 100
			value = Math.max(0, Math.min(100, value));
			scrollbar.slider('option', 'value', value);
			event.preventDefault();
		});			
				
		$("#scroll_right").mouseenter(
			function() {
				
				timer = setInterval(function() { 
					
					$("#scroll_left").removeClass('disabled');
					
					var speed = parseInt(1);
					var slider = $('.scroll-bar');
					var curSlider = slider.slider("option", "value");
					curSlider += speed; // += and -= directions of scroling with MouseWheel
					
					if (curSlider > slider.slider("option", "max")){
						$("#scroll_right").addClass('disabled');
						curSlider = slider.slider("option", "max");
					} else if (curSlider < slider.slider("option", "min")){
						curSlider = slider.slider("option", "min");
					}else{
						
					}
					slider.slider("value", curSlider);
					
				}, 100);

			}
		);
		$("#scroll_right").mouseleave( 
			function() { 
				clearInterval(timer); 
			}
		);
	
		$("#scroll_left").mouseenter(
			function() {
				timer = setInterval(function() { 
				
				$("#scroll_right").removeClass('disabled');
				
				var speed = parseInt(1);
				var slider = $('.scroll-bar');;
				var curSlider = slider.slider("option", "value");
				curSlider -= speed; // += and -= directions of scroling with MouseWheel
				
				if (curSlider > slider.slider("option", "max")){
					curSlider = slider.slider("option", "max");
				}else if (curSlider < slider.slider("option", "min")){
					$("#scroll_left").addClass('disabled');
						curSlider = slider.slider("option", "min");
				}
							
				slider.slider("value", curSlider);
							
			}, 100);
						
			}
		);
		$("#scroll_left").mouseleave(
			function() { 
				clearInterval(timer); 
			}
		);		
				
		function setScrollerWidth(){
			var origWidth = $(".scroll-bar").width();//read the original slider width
			var sliderWidth = origWidth -200;//the width through which the handle can move needs to be the original width minus the handle width
			var sliderMargin =  (origWidth - sliderWidth)*0.5;//so the slider needs to have both top and bottom margins equal to half the difference					
			$(".scroll-bar-wrap").css({width:sliderWidth,marginRight: sliderMargin});//set the slider height and margins
		}
		
		
	});
	
	// Show or hide scrolling on window resize	
	window.onresize = function(event) {	
 		if( $contWidth > $( '#thumbnails' ).width() ){
			$( '#thumbnails .pulldown-items' ).width( $contWidth );
			$( '#thumbnails .scroll-link' ).fadeIn();
		}else{
			$( '#thumbnails .scroll-link' ).fadeOut();
			$( '#thumbnails .pulldown-items' ).css( "margin-left", 0 );
		}
	};

	// Set bottom of the thumbnail container to the footers height
	// $('#thumbnails').css({ bottom: $('#colophon').outerHeight() });
	// $('#thumbnails').css({ bottom: - $('#thumbnails').outerHeight( true ) + $('#colophon').outerHeight() });	

	// initialize SuperBGImage
	$fullsize.superbgimage();	

	// prev slide
	$('#thumbnails a.fullsize-prev').click(function() {
		$('#startInterval').val("start");
		$fullsizeTimer.stopTimer();
		$fullsize.prevSlide();
		$fullsize.startSlideShow();
		return false;
	});
						
	// next slide
	$('#thumbnails a.fullsize-next').click(function() {
		$('#startInterval').val("start");													
		$fullsizeTimer.stopTimer();
		$fullsize.nextSlide();
		$fullsize.startSlideShow();
		return false;
	});
	
	// stop slideshow
	$('#thumbnails a.fullsize-stop').click(function() {

		// show/hide controls
		$(this).hide();
		$('#thumbnails a.fullsize-start').show();		
													
		$fullsizeTimer.stopTimer();
		$fullsize.stopSlideShow();
		return false;
	});	


})
