<!--
/***********************************************************************************
  *	menu.js
  * 
  *	JavaScript-Funktionen zur Steuerung des Menues
  *	
  * (c) 2004 Gerhard Buchecker, www.lemontree.at
  *
  *********************************************************************************/

/*--------------------------------------------------------------------------------*/
/* Initialisierung der Elemente und Positionen */

var smallWidth= 1050, smallHeight= 47;	// Breite und Hoehe der kleinen Grafik
var smallLeft= 0, smallTop = 10;			// Position der kleinen Grafik
var smallName= "balken.kl.jpg";			// Dateiname der kleinen Grafik
var largeName= "balken.m.jpg";			// Dateiname der grossen Grafik
var zoom = 1.5;   // Jeder Faktor ist moeglich, wenn Breite und Hoehe der grossen und kleinen Grafik im gleichen Verhaeltnis referenziert werden

var lensWidth = 200, lensHeight= 80;	// Breite und Hoehe der Lupe
var korrekturLupenposition = -10;

				
var root = "/pages/";		// Verzeichnis von der Hauptebene der Website zum Ordner mit den Unterseiten
var menuItems = new Array();
menuItems[0] = new Array("200", "index.html", 10);	// Format: Array(<Breite des Hotspots in px>, <href>, <linke Endposition der Lupe in px>)
menuItems[1] = new Array("75", "pages/person.html", 180);
menuItems[2] = new Array("90", "pages/kunden.html", 260);
menuItems[3] = new Array("160", "pages/arbeit.html", 360);
menuItems[4] = new Array("105", "pages/moderationen.html", 520);
menuItems[5] = new Array("150", "pages/vortraege.html", 650);
menuItems[6] = new Array("80", "pages/kontakt.html", 760);
menuItems[7] = new Array("55", "pages/presse.html", 840);
menuItems[8] = new Array("50", "pages/links.html", 930);

/*--------------------------------------------------------------------------------*/

var ie = document.all?1:0;
var w3c = document.getElementById?1:0;
var ns4 = document.layers?1:0;

var lens = null;
var menu = null;
var lupe = null;	// Ebene mit Rand und Position der Lupe
var X, Y;			// Positionen des Ausschnittes des Lupenbildes innerhalb der kleinen Grafik
var leftClip, topClip, rightClip, bottomClip;
var posX = 0;
var posY = 0;
var endPos;

function init(id) {

	endPos = getEndPos();
	
	if (document.layers) {
		lupe = document.divLupe;
		lens = document.divLupeImage;
		menu = document.divMenuimage;
		lupe.top = parseInt(menu.top) - (lensHeight / 4) + korrekturLupenposition;	// obere Position der Lupe
		lens.top = parseInt(menu.top) - (lensHeight / 20) + korrekturLupenposition;	// obere Position des Lupenbildes
	} else if (document.getElementById) {
		lupe = document.getElementById("divLupe").style;
		lens = document.getElementById("divLupeImage").style;
		menu = document.getElementById("divMenuimage").style;
		lupe.top = parseInt(menu.top) - (lensHeight / 4) + korrekturLupenposition + "px";	// obere Position der Lupe
		lens.top = parseInt(menu.top) - (lensHeight / 20) + korrekturLupenposition + "px";	// obere Position des Lupenbildes
	} else {
		lupe = divLupe.style;
		lens = divLupeImage.style;
		menu = divMenuimage.style;
		lupe.top = parseInt(menu.top) - (lensHeight / 4) + korrekturLupenposition + "px";	// obere Position der Lupe
		lens.top = parseInt(menu.top) - (lensHeight / 20) + korrekturLupenposition + "px";	// obere Position des Lupenbildes
	}
	
	// Opera ab Version 7 ermitteln - unabhaengig von der eingestellten Identifizierung
	if((window.opera) && !(navigator.userAgent.indexOf("7")!=-1)) {
		alert("Die divLupe funktioniert leider erst mit Opera 7.");
		return;
	}
	
	// Abfrage und Festlegung der Ausgangsposition
	posX = parseInt(lupe.left);
	cut();
}

function getEndPos() {
	var endPos = new Array();
	
	for (i=0; i<menuItems.length; i++) {
		endPos[i] = menuItems[i][2];
	}	

	return endPos;
}

/*--------------------------------------------------------------------------------*/
/* loest je nach Position der Lupe und nach gewuenschter Endposition die 
 * entsprechende Funktion aus */
 
 // id ist die Nummer des anzusteuernden Menuepunktes
 
 function move(id) {
	
	if (lupe != null) {
		currentPos = parseInt(lupe.left);
		
		if (currentPos < endPos[id]) {
			moveRight(id);
		}
		if (currentPos > endPos[id]) {
			moveLeft(id);
		}
	}
 }
 
/*--------------------------------------------------------------------------------*/
/* Steuerung der Bewegung der Lupe */

// id ist die Nummer des anzusteuernden Menuepunktes

function moveRight(id) {
	currentPos = parseInt(lupe.left);
	
	if (currentPos < endPos[id]) {
		var distanceBegin = currentPos - beginPos; // Abstand der Lupe von der Istposition zur Ausgangsposition
		var distanceEnd = endPos[id] - currentPos; // Abstand der Lupe vom Iststand zur Zielposition
		if (distanceBegin <= 100) {
			var speed = getSpeed(distanceBegin);
		} else {
			var speed = getSpeed(distanceEnd);
		}
	
		lupe.left = (currentPos + speed);
		posX = (currentPos + speed);
		cut();
		
		timer = setTimeout('moveRight(' + id + ')', 10);
	}
}

/*--------------------------------------------------------------------------------*/
/* Steuerung der Linksbewegung der Lupe */

// id ist die Nummer des anzusteuernden Menuepunktes

function moveLeft(id) {
	currentPos = parseInt(lupe.left);
	if (currentPos > endPos[id]) {
		var distanceBegin = beginPos - currentPos;	// Abstand der Lupe von der Ausgangsposition zur Istposition
		var distanceEnd = currentPos - endPos[id]; // Abstand der Lupe vom Iststand zur Zielposition
		if (distanceBegin <= 100) {
			var speed = getSpeed(distanceBegin);
		} else {
			var speed = getSpeed(distanceEnd);
		}
		
		lupe.left = (currentPos - speed);
		posX = (currentPos + speed);
		cut();
		
		timer = setTimeout('moveLeft(' + id + ')', 1);
	}
}

/*--------------------------------------------------------------------------------*/
/* stellt die Schrittweite der Links- bzw. Rechtsbewegung der Lupe in Pixel 
 * in Abhaengigkeit von der Differenz zwischen Ist- und Zielposition der Lupe ein */
 
 // distanceEnd ist die Differenz zwischen Ist- und Zielposition der Lupe als POSITIVE Integer
 
 function getSpeed(distance) {
	// Einstellung von 'speed' je nach Position der Lupe => Abbremsefekt
	if (distance < 10) {
		speed = 1;
	} else if (distance < 25) {
		speed = 2;
	} else if (distance < 50) {
		speed = 5;
	} else if (distance < 100) {
		speed = 10;
	} else {
		speed = 30;
	}
	return speed;
}

/*--------------------------------------------------------------------------------*/
/* setzt die Anfangsposition einer Bewegung in die Variable 'beginPos' */

var beginPos;

function setBeginPos() {
	beginPos = parseInt(lupe.left);
}

/*--------------------------------------------------------------------------------*/
/* loescht eine gesetzten Timer und stoppt damit die aktuelle Bewegung */

function clearTimer() {
	if(window.timer){
		clearTimeout(timer);
	}
}

/*--------------------------------------------------------------------------------*/
/* Steuerung der Lupe */


function cut() { // Clipping und Verschieben der grossen Grafik

	X = Math.round(posX * zoom);
	Y = Math.round(posY * zoom);
	
	// Clipping-Werte fuer die grosse Grafik
	leftClip = X;
	topClip = Y;
	rightClip = X + lensWidth;
	bottomClip = Y + lensHeight;

	lens.visibility = "visible";   // Grosse Grafik sichtbar machen

	if(ie||w3c) { // Fuer IE 5+, Mozilla, Netscape 6+ und Opera 7

		// Clipping
		lens.clip="rect(" + topClip + "px " + rightClip +"px "+ bottomClip +"px "+ leftClip +"px)";

		// Grosse Grafik entsprechend der Mausposition verschieben
		lens.left = smallLeft - posX*(zoom-1) +"px";
	
	} else if(ns4) { // Fuer NS 4

		lens.clip.left = leftClip;		// Clipping
		lens.clip.top = topClip;
		lens.clip.right = rightClip;
		lens.clip.bottom = bottomClip;

		// Grosse Grafik entsprechend der Mausposition verschieben
		lens.left = smallLeft - mouseX*(zoom-1);
	}
}

/*--------------------------------------------------------------------------------*/
/* Ausgabe des Menues */

function getMenue() {
	
	var path = (self.location.href.indexOf(root) > -1) ? "../" : "";
	
	var d = document;
	d.writeln('<div id="divSteuerung" style="position:absolute; left:' + menuItems[0][2] + 'px; top:35px; visibility:visible; z-index:5;">');
		d.writeln('<table border="0" cellspacing="0" cellpadding="0">');
		d.writeln('<tr>');
		
		var idAktive = 0;	// Arrayindex des aktiven Menuepunktes
		for (i=0; i<menuItems.length; i++) {
			if (parent.location.href.indexOf(menuItems[i][1]) > -1) idAktive = i;
		}
		
		for (i=0; i<menuItems.length; i++) {
			d.writeln('<td width="' + menuItems[i][0] + '" align="left"><a href="' + path + menuItems[i][1] + '" target="_parent" onMouseOver="clearTimer(); move(' + i + ');" onMouseOut="clearTimer(); move(' + idAktive + ');"><img src="' + path + 'images/spacer.gif" alt="" width="' + menuItems[i][0] + '" height="65" border="0"></a></td>');
		}
		
		d.writeln('</tr>');
		d.writeln('</table>');
	d.writeln('</div>');
	
	d.writeln('<div id="divLupe" style="position:absolute; left:' + menuItems[idAktive][2] + '; top:23; visibility:visible; z-index:4; border: 1px solid #000000">');
		d.writeln('<img src="' + path + 'images/spacer.gif" alt="" width="' + lensWidth + '" height="' + lensHeight + '" border="0">');
	d.writeln('</div>');
	
	d.writeln('<div id="divLupeImage" style="position:absolute; left:' + menuItems[idAktive][2] + '; top:23; visibility:hidden; z-index:3;">');
		d.writeln('<img src="' + path + 'images/' + largeName + '" alt="" width="' + Math.round(smallWidth * zoom) + '" height="' + Math.round(smallHeight * zoom) + '" border="0">');
	d.writeln('</div>');
	
	d.writeln('<div id="divMenuimage" style="position:absolute; left:0px; top:53px; z-index:1;">');
		d.writeln('<img src="' + path + 'images/' + smallName + '" alt="" width="' + smallWidth + '" height="' + smallHeight + '" border="0">');
	d.writeln('</div>');
}

/*--------------------------------------------------------------------------------*/

