//Custom Functions
(function () {
    
    $.fn.infiniteCarousel = function () {
        function repeat(str, n) {
            return new Array( n + 1 ).join(str);
        }
        
        return this.each(function () {
            // magic!
            var $wrapper = $('> div', this).css('overflow', 'hidden'),
                $slider = $wrapper.find('> ul').width(9999),
                $items = $slider.find('> li'),
                $single = $items.filter(':first')
                
                singleWidth = $single.outerWidth() +1, // add padding or margin width here
                visible = Math.ceil($wrapper.innerWidth() / singleWidth),
                currentPage = 1,
                pages = Math.ceil($items.length / visible);
                
            /* TASKS */
            
            // 1. pad the pages with empty element if required
            if ($items.length % visible != 0) {
                // pad
                $slider.append(repeat('<li class="empty" />', visible - ($items.length % visible)));
                $items = $slider.find('> li');
            }
            
            // 2. create the carousel padding on left and right (cloned)
            $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');
            
            // 3. reset scroll
            $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 == last page - then reset position
                    if (page > pages) {
                        $wrapper.scrollLeft(singleWidth * visible);
                        page = 1;
                    } else if (page == 0) {
                        page = pages;
                        $wrapper.scrollLeft(singleWidth * visible * pages);
                    }
                    
                    currentPage = page;
                });
            }
            
            // 5. insert the back and forward link
            $wrapper.after('<span class="arrow forward"><a href="#">&gt;</a></span><span class="arrow back"><a href="#">&lt;</a></span>');
            
            // 6. bind the back and forward links
            $('span.back', this).click(function () {
                gotoPage(currentPage - 1);
                return false;
            });
            
            $('span.forward', this).click(function () {
                gotoPage(currentPage + 1);
                return false;
            });
            
            $(this).bind('goto', function (event, page) {
                gotoPage(page);
            });
            
            
            $(this).bind('next', function () { // THIS IS NEW CODE FOR THE AUTOMATIC INFINITE CAROUSEL
                gotoPage(currentPage + 1);
            });
        });
    }; // end infinate carasol
    
    
})(jQuery);


$(document).ready(function () {
    
    // Cufon
    Cufon.set('fontFamily', 'Oceania Regular').replace('.services.row h3, footer h2');
    
    Cufon.set('fontFamily', 'Oceania Light').replace('h1, h2, h3', {
       textShadow: '#696a6b 0px 1px;'
    });
    
    Cufon.set('fontFamily', 'Oceania Medium').replace('.portfolio.row h3', {
       textShadow: '#737373 0px 1px;'
    });
    
    
    // stupid fancy box cant validate without this hack
    $('li a').each(function(index) {
       var $el = $(this);
       $el.attr('rel', $el.parent().attr('id'));
    });
    
    $('.portfolio .more-btn, .fancy-images').fancybox();
    
    
    // Google Analytics Event Tracking
    function gaEachEvent(event) {
       var element = $(event.target);
       _gaq.push(['_trackEvent', 'Portfolio Projects', 'Viewed ' + element.attr('rel').replace('-', ' ') +' project' ]);
       console.log(element.attr('rel'))
    }
    
    $('.portfolio .more-btn').each(function(i) {
       $(this).click(gaEachEvent) 
    });
    
    function gaEvent(category, action) {
        _gaq.push(['_trackEvent', category, action ])
        console.log(category, action)
    }

    $('.portfolio .forward').click(gaEvent('Portfolio Slider', 'Next Slide'));
    $('.portfolio .back').click(gaEvent('Portfolio Slider', 'Previous Slide'));
   
    // Automatic Infinite Carousel
    var autoscrolling = false; 
    
    $('.infiniteCarousel').infiniteCarousel().mouseover(function () {
        autoscrolling = false;
    }).mouseout(function () {
        autoscrolling = false; //true
    });
    
    setInterval(function () {
        if (autoscrolling) {
            $('.infiniteCarousel').trigger('next');
        }
    }, 3000);
    
    //remove rel from cloned items to fix fancybox
    $('.infiniteCarousel .cloned a').removeAttr('rel')
    
    
    
    //All Sections
    /*
    $('.row-body').hover(function(e) {
        $(this).find('.box-details').hoverFlow(e.type, { bottom: -20}, {
            duration: 'fast', 
            complete: function() {
            
            }
        });
 
    }, function(e) {
   
       $(this).find('.box-details').delay(50).hoverFlow(e.type, { bottom: -280 }, {
            duration: 'normal', 
            complete: function() {
           
            }
        })
    });
    */
    
    // Portfolio Section
    $('.portfolio .boxes > li').hover(function(e) {
        $(this).find('.box-details').hoverFlow(e.type, { bottom: -20}, {
            duration: 'fast', 
            complete: function() {
                $(this).find('h3, p, .more-btn').animate({opacity: 1} , 200);
            }
        });
        
        //$(this).find('h3').hoverFlow(e.type, {paddingBottom: 8 }, 200);
        
    }, function(e) {
       $(this).find('h3, p, .more-btn').delay(100).animate({opacity: 0} , 100); //delay fixes fancybox bug
       $(this).find('.box-details').delay(100).hoverFlow(e.type, { bottom: -280 }, {
            duration: 'normal', 
            complete: function() {
               
            }
        }).mousedown(function() {
            //$(this).animate({bottom: -23}, 200);
        }).mouseup(function() {
            //$(this).animate({bottom: -20}, 100);
        });
        
        //$(this).find('h3').hoverFlow(e.type, {paddingBottom: 0 }, 200);
        
    });
        
    // Services Section
    var $services =$('.services .boxes > li')
    var textColor = $services.css('color');
    var white = '#FFFFFF'
    var darkGrey = '#595959'
    var lightGrey = '#393838'
    var lighterGrey = '#7d7c7c'

    $('.services .boxes > li').hover(function(e) {
        $(this).hoverFlow(e.type, {bottom: 38, backgroundColor: darkGrey, color: white}, {
            duration: 300, 
            complete: function() {
                $(this).find('.more-btn').animate({opacity: 1} , 150);
            }
        });
        
        $(this).find('h3').hoverFlow(e.type, {backgroundColor: lightGrey, borderBottomColor: lighterGrey, paddingBottom: 8}, {duration: 300});
      
    }, function(e) {
       $(this).find('.more-btn').hoverFlow(e.type, { opacity: 0 }, 200);
    
       $(this).find('h3').hoverFlow(e.type, {backgroundColor: white, borderBottomColor: white, paddingBottom: 0 }, 200);

       $(this).hoverFlow(e.type, {bottom: 0, backgroundColor: white, color: textColor}, {
            duration: 200, 
            complete: function() {
               $(this).find('.more-btn').animate({opacity: 0}, {duration:100, queue: false})             
            }
        });
    }).mousedown(function() {
        $(this).animate({bottom: 35}, 200);
    }).mouseup(function() {
        $(this).animate({bottom: 38}, 100);
    });
    
    
    
    
    
    // Contact Section
    // html5 validator dont likie google's plus one markup
    //$('li.google-plus').append('<g:plusone size="tall" count="true" href="http://www.osura.com/" callback="plusone"></g:plusone>');
    
    $('.social-cta').hover(hoverOver, hoverOut)

    function hoverOver() {
        $(this).stop().animate({backgroundPosition: '-172px 0'}, 3000);
    }

    function hoverOut() {
        $(this).stop().animate({backgroundPosition: '0 0'});
    }

    function plusone(obj) {
        _gaq.push(['_trackEvent', 'Plus One', obj.state]);
    }
    
    
    
    
    
    
}); // end DOM Ready


$(window).load(function() {
    if (window.location.hash == "#farrah") {
        console.log("it worked");
        $(".more-btn[rel='farrah-flowers']").delay(1000).fancybox().trigger('click');
    }
});

$(window).scroll(function() {
    
    if ($(window).scrollTop() + $(window).height() == $(document).height()) {
        
        //$('.wufoo-form').load('includes/wufoo.html')
    
    }
    
    
    
    
});