/**
 * @author Gsus
 */

$(document).ready(function() {
   
	var homePos = 0;
	var drinksPos = 3943;
	var galleryPos = 7747;
	var socialPos = 11752;
	var contactPos = 15700;
	var currentSlideNumber = 1;
	var difference = 0; var diffLeft = 0; var diffRight = 0;
	var oldMoveStep;
	var sliding;
	var slideEnabled = true;
	var rewInfo = $('#rewind-info');

	function changePage (pageName) {
		$('article').stop(true, false);
		slideEnabled = false;
		
		switch (pageName){
			case 'home': 
				slideEnabled = false;
				$("article").animate({
	    			left: ('-' + homePos + 'px')
	  			}, 3000, 'easeInOutQuart', function() {
	  				difference = homePos;
	  				slideEnabled = true;
	    			currentSlideNumber = 1;
	  			});
	  			break;
	  		case 'drinks':
	  			slideEnabled = false;
				$("article").animate({
    				left: ('-' + drinksPos + 'px')
  				}, 3000, 'easeInOutQuart', function() {
  					difference = drinksPos;
  					slideEnabled = true;
    				currentSlideNumber = 2;
  				});
  				break;
  			case 'gallery':
  				slideEnabled = false;
				$("article").animate({
    				left: ('-' + galleryPos + 'px')
  				}, 3000, 'easeInOutQuart', function() {
  					difference = galleryPos;
  					slideEnabled = true;
    				currentSlideNumber = 3;
  				});
  				break;
  			case 'social':
  				slideEnabled = false;
				$("article").animate({
    				left: ('-' + socialPos + 'px')
  				}, 3000, 'easeInOutQuart', function() {
  					difference = socialPos;
  					slideEnabled = true;
    				currentSlideNumber = 4;
  				});
  				break;
  			case 'contact':
  				slideEnabled = false;
				$("article").animate({
    				left: ('-' + contactPos + 'px')
  				}, 3000, 'easeInOutQuart', function() {
  					difference = contactPos;
  					slideEnabled = true;
    				currentSlideNumber = 5;
  				});
		}		
   	}
		
	function slideToRight (scrollStep) {
		if(difference < contactPos){
			difference = difference + scrollStep;
			$('article').css('left', '-' + difference + 'px' );
		} else { rewInfo.children('p').html("You're on the edge!");}
	}
	
	function slideToLeft (scrollStep) {
		if(difference >= homePos) {
			difference = difference - scrollStep;
			$('article').css('left', '-' + difference + 'px' );
		} else { rewInfo.children('p').html("You're on the edge!");}
	}
   	
   	
   	function setHoverEffect () {
		if($("article").css('left') == ('-' + homePos + 'px')){
			$("nav ul a .active").removeClass('active');
			$('nav ul .home a span').addClass('active');
		}
		if($("article").css('left') == ('-' + drinksPos + 'px')){
			$("nav ul a .active").removeClass('active');
			$('nav ul .drinks a span').addClass('active');
		}
		if($("article").css('left') == ('-' + galleryPos + 'px')){
			$("nav ul a .active").removeClass('active');
			$('nav ul .gallery a span').addClass('active');
		}
		if($("article").css('left') == ('-' + socialPos + 'px')){
			$("nav ul a .active").removeClass('active');
			$('nav ul .social a span').addClass('active');
		}
		if($("article").css('left') == ('-' + contactPos + 'px')){
			$("nav ul a .active").removeClass('active');
			$('nav ul .contact a span').addClass('active');
		}
	}
	
	function slidePageTo (targetSlide) {
		var slideNum;
		if(targetSlide == 1){
			slideNum = homePos;
		}
		if(targetSlide == 2){
			slideNum = drinksPos;
		}
		if(targetSlide == 3){
			slideNum = galleryPos;
		}
		if(targetSlide == 4){
			slideNum = socialPos;
		}
		if(targetSlide == 5){
			slideNum = contactPos;
		}
		
		if((targetSlide > 0) && (targetSlide < 6)){
			$("article").animate({
				left: ('-' + slideNum + 'px')
				}, 1000, 'easeInQuad', function() {
				currentSlideNumber = targetSlide;
				difference = slideNum;
				setHoverEffect();
			});
		}
		
	}

	function checkClose(position){
		if( (position > (homePos - 300)) && (position < (homePos + 300)) ){
			return 1;
		} else if ( (position > (drinksPos - 300)) && (position < (drinksPos + 300)) ){
			return 2; 
		} else if( (position > (galleryPos - 300)) && (position < (galleryPos + 300)) ){
			return 3; 
		} else if( (position > (socialPos - 300)) && (position < (socialPos + 300)) ){
			return 4; 
		}else if( (position > (contactPos - 300)) && (position < (contactPos + 300)) ){
			return 5; 
		} else {
			return false;
		}
		
	}
	
	$('#right-arrow').mouseover(function(){
		rewInfo.fadeIn(300);
	});
	$('#right-arrow').mousemove(function(e) {
		if(slideEnabled) {
			var diffRight = $(this).width() - ( e.pageX - this.offsetLeft );
			rewInfo.css("left", (e.pageX - 180) + "px");
			rewInfo.css("top", (e.pageY + 20) + "px");
			rewInfo.css("textAlign", "right");
			if(diffRight < 140){
				var moveStep = 1;
				if (diffRight < 120){ moveStep = 3;}
				if (diffRight < 90){ moveStep = 6;}
				if (diffRight < 60){ moveStep = 9;}
				if (diffRight < 30){ moveStep = 12;}
				if (moveStep != oldMoveStep){
					clearInterval(sliding);
					sliding = setInterval( function(){slideToRight(moveStep)}, 20);
					oldMoveStep = moveStep;
					var rew = '';
					for (var i=0; i < ( moveStep / 3 ); i++) {
						rew += '&rsaquo;';
					}
					rewInfo.children('p').html(rew);
				}
			} else {
				clearInterval(sliding);
				rewInfo.children('p').html('&nbsp;');
			}
		}
	});
	$('#right-arrow').mouseleave( function() {
		var diff;
		clearInterval(sliding);
		rewInfo.fadeOut(300);
		diff = checkClose(difference);
		
		if(diff != false){
			console.log('slidingPage to' + diff);
			slidePageTo(diff);
		}
	});
	
	
	$('#left-arrow').mouseover(function(){
		rewInfo.fadeIn(300);
	});
	$('#left-arrow').mousemove(function(e) {
		if(slideEnabled) {
			var diffLeft = e.pageX - this.offsetLeft;
			rewInfo.css("left", (e.pageX + 20) + "px");
			rewInfo.css("top", (e.pageY + 20) + "px");
			rewInfo.css("textAlign", "left");
			if(diffLeft < 140){
				var moveStep = 1;
				if (diffLeft < 120){ moveStep = 3;}
				if (diffLeft < 90){ moveStep = 6;}
				if (diffLeft < 60){ moveStep = 9;}
				if (diffLeft < 30){ moveStep = 12;}
				if (moveStep != oldMoveStep){
					clearInterval(sliding);
					sliding = setInterval( function(){slideToLeft(moveStep)}, 20);
					oldMoveStep = moveStep;
					var rew = '';
					for (var i=0; i < ( moveStep / 3 ); i++) {
						rew += '&lsaquo;';
					}
					rewInfo.children('p').html(rew);
				}
			} else {
				clearInterval(sliding);
				rewInfo.children('p').html('&nbsp;');
			}
			
		}
	});
	$('#left-arrow').mouseleave( function() {
		var diff;
		clearInterval(sliding);
		rewInfo.fadeOut(300);
		diff = checkClose(difference);
		
		if(diff != false){
			slidePageTo(diff);
		}
	});

	$(document).unbind('keypress'); $(window).keydown(function(event){
		if (event.keyCode == 39 || event.keyCode == 40) slideToRight(100);
		if (event.keyCode == 37 || event.keyCode == 38) slideToLeft(100);
	});
	$(window).keyup(function(event){
		time = setTimeout(diff = checkClose(difference), 500);
		if(diff != false){
			slidePageTo(diff);
			setHoverEffect();
		} 
	});
	 
	
	$("nav ul a").click(function () { 
		changePage($(this).parent("li").attr("class"));
		$("nav ul a .active").removeClass('active');
		$(this).children("span").addClass('active'); 
    });
	
	$("section.home a").click(function () {
		changePage($(this).attr("class"));
		$("nav ul a .active").removeClass('active');
		$("nav ul ." + $(this).attr("class")).children("a").children("span").addClass('active');
    });
    
	/*
	$('a.left').click(function() {
			if($('article').css('left') != '0px') {
				$("article").animate({
	    			left: '+=800px'
	  			}, 800, 'easeInOutCubic', function() {
	    			setHoverEffect();
	  			});
			}
		});
		
	$('a.right').click(function() {
			if($('article').css('left') != '-12000px') {
				$("article").animate({
    				left: '-=800px'
  				}, 800, 'easeInOutCubic', function() {
  					setHoverEffect();
  				});
			}
		});
	*/	
	
	//jCarousel Plugin
    $('#carousel').jcarousel({
        vertical: true, //display vertical carousel
        scroll: 1,  //auto scroll
        auto: 3,    //the speed of scrolling
        wrap: 'last',   //go back to top when reach last item
        initCallback: mycarousel_initCallback   //extra called back function
    });
 
    //Front page Carousel - Initial Setup
    //set all the item to full opacity
    $('div#slideshow-carousel a img').css({'opacity': '0.7'});
     
    //readjust the first item to 50% opacity
    $('div#slideshow-carousel a img:first').css({'opacity': '1.0'});
     
    //append the arrow to the first item
    $('div#slideshow-carousel li a:first').append('<span class="arrow"></span>')
 
  
    //Add hover and click event to each of the item in the carousel
    $('div#slideshow-carousel li a').hover(
        function () {
             
            //check to make sure the item is not selected
            if (!$(this).has('span').length) {
                //reset all the item's opacity to 50%
                $('div#slideshow-carousel li a img').stop(true, true).css({'opacity': '0.7'});
                 
                //adust the current selected item to full opacity
                $(this).stop(true, true).children('img').css({'opacity': '1.0'});
            }      
        },
        function () {
                 
            //on mouse out, reset all the item back to 50% opacity
            $('div#slideshow-carousel li a img').stop(true, true).css({'opacity': '0.7'});
             
            //reactivate the selected item by loop through them and look for the one
            //that has the span arrow
            $('div#slideshow-carousel li a').each(function () {
                //found the span and reset the opacity back to full opacity
                if ($(this).has('span').length) $(this).children('img').css({'opacity': '1.0'});
 
            });
                 
        }
    ).click(function () {
 
        //remove the span.arrow
        $('span.arrow').remove();
         
        //append it to the current item       
        $(this).append('<span class="arrow"></span>');
         
        //remove the active class from the slideshow main
        $('div#slideshow-main li').removeClass('active');
         
        //display the main image by appending active class to it.       
        $('div#slideshow-main li.' + $(this).attr('rel')).addClass('active');  
             
        return false;
    });
	
	//Carousel Tweaking
	function mycarousel_initCallback(carousel) {
		 
		// Pause autoscrolling if the user moves with the cursor over the clip.
		// resume otherwise
		carousel.clip.hover(function() {
			carousel.stopAuto();
		}, function() {
			carousel.startAuto();
		});
	}
});