function initSlider(id, maxLimit, minLimit, maxDefault, minDefault, width) {
	
	gap = 1;
	zero = 0;
	
	width = width || 200;
	
	minDrag = getEl('slider_'+id+'_min');
	maxDrag = getEl('slider_'+id+'_max');
	sliderIndicatorContainer = getEl('slider_'+id+'_indicator_container');
	sliderContainer = getEl('slider_'+id+'_container');
	sliderIndicatorTitle1 = getEl('slider_'+id+'_indicator_title_1');
	sliderIndicatorTitle2 = getEl('slider_'+id+'_indicator_title_2');
	sliderIndicatorTitle3 = getEl('slider_'+id+'_indicator_title_3');

	initSliderDefaults(id, minDefault, maxDefault, minLimit, maxLimit, width);
	
	Drag.init(minDrag, null, 0, width, 15, 15);
	Drag.init(maxDrag, null, 0, width, 15, 15);
	
	sliderIndicatorContainer.style.width = width + 'px';
	sliderContainer.style.width = width + 'px';
	
	sliderIndicatorTitle1.innerHTML = minLimit;
	sliderIndicatorTitle2.innerHTML = minLimit + Math.round((maxLimit-minLimit)/2);
	sliderIndicatorTitle3.innerHTML = maxLimit;
	
	minDrag.onDrag = function(x, y) {
		
		minDrag = getEl('slider_'+id+'_min');
		maxDrag = getEl('slider_'+id+'_max');
		sliderMinInput = getEl('slider_'+id+'_min_input');
		sliderIndicatorMask = getEl('slider_'+id+'_indicator_mask');
		sliderMaxInput = getEl('slider_'+id+'_max_input');
		sliderIndicator = getEl('slider_'+id+'_indicator');

		if(parseInt(minDrag.style.left) > parseInt(maxDrag.style.left) - gap) {
			minDrag.style.left = parseInt(maxDrag.style.left) - gap + 'px';
			sliderMinInput.value = convertCoordinateToValue(minLimit, maxLimit, width, parseInt(maxDrag.style.left) - gap);
			sliderIndicatorMask.style.width = parseInt(maxDrag.style.left) - gap  + 'px';
		} else if(parseInt(minDrag.style.left) < zero) {
			minDrag.style.left = zero + 'px';
			sliderMinInput.value = convertCoordinateToValue(minLimit, maxLimit, width, zero);
			sliderIndicatorMask.style.width = zero  + 'px';
		} else {
			sliderMinInput.value=convertCoordinateToValue(minLimit, maxLimit, width, x);
			sliderIndicatorMask.style.width = x + 'px';
		}
	}
	
	maxDrag.onDrag = function(x, y) {
		
		minDrag = getEl('slider_'+id+'_min');
		maxDrag = getEl('slider_'+id+'_max');
		sliderMinInput = getEl('slider_'+id+'_min_input');
		sliderIndicatorMask = getEl('slider_'+id+'_indicator_mask');
		sliderMaxInput = getEl('slider_'+id+'_max_input');
		sliderIndicator = getEl('slider_'+id+'_indicator');
		
		if(parseInt(maxDrag.style.left) < parseInt(minDrag.style.left) + gap) {
			maxDrag.style.left = parseInt(minDrag.style.left) + gap + 'px';
			sliderMaxInput.value = convertCoordinateToValue(minLimit, maxLimit, width, parseInt(minDrag.style.left) + gap);
			sliderIndicator.style.width = parseInt(minDrag.style.left) + gap + 'px';
		} else if(parseInt(maxDrag.style.left) > width) {
			maxDrag.style.left = width + 'px';
			sliderMaxInput.value = convertCoordinateToValue(minLimit, maxLimit, width, width);
			sliderIndicator.style.width = width + 'px';
		} else {
			sliderMaxInput.value=convertCoordinateToValue(minLimit, maxLimit, width, x);
			sliderIndicator.style.width = x + 'px';
		}
	}

}

function getEl(id){
	return document.getElementById(id);
}

function convertCoordinateToValue(minLimit_value, maxLimit_value, width_value, cord_value){
	return Math.round( minLimit_value + ( maxLimit_value - minLimit_value ) / 100 * ( cord_value / ( width_value / 100 ) ) );
}

function convertValueToCoordinate(minLimit_value, maxLimit_value, width_value, value_value){
	return Math.round( ( width_value / 100 ) * ( value_value - minLimit_value ) / ( ( maxLimit_value - minLimit_value ) / 100 ) );
}


function initSliderDefaults(id, minValue, maxValue, minLimit_value, maxLimit_value, width_value){	
	getEl('slider_'+id+'_min').style.left = convertValueToCoordinate(minLimit_value, maxLimit_value, width_value, minValue) + 'px';
	getEl('slider_'+id+'_min_input').value = minValue;
	getEl('slider_'+id+'_indicator_mask').style.width = convertValueToCoordinate(minLimit_value, maxLimit_value, width_value, minValue)  + 'px';
	getEl('slider_'+id+'_max').style.left = convertValueToCoordinate(minLimit_value, maxLimit_value, width_value, maxValue) + 'px';
	getEl('slider_'+id+'_max_input').value = maxValue;
	getEl('slider_'+id+'_indicator').style.width = convertValueToCoordinate(minLimit_value, maxLimit_value, width_value, maxValue) + 'px';
}