//Globale Variablen:
var strContinentValue = '';
var strCountryValue = '';
var strStateValue = '';
var strCityValue = '';

function setParamContinent(selected){
	var buffer = document.getElementById("buffer");
	var werte = selected.split(":");
	var continentWert = document.getElementById("continent_wert");
	continentWert.setAttribute('value', werte[0]);
}
function setParamCountry(selected){
	var buffer = document.getElementById("buffer");
	var werte = selected.split(":");
	var countryWert = document.getElementById("country_wert");
	countryWert.setAttribute('value', werte[1]);
}
function setParamState(selected){
	var buffer = document.getElementById("buffer");
	var werte = selected.split(":");
	var stateWert = document.getElementById("state_wert");
	stateWert.setAttribute('value', werte[2]);
}
function setParamCity(selected){
	var buffer = document.getElementById("buffer");
	var werte = selected.split(":");
	var cityWert = document.getElementById("city_wert");
	cityWert.setAttribute('value', werte[3]);
}

function init(){
	var buffer = document.getElementById("buffer");
	var gui = document.getElementById("gui");
	var aElem;
	
	elem = buffer.firstChild;
	while(elem){
		if(elem.nodeType == 1) {
			if(elem.nodeName == "SELECT" && elem.getAttribute('id') == 'continent') {
				aElem = gui.appendChild(elem.cloneNode(true));
				aElem.id = elem.id + '_copy';
				aElem.onChange = 'changeBoxes(this.value, this)';
			}
		}
		elem = elem.nextSibling;
		
	}
	return true;
}

function clearGuiBox(){
	var gui = document.getElementById("gui");
	while(gui.hasChildNodes()){
		elem = gui.firstChild;
		gui.removeChild(elem);
	}
	return true;
}


function copySelectBox(box, currentValue){
	//Code wird ins DIV mit der id gui kopiert:
	var gui = document.getElementById("gui");
	var newSelect = createSelectBox(box);
	elem = box.firstChild;
	while(elem){
   		//Option wird kopiert aus dem Buffer:
		var newOption = elem.cloneNode(true);
		//Ausgewählter wert soll weiterhin selektiert bleiben:
		if(currentValue != "" && currentValue == newOption.value) {
			newOption.setAttribute('selected', 'selected');
		}
		//und angefügt:
   		newSelect.appendChild(newOption);
		
		//nächstes Option-Tag wird gespeichert.
		elem = elem.nextSibling;
	}	
	
	gui.appendChild(newSelect);	
	
}

function createSelectBox(box){
	var gui = document.getElementById("gui");
	var newSelect = null;
	
	if(navigator.appName == "Microsoft Internet Explorer"){
	  if(box.id == 'city') {
	    newSelect = document.createElement("<select id='" + box.id + "_copy' name='" + box.name + "' onchange='changeBoxes(this.value,this);this.form.submit()' ></select>");
	  } else {
	    newSelect = document.createElement("<select id='" + box.id + "_copy' name='" + box.name + "' onchange='changeBoxes(this.value,this)' ></select>");
	  }
	}else{
	  newSelect = document.createElement('select');
	  newSelect.setAttribute('id', box.id + '_copy');
	  newSelect.setAttribute('name',box.name);
	  newSelect.setAttribute('onchange','changeBoxes(this.value, this)');
	  if(box.id == 'city') {
		  newSelect.setAttribute('onchange', 'changeBoxes(this.value, this);this.form.submit()');
	  }
  }
  return newSelect;
}

function changeBoxes(aenderung, obj) {
	
	var stack = aenderung.split(":");
	
	//setzen der Referenzen aus dem Buffer:
	var selContinent = document.getElementById('continent');
	
	var selCountry = document.getElementById('country');
	var selCountryClone = selCountry.cloneNode(true);
	
	var selState = document.getElementById('state');
	var selStateClone = selState.cloneNode(true);
	
	var selCity = document.getElementById('city');
	var selCityClone = selCity.cloneNode(true);
	
	//Auswahl festlegen, wenn erneut ein Land
	//ausgewählt wird.:
	switchCondition = stack.length;
	if(aenderung.substring(0,7) == 'showall') {
		switchCondition = 1;
		aenderung = strContinentValue;
	}
	
	switch(switchCondition){
		case 1:
			clearGuiBox();
			strContinentValue = aenderung;
			//Wenn Das Feld Continent geändert wurde:
			copySelectBox(selContinent, aenderung);
			buildSelectBox(selCountry, "country", strContinentValue, '');
			setParamContinent(aenderung);
			setParamCountry(':');
			setParamState('::');
			setParamCity(':::');
			changeContinent(aenderung, false)
			break;
		case 2:
			clearGuiBox();
			strCountryValue = aenderung;
			//Änderung im Feld Contry
			copySelectBox(selContinent, strContinentValue);
			buildSelectBox(selCountry, 'country', strContinentValue, strCountryValue);
			buildSelectBox(selState, "state", aenderung, '');
			setParamCountry(aenderung);
			setParamState(':::');
			setParamCity(':::');
			break;
		case 3:
			clearGuiBox();
			//Änderung im Feld State
			strStateValue = aenderung;
			copySelectBox(selContinent, strContinentValue);
			buildSelectBox(selCountry, 'country', strContinentValue, strCountryValue);
			buildSelectBox(selState, 'state', strCountryValue, aenderung);
			buildSelectBox(selCity, "city", aenderung);
			setParamState(aenderung);
			break;		
		case 4:
			//Änderung im Feld City
			strCityValue = aenderung;
			//copySelectBox(selContinent, strContinentValue);
			//buildSelectBox(selCountry, 'country', strContinentValue, strCountryValue);
			//buildSelectBox(selState, 'state', strCountryValue, strStateValue);
			//buildSelectBox(selCity, "city", strStateValue, aenderung);
			setParamCity(aenderung);
			break;
	}
}



function buildSelectBox(box, name, ctrl, selected){
  var gui = document.getElementById("gui");
  var newSelect = createSelectBox(box);
	elem = box.firstChild;
	
	while(elem){
		if(elem.nodeType == 1){ // Elementknoten
			//erstes ELement mit 'showall_..." soll immer angezeigt werden:
			if(elem.value.substring(0,7) == 'showall') {
				//show all wird angezeigt:
				var newOption = elem.cloneNode(true);
			   	newSelect.appendChild(newOption);
			}
			mm = elem.getAttribute('value');
			mm2 = mm.substring(0, ctrl.length);
			if ( mm2 == ctrl ){
				var newOption = elem.cloneNode(true);
				if(selected == newOption.value) {
					newOption.setAttribute('selected', 'selected');
				}
				newSelect.appendChild(newOption);
			}
		}
		elem = elem.nextSibling;
	}
	
	gui.appendChild(newSelect);
}

/*----- THE MAP STUFF----*/
<!-- Begin

image1 = new Image;
image1.src = "fileadmin/template/img/america.gif";

image2 = new Image;
image2.src = "fileadmin/template/img/asien.gif";

image3 = new Image;
image3.src = "fileadmin/template/img/europa.gif";

image4 = new Image;
image4.src = "fileadmin/template/img/no_map.gif";

function changeContinent(continentnr, callChangeBoxes){
	
	if(callChangeBoxes == undefined) callChangeBoxes = true;
	
	var image = document.getElementById('mapmage');
	if(continentnr == 1){
		image.setAttribute("src",image1.src);
	} else if(continentnr == 2){
		image.setAttribute("src",image3.src);
	}else{
		image.setAttribute("src",image2.src);
	}
	if(callChangeBoxes) {
		changeBoxes(String(continentnr),'');
	}
}

// End -->