var sliders = new Array();
var selectedKnob;
var selectedSlider;
var selectedKnobIndex;
var selectedKnobInput;

var offsetX, offsetY;

   
   
function initSliders() {   
	
		
	initDHTMLAPI();
	initDrag( );

	var defP = {slMin:0, slMax:100, precision:0, slStep:1 }; 
	
	
	var imgDir =  '/content/slider/';
	var defSliderIcon = imgDir + 'knob.gif';
	var sliderIcon;
	var knobWidth = 12;
	var knobHeight = 19;
	var divClass = 'knobDiv';
	var u = 1;
	var k, k1, i, v, id, knobs, position, n, m, ui, form, input;
	
	
	for (k in sliders) {
		
		v = sliders[k];
		id = v.holder;
		
		sliderIcon = v['knob'] ? imgDir + v['knob'] : defSliderIcon;
		
		for (k1 in defP) {
			if(!v[k1]) sliders[k][k1] = defP[k1];
		}
		
		
		sliders[k].instance = getRawObject(id);
		sliders[k].zone = {left:0, top:0, right:getObjectWidth(id), bottom:getObjectHeight(id)};
		if(!v.slWidth) sliders[k].slWidth = getObjectWidth(id);
		sliders[k].knobWidth = knobWidth;
		sliders[k].slUnit = (v.slMax - v.slMin)/(v.slWidth - v.knobWidth);
		if (v.disp) sliders[k].disp = getRawObject(v.disp);
		
		
		
		v.val2 ? n = 2 : n = 1;
		
		if (v.formID && v.inputs) {
			
			form = getRawObject(v.formID);
			if (form && form.elements) {
				
				for(i = 1; i <= n; i++) {
					if(v.inputs[i-1]) {
						input = form.elements[v.inputs[i-1]];
						if (input) {
							//input.value = v['val' + i];
							if (input.value) {
								v['val' + i] = input.value;
							}
							sliders[k]['input' + i] = input;
						}
					}
					
				}
				
			}
			
			
		}
		
		
		
		sliders[k].knobs = new Array();
		knobs = '';
		
		for(i = 1; i <= n; i++) {
		
			position = Math.round((v['val' + i] - v.slMin) / v.slUnit);
			ui = u + '' + i;
			
			knobs += '<div id="img' + ui + 'Wrap" class="' + divClass + '" style="left:' + position + 'px;">';
			knobs += '<img id="img' + ui + '" name="img' + ui + '" src="' + sliderIcon + '" border="0" width="' + knobWidth + '" height="' + knobHeight + '" >';
			knobs += '</div>';
			
		}	
		
		sliders[k].instance.innerHTML = knobs;
	
		for(i = 1; i <= n; i++) {
			ui = u + '' + i;
			sliders[k].knobs[i] = getRawObject('img' + ui + 'Wrap');
		}	
		
		
		if(sliders[k].handler) sliders[k].handler();
		
		u++;
		
	}
	  
	  
	sliderDragHandler();  
}  
   

function setSelectedElem(evt) {
   evt = (evt) ? evt : event;
   var target = (evt.target) ? evt.target : evt.srcElement;
    var divID = (target.name && target.src) ? target.name + "Wrap" : "";
    if (divID) {
        selectedKnob = getRawObject(divID);
        setZIndex(selectedKnob, 100);
		
		for (var k in sliders) {
			for (var k1 in sliders[k].knobs) {
				if (sliders[k].knobs[k1] == selectedKnob) {
					selectedSlider = sliders[k];
					selectedKnobIndex = k1;
					selectedKnobInput = selectedSlider['input' + k1];
				}
			}
		}
		
        return;
    }
    selectedKnob = null;
	selectedSlider = null;
	selectedKnobIndex = null;
	selectedKnobInput = null;
	
    return;
}


   

function engage(evt) {
    evt = (evt) ? evt : event;
    setSelectedElem(evt);
    if (selectedKnob && selectedSlider) {
        if (document.body && document.body.setCapture) {
            document.body.setCapture();
        }
       
        offsetX = evt.clientX - ((selectedKnob.offsetLeft) ? selectedKnob.offsetLeft : 0);
        offsetY = evt.clientY - ((selectedKnob.offsetTop) ? selectedKnob.offsetTop : 0);
	
	    return false;
    }
	return true;
}


 

 
   
function dragIt(evt) {
    evt = (evt) ? evt : event;
    var x, y, width, height;
	var str = '';
	var arr = new Array();
   
    if (selectedKnob && selectedSlider) {
		
		x = evt.clientX - offsetX;
	
        width = selectedSlider.knobWidth;
 
		
       if(x < selectedSlider.zone.left) {
	   	 	x = selectedSlider.zone.left;
	   }
	   else if(x + width > selectedSlider.zone.right) {
	   		x = selectedSlider.zone.right - width;
	   }
	   
	
		shiftTo(selectedKnob, x, 0);
		getSliderValue(x);
			
        evt.cancelBubble = true;
        return false;
    }
	return true;
}
 
 
function getSliderValue(x) {

	if (selectedKnob && selectedSlider && selectedKnobIndex) {
		
		var value = Math.round(x*selectedSlider.slUnit + selectedSlider.slMin, selectedSlider.precision);
		
		if (value < selectedSlider.slMin) value = selectedSlider.slMin;
		else if (value > selectedSlider.slMax) value = selectedSlider.slMax;
		
		
		selectedSlider['val' + selectedKnobIndex] = value;
		if(selectedKnobInput) selectedKnobInput.value = value;
		sliderDragHandler();
	}
}
 
 
 
function sliderDragHandler() { 
  
 		var str = '';
		
		var elements = ['qpgmin', 'qpgmax', 'qymin', 'qymax', 'PGLEN'];
		var elem;
		
		for (var k in elements){
			elem = getRawObject(elements[k]);
			if(elem) str += elements[k] + ' ' + elem.value + ' \n ';
		
		}
	
		
		if (selectedSlider && selectedSlider.handler) {
			selectedSlider.handler();	
		}
} 



function setSliderValue(slider, index, value) {
	
	if (slider.knobs[index]) {
		
		if (value < slider.slMin) value = slider.slMin;
		else if (value > slider.slMax) value = slider.slMax;
		
		slider['val' + index] = value;
		if (slider['input' + index]) slider['input' + index].value = value;
		
		var x = Math.round((value - slider.slMin) / slider.slUnit);
		shiftTo(slider.knobs[index], x, 0);
		
		if (slider.handler) slider.handler();	
		
	}

}
   
   

function release(evt) {
    if (selectedKnob) {
        setZIndex(selectedKnob, 0);
        if (document.body && document.body.releaseCapture) {
            document.body.releaseCapture();
        }
       
	   	sliderReleaseHandler();
	   
	    selectedKnob = null;
		selectedSlider = null;
		selectedKnobIndex = null;
    }
}
   
function checkSliderValues() { 

	if(selectedSlider.knobs.length > 1) {
		var flag = false;
		var val1 = selectedSlider.val1*1;
		var val2 = selectedSlider.val2*1;
		
		if(val1 == val2) {
			if(val2 < selectedSlider.slMax) val2 += selectedSlider.slStep;	
			else  val1 -= selectedSlider.slStep;
			flag = true;
		}
		else if (val1 > val2) {
			val1 = selectedSlider.val2*1;
			val2 = selectedSlider.val1*1;
			flag = true;
		}
		
		if(flag == true) {
			setSliderValue(selectedSlider, 1, val1);
			setSliderValue(selectedSlider, 2, val2);
			
			//alert(val1 + " " + val2 + " " + selectedSlider.val1 + " " + selectedSlider.val2);
		}
	}
}



function sliderReleaseHandler() { 
  
	checkSliderValues(); 
	
	if (selectedSlider.formID && selectedSlider.submitForm) {		
		var form = getRawObject(selectedSlider.formID);
		form.submit( );
	}
} 




function initDrag( ) {
   
   if (document.layers) {
        // turn on event capture for these events in NN4 event model
        document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP);
		document.onmousedown = engage;
    	document.onmousemove = dragIt;
    	document.onmouseup = release;
        return;
    } else if (document.body & document.body.addEventListener) {
        // turn on event capture for these events in W3C DOM event model
        document.addEventListener("mousedown", engage, true);
        document.addEventListener("mousemove", dragIt, true);
        document.addEventListener("mouseup", release, true);
        return;
    }
	
    document.onmousedown = engage;
    document.onmousemove = dragIt;
    document.onmouseup = release;
    return;
}