//------------------------------------------------------------
// Bewegen eines Schiebereglers via "Drag 'n' Drop",
// Scrollen einer Seite im Nachbarframe im passenden
// Verhaeltniss zum Schiebeweg des Reglers
//
// © 2004 Niels Bobogk
//------------------------------------------------------------


// Konstanten
var buttonMinTop = 187;								// obere Grenze, bis zu der der Button verschoben werden kann
var buttonMaxTop = 348;								// untere Grenze, bis zu der der Button verschoben werden kann
var buttonDistance = buttonMaxTop - buttonMinTop;

var contentFrameHeight = 374;						// Hoehe des Frames mit dem Inhalt
var contentFrameName = 'innen_mitte_mitte';			// Name des Frames mit der Inhaltsebene
var contentDivName = 'content';						// Name der Ebene mit dem Inhalt

//-------------------------------------------------------------

//Variablen
var ratio = 0;										// Verhaeltnis von Seitenhoehe zu buttonDistance
var dy = 0;											// Offset-Position des Cursor auf dem Button

// Objektvariablen
var objButton;
var objContentLayer;

//-------------------------------------------------------------


//------------------------------------------------------------
// Cross-Browser Objekterfassung fuer DOM-Prog.
// IN:	elemID	-	ID/Name des zu erfassenden Objektes
//		path	-	Pfadangabe, falls Obj. in anderem Frame
//------------------------------------------------------------
function getObj(elemId) {
	// fuer Browser, die DOM unterstuetzen
	if (document.getElementById) {
		this.obj = document.getElementById(elemId);
		this.style = document.getElementById(elemId).style;
		this.offsetHeight = this.obj.offsetHeight;
	}
	// Microsoft IE (ab) Version 4
	else if (document.all) {
		this.obj = document.all[elemId];
		this.style = document.all[elemId].style;
		this.offsetHeight = this.obj.offsetHeight;
	}	
	// Netscape Version 4
	else if (document.layers) {
		this.obj = document.layers[elemId];
		this.style = document.layers[elemId];
		this.offsetHeight = this.style.document.height;
	}
}


//------------------------------------------------------------
// Abfrage der Mausposition bei einem Event
//------------------------------------------------------------
function getMousePos(e) {
	if (document.all) {
		mouseY = event.clientY + document.body.scrollTop;
		mouseX = event.clientX + document.body.scrollLeft;
	}
	else if (document.getElementById || document.layers) {
		mouseY = e.pageY;
		mouseX = e.pageX;
	}
}


//------------------------------------------------------------
// Ueberpruefen, ob beim Mousedown der Cursor auf dem Regler
// ist und nicht die rechte Maustaste gedrückt wurde
//------------------------------------------------------------
function isMouseOnButton(e) {
	// rechte Maustaste unterbinden
	if ((document.all && event.button != 1) || (document.layers && e.which != 1)) return false;
	
	var t = parseInt(objButton.style.top);
	var l = parseInt(objButton.style.left);

	getMousePos(e);

	if (mouseY >= t && mouseY <= t + parseInt(objButton.style.height) && mouseX >= l && mouseX <= l + parseInt(objButton.style.width)) {
		return true;
	}
	else {
		return false;
	}
}


//------------------------------------------------------------
// Beenden des Drag-Vorgangs
//------------------------------------------------------------
function endDrag(e) {
	if (document.layers) document.releaseEvents(Event.MOUSEMOVE);
	document.onmousemove = null;
	return false;
}

//------------------------------------------------------------
// Bewegen des Buttons bei gedrueckter Maustaste 
//------------------------------------------------------------
function drag(e) {
	var currTop = parseInt(objButton.style.top);

	getMousePos(e);

	// Regler nur innerhalb der angegebenen Grenzen
	// buttonMinTop und buttonMaxTop bewegen;
	// "px" muss fuer Mozilla angehaengt werden
	if (mouseY - dy >= buttonMinTop && mouseY - dy <= buttonMaxTop) {
		objButton.style.top = (mouseY - dy) + "px";
	}	
	else if (mouseY < buttonMinTop) {
		objButton.style.top = buttonMinTop + "px";
	}
	else if (mouseY > buttonMaxTop) {
		objButton.style.top = buttonMaxTop + "px";
	}
	
	// Scrollen der Inhaltsseite
	parent.frames[contentFrameName].scrollTo(0,parseInt((parseInt(objButton.style.top) - buttonMinTop) * ratio));
	return false;
}

//------------------------------------------------------------
// Offsetpos. ermitteln und event capturing initialisieren
//------------------------------------------------------------
function startDrag(e) {	
	if (isMouseOnButton(e)) {
	// ermitteln der Offsetposition dy, da sonst der Cursor an
	// die Oberkante des Buttons geraet
	getMousePos(e);
	dy = mouseY - parseInt(objButton.style.top);
	
	// event capturing initialisieren
	if (document.layers) document.captureEvents(Event.MOUSEMOVE);
	document.onmousemove = drag;
	
	// Popup beim Mac verhindern, wenn Maustaste laenger gedrueckt
	return false;
	}
}


//------------------------------------------------------------
// Button auf Top-Position setzen, Seite auf 0-Pos scrollen
//------------------------------------------------------------
function resetButton() {		
	objButton.style.top = buttonMinTop;
	parent.scrollframe.scrollTo(0,0);
}


//------------------------------------------------------------
// nach dem Laden der Seite Regler initialisieren,
// Verhaeltniss Reglerschiebeweg zu Seitenhoehe ermitteln
// event capturing initialisieren
//------------------------------------------------------------
function init() { 
	objButton = new getObj('btn');

	if (parent.frames[contentFrameName].document.getElementById(contentDivName)) {
		ratio = (parent.frames[contentFrameName].document.getElementById(contentDivName).offsetHeight - contentFrameHeight) / buttonDistance;
	}

	resetButton();
	
	// wenn Seite hoeher ist als der Frame
	if (ratio > 0) {
		// Mausereignisse abfangen
		if (document.layers) document.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP);	// Netscape 4
		document.onmousedown = startDrag;
		document.onmouseup = endDrag;
	}
}