var imagesHeight = 0;

$(document).ready(function(){
    setup_logo();
    setup_grid();
    setup_box_image();
    setup_dark();
    setup_body();
    setup_window_resize();
});

function setup_logo() {
    $("#logo").find("img").css({
        'left' : ($(document).width() - 283) / 2
    });
}

function setup_dark() {
    $("#black").css({
        'height' : '2000px',
        'opacity' : '0.8'
    }).hide();
}

function setup_window_resize(){
    $(window).resize(function(){
        $("#fade").animate({
            'left' : ($(document).width() - 635) / 2
        });
        
        $("#logo").find("img").animate({
            'left' : ($(document).width() - 283) / 2
        });
    });
}

function setup_body() {
    $(document).keyup(function(e) {
        if (e.keyCode == 27) { fadeout(); }   // esc
    });  
    $("#black").live('click',fadeout);
}

function fadeout() {
    $("#fade").fadeOut();
    $("#slider").fadeOut();
    $(".fadebox").remove();
    $("#black").fadeOut();
    $("#load").hide();
    $("body").css({
        'overflow' : 'auto'
    });
    $("html,body").unbind('mousewheel');
}

function setup_grid() {
   $("#grid").vgrid({
        easeing: "easeOutQuad",
        time: 500,
        delay: 40
    }); 
}

function setup_box_image() {
    $(".img_link").click(function(e){
        e.preventDefault();    
        
        $("html,body").animate({
            scrollTop: 0
        });

        $("#fade").css({
            'left' : ($(document).width() - 635) / 2
        });

        $("#black").fadeIn();
        $("#fade").fadeIn();
        $("#load").show();
              
        $.ajax({
            type: 'post',
            async: 'false',
            dataType: 'html',
            url: 'ajax.php',
            data: 'query='+$(this).attr('id'),
            success: function(data) {                
                $("#fade").html($("#fade").html()+data); 
                
                $("img.batch").batchImageLoad({
                    loadingCompleteCallback: function(){

                        $("#load").fadeOut('fast',function(){ 
                            $(".fadebox").fadeIn();
                            setup_scroll();
                        });                        
                    }
                });            
            },
            error: function(){
                $("#black").click();
            }
        });
    });
}

function setup_scroll() {
    imagesHeight = 150;
    var screenHeight = $(window).height();
    
    $("#fade").find(".imgbox").each(function(){  
        imagesHeight = imagesHeight + $(this).height() + 170;
    });        

    setup_wheel();
    
    $(".fadebox").draggable({       
       axis: 'y',
       scroll: false,
       drag: function(e,ui) {
           if(ui.position.top > 0) {
               ui.css({
                  'top' : '0px'
               });
           }
           
           if(ui.position.top < -(imagesHeight - screenHeight + 100)) {
               ui.css({
                  'top' : (imagesHeight - screenHeight + 100)+'px'
               });
           }
       }
    });
     
    $(".imgbox").draggable({
        cancel: 'img,p,div'
    });
}

function setup_wheel() {
    $("body").css({
        'overflow' : 'hidden'
    });
    
    $("html,body").mousewheel(function(e,delta){
        e.preventDefault();

        //Scroll up
        if(delta > 0) {    
            $(".fadebox").css({
                'top' : function(index, value) {
                    value = parseInt(value);
                    if(value + 75 > 0) {
                        return 0;
                    }
                    return value + 75;
                }
            });

         //Scroll down
        } else if(delta < 0) {
            $(".fadebox").css({
               'top' : function(index, value) {
                   value = parseInt(value);
                   
                   if(value - 75 < -(imagesHeight - $(window).height() + 100)) {
                       return value;
                   }
                   
                   return value - 75;
                }
            });

        }
    });
}