var dragElement = null;
var startX = null;
var mouseShift = 0;
var sliderTopY = 0;
var slideBarX = 0;
var id;
var activeSlider;

function drag(slider,event) {
	if(!event) event = window.event; 
	dragElement = true;
	activeSlider = slider;
	if(!slider.valueBox) {
		slider.valueBox = slider.parentNode.parentNode.parentNode.getElementsByTagName('DIV')[2];
	}
	if(!slider.valueInput) {
		slider.valueInput = slider.parentNode.parentNode.parentNode.getElementsByTagName('INPUT')[0];
	}
	startX = slider.offsetLeft;
	var forShift = 0;
	while(slider != null) { forShift += slider.offsetLeft; slider = slider.offsetParent; }
	mouseShift = event.clientX + document.body.scrollLeft - forShift;
}

document.onmouseup=function() {
	dragElement = null;
	activeSlider = null;
	document.body.style.cursor = 'auto';
	startX = null;
}

document.onmousedown=function() {
	if(dragElement) return false;
	return true;
}

document.onselectstart=function() {
	if(dragElement) return false;
	return true;
}

var mouseX = 0;
var mouseY = 0;

document.onmousemove=function(event) {
	var slider = activeSlider;
	if(slider == null) return false;
	if(!event) event = window.event; 
	sliderTopY = 0;
	slideBarX=0;
	var slideBar = slider.parentNode;
	var obj = slideBar;
	while(obj != null) { slideBarX += obj.offsetLeft; sliderTopY += obj.offsetTop; obj = obj.offsetParent; }

    mouseX = event.clientX + document.documentElement.scrollLeft;
    mouseY = event.clientY + document.documentElement.scrollTop;
	if (dragElement) {
		document.body.style.cursor = 'pointer';
		if((mouseY > (sliderTopY - 40)) && (mouseY < (sliderTopY + 54))) {
			if(mouseX - mouseShift < slideBarX) { slider.style.left = "0px"; }
			else if((mouseX - mouseShift) > (slideBar.offsetWidth + slideBarX - 14)) slider.style.left = slideBar.offsetWidth - 14 + "px";
			else slider.style.left = mouseX - slideBarX - mouseShift + "px";
		}
		id=Math.round(slider.offsetLeft/((slideBar.offsetWidth - 14)/20));
		slider.valueBox.innerHTML = id * 10;
		slider.valueInput.value = id * 10;
	}
}