$(document).ready(function() {
    $('.thumb').css({ 'left': '2' });

    //Gets max scroll positions, gets number of images and resizes .overview to accomodate all images
    var imageSum = $("#BrandBanner img").size();
    var scrollRemaining = imageSum - 7;
    var overWidth = imageSum * 130;
    var startThumbPos = $('.thumb').position();
    var startThumbLeft = startThumbPos.left;
    var thumbTicks = 868 / scrollRemaining;
    var roundingAlt = 1;
    var roundingAlt2 = 1;
    var moveConstant = 1 + (910 / (scrollRemaining*130));
	$('.overview').css({'width':overWidth});



    //mousewheel controls
    function scrollDirection(event, delta) {
        $('.logonav').unbind('mousewheel', scrollDirection);
        var thisPosition = $('.overview').position();
        var thisLeft = thisPosition.left;
        var currentThumb = $('.thumb').position();
        var nowThumbLeft = currentThumb.left;

        if (delta > 0 && nowThumbLeft > 2) {
            moveRight();
        }
        else if (delta < 0 && nowThumbLeft < 868) {
            moveLeft();
        }
        event.preventDefault();
        $('.logonav').bind('mousewheel', scrollDirection);
    };

    $('.logonav').bind('mousewheel', scrollDirection);


    // Thumb draggable functionality
    function dragThumb() {
        var currentThumb = $('.thumb').position();
        var startLocation = currentThumb.left;
        $(document).bind('mousemove', getCoords);
        $(document).bind('mouseup', stopDrag);


        function getCoords() {
            var currentThumb = $('.thumb').position();
            var thisThumbLeft = currentThumb.left;
	    var overPos = $('.overview').position();
	    var overLeft = overPos.left;
	    
	    
            $('.overview').css({ 'left': 0 - (thisThumbLeft * (130 / thumbTicks)) });
        }

        function stopDrag() {
            $(document).unbind('mouseup', stopDrag);
            $(document).unbind('mousemove', getCoords);

            var thisPosition = $('.overview').position();
            var thisLeft = thisPosition.left;
            var currentThumb = $('.thumb').position();
            var nowThumbLeft = currentThumb.left;
            var preventOutOfSync = thisLeft / 130;
            var outOfSync = preventOutOfSync - Math.floor(preventOutOfSync);


            //prevents issue with Brand menu and 
            if (outOfSync > 0.5) {
                preventOutOfSync = Math.ceil(preventOutOfSync);
            }
            else if (outOfSync < 0.5) {
                preventOutOfSync = Math.floor(preventOutOfSync);
            }

            if (130 * preventOutOfSync < (910 - overWidth)) {
                $('.overview').animate({ 'left': 0 - (overWidth - 910) });
		$('.thumb').animate({'left':'100%'});
            }
            else {
                $('.overview').animate({ 'left': 130 * preventOutOfSync });
		$('.thumb').animate({'left': 0-(thumbTicks * preventOutOfSync)});
            }

            var currentThumb = $('.thumb').position();
            var stopLocation = currentThumb.left;
        }
    }



    $(".thumb").draggable({ axis: "x", containment: '.track' });

    $('.thumb').bind('mousedown', dragThumb);


    // Slides brands to the left when scrolling down
    function moveLeft() {
        var thisPosition = $('.overview').position();
        var thisLeft = thisPosition.left;
        var currentThumb = $('.thumb').position();
        var nowThumbLeft = currentThumb.left;

        if (nowThumbLeft < 868) {
            if (roundingAlt % 2 === 0) {
                $('.thumb').css({ 'left': Math.ceil(nowThumbLeft + (868 / scrollRemaining)) });
                roundingAlt++;
            }
            else {
                $('.thumb').css({ 'left': Math.floor(nowThumbLeft + (868 / scrollRemaining)) });
                roundingAlt++;
            }
            $('.overview').css({ 'left': thisLeft - 130 });
        }
        else {
            $('.thumb').css({ 'left': '868px' });
        }
    }

    //Slides Brands to the right when scrolling up
    function moveRight() {
        var thisPosition = $('.overview').position();
        var thisLeft = thisPosition.left;
        var currentThumb = $('.thumb').position();
        var nowThumbLeft = currentThumb.left;

        if (nowThumbLeft > 38) {

            if (roundingAlt % 2 === 0) {
                $('.thumb').css({ 'left': Math.ceil(nowThumbLeft - (868 / scrollRemaining)) });
                roundingAlt++;
            }
            else {
                $('.thumb').css({ 'left': Math.floor(nowThumbLeft - (868 / scrollRemaining)) });
                roundingAlt++;
            }

            $('.overview').css({ 'left': (thisLeft + 130) });
        }
        else {
            $('.thumb').css({ 'left': '2px' });
            $('.overview').css({ 'left': '0px' });
        }
    }

    //slides right on leftscroll hover
    function slideRight() {
        var thisPosition = $('.overview').position();
        var thisLeft = thisPosition.left;
        var currentThumb = $('.thumb').position();
        var nowThumbLeft = currentThumb.left;

        if (nowThumbLeft > 38) {
            if (roundingAlt % 2 === 0) {
                $('.thumb').stop(true, true).animate({ 'left': Math.ceil(nowThumbLeft - (868 / scrollRemaining)) }, 300);
                roundingAlt++;
            }
            else {
                $('.thumb').stop(true, true).animate({ 'left': Math.floor(nowThumbLeft - (868 / scrollRemaining)) }, 300);
                roundingAlt++;
            }
            $('.overview').stop(true, true).animate({ 'left': (thisLeft + 130) }, 199);
        }
        else {
            $('.thumb').css({ 'left': '2px' });
            $('.overview').css({ 'left': '1px;' })
        }
    }

    // Slides brands to the left when hovering over rightscroll button
    function slideLeft() {
        var thisPosition = $('.overview').position();
        var thisLeft = thisPosition.left;
        var currentThumb = $('.thumb').position();
        var nowThumbLeft = currentThumb.left;

        if (nowThumbLeft < 868) {
            if (roundingAlt % 2 === 0) {
                $('.thumb').stop(true, true).animate({ 'left': Math.ceil(nowThumbLeft + (868 / scrollRemaining)) }, 300);
                roundingAlt++;
            }
            else {
                $('.thumb').stop(true, true).animate({ 'left': Math.floor(nowThumbLeft + (868 / scrollRemaining)) }, 300);
                roundingAlt++;
            }
            $('.overview').stop(true, true).animate({ 'left': thisLeft - 130 }, 300);
        }
        else {
            $('.thumb').css({ 'left': '868px' });
        }
    }


    //Calls brandbar sliding functions when hovering over scroll buttons
    $('.leftscroll').hover(function() {
        hoverInterval = setInterval(slideRight, 350);
    },
            function() {
                clearInterval(hoverInterval)
            });


    $('.rightscroll').hover(function() {
        hoverInterval = setInterval(slideLeft, 350);
    },
            function() {
                clearInterval(hoverInterval)
            });


    //Gets current brand from url and slides brandbar and scrollthumb to the specific brand
    var path = window.location.href;
    var BN_pos = path.search("BN=");
    var BN_end = path.search("&");
    var brandID = '';

    if (BN_end >= 0) {
        var brandName = path.substring(BN_pos + 3, BN_end);
    }
    else {
        var brandName = path.substring(BN_pos + 3);
    }

    var brandID = brandName.toLowerCase().replace("+", "_");

    if (BN_pos >= 0) {
        var brandPosition = $('#' + brandID).parent('a').parent('div').position();
        var brandLeft = brandPosition.left;
        var imageOrder = brandLeft / 130;
        var scrollPos = (imageOrder / scrollRemaining) * 100;
        var maxToJumpVar = overWidth / 910;
        var maxToJump = 0 - (overWidth - 910);

        //        alert(brandLeft);


        brandLeft = 0 - brandLeft;

        if (brandLeft <= maxToJump) {
            $('.overview').css({ 'left': maxToJump });
            $('.thumb').css({ 'left': '868px' });
        }
        else if (brandLeft > maxToJump) {
            $('.overview').css({ 'left': brandLeft });
            $('.thumb').css({ 'left': scrollPos + '%' });
        }
    }
});