// On DOM load
$(function(){
       
    // Initialise opacity
    $('.banner, .captions, .info').css('opacity',0);
    
    // Image browsing
    $('a[rel="prev"], a[rel="next"]').click(
        function(){ 
            $(this).blur();                  
            if($(this).hasClass('disabled')){
                return false;
            }               
            var url = $(this).attr('href');
            JB.load_fun(url);
            return false;
        });
    // Info browsing
    $('a[rel="about"]').click(
        function(){
            JB.load_info_fun(this.href);            
            $(this).blur();
            return false;
            });
    
    // Thumbs, resize to size of window with a minimum of 4 per row
    if($('.thumbs').length){
        $('.thumb .caption').css('opacity',0);
        $('.thumb').mouseover(
            function(){
                var el = this;
                clearInterval(el.intId);
                el.intId = setTimeout(function(){$('.caption',el).fadeTo('fast',0.8)},100);
            }
        );
        $('.thumb').mouseout(
            function(){
                var el = this;
                clearInterval(el.intId);
                el.intId = setTimeout(function(){$('.caption',el).fadeTo('medium',0)},100);
            }
        );
        $(window).resize(
            function (){
                var w = $(window).width();
                var min_w = 120;
                var img_w = w/8;
                if(img_w > min_w){
                    $('.thumb').css('width','12.5%');
                    return;
                }
                if(img_w < min_w){
                    img_w =w/6;
                }
                if(img_w < min_w){
                    img_w = w/4;
                }
                if(img_w < min_w){
                    img_w = 100;
                }
                $('.thumb').width(img_w);
            }
        );
        $(window).resize();
    }
});

// On window load (including all images etc)
$(window).load(
    function(){
        // Always have a short delay before fading in
        setTimeout(function(){
            $('.blackout').fadeTo('slow',0, function(){ 
                                    $('body').css('overflow','auto'); 
                                    $(this).remove(); 
                                });
            $('.info').centerOf('window');
            $('.banner, .captions, .info').css('display','block');
            $('.captions, .banner, .info').fadeTo('slow',0.8);
        }, 100);
        // Keep captions hidden until you mouse over them
        $('.captions').hide();
        JB.init_mousemove_fun();
    }
);