/* 
      + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
      +
      +  DESIGN © BY
      +  www.jentzschdesign.com
      +  Hartmut Jentzsch
      +  Burggraben 1
      +  D-53359 Rheinbach
      +  http://www.jentzschdesign.com
      +
      +  CODE © BY
      +  www.jentzschdesign.com
      +  Christoph Becker
      +
      + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
 */





var anzeige,
ImageHeight = 105,													//Hier muss die Bildhöhe angegeben werden, damit die Bildumkehrung am Fensterende erreicht wird.
ImagePath = "http://www.seniorenland.com/out/oxbaseshop/html/0/dyn_images/0/",		//Hier gehört der Pfad zu den Bildern der Vergrößerung hin. Bitte aktivieren und Überprüfen!!!!!
spalten = "col1, col2",								//hier werden die zu berücksichtigten DIV's mit ihrer ID angegeben, mehrere div-ID's mit "," trennen
browser,
akt_img = null,
id_path = new Array(),												//das Array, das die Image-IDs und die Pfade der auf der Seite dargestellten Bilder enthält
scrll_x, scrll_y,
posX, posY;																//beinhaltet die koordinaten des Mauszeigers


function init() {			
	var searchImages, i;
	
	document.onmousemove = MouseMove;
	anzeige = document.getElementById("anzeige").style;
	
	browser = Browser();
	
	if(spalten.indexOf("," != -1)) {
		var searchDiv = spalten.split(", ");
		for(i = 0; i < searchDiv.length; i++) {
			var div_tag = document.getElementById(searchDiv[i]);
			setEvent(div_tag);
		}
	}
	else {
		var div_tag = document.getElementById(spalten);
		setEvent(div_tag);
	}
}

function Browser() {
	var n = navigator.userAgent.toLowerCase(), nv = navigator.appVersion;
	
	if(n.indexOf("msie") != -1) {
		return "IE";
	}
	else if(n.indexOf("opera") != -1) {
		return "OP";
	}
}

function setEvent(div_id) {
	for(i = 0; (searchImages = div_id.getElementsByTagName("img")[i]); i++) {
		if(searchImages.getAttribute("src").indexOf("_ico") != -1) {
			var getId = extractID(searchImages.getAttribute("src"));
			id_path[getId] = ImagePath;															//die Image-ID und der Pfad werden in einem Array gespeichert (Entlastung des Clients)
			
			searchImages.id = getId;																//die Image-ID wird hier festgelegt (wichtig für die Funktionalität)
			searchImages.onmouseover = function() { MouseOver(this.id); }				//es wir das onmouseover Event an das Image Element gesetzt
			searchImages.onmouseout = function() { MouseOut(); }							//das selbe wird auch mit dem onmousout Event gemacht
		}
	}
}

function MouseOver(id) {
		akt_img = document.getElementById(id);						//legt das momentan aktive Objekt fest durch die übergebene Image-ID
		setImage = id.replace(/ico/, "th");							//ersetzt wird die Endung des Dateinamens durch die Endung die bei der größeren Variante gegeben ist
		imageData = setImageData(id_path[id], setImage);		//schreibt den Imagepfad in die Imagesource des DIV Contaiers
		anzeige.visibility = "visible";
}

function MouseOut() {
	anzeige.visibility = "hidden";
	document.getElementById("grossbild").src = "";
	akt_img = null;																//setzt das aktive Objekt zurück
}

function MouseMove(event) {
	var pos_y;
	
	posX = document.all ? window.event.clientX : event.pageX;
	posY = document.all ? window.event.clientY : event.pageY;

	if(akt_img != null) {														//Hier startet die Bewegung des DIV-Containers
		if(browser == "IE" || browser == "OP") {
			scrll_x = document.documentElement.scrollLeft;
			scrll_y = document.documentElement.scrollTop;
					
			if(browser == "IE") {
				wHeight = document.documentElement.clientHeight;
				if(wHeight < (posY + ImageHeight)) {
					pos_y = posY - ImageHeight + scrll_y;
				}
				else {
					pos_y = posY + scrll_y;
				}
			}
			
			if(browser == "OP") {
				wHeight = window.innerHeight;
				if(wHeight < (posY + ImageHeight)) {
					pos_y = posY - ImageHeight + scrll_y;
				}
				else {
					pos_y = posY + scrll_y;
				}
			}
		}
		else {
			scrll_x = 0;
			scrll_y = window.pageYOffset;
			
			wHeight = window.innerHeight;
			if(wHeight < (posY + ImageHeight - scrll_y)) {
				pos_y = posY - ImageHeight
			}
			else {
				pos_y = posY;
			}
		}

		anzeige.left = (posX + 4 + scrll_x) + "px";
		anzeige.top = pos_y + "px";
	}
}

function setImageData(Path, id) {
	document.getElementById("grossbild").src = Path + id + ".jpg";
}

function extractID(src) {														//Hier wird aus dem Pfad der Dateiname extrahiert, der auch als Image-ID dient
	var lastPos = src.lastIndexOf("/") + 1;
	
	var imgFile = src.lastIndexOf(".");
	var id = src.substring(lastPos, imgFile);
	
	return id;
}