$(function() {
	$( "#slider-range" ).slider({
		range: true,
		min: -1,
		max: 25,
		step: 1,
		values: [ parseInt($("#start_hour_span").text()) , parseInt($("#end_hour_span").text()) ],
		slide: function( event, ui ) {
			if ((ui.values[1] - ui.values[0] < 1)||(ui.values[0] < 0)||(ui.values[1]>24)){
                return false;
            }
			$( "#start_hour" ).val( ui.values[ 0 ] );
			$( "#end_hour" ).val( ui.values[ 1 ] );
			$( "#start_hour_span" ).text( ui.values[ 0 ] + ":00" );
			$( "#end_hour_span" ).text( ui.values[ 1 ] + ":00" );
        
		}
	});
	$( "#start_hour" ).val($( "#slider-range" ).slider( "values", 0 ));
	$( "#end_hour" ).val($( "#slider-range" ).slider( "values", 1 ));
	$( "#start_hour_span" ).text($( "#slider-range" ).slider( "values", 0 ) + ":00");
	$( "#end_hour_span" ).text($( "#slider-range" ).slider( "values", 1 ) + ":00");

$('#slider-range').slider({});
	$('.ui-slider').each(function() {
	$('.ui-slider-handle:first', this).addClass('my-slider-handle-left')
	$('.ui-slider-handle:last', this).addClass('my-slider-handle-right')
	});
});