var preload_gr = new Object();
for(var value in vt_gr){
	preload_gr[value] = new Image();
	preload_gr[value].src = vt_gr[value];
}

var grundrissAbb = document.getElementById("vt_gr");
var ansichtAbb = document.getElementById("vt_abb");


var liTags = document.getElementById("vt_list_navi").getElementsByTagName("LI");
for (var i=0; i<liTags.length; i++) {											
	//Klick auf Links in Liste
	liTags[i].firstChild.onclick=function() {
		//ID des LI-Elements
		var type= this.parentNode.getAttribute('id');
		vt_click(type);
		return false;
	}
	//MouseOver auf Links in Liste
	liTags[i].firstChild.onmouseover=function() {
		var type= this.parentNode.getAttribute('id');
		grundrissAbb.src = preload_gr[type].src;
	}
	//MouseOut auf Links in Liste
	liTags[i].firstChild.onmouseout=function() {
		grundrissAbb.src = vt_gr[active_gr];
	}
}

var areaTags = document.getElementById("gr_map").getElementsByTagName("AREA");
for (var i=0; i<areaTags.length; i++) {											
	//Klick auf AREA-Link
	areaTags[i].onclick=function() {
		var type= this.className;
		vt_click(type);
		return false;
	}
	//MouseOver auf AREA-Links
	areaTags[i].onmouseover=function() {
		var type= this.className;
		vt_rollOver(type);
	}
	//MouseOut auf AREA-Links
	areaTags[i].onmouseout=function() {
		vt_rollOut();
	}
	
}
function vt_click(type) {
	active_gr = type;
	
	//Grundrissbild ersetzen										
	grundrissAbb.src = preload_gr[active_gr].src;
	
	//Foto ersetzen
	preload_abb = new Image();
	preload_abb.src = vt_abb[active_gr];
	ansichtAbb.src = preload_abb.src;
	
	//Aktive Klassen setzen
	setActiveElementForList(active_gr);
	
}

function vt_rollOver(type) {

	grundrissAbb.src = preload_gr[type].src;
	document.getElementById(type).firstChild.className = 'active';
}

function vt_rollOut() {
	setActiveElementForList(active_gr);
	grundrissAbb.src = preload_gr[active_gr].src;
}

function setActiveElementForList(type) {
	//alert(type);
	var liTags = document.getElementById("vt_list_navi").getElementsByTagName("LI");
	//Alle aktiven Klassen ersetzen
	for (var i=0; i<liTags.length; i++) {
		liTags[i].firstChild.className = '';
	}
	//class="active" auf aktuelles Element
	document.getElementById(type).firstChild.className = 'active';
	
}