$(document).ready(function() {
    if(navigator.userAgent.match(/iPhone/i)){
        $('body').css('font-size', '1em');
        $('.pVideo iframe').remove();
    }
    
    
    
                
    // Navigation    
    function loadProject(id){
        var currentProject = $("div.project:visible");
        var projectToShow = $("#p_"+id);
        var thumbToSelect = $("#t_"+id);
                    
        $('img.thumb').removeClass('currentThumb');
        thumbToSelect.addClass('currentThumb');
                    
        currentProject.hide();
        projectToShow.fadeIn("slow");
                
        if(navigator.userAgent.match(/iPhone/i)){
            if(projectToShow.hasClass('pVideo')){
                $('#videoLink_'+id).show();
            }
        }
                  
        if(currentProject.hasClass('pVideo')){
            var videoId = currentProject.children().attr('id');
            var froogaloop = $f(videoId);
            froogaloop.api('unload');
        }
                    
        $('#client').html($('#p_'+id+' .hClient').html());
        $('#desc').html($('#p_'+id+' .hDesc').html());
        $('#url').html('<a id="link" target="_blank" href="'+$('#p_'+id+' .hUrl').html()+'">'+$('#p_'+id+' .hSite').html()+'</a>');
                    
        resizeImage();
    }

    function getNextIdProject(){
        currentProject = $("div.project:visible");

        if(currentProject.next().attr('id')){
            var nextId = currentProject.next().attr('id');
            nextId = nextId.split('_');
            nextId = nextId[1];   
            return nextId;
        }
        else{
            return firstIdProject;
        }
    }
                
    function getPrevIdProject(){
        currentProject = $("div.project:visible");
        if(currentProject.prev().attr('id') != 'footer'){
            var prevId = currentProject.prev().attr('id');
            prevId = prevId.split('_');
            prevId = prevId[1];   
            return prevId;
        }
        else{
            return lastIdProject;
        }
    }
                
                
    $(window).keydown(function(event) {
        if (event.keyCode == 37) {
            loadProject(getPrevIdProject());
        } else if (event.keyCode == 39) {
            loadProject(getNextIdProject());
        }
    });
                
    $(".project").click(function() {
        loadProject(getNextIdProject());
        return false;
    });
                
    $(".thumb").click(function() {
        if($(this).hasClass('currentThumb')){
            return false;
        }
        else{
            var idProject = $(this).attr('id');
            idProject = idProject.split('_');
            idProject = idProject[1];  
            loadProject(idProject);
        }
        return false;
                    
    });
                
    // -- Navigation    
                    
    // slide
    var carouselHeight = 70;
    var slideHeight = 84;
    var slideContentHeight = 83;
                
    function slideDown(){
        $('#slideContent').height(slideContentHeight);
        $('#slide').stop();
        $('#slide').animate({
            height: slideHeight
        }, 300);
        $('#slideBtn img').attr('src','v2/img/75p_black-triangle-down.png');
    }
                
    function slideUp(){
        $('#slideContent').height(slideContentHeight+carouselHeight);
        $('#slide').stop();
        $('#slide').animate({
            height: slideHeight+carouselHeight
        }, 300);
        $('#slideBtn img').attr('src','v2/img/75p_black-triangle-up.png');
    }
                
    $(".slidePop").mouseover(function(){
        slideUp();
    });
    $(".slidePop").mouseout(function(){
        slideDown();
    });
                
    // -- slide
                
                
    // Carrousel Navigation
    var xImage = 60;
    var marginImage = 12;
    var nbImage = $('#carrousel').children().size();
    var maxLeft = (xImage+marginImage)*nbImage;
                
                
    function getWidthslide(){
        var widthSlide = (xImage+marginImage)*nbImagePerSlide;
        return widthSlide;
    }
                
    $('#carrouselBox').width(getWidthslide());
    $('#carrouselNavigBox').width(getWidthslide()+50);
                
    $("#prevCarrousel").click(function() {
        var position = $('#carrousel').position();
        if(position.left < 0 ){
            if(position.left+getWidthslide() > 0){
                $('#carrousel').animate({
                    left: 0
                }, 300);
            }
            else{
                $('#carrousel').animate({
                    left: "+="+getWidthslide()
                }, 300);
            }
        }
        return false;
    });
                
    $("#nextCarrousel").click(function() {
        var position = $('#carrousel').position();
        if(Math.abs(position.left-getWidthslide())<maxLeft){
            if(Math.abs(position.left-getWidthslide())>(maxLeft-getWidthslide())){
                $('#carrousel').animate({
                    left: -(maxLeft-getWidthslide())
                }, 300);
            }
            else{
                $('#carrousel').animate({
                    left: "-="+getWidthslide()
                }, 300);
            }
        }
        return false;
    });
    // -- Carrousel Navigation
                
    // Resize Video Image
    var theWindow = $(window);
    var theWindowHeight = $(window).height();
    var theWindowWidth = $(window).width();
    
    var formatVideo = 'big';
                
    theWindow.resize(function() {
        theWindowHeight = $(window).height();
        theWindowWidth = $(window).width();
        resizeImage();
    }).trigger("resize");
                
                
                
    function resizeImage(){
                    
        var currentProject = $("div.project:visible");
        

        
        if(currentProject.hasClass('pVideo')){

            if((theWindowHeight) < (480+55+13) || (theWindowWidth) < 640){
                if((theWindowHeight) < (320+55+13)  || (theWindowWidth) < 480){
                    var newformatVideo = 'small';
                }
                else{
                    var newformatVideo = 'medium';
                }
            }
            else{
                var newformatVideo = 'big';
            }
                        
            if(newformatVideo != formatVideo){
                formatVideo = newformatVideo;
                if(formatVideo == 'big'){
                                
                    $("div.project:visible iframe").css('width', '640');
                    $("div.project:visible iframe").css('height', '480');
                }
                else if(formatVideo == 'medium'){
                                
                    $("div.project:visible iframe").css('width', '480');
                    $("div.project:visible iframe").css('height', '360');

                }else if(formatVideo == 'small'){
                                
                    $("div.project:visible iframe").css('width', '320');
                    $("div.project:visible iframe").css('height', '240');
                }
            }
                        
            var videoContainerY = theWindowHeight-80;
            $("div.pVideo:visible").css('padding-top',((videoContainerY-$("div.project:visible iframe").height())/2));
            
        }
        else{
            
            
            
            var realImageWith = $("div.project:visible .realImageX").html();
            var realImageHeight = $("div.project:visible .realImageY").html();
            var realImageRatio = realImageWith/realImageHeight;
            var realImageFormat = '';
            if(realImageRatio > 1){
                realImageFormat = 'paysage';
            }
            else{
                realImageFormat = 'portrait';
            }
            
            var displayWidth = theWindowWidth;
            var displayHeight = theWindowHeight-55;
            var displayRatio = (theWindowWidth/(theWindowHeight-55));
            
            var displayFormat = '';
            if(displayRatio > 1){
                displayFormat = 'paysage';
            }
            else{
                displayFormat = 'portrait';
            }
            

            
            $("#debug-image").html(realImageWith+'*'+realImageHeight+' ratio:'+realImageRatio+' format:'+realImageFormat);
            $("#debug-display").html(displayWidth+'*'+displayHeight+' ratio:'+displayRatio+' format:'+displayFormat);
            
            if(displayRatio > realImageRatio){
                $("div.project:visible img").height((theWindowHeight-55));
                $("div.project:visible img").width(displayHeight*realImageRatio);
                $("div.project:visible img").css('margin-top',0);
            }
            else{
                $("div.project:visible img").width(displayWidth);
                $("div.project:visible img").height(displayWidth/realImageRatio);
                
                $("div.project:visible img").css('margin-top',(displayHeight-$("div.project:visible img").height())/2);
            }
            

        }
    }
// Resize Video Image
                
});