(function ($) {
	
	$.fn.sliderProjects = function (options) {
		
		$('.lineL, .lineR').draggable({
			axis: 'x',
			grid: [222, 20],
			drag: function(event, ui) {
				
				if (ui.position.left < 0) {
					ui.position.left = 0;
				}
				
				if(ui.position.left > 888) {
					ui.position.left = 888;
				}
				
				if ($(this).is('.lineL') && $('.lineR').position().left - 222 <= ui.position.left ) {
					ui.position.left = $('.lineR').position().left - 222;
				}
				
				if ($(this).is('.lineR') && $('.lineL').position().left + 222 >= ui.position.left ) {
					ui.position.left = $('.lineL').position().left + 222;
				}
				
				$('.catLineIn span').css({
					left: $('.lineL').position().left,
					width: $('.lineR').position().left - $('.lineL').position().left,
				});

				var _square = [],
					_squareMin = parseInt($('.catLine').attr('min')),
					_squareMax = parseInt($('.catLine').attr('max')),
					_squareDiv = (_squareMax - _squareMin) / 4,
					_leftSquare = $('.lineL').position().left / 222 * _squareDiv + _squareMin,
					_rightSquare = $('.lineR').position().left / 222 * _squareDiv + _squareMin;
					
				$('.catItem').each(function () {
					
					var _val = $(this).attr('rel');
					
					if (_val >=_leftSquare && _val <= _rightSquare) {
						$(this).show();
					}
					else {
						$(this).hide();
					}
					
				});
					
				//$('#debug').html(_leftSquare + '-' + _rightSquare);
				
			}
		});
		
	};
	
})(jQuery);