// Herder-Institut Marburg - Kartensammlung
// Dipl.-Ing. Marc Friede

// XML-Daten laden und ausgeben

var http = null;
var stand = "";
var kartenwerke = new Array();
var sortiert_region = 0;
var sortiert_signatur = 0;
var filter = "";
var filterbuchstaben = new Array();

// Der Internet Explorer bis Version 7 kann das Attribut class (für CSS) nicht dynamisch per JavaScript zuweisen,
// stattdessen muss hier das IE-Attribut className gesetzt werden
if (navigator.appName.indexOf("Explorer") != -1) {
	if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) {
		var ieversion = new Number(RegExp.$1)
		if (ieversion >= 8 )
			// Internet Explorer ab Version 8
			attrClass = "class";
		else if (ieversion < 8 )
			// Internet Explorer bis Version 7
			attrClass = "className";
	}
	else attrClass = "class";
} else {
	attrClass = "class";
}

if (window.XMLHttpRequest) {
	http = new XMLHttpRequest();
} else if (window.ActiveXObject) {
	http = new ActiveXObject("Microsoft.XMLHTTP");
}

window.onload = function () {   

	if (http != null) {
	//	http.open("GET", "http://www.herder-institut.de/karten/topkart/tkverz.xml", true);
		http.open("GET", "/karten/topkart/tkverz.xml", true);			
		http.onreadystatechange = einlesen;
		http.send(null);
	}
}

function inArray(array,element){

	// Wenn das uebergebene Element im uebergebenen Array enthalten ist,
	// Ueberpruefungsschleife abbrechen und true zurueckgeben, sonst false
	
	for (i=0; i<array.length; i++)
		 if (array[i] == element) return true;
	return false;
}

function kartenindex(signatur_pur){
		var url = "http://www.herder-institut.de/karten/topkart/kartenindizes.htm?"+signatur_pur;
		window.open(url, "kartenindizes", "width=1024, height=768, left=0, top=0, resizable=yes, toolbar=yes, status=yes, scrollbars=yes");
	}

function einlesen() {

	if (http.readyState == 4) {

		var xmlDoc = http.responseXML;
		var xmlkartenverz = xmlDoc.getElementsByTagName("kartenverz");
		var xmlkartenwerke = xmlDoc.getElementsByTagName("kartenwerk");
		
		// Stand des Verzeichnisses aus den XML-Daten auslesen
		if(xmlkartenverz[0].getElementsByTagName("stand")[0]){			
			stand = "Stand: " + xmlkartenverz[0].getElementsByTagName("stand")[0].firstChild.nodeValue;
		}

		// Fuer jedes Kartenwerk...
		for (var i = 0; i < xmlkartenwerke.length; i++) {
		
			// Unterarray erstellen
			kartenwerke[i] = new Array();

			// XML-Daten auslesen und in Array ablegen
			
			if(xmlkartenwerke[i].getElementsByTagName("region")[0]){			
				kartenwerke[i]["region"] = xmlkartenwerke[i].getElementsByTagName("region")[0].firstChild.nodeValue;								
				
				// Anfangsbuchstaben des Eintrages "Region" auslesen,
				// in Kleinbuchstaben umwandeln und Umlaute sowie sz ersetzen
				var region1 = kartenwerke[i]["region"].charAt(0);				
				region1 = sortTextTransform(region1);
				
				// Falls noch nicht enthalten, zum Array der Filterbuchstaben hinzufuegen
				if(!inArray(filterbuchstaben, region1)) filterbuchstaben.push(region1);
				
			} else {
				kartenwerke[i]["region"] = "";
			}
			
			if(xmlkartenwerke[i].getElementsByTagName("massstab")[0]){			
				kartenwerke[i]["massstab"] = xmlkartenwerke[i].getElementsByTagName("massstab")[0].firstChild.nodeValue;
			} else {
				kartenwerke[i]["massstab"] = "\u00a0";
			}
			
			if(xmlkartenwerke[i].getElementsByTagName("ortjahr")[0]){			
				kartenwerke[i]["ortjahr"] = xmlkartenwerke[i].getElementsByTagName("ortjahr")[0].firstChild.nodeValue;
			} else {
				kartenwerke[i]["ortjahr"] = "\u00a0";
			}
			
			if(xmlkartenwerke[i].getElementsByTagName("kartenindex")[0]) kartenwerke[i]["kartenindex"] = true;
			else kartenwerke[i]["kartenindex"] = false;
						
			if(xmlkartenwerke[i].getElementsByTagName("vorschau")[0]) kartenwerke[i]["vorschau"] = true;
			else kartenwerke[i]["vorschau"] = false;
			
			if(xmlkartenwerke[i].getElementsByTagName("signatur")[0]){			
				var signatur = xmlkartenwerke[i].getElementsByTagName("signatur")[0].firstChild.nodeValue;
				kartenwerke[i]["signatur"] = signatur;
				
				// wenn ein Kartenindex und/oder eine Vorschaugrafik exisitiert
				if(kartenwerke[i]["kartenindex"] || kartenwerke[i]["vorschau"]){
				
					// fuer den Aufruf zusaetzlich Signatur ohne Leerzeichen im Array ablegen
					var signatur_array = signatur.split(" ");
					var signatur_pur = signatur_array.join("");
					kartenwerke[i]["signatur_pur"] = signatur_pur;
				} else {
					kartenwerke[i]["signatur_pur"] = "";				
				}
			} else {
				kartenwerke[i]["signatur"] = "\u00a0";				
			}
			
			if(xmlkartenwerke[i].getElementsByTagName("titel")[0]){			
				kartenwerke[i]["titel"] = xmlkartenwerke[i].getElementsByTagName("titel")[0].firstChild.nodeValue;
			} else {
				kartenwerke[i]["titel"] = "\u00a0";
			}
			
			if(xmlkartenwerke[i].getElementsByTagName("anmerkung")[0]){			
				kartenwerke[i]["anmerkung"] = xmlkartenwerke[i].getElementsByTagName("anmerkung")[0].firstChild.nodeValue;
			} else {
				kartenwerke[i]["anmerkung"] = "\u00a0";
			}
		}

		// Steuerung des Filters erstellen
		filtersteuerung();
		
		// Liste der Kartenwerke nach dem Eintrag "Region" sortieren und ausgeben
		sortieren("region");
	}
}


function filtersteuerung() {

	// Array mit den Anfangsbuchstaben fuer die Filtersteuerung sortieren
	filterbuchstaben.sort();
	
	// DIV "filter" an Variable uebergeben
	var filter = document.getElementById("filter");

	// Fuer jeden enthaltenen Buchstaben
	for(var b = 0; b < filterbuchstaben.length; b++){
	
		var char = filterbuchstaben[b];
		var CHAR = filterbuchstaben[b].toUpperCase();
				
		// Link erzeugen
		var a_filter = document.createElement("a");		
		a_filter.setAttribute("href","javascript:filtern('"+char+"')");	
		a_filter.setAttribute("title","Nur Kartenwerke aus L\ändern/Regionen mit dem Anfangsbuchstaben '"+CHAR+"' anzeigen");				
		
		var txt_filter = document.createTextNode(CHAR);
		a_filter.appendChild(txt_filter);
		
		// Trennstrich erzeugen
		var trenner_filter = document.createTextNode("|");
		
		// Link und Trennstrich zum DIV "filter" hinzufuegen
		filter.appendChild(a_filter);
		filter.appendChild(trenner_filter);	
	}
	
	// Weiteren Link fuer die Anzeige aller Eintraege erzeugen und zum DIV "filter" hinzufuegen
	var a_filter = document.createElement("a");
	//a_filter.setAttribute("href","javascript:void(0)");
	//a_filter.setAttribute("onclick","filtern('')");
	a_filter.setAttribute("href","javascript:filtern('')");
	a_filter.setAttribute("title","Alle Kartenwerke anzeigen");
	var txt_filter = document.createTextNode("Alle");
	a_filter.appendChild(txt_filter);
	filter.appendChild(a_filter);

}

function sortTextTransform(string) {

	// String in Kleinbuchstaben umwandeln
	string = string.toLowerCase();
	
	// Umlaute und sz fuer die Sortierung durch
	// entsprechende Selbstlaute ersetzen
	string = string.replace(/\ä/g,"a");
	string = string.replace(/\ö/g,"o");
	string = string.replace(/\ü/g,"u");
	string = string.replace(/\ß/g,"s");
	
	// transformierten String zurueckgeben
	return string;
}


function sortRegion(a,b) {

	// Umlaute und sz in den zu vergleichenden Eintraegen "Region"
	// fuer eine ordnungsgemaesse Sortierung
	// mithilfe obiger Funktion ersetzen
	a_region = sortTextTransform(a["region"]);
	b_region = sortTextTransform(b["region"]);

	// Massstabszahlen der zu vergleichenden Kartenwerke ermitteln
	a_massstabszahl = a["massstab"].substr(a["massstab"].indexOf(':')+1);	// String nach dem Doppelpunkt extrahieren
	b_massstabszahl = b["massstab"].substr(b["massstab"].indexOf(':')+1);	  
	a_massstabszahl = a_massstabszahl.replace(/\s+/g,"");	// Leerzeichen sowie
	b_massstabszahl = b_massstabszahl.replace(/\s+/g,"");
	a_massstabszahl = a_massstabszahl.replace(/\./g,"");	// Tausenderpunkt entfernen und
	b_massstabszahl = b_massstabszahl.replace(/\./g,"");
	a_massstabszahl = parseInt(a_massstabszahl);			// in Integerzahl umwandeln
	b_massstabszahl = parseInt(b_massstabszahl);
	
	var index = 0; 	// entspricht a == b
	
	// Wenn die Region gleich ist, nach der Massstabszahl sortieren
	if(a_region == b_region){
	
		// Wenn die Massstabszahl auch gleich ist, nach der Signatur sortieren
		if(a_massstabszahl == b_massstabszahl){
		
			index = sortSignatur(a,b);
			
		} else {
		
			index = a_massstabszahl - b_massstabszahl;
		}
	}
	
	else if (a_region > b_region) index = 1;
	else if (a_region < b_region) index = -1;
	
	return index;	
}

function sortSignatur(a,b) {

	// Signaturen in ihre Einzelteile zerlegen
	
	// Vorangestelltes "K" steht fuer Aufbewahrung in der Kartensammlung
	// (uebrige Stuecke befinden sich in der Bibliothek)
	// Es folgt eine arabische Ziffer der Regionalen Gliederung,
	// eine roemische Ziffer der Sachlichen Grobgliederung,
	// ein Buchstabe der Sachlichen Feingliederung, dem (meist) ohne Leerzeichen
	// eine laufende Nummer nachgestellt ist

	// Signatur an Leerzeichen trennen
	var a_array = a["signatur"].split(" ");

	// Wenn das erste Zeichen von Eintrag a ein "K" ist
	if (a["signatur"].charAt(0) == "K"){	
	
		// Erstes Element ("K") entfernen
		a_array.shift();		
	
	}
	
	// Signatur an Leerzeichen trennen
	var b_array = b["signatur"].split(" ");

	// Wenn das erste Zeichen von Eintrag a ein "K" ist
	if (b["signatur"].charAt(0) == "K"){	

		// Erstes Element ("K") entfernen
		b_array.shift();		
		
	}			

	
	// Regionale Gliederung in Integerzahl umwandeln
	a_array[0] = parseInt(a_array[0]);
	b_array[0] = parseInt(b_array[0]); 
	
	// Roemische Ziffern der Sachlichen Grobzuordnung
	// in arabische Zahlen umwandeln
	switch(a_array[1]){
		case "I":		a_array[1] = 1; break;
		case "II":		a_array[1] = 2; break;
		case "III": 	a_array[1] = 3; break;
		case "IV":		a_array[1] = 4; break;
		case "V":		a_array[1] = 5; break;
		case "VI":		a_array[1] = 6; break;
		case "VII":		a_array[1] = 7; break;
		case "VIII":	a_array[1] = 8; break;
		case "IX":		a_array[1] = 9; break;
		case "X":		a_array[1] = 10; break;
		case "XI":		a_array[1] = 11; break;
		case "XII":		a_array[1] = 12; break;
		case "XIII":	a_array[1] = 13; break;
		case "XIV":		a_array[1] = 14; break;
		case "XV":		a_array[1] = 15; break;
		case "XVI":		a_array[1] = 16;		
	}
	switch(b_array[1]){
		case "I":		b_array[1] = 1; break;
		case "II":		b_array[1] = 2; break;
		case "III": 	b_array[1] = 3; break;
		case "IV":		b_array[1] = 4; break;
		case "V":		b_array[1] = 5; break;
		case "VI":		b_array[1] = 6; break;
		case "VII":		b_array[1] = 7; break;
		case "VIII":	b_array[1] = 8; break;
		case "IX":		b_array[1] = 9; break;
		case "X":		b_array[1] = 10; break;
		case "XI":		b_array[1] = 11; break;
		case "XII":		b_array[1] = 12; break;
		case "XIII":	b_array[1] = 13; break;
		case "XIV":		b_array[1] = 14; break;
		case "XV":		b_array[1] = 15; break;
		case "XVI":		b_array[1] = 16;		
	}
	
	// Wenn das Array aus 5 Elementen besteht
	// (wenn zwischen den letzten beiden Teilen ein zusaetzliches Leerzeichen war)
	if(a_array.length > 3){
	
		// 4. Element von Leerzeichen befreien und in Integerzahl umwandeln 
		a_array[3] = parseInt(a_array[3].replace(/^\s+/, '').replace(/\s+$/, ''));			
	
	} else {
	
		// Sonst
		// 3. Element in Buchstabe der Sachlichen Feingliederung
		// und laufende Nummer aufsplitten, letztere in Integerzahl umwandeln,
		// und an Array-Position 3 bzw. 4 speichern
		var char = a_array[2].slice(0,1);
		var nr = parseInt(a_array[2].slice(1));
		a_array[3] = nr;
		a_array[2] = char;	
	}
	
	// Wenn das Array aus 5 Elementen besteht
	// (wenn zwischen den letzten beiden Teilen ein zusaetzliches Leerzeichen war)
	if(b_array.length > 3){

		// 4. Element von Leerzeichen befreien und in Integerzahl umwandeln 
		b_array[3] = parseInt(b_array[3].replace(/^\s+/, '').replace(/\s+$/, ''));			

	} else {

		// Sonst
		// 3. Element in Buchstabe der Sachlichen Feingliederung
		// und laufende Nummer aufsplitten, letztere in Integerzahl umwandeln,
		// und an Array-Position 3 bzw. 4 speichern
		var char = b_array[2].slice(0,1);
		var nr = parseInt(b_array[2].slice(1));
		b_array[3] = nr;
		b_array[2] = char;	
	}	
	
			
	var index = 0;
	
	// Wenn der Regionale Zuordnung gleich ist
	if (a_array[0] == b_array[0]){		
		
		// Wenn auch die Sachliche Grobzuordnung gleich ist
		if (a_array[1] == b_array[1]){
		
			// Wenn auch die Sachliche Feinzuordnung gleich ist
			if (a_array[2] == b_array[2]){

				// nach der laufenden Nummer sortieren
				if (a_array[3] > b_array[3]) index = 1;
				else if (a_array[3] < b_array[3]) index = -1;					
			}		
			// sonst nach der Sachlichen Feinzuordnung sortieren
			else if (a_array[2] > b_array[2]) index = 1;
			else if (a_array[2] < b_array[2]) index = -1;		
		}
		// sonst nach der Sachlichen Grobzuordnung sortieren
		else if (a_array[1] > b_array[1]) index = 1;
		else if (a_array[1] < b_array[1]) index = -1;
	} 
	// sonst nach der Regionalen Zuordnung sortieren
	else if (a_array[0] > b_array[0]) index = 1;
	else if (a_array[0] < b_array[0]) index = -1;
	
	return index;
}


function sortieren(spalte) {
	
	switch(spalte){

	case 'region':

		if(sortiert_region == 1){

			// Wenn die Liste bereits aufsteigend nach der Spalte "Region" sortiert ist,
			// Reihenfolge der Eintraege umkehren und Variable setzen
			kartenwerke.reverse();
			sortiert_region = 2;

		} else {

			// sonst die Liste aufsteigend nach den Spalten "Region", "Massstab" und "Signatur" sortieren und Variable setzen
			kartenwerke.sort(sortRegion);
			sortiert_region = 1;
		}

		// Variable fuer Sortierung nach der Signatur zuruecksetzen
		sortiert_signatur = 0;

		break;

	case 'signatur':

		if(sortiert_signatur == 1){

			// Wenn die Liste bereits aufsteigend nach der Spalte "Signatur" sortiert ist,
			// Reihenfolge der Eintraege umkehren und Variable setzen
			kartenwerke.reverse();
			sortiert_signatur = 2;

		} else {

			// sonst die Liste aufsteigend nach der Spalte "Signatur" sortieren und Variable setzen
			kartenwerke.sort(sortSignatur);
			sortiert_signatur = 1;			
		}
		
		// Variable fuer Sortierung nach der Region zuruecksetzen
		sortiert_region = 0;
		
		break;	
	}
	
	
	// Liste erzeugen und darstellen
	ausgeben();
}

function ausgeben() {	

	// Rahmen-DIV erzeugen
	var div_rahmen = document.createElement("div");
	div_rahmen.setAttribute("id","listeninhalt");
	
	// Kopfzeile erzeugen	
	
	var div_kopf = document.createElement("div");
	div_kopf.setAttribute("id","kopf");
	
	var div_k_region = document.createElement("div");
	div_k_region.setAttribute("id","k_region");	
	var a_k_region = document.createElement("a");
	//a_k_region.setAttribute("href","javascript:void(0)");
	//a_k_region.setAttribute("onclick","sortieren('region')");
	a_k_region.setAttribute("href","javascript:sortieren('region')");	
	var txt_k_region = document.createTextNode("Land/Region");
	var img_k_region = document.createElement("img");	
	// Grafik gemaess der aktuellen Sortierung einfuegen
	img_k_region.setAttribute("src","/karten/topkart/graphics/sortieren"+sortiert_region+".gif");
	img_k_region.setAttribute("width","16");
	img_k_region.setAttribute("height","8");
	img_k_region.setAttribute("alt","V");
	img_k_region.setAttribute("border","0");	

	// Titeltexte gemaess der aktuellen Sortierung einfuegen
	switch(sortiert_region){
		case 0:
		case 2: a_k_region.setAttribute("title","Kartenwerke aufsteigend nach Land/Region sortieren");
				img_k_region.setAttribute("title","Kartenwerke aufsteigend nach Land/Region sortieren"); break;
		case 1: a_k_region.setAttribute("title","Kartenwerke absteigend nach Land/Region sortieren");
				img_k_region.setAttribute("title","Kartenwerke absteigend nach Land/Region sortieren"); break;
	}

	a_k_region.appendChild(txt_k_region);
	a_k_region.appendChild(img_k_region);	
	div_k_region.appendChild(a_k_region);	
	div_kopf.appendChild(div_k_region);

	var div_k_massstab = document.createElement("div");
	div_k_massstab.setAttribute("id","k_massstab");
	var txt_k_massstab = document.createTextNode("Ma\ßstab");
	div_k_massstab.appendChild(txt_k_massstab);
	div_kopf.appendChild(div_k_massstab);
	
	var div_k_ortjahr = document.createElement("div");
	div_k_ortjahr.setAttribute("id","k_ortjahr");
	var txt_k_ortjahr = document.createTextNode("Ort, Jahr");
	div_k_ortjahr.appendChild(txt_k_ortjahr);
	div_kopf.appendChild(div_k_ortjahr);
	
	var div_k_signatur = document.createElement("div");
	div_k_signatur.setAttribute("id","k_signatur");
	var a_k_signatur = document.createElement("a");
	//a_k_signatur.setAttribute("href","javascript:void(0)");
	//a_k_signatur.setAttribute("onclick","sortieren('signatur')");
	a_k_signatur.setAttribute("href","javascript:sortieren('signatur')");
	var txt_k_signatur = document.createTextNode("Signatur");
	var img_k_signatur = document.createElement("img");
	// Grafik gemaess der aktuellen Sortierung einfuegen
	img_k_signatur.setAttribute("src","/karten/topkart/graphics/sortieren"+sortiert_signatur+".gif");
	img_k_signatur.setAttribute("width","16");
	img_k_signatur.setAttribute("height","8");
	img_k_signatur.setAttribute("alt","V");
	img_k_signatur.setAttribute("border","0");	

	// Titeltexte gemaess der aktuellen Sortierung einfuegen
	switch(sortiert_signatur){
		case 0:
		case 2: a_k_signatur.setAttribute("title","Kartenwerke aufsteigend nach der Signatur sortieren");
				img_k_signatur.setAttribute("title","Kartenwerke aufsteigend nach der Signatur sortieren"); break;
		case 1: a_k_signatur.setAttribute("title","Kartenwerke absteigend nach der Signatur sortieren");
				img_k_signatur.setAttribute("title","Kartenwerke absteigend nach der Signatur sortieren"); break;
	}	

	a_k_signatur.appendChild(txt_k_signatur);
	a_k_signatur.appendChild(img_k_signatur);
	div_k_signatur.appendChild(a_k_signatur);
	div_kopf.appendChild(div_k_signatur);
	
	var div_k_titel = document.createElement("div");
	div_k_titel.setAttribute("id","k_titel");
	var txt_k_titel = document.createTextNode("Titel");
	div_k_titel.appendChild(txt_k_titel);
	div_kopf.appendChild(div_k_titel);

	var div_k_anmerkung = document.createElement("div");
	div_k_anmerkung.setAttribute("id","k_anmerkung");
	var txt_k_anmerkung = document.createTextNode("Anmerkung");
	div_k_anmerkung.appendChild(txt_k_anmerkung);
	div_kopf.appendChild(div_k_anmerkung);
	
	div_rahmen.appendChild(div_kopf);
	
	// Variable fuer laufende Nummer der aufgelisteten Kartenwerke initialisieren
	var lfdnr = 0;
		
	// Fuer jedes Kartenwerk...
	for (var i = 0; i < kartenwerke.length; i++) {
	
		// XML-Eintrag "Region" auslesen
		var xml_region = kartenwerke[i]["region"];		
	
		// Wenn ein Filter angegeben wurde
		if(filter != ""){						
			
			// Anfangsbuchstaben des Eintrages "Region" auslesen
			// und Umlaute sowie sz ersetzen
			var region1 = xml_region.charAt(0);
			region1 = sortTextTransform(region1);
			
			// Wenn der erste Buchstabe der Region nicht mit dem Filter uebereinstimmt
			if(region1 != filter){							
			
				// Zum naechsten Element der For-Schleife springen,
				// ohne einen Listeneintrag fuer dieses Kartenwerk zu erstellen
				continue;
			}
		
		}			
	
		var div_kartenwerk = document.createElement("div");		
		if(lfdnr % 2 == 1){
			div_kartenwerk.setAttribute(attrClass,"kartenwerk_ungerade");
		} else {
			div_kartenwerk.setAttribute(attrClass,"kartenwerk_gerade");
		}
		
		// DIV Zeile 1 erzeugen
		var div_zeile1 = document.createElement("div");
		div_zeile1.setAttribute(attrClass,"zeile");

		// DIV "Region" erzeugen, mit XML-Eintrag fuellen und zum Kartenwerk-DIV hinzufuegen
		var div_region = document.createElement("div");
		div_region.setAttribute(attrClass,"region");
		var txt_region = document.createTextNode(xml_region);		
		div_region.appendChild(txt_region);               
		div_zeile1.appendChild(div_region);				

		// DIV "Massstab" erzeugen, mit XML-Eintrag fuellen und zum Kartenwerk-DIV hinzufuegen
		var div_massstab = document.createElement("div");
		div_massstab.setAttribute(attrClass,"massstab");
		var xml_massstab = kartenwerke[i]["massstab"];		
		// Leerzeichen vor und nach dem Doppelpunkt in der Massstabsangabe durch geschuetzte Leerzeichen ersetzen,
		// um einen Zeilenumbruch an dieser Stelle zu unterbinden
		xml_massstab = xml_massstab.replace(/ : /g, "\u00a0:\u00a0");
		var txt_massstab = document.createTextNode(xml_massstab);
		div_massstab.appendChild(txt_massstab);               
		div_zeile1.appendChild(div_massstab);

		// DIV "OrtJahr" erzeugen, mit XML-Eintrag fuellen und zum Kartenwerk-DIV hinzufuegen
		var div_ortjahr = document.createElement("div");
		div_ortjahr.setAttribute(attrClass,"ortjahr");
		var xml_ortjahr = kartenwerke[i]["ortjahr"];
		var txt_ortjahr = document.createTextNode(xml_ortjahr);
		div_ortjahr.appendChild(txt_ortjahr);               
		div_zeile1.appendChild(div_ortjahr);

		// DIV "Signatur" erzeugen, mit XML-Eintrag fuellen und zum Kartenwerk-DIV hinzufuegen
		var div_signatur = document.createElement("div");
		div_signatur.setAttribute(attrClass,"signatur");
		var xml_signatur = kartenwerke[i]["signatur"];
		var txt_signatur = document.createTextNode(xml_signatur);
		div_signatur.appendChild(txt_signatur);               
		div_zeile1.appendChild(div_signatur);
		
		// Zeile 1 zum DIV kartenwerk hinzufuegen
		div_kartenwerk.appendChild(div_zeile1);
		
		// DIV Zeile 2 erzeugen
		var div_zeile2 = document.createElement("div");
		div_zeile2.setAttribute(attrClass,"zeile");						

		// DIV "Titel" erzeugen,
		// mit XML-Eintrag fuellen und zur Zeile 2 hinzufuegen
		var div_titel = document.createElement("div");		
		div_titel.setAttribute(attrClass,"titel");
		var xml_titel = kartenwerke[i]["titel"];		
		var txt_titel = document.createTextNode(xml_titel);
		div_titel.appendChild(txt_titel);            
		div_zeile2.appendChild(div_titel);

		// DIV Icons erzeugen und zur Zeile 2 hinzufuegen
		var div_icons = document.createElement("div");
		div_icons.setAttribute(attrClass,"icons");

		var signatur_pur = kartenwerke[i]["signatur_pur"];
		if(signatur_pur != ""){
		
			if(kartenwerke[i]["vorschau"]){
				// Icon fuer Detailvorschau setzen
				var img_overlay = document.createElement("img");
				img_overlay.setAttribute("src","/karten/topkart/graphics/vorschau.gif");
				img_overlay.setAttribute(attrClass,"vorschau");
				img_overlay.setAttribute("width","26");
				img_overlay.setAttribute("height","26");
				img_overlay.setAttribute("alt","> Detailvorschau");
				img_overlay.setAttribute("title","");
				img_overlay.setAttribute("border","0");

				if (navigator.appName.indexOf("Explorer") != -1) {	
					img_overlay.onmouseover = new Function("zeigeOverlay('"+xml_region+"', '"+xml_titel+"', '/karten/topkart/thumbnails/"+signatur_pur+"v.jpg', event)");
					img_overlay.onmouseout = new Function("verbergeOverlay()");
				} else {
					img_overlay.setAttribute("onmouseover","zeigeOverlay('"+xml_region+"', '"+xml_titel+"', '/karten/topkart/thumbnails/"+signatur_pur+"v.jpg', event)");
					img_overlay.setAttribute("onmouseout","verbergeOverlay()");
				}
				div_icons.appendChild(img_overlay);
			}
		
			if(kartenwerke[i]["kartenindex"]){
											
				if(window.opera || navigator.userAgent.indexOf("Opera")!=-1) {
					// Da die Google Maps API den Browser Opera (noch) nicht unterstuetzt,
					// Icon ohne Link und mit entsprechendem Tooltip erzeugen					
					var img_link = document.createElement("img");
					img_link.setAttribute("src","/karten/topkart/graphics/kartenindex.gif");
					img_link.setAttribute(attrClass,"index");
					img_link.setAttribute("width","26");
					img_link.setAttribute("height","26");
					img_link.setAttribute("alt","> Kartenindex");
					img_link.setAttribute("title","Die Anzeige des interaktiven Kartenindex ist mit dem Opera leider noch nicht m\öglich!");
					img_link.setAttribute("border","0");			
					div_icons.appendChild(img_link);
				} 
				else {
					// Icon fuer Kartenindex inklusive Link setzen
					var a_link = document.createElement("a");						
					//a_link.setAttribute("href","javascript:void(0)");
					//a_link.setAttribute("onclick","kartenindex('"+signatur_pur+"')");
					a_link.setAttribute("href","javascript:kartenindex('"+signatur_pur+"')");
					a_link.setAttribute("title","Interaktiven Kartenindex aufrufen");
					var img_link = document.createElement("img");
					img_link.setAttribute("src","/karten/topkart/graphics/kartenindex.gif");
					img_link.setAttribute(attrClass,"index");
					img_link.setAttribute("width","26");
					img_link.setAttribute("height","26");
					img_link.setAttribute("alt","> Kartenindex");
					img_link.setAttribute("title","Interaktiven Kartenindex aufrufen");
					img_link.setAttribute("border","0");			
					a_link.appendChild(img_link);
					div_icons.appendChild(a_link);
				}
			}
			
		} else {
			var leerz_icons = document.createTextNode("\u00A0");
			div_icons.appendChild(leerz_icons);
		}
		div_zeile2.appendChild(div_icons);

		// DIV "Anmerkung" erzeugen,
		// mit XML-Eintrag fuellen und zur Zeile 2 hinzufuegen
		var div_anmerkung = document.createElement("div");		
		div_anmerkung.setAttribute(attrClass,"anmerkung");
		var xml_anmerkung = kartenwerke[i]["anmerkung"];		
		var txt_anmerkung = document.createTextNode(xml_anmerkung);
		div_anmerkung.appendChild(txt_anmerkung);
		div_zeile2.appendChild(div_anmerkung);		

		// Zeile 2 zum DIV kartenwerk hinzufuegen
		div_kartenwerk.appendChild(div_zeile2);
		
		// Kartenwerk zum Rahmen-DIV hinzufuegen
		div_rahmen.appendChild(div_kartenwerk);
		
		// DIV mit der id=listeninhalt durch das neu erstellte ersetzen
		document.getElementById("liste").replaceChild(div_rahmen, document.getElementById("listeninhalt"));
		
		// Laufende Nummer der aufgelisteten Kartenwerke ums 1 erhoehen
		lfdnr++;				
	}
	
	// Fusszeile mit Angabe des Standes erzeugen	
		
	var div_fuss = document.createElement("div");
	div_fuss.setAttribute("id","fuss");
	var txt_stand = document.createTextNode(stand);
	div_fuss.appendChild(txt_stand);
	div_rahmen.appendChild(div_fuss);
	
	// DIV fuer Vorschaubild erzeugen
	
	var div_overlay_rahmen = document.createElement("div");
	div_overlay_rahmen.setAttribute("id","overlay_rahmen");		
	var div_overlay = document.createElement("div");
	div_overlay.setAttribute("id","overlay");	
	div_overlay_rahmen.appendChild(div_overlay);
	div_rahmen.appendChild(div_overlay_rahmen);
	
}

function filtern(char) {
	
	// uebergebenen Buchstaben zur Filterung global speichern
	filter = char;
	
	// Liste neu erzeugen und darstellen
	ausgeben();
		
}

function zeigeOverlay(region, titel, grafik_url, event) {

	// Scrollposition ermitteln
	if (navigator.appName == "Microsoft Internet Explorer"){
		var scrollX = document.documentElement.scrollLeft;
		var scrollY = document.documentElement.scrollTop;
	}
	else if (navigator.appName == "Netscape" || navigator.appName == "Opera"){
		var scrollX = window.pageXOffset;
		var scrollY = window.pageYOffset;
	}

	var overlay_rahmen = document.getElementById('overlay_rahmen')
	var overlay = document.getElementById('overlay')

	// Overlay-Container mit entsprechender Grafik fuellen	
	overlay.innerHTML = '<b>'+region+'</b><br/>'+titel+'<br/>'+'<img src="'+grafik_url+'" width="500" height="350">';
	// Position festlegen
	overlay_rahmen.style.top  = (event.clientY - 350 - 40)+scrollY+"px";
	overlay_rahmen.style.left = (event.clientX - 500 - 40)+scrollX+"px";
	// Overlay einblenden
	overlay_rahmen.style.display = 'block';
}

function verbergeOverlay() {
	document.getElementById('overlay_rahmen').style.display = "none";
}