
function controlTheSliders(){
//stuff that slides
        var $progressIndicator = $(".about-container .progress-indicator");
        var $progressSlider = $progressIndicator.find(".progress-overlay");

        var $aboutContainer = $(".about-container");
        var $aboutPost = $(".about-post");
        
        var $goToTopContainer = $(".go-to-top-container");

        $aboutContainer.css("min-height",$aboutPost.outerHeight());

        //$aboutContainer.css("position","relative");
        //aboutcontainer initial positions
        $leftCont = $(".about-post").eq(0).position().left;
        $rightCont = $(".about-post").eq(1).position().left;
        //now make them fly!
        $(".about-post").eq(0).css({position:"absolute",left:$(".about-post").eq(0).outerWidth(),opacity:0});
        $(".about-post").eq(1).css({position:"absolute",left:960+$(".about-post").eq(1).outerWidth()+"px",opacity:0});

        $distanceToTravel = $(".about-post").eq(1).outerWidth();


        $(".services-container").css({position:"relative"});
        
        $(".creds-container").css({opacity:0});
        
        var outerServiceBoxes = $(".service-box:nth-child(2n)");
        var centerServiceBoxes = $(".service-box:nth-child(2n+1)");

        var outerServiceBoxesInitPos = [];

        $.each(outerServiceBoxes,function(){
                var initPosL = $(this).position().left;
                var initPosT = $(this).position().top;
                outerServiceBoxesInitPos.push({element:$(this),top:initPosT,left:initPosL});
        });
        //center central column
        $.each(centerServiceBoxes,function(){
            $(this).css({float:"none",marginLeft:"auto",marginRight:"auto"}); 
        });
        //position absolutely outer service boxes
        $.each(outerServiceBoxes, function(i,e){
            $(this).css({position:"absolute",left:outerServiceBoxesInitPos[i].left,top:outerServiceBoxesInitPos[i].top}); 
        });
        
        //now every outer service box move outside
        var outerBoxesSplits = splitArray(outerServiceBoxes);
        //move elems on the left
        $.each(outerBoxesSplits[0],function(){
            
            $(this).css({left:"-=300",opacity:0});
        })
        
        //move elems on the right
        $.each(outerBoxesSplits[1],function(){ 
            $(this).css({left:"+=300",opacity:0});
        });
        
        $.each(centerServiceBoxes,function(){
            
            $(this).css({opacity:0});  
            
        });
        
        
        //stuff that triggers the slides
        var threshold = 100;
        $(window).bind("scroll",function(){
            
            var fold = $(window).height()+$(window).scrollTop();
            var center = ($(window).height()/3)+$(window).scrollTop();
            var difference = Math.floor((fold-center));
            //About us
            if($aboutContainer.position().top+threshold<fold){
              var percentageval = Math.floor(100*(($aboutContainer.position().top+threshold)-center)/difference);
             if(percentageval > 0){
                $progressSlider.width(960*(percentageval/100));
                $(".about-post").eq(0).css({left:(0-$distanceToTravel*(percentageval/100)),opacity:((100-percentageval)/100)});
                $(".about-post").eq(1).css({left:(960-$(".about-post").eq(1).outerWidth())+($distanceToTravel*(percentageval/100)),opacity:((100-percentageval)/100)});
             }else{
                $progressSlider.width(0);
                $(".about-post").eq(0).css({left:$leftCont,opacity:1});
                $(".about-post").eq(1).css({left:$rightCont,opacity:1});
             }
            }else{
                $progressSlider.width(960);
            }
            
            
            if($(".creds-container").position().top+threshold<fold){
                var percentageval = Math.floor(100*(($(".creds-container").position().top+threshold)-center)/difference);
                if(percentageval > 0){
                   $(".creds-container").css({opacity:((100-percentageval)/100)});     
                }else{
                    $(".creds-container").css({opacity:1});     
                }
            }
                
            if($(".contact-container").position().top+threshold<fold){
                var percentageval = Math.floor(100*(($(".contact-container").position().top+threshold)-center)/difference);
                if(percentageval > 0){
                   $(".contact-container").css({opacity:((100-percentageval)/100)});     
                }else{
                    $(".contact-container").css({opacity:1});     
                }
            }
            
            
        
            if($aboutContainer.position().top+threshold<center){
               $(".about-post").eq(0).css({left:$leftCont,opacity:1});
               $(".about-post").eq(1).css({left:$rightCont,opacity:1});
            }
            
            if($(window).scrollTop() <= 0){
                $(".about-post").eq(0).css({position:"absolute",left:$(".about-post").eq(0).outerWidth(),opacity:0});
                $(".about-post").eq(1).css({position:"absolute",left:960+$(".about-post").eq(1).outerWidth()+"px",opacity:0});
                $progressSlider.width(960);
                $(".main-nav li").eq(0).trigger("click");
            }
            
            $.each($goToTopContainer,function(i,e){    
             
                        var $goToTopIndicator = $(this).find(".progress-indicator");
                        var $goToTopSlider = $(this).find(".progress-overlay");
                        
                        if($(this).offset().top+threshold<fold){
                              var percentageval = Math.floor(100*(($(this).offset().top+threshold)-center)/difference);
                               if(percentageval > 0){
                                        $goToTopSlider.width(960*(percentageval/100));
                                     }else{
                                        $goToTopSlider.width(0);
                                     }
                        }else{
                               $goToTopSlider.width(960); 
                        }
                
             });
                        
                    
            
            
            if($(".services-container").position().top+threshold<fold){
                
                $.each(outerBoxesSplits[0],function(i,e){    
                    if($(this).offset().top+threshold<fold){
                        var percentageval = Math.floor(100*(($(this).offset().top+threshold)-center)/difference);
                        $(this).css({left:(-300*(percentageval/100)),opacity:((100-percentageval)/100)});
                    }
                    
                    if($(this).offset().top+threshold<center){
                        
                        $(this).css({left:0,opacity:1});
                        
                    }
                    
                });
                
                $.each(centerServiceBoxes,function(){
                    var percentageval = Math.floor(100*(($(this).offset().top+threshold)-center)/difference);
                    $(this).css({opacity:((100-percentageval)/100)});  
                });
                
                $.each(outerBoxesSplits[1],function(){    
                    if($(this).offset().top+threshold<fold){
                        var percentageval = Math.floor(100*(($(this).offset().top+threshold)-center)/difference);
                        $(this).css({left:(960-300)+(300*(percentageval/100)),opacity:((100-percentageval)/100)});
                    }
                    
                    if($(this).offset().top+threshold<center){
                        $(this).css({left:640,opacity:1});
                    }
                    
                });            
                
        }
    
    
    
});
    
}


function resetTheSliders(){
        $(".about-post").removeAttr("style");
        $(".about-post").removeAttr("style");
        $(".service-box").removeAttr("style");
        $(".creds-container").removeAttr("style");
        $(".contact-container").removeAttr("style");
        $(window).unbind("scroll");
}



function splitArray(candid) {
    var oddOnes = [],
        evenOnes = [];
    for(var i=0; i<candid.length; i++)
        (i % 2 == 0 ? evenOnes : oddOnes).push(candid[i]);
    return [evenOnes, oddOnes];
}

