var SLIDER_VERSION = "1.1 BETA";
var mover;
var bar;
var tooltip;
var iPageOffsetX;
var bHitBound;
var bSliderActive = false;
var iBoundsOffset = 0;
var iBoundsEntry = 0;
var bOutOfBoundsLeft = false;
var bOutOfBoundsRight = false;
var iCallBackOffset = 1;

var activeSlider = null;
var activeSliders = {
	"hitlistSlider" : {
		"box" : "sliderBox",
		"mover" : "sliderMover",
		"bar" : "sliderBar",
		"tooltip" : "sliderTooltip"
	},
	"lpSlider" : {
		"box" : "lpsliderBox",
		"mover" : "lpsliderMover",
		"bar" : "lpsliderBar",
		"tooltip" : "lpsliderTooltip"
	}
//	"bookSlider" : {
//		"box" : "sliderBox",
//		"mover" : "sliderMover",
//		"bar" : "sliderBar",
//		"tooltip" : "sliderTooltip",
//	},
};

// fn OHNE ();
//var fnReleaseCallback = fnc;
var fnMoveCallback = function(iLeft, tooltip) {
	tooltip.innerHTML = 'Offset: ' + iLeft;
};
var fnReleaseCallback = function(iLeft) {
	window.status = "callback: " + iLeft;
};

function activateSlider(slider) {
	activeSlider = slider;
}

function initSlider(e) {

	/* get HTML elements */
	box = document.getElementById(activeSlider["box"]);
	mover = document.getElementById(activeSlider["mover"]);
	bar = document.getElementById(activeSlider["bar"]);
	tooltip = document.getElementById(activeSlider["tooltip"]);

	/* Apply styles */
	if (bar.style.setAttribute && tooltip.style.setAttribute) {
		bar.style.setAttribute("backgroundColor", "#F7F7F7");
		if (SLIDER_SHOWTOOLTIP === true || typeof(SLIDER_SHOWTOOLTIP) != 'boolean') {
			tooltip.style.setAttribute("display", "block");
		}	
//		tooltip.style.setAttribute("top", "-50px");
		tooltip.style.zIndex = '11000';
	} else {
		bar.style.backgroundColor = "#F7F7F7";
		if (SLIDER_SHOWTOOLTIP === true || typeof(SLIDER_SHOWTOOLTIP) != 'boolean') {
			tooltip.style.display = "block";
		}
		tooltip.style.zIndex = 10001;
//		tooltip.style.top = "-50px";
	}


	if (e.cancelBubble) {
		e.cancelBubble = true;
	}
	if (e.stopPropagation) {
		e.stopPropagation();
	}

	/* Preset Variables */
	bSliderActive = true;
	iPageOffsetX = e.clientX;
	bHitLowerBound = false;
	iBoxWidth = parseInt(getStyle(box, "width", "width"));
	iBarLeft = parseInt(getStyle(bar, "left", "left"));
	
	fnMoveCallback(iBarLeft, tooltip);
	
	positionateTooltip(e);
	var body = document.getElementsByTagName("body")[0];
	if (body.attachEvent) {
		body.attachEvent("ondrag", markPrevention);
		body.attachEvent("onselectstart", markPrevention);
	}
	addEvent(mover, "mousemove", moveSlider);
	addEvent(body, "mousemove", moveSlider);
}

var a = "";
var b = "";
function moveSlider(e) {
	tooltip.innerHTML = e.clientX;
	
	var iBarWidth = parseInt(getStyle(bar, "width", "width"));
	var iBarLeft = parseInt(getStyle(bar, "left", "left"));
	var iBarRight = parseInt(getStyle(bar, "right", "right"));
	var iNewOffset = iPageOffsetX - e.clientX;
	iBarLeft -= iNewOffset;

	// =====> left side....

	// detect a bouncing out of bounds on the left side
	if (iBarLeft <= 1) {
		tooltip.innerHTML = "Hit lower!";
		if (!bOutOfBoundsLeft && iBoundsEntry == 0) {
			iBoundsEntry = e.clientX;
			bOutOfBoundsLeft = true;
		}
	}

	// check wether the mouse is back
	if (bOutOfBoundsLeft && e.clientX >= iBoundsEntry && iPageOffsetX < e.clientX) {
		iBarLeft = e.clientX - iBoundsEntry;
		iBoundsEntry = 0;
		bOutOfBoundsLeft = false;
	}
	
	// bounces out left side
	if (bOutOfBoundsLeft && e.clientX <= iBoundsEntry) {
		iBarLeft = 1;
	}


	// =====> right side....

	if (iBarLeft + iBarWidth > iBoxWidth - 3) {
		tooltip.innerHTML = "Hit upper!";
		if (!bOutOfBoundsRight && iBoundsEntry == 0) {
			iBoundsEntry = e.clientX;
			bOutOfBoundsRight = true;
		}
	}
	
	if (bOutOfBoundsRight && e.clientX >= iBoundsEntry) {
		iBarLeft = iBoxWidth - iBarWidth - 3;
	}
	
	if (bOutOfBoundsRight && e.clientX <= iBoundsEntry && iPageOffsetX > e.clientX) {
		iBarLeft -= e.clientX - iBoundsEntry;
		iBoundsEntry = 0;
		bOutOfBoundsRight = false;
	}

//	window.status = iPageOffsetX + " " + e.clientX + " " + iBarLeft + " " + iNewOffset + " " + iBoundsOffset + " " + iBoundsEntry + " " + bOutOfBoundsRight;
	if (iBarLeft > 0 & (iBarLeft + iBarWidth) < iBoxWidth) {
		if (mover.style.setAttribute && bar.style.setAttribute) {
			mover.style.setAttribute("left", iBarLeft + "px");
			bar.style.setAttribute("left", iBarLeft + "px");
//			mover.style["left"] = iBarLeft + "px";
		} else {
			mover.style.left = iBarLeft + "px";
			bar.style.left = iBarLeft + "px";
		}
		iPageOffsetX = e.clientX;
	}
	iCallBackOffset = iBarLeft;
	fnMoveCallback(iBarLeft, tooltip);
	//positionateTooltip(e);
}

function releaseSlider(e) {
	if (!bSliderActive) {
	   return;
	}
	bSliderActive = false;
	
	if (typeof(e) != "undefined") {
		if (e.cancelBubble) {
			e.cancelBubble = true;
		}
	
		if (e.stopPropagation) {
			e.stopPropagation();
		}
	}

	var body = document.getElementsByTagName("body")[0];
	if (body.attachEvent) {
		body.detachEvent("ondrag", markPrevention);
		body.detachEvent("onselectstart", markPrevention);
	}
	removeEvent(mover, "mousemove", moveSlider);
	removeEvent(body, "mousemove", moveSlider);

	/* Remove Styles */
	if (bar) {
		if (bar.style.setAttribute && tooltip.style.setAttribute) {
			bar.style.setAttribute("backgroundColor", "#EFEFEF");
			tooltip.style.setAttribute("display", "none");
		} else {
			bar.style.backgroundColor = "#EFEFEF";
			tooltip.style.display = "none";
		}
		
		fnReleaseCallback(iCallBackOffset);
	}

	/* Reset Variables */
	bOutOfBoundsLeft = false;
	bOutOfBoundsRight = false;
	iBoundsEntry = 0;
}

function positionateTooltip(e) {
	var iTTpW = getStyle(tooltip, "width", "width");
	if (iTTpW == "auto") {
		iTTpW = getStyle(tooltip, "minWidth", "min-width");
	}
	iTooltipWidth = parseInt(iTTpW);
	iBarWidth = parseInt(getStyle(bar, "width", "width"));
		
	iLeft = (iBarWidth / 2) - (iTooltipWidth / 2) - 3;
	tooltip.style.left = iLeft + "px";
}

function markPrevention() {
	return false;
}

function addEvent(obj, type, fn) {
	try {
		if (obj.addEventListener) {
			try {
				obj.addEventListener(type, fn, false);
			} catch(e) {}
			return true;
		} else if (obj.attachEvent) { 
			var r = obj.attachEvent("on" + type, fn);
			return r;
		}
		return false;
	} catch(e1) {
//		alert("couldn't attach event " + fn);
	}
}

function removeEvent(obj, type, fn) {
	if (obj.removeEventListener) {
		try {
			obj.removeEventListener(type, fn, false);
		} catch(e) {}
		return true;
	} else if (obj.detachEvent) { 
		var r = obj.detachEvent("on" + type, fn);
		return r;
	}
	return false;
}


function getStyle(elem, IEStyleProp, CSSStyleProp) {
    if (window.getComputedStyle) {
    	try {
	        var compStyle = window.getComputedStyle(elem, "");
	        return compStyle.getPropertyValue(CSSStyleProp);
    	} catch(e) {
    		return "";
    	}
    } else if (elem.currentStyle) {
        return elem.currentStyle[IEStyleProp];
    }
    return "";
}