/******************************************************************************************************

	DROP DOWN MENU
	
*******************************************************************************************************/

$(document).ready(function(){	
        
        $("#mainNav .drop").hover(function() {
            
            $(this).parent().find("ul.subnav").slideDown('fast').show();
    
            $(this).parent().hover(function() {
            }, function(){	
                $(this).parent().find("ul.subnav").slideUp('fast'); 
            });
    
            }).hover(function() { 
                $(this).addClass("subhover"); 
            }, function(){	
                $(this).removeClass("subhover"); 
        });
    
    });

/******************************************************************************************************

	CAROUSEL
	
*******************************************************************************************************/


$.fn.infiniteCarousel = function () {

    function repeat(str, num) {
        return new Array( num + 1 ).join( str );
    }
  
    return this.each(function () {
        var $wrapper = $('> div', this).css('overflow', 'hidden'),
            $slider = $wrapper.find('> ul'),
            $items = $slider.find('> li'),
            $single = $items.filter(':first'),
            
            singleWidth = $single.outerWidth(), 
            visible = Math.ceil($wrapper.innerWidth() / singleWidth), // note: doesnt include padding or border
            currentPage = 1,
            pages = Math.ceil($items.length / visible);            


        // 1. Pad so that 'visible' number will always be seen, otherwise create empty items
        if (($items.length % visible) != 0) {
            $slider.append(repeat('<li class="empty" />', visible - ($items.length % visible)));
            $items = $slider.find('> li');
        }

        // 2. Top and tail the list with 'visible' number of items, top has the last section, and tail has the first
        $items.filter(':first').before($items.slice(- visible).clone().addClass('cloned'));
        $items.filter(':last').after($items.slice(0, visible).clone().addClass('cloned'));
        $items = $slider.find('> li'); // reselect
        
        // 3. Set the left position to the first 'real' item
        $wrapper.scrollLeft(singleWidth * visible);
        
        // 4. paging function
        function gotoPage(page) {
            var dir = page < currentPage ? -1 : 1,
                n = Math.abs(currentPage - page),
                left = singleWidth * dir * visible * n;
            
            $wrapper.filter(':not(:animated)').animate({
                scrollLeft : '+=' + left
            }, 500, function () {
                if (page == 0) {
                    $wrapper.scrollLeft(singleWidth * visible * pages);
                    page = pages;
                } else if (page > pages) {
                    $wrapper.scrollLeft(singleWidth * visible);
                    // reset back to start position
                    page = 1;
                } 

                currentPage = page;
            });                
            
            return false;
        }
        
        $wrapper.after('<a class="arrow back">&lt;</a><a class="arrow next">&gt;</a>');
        
        // 5. Bind to the forward and back buttons
        $('a.back', this).click(function () {
            return gotoPage(currentPage - 1);                
        });
        
        $('a.next', this).click(function () {
            return gotoPage(currentPage + 1);
        });
        
        // create a public interface to move to a specific page
        $(this).bind('goto', function (event, page) {
            gotoPage(page);
        });
    });  
};

$(document).ready(function () {
  $('.infiniteCarousel').infiniteCarousel();
});


/******************************************************************************************************

	CAROUSEL CAPTION
	
*******************************************************************************************************/
			$(document).ready(function(){
				//To switch directions up/down and left/right just place a "-" in front of the top/left attribute
				//Full Caption Sliding (Hidden to Visible) https://buildinternet.s3.amazonaws.com/live-tutorials/sliding-boxes/index.htm
				$('.boxgrid.captionfull').hover(function(){
					$(".cover", this).stop().animate({top:'103px'},{queue:false,duration:160});
				}, function() {
					$(".cover", this).stop().animate({top:'203px'},{queue:false,duration:160});
				});
			});
			
/******************************************************************************************************

	TWITTER
	
*******************************************************************************************************/

	$(document).ready(function(){
      getTwitters('tweet', { 
      id: 'Brooklynitehock',     
      count: 1, 
      enableLinks: true, 
      ignoreReplies: true, 
      clearContents: true,
      template: '<span class="twitterPrefix"><span class="twitterStatus">%text%</span> <em class="twitterTime"><a href="http://twitter.com/%user_screen_name%/statuses/%id%">%time%</a></em>'
		});
	});

/******************************************************************************************************

	SCROLL
	
*******************************************************************************************************/

        $(document).ready(function(){
			$("#toTop").scrollToTop({
				speed:1000,
				ease:"jswing"
				});
		});
		
/******************************************************************************************************

	HOME BANNER ROTATOR
	
*******************************************************************************************************/

		$(function() {
			
			$("div.pagination").tabs(".bannerRotator > div", {
		
				effect: 'fade',
				fadeOutSpeed: "slow",
		
				rotate: true
		
			 }).slideshow({
				autoplay: true, 
				interval: 15000, 
				clickable: false 
				 
				 });  
			
		});

/******************************************************************************************************

	PRODUCT ROTATOR
	
*******************************************************************************************************/

    $(function() {
        
        $("div.tabs").tabs(".product_display > div", {
    
		effect: 'fade',
		fadeOutSpeed: "slow",

		rotate: true

		}).slideshow();
	});