$(document).ready(
function()
{
    $('div.ui-slider-2').css('display','block');
    
    $('#slider2').slider({ 
        steps: 2,
        range: true,
        change: function(e,ui) {
            new_value = round((2/100)*ui.value)+1;
			boldTextScrollBar(new_value);
			
            return newDirection(new_value);
        }
        
    });
    
    moveScrollButton();
}
);

function newDirection(new_value){
    boldTextScrollBar(new_value);
	$("#htmlProjectsList").html('<img src="/images/i/loader-big.gif">');
	
	ajax({
        "url":"\/portfolio/project/direction-ajax", "type":"POST", "async":true,
        "data":{"direction":new_value, "langVal":$("#langVal").val(), "format":"json"}, "dataType":"json"},
        true);
    return false;
}

function boldTextScrollBar(new_value){
    some_id = "#wrap_val"+old_value;
	$(some_id).attr("class","non_active");
	old_value = new_value;
	some_id = "#wrap_val"+old_value;
	$(some_id).attr("class","active");
	
	moveScrollButton();
}

function moveScrollButton(){
    $('#wrap_val'+old_value).attr('class','active');
    px = 479*(old_value-1)/2;
    new_style = 'left: '+px+'px;';
    $('div.ui-slider-handle').attr('style',new_style);
}

function projectPagination(page){
    $("#htmlProjectsList").html('<img src="/images/i/loader-big.gif">');
    ajax({
        "url":"\/portfolio/project/direction-ajax", "type":"POST", "async":true,
        "data":{"direction":old_value, "langVal":$("#langVal").val(), "page":page, "format":"json"}, "dataType":"json"},
        true);
        
    return false;
}