var portfolio_item_width = 150;
var portfolio_scroll_distance = portfolio_item_width;
var portfolio_max_scroll = 0;
var portfolio_current_position = 0;


$(document).ready(function() {
     
    $("#portfolio_spinner").css("width", portfolio_spinner_width);
    portfolio_max_scroll = $("#portfolio_spinner").width() - $("#portfolio_spinner_container").width();
    if(portfolio_max_scroll<0) portfolio_max_scroll = 0;    
    
    pf_set_position(portfolio_current_position);

    $('#portfolio_spinner_wrapper').mousewheel(function(event, delta) {
        event.preventDefault();
        
        handle_scroll(delta);
                
        return false; // prevent default
    });
    
    //Standaard eerste thumb selecteren
    var iCount=0;
    $("#portfolio_spinner").find('.portfolio_spinner_item').each(function(index) {
        iCount++;
            if (iCount == 1) {
            $(".portfolio_spinner_item").removeClass('inner_border');
            $(this).attr("class","portfolio_spinner_item inner_border").addClass('inner_border');
            center_thumbs();
        }
    });
    
    $(".portfolio_spinner_item").click(function(){
        
        //Class border verwijderen
        $(".portfolio_spinner_item").removeClass('inner_border');
        //Class toepassen op geselecteerde item
        $(this).addClass('inner_border');
        //Html item resetten     
    
        url= '';
        //Ophalen afbeelding
        var url = $(this).attr("title");
        
        pf_getContent(url);
        pf_fade(url);
        
        center_thumbs();
       
    });

});

//Functie om alle acties in een keer uit te voeren:
function pf_goto(iAction) {
        var iCount=0;
        var iLimit=0;
        //Bepaal welke het volgende voorbeeld is:
        $("#portfolio_spinner").find('.portfolio_spinner_item').each(function(index) {
            iCount++;
            
            var nameClass = $(this).attr('class');
            
            if (nameClass == "portfolio_spinner_item inner_border"){
                var toNext = (iCount+iAction);
                
                var iCountNew=0;
                //Ophalen volgende voorbeeld
                $("#portfolio_spinner").find('.portfolio_spinner_item').each(function(index) {
                    iCountNew++;    
                    
                    if (iCountNew == toNext) {
                        iLimit++;
                        
                        if (iLimit == 1){
                            
                            $(".portfolio_spinner_item").removeClass('inner_border');
                            $(this).attr("class","portfolio_spinner_item inner_border").addClass('inner_border');
                            center_thumbs();
                            var toURL = $(this).attr("class","portfolio_spinner_item inner_border").attr('title');
                            pf_getContent(toURL);
                          
                        }
                           
                       
                        pf_fade(toURL);
                        
                      
                    }           
                });
            }        
        });
}


function center_thumbs() {
        //Aantal elementen tellen:
        iCountTotaal=0; 
        $("#portfolio_spinner").find('.portfolio_spinner_item').each(function(index) {
            iCountTotaal++;
        });
        
        //Ga naar de loop, vervolgens zoeken naar het geselecteerde item
        var iCount=0;
        $("#portfolio_spinner").find('.portfolio_spinner_item').each(function(index) {
        iCount++;
            
            var nameClass = $(this).attr('class');
            
            if (nameClass == "portfolio_spinner_item inner_border"){
            //alert(iCount);   
                if (iCount > 3){
                    var newCount = (iCount - 3);
                    var leftNew = (-150*newCount);
                    $("#portfolio_spinner").css("left",leftNew).slice(0, -2);
                }
                  if ((iCount == iCountTotaal) || (iCount == (iCountTotaal-1))) {
                    pf_next();
                }
            }
            
        });

      
}

function pf_prev() {
    handle_scroll(1);
}

function pf_next() {
    handle_scroll(-1);
}

function handle_scroll(delta) {
    var left = $("#portfolio_spinner").css("left").slice(0, -2);
    var new_left = (parseInt(left)+(delta*portfolio_scroll_distance));
    if(new_left>0) new_left = 0;
    
    if((new_left*-1) > portfolio_max_scroll) new_left = portfolio_max_scroll*-1;
    
    portfolio_current_position = Math.round(new_left/portfolio_scroll_distance);
    pf_set_position(portfolio_current_position);
}

function pf_set_position(pos) {
    
    var new_left = (pos * portfolio_scroll_distance);
    $("#portfolio_spinner").css("left", new_left+"px");
    
    var name = $("a.portfolio_spinner_item:eq("+(pos*(-1))+")").attr("rel");
    $("#portfolio_label").html(name);
    $("a.portfolio_spinner_item").css("z-index", 0).css("opacity", "0.1");
    
    $("a.portfolio_spinner_item:eq("+((pos-2)*(-1))+")").css("opacity", "0.3");
    $("a.portfolio_spinner_item:eq("+((pos-1)*(-1))+")").css("opacity", "0.6");
    $("a.portfolio_spinner_item:eq("+(pos*(-1))+")").css("z-index", 1).css("opacity", "1");
    $("a.portfolio_spinner_item:eq("+((pos+1)*(-1))+")").css("opacity", "0.6");
    $("a.portfolio_spinner_item:eq("+((pos+2)*(-1))+")").css("opacity", "0.3");
}

function pf_fade(toURL) {
    $("#portfolio_image_big").fadeOut(250, function(){
        $("#portfolio_image_big").attr("src", toURL);
        $("#portfolio_image_big").fadeIn(350);
    });    
}

function pf_getContent(toURL) {
    $.ajax({
        url: "/portfolio",
        global: false,
        type: "POST",
        data: ({action: 'get_content', 'url':toURL }),
        dataType: "html",
        async:true,
        success: function(msg){
           $("#portfolio_content_container").html(msg);
        }
    });
}