DropDownList = function (divElement,inputElement) {
	var obj = this;
	
	this.box_active = false;
	this.open = false;
	this.stay_close = false;
	this.active_line = -1;
	
	// Unterschiedliche Modi
	this.ModeSwitch = true;
	this.ModeFilter = false;
	this.MultipleChoice = false;
	
	this.div_box = divElement;
	this.div_box.onmousedown = function() { obj.box_active = true; }
	this.div_box.onmouseout = function() { obj.linked_to.focus(); obj.box_active = false; }

	// Wir schauen die Liste durch, setzen die nötigen Eventhandler und speichern die Einträge
	var liste = this.div_box.childNodes;
	var list_count = 0;
	this.entries = new Array();
	
	for (i=0;i<liste.length;i++) {
	  if (liste[i].tagName == 'P' && liste[i].className == 'list') {
	    liste[i].onclick = function() { 
	      add_or_del_value(this.lang,obj.linked_to,obj.ModeSwitch,obj.ModeFilter);
	      if (!obj.ModeFilter && !obj.MultipleChoice) { // Wir schliessen den Auswahl Block, wenn es kein Filter und kein MultipleChoice ist
	        obj.Hide();
	        obj.stay_close = true;
	      } else {
				  obj.Update();
				} 
	      return false; 
	    }
	    liste[i].my_number = list_count;
	    liste[i].onmousemove = function() { 
	      if (obj.active_line != this.my_number) {
          if (obj.active_line >=0 && obj.active_line < obj.entries.length) obj.entries[obj.active_line].className='list';
	        obj.active_line = this.my_number;
	        this.className ='list hover'; 
	      }  
	    }
	    liste[i].onmouseout = function() { this.className ='list'; }
	    this.entries[list_count] = liste[i];
	    list_count++;
	  }
	}
	
	this.linked_to = inputElement;
	this.linked_to.setAttribute('autocomplete','off'); // Autocomplete Funktion für das Feld abschalten 
  this.linked_to.onmousedown = function() { if (!obj.ModeFilter && !obj.MultipleChoice) obj.Switch(); } // Wir schalten die Sichtbarkeit des Auswahl Blocks um, wenn es kein Filter und kein MultipleChoice ist
  this.linked_to.onfocus = function() { if (! obj.stay_close) obj.Show(); }
  this.linked_to.onblur = function() { if (! obj.box_active) obj.Hide(); }
  this.linked_to.onkeyup = function(aEvent) {
	  var myEvent = aEvent ? aEvent : window.event; 
    if (obj.open) {
      if (obj.active_line < obj.entries.length-1 && myEvent.keyCode == 40 || obj.active_line > 0 && myEvent.keyCode == 38) {
        if (obj.active_line >=0 && obj.active_line < obj.entries.length) obj.entries[obj.active_line].className='list';
        if (myEvent.keyCode == 40) {
          // Im Fall von ModeFilter müssen wir nicht einfach counter erhoehen, sondern den nächsten sichtbaren suchen
          var t = obj.active_line + 1;
          while( t < obj.entries.length && obj.entries[t].style.display == 'none') t++;
          if ( t < obj.entries.length) obj.active_line = t;
          if (obj.div_box.scrollTop + obj.div_box.offsetHeight < obj.entries[obj.active_line].offsetTop + obj.entries[obj.active_line].offsetHeight) {
            obj.div_box.scrollTop = obj.entries[obj.active_line].offsetTop + obj.entries[obj.active_line].offsetHeight - obj.div_box.offsetHeight + 4;
          }
        }
        if (myEvent.keyCode == 38) {
          // Im Fall von ModeFilter müssen wir nicht einfach counter heruntersetzen, sondern den nächsten sichtbaren suchen
          var t = obj.active_line - 1;
          while( t >= 0 && obj.entries[t].style.display == 'none') t--;
          if ( t >= 0) obj.active_line = t;
          if (obj.div_box.scrollTop > obj.entries[obj.active_line].offsetTop) {
            obj.div_box.scrollTop = obj.entries[obj.active_line].offsetTop - 4;
          }
        }
			  if (obj.active_line >=0 && obj.active_line < obj.entries.length) obj.entries[obj.active_line].className='list hover';
			}
		} else {
		  if (myEvent.keyCode == 40) {
		    obj.Show();
		    obj.active_line++;
		    obj.entries[obj.active_line].className='list hover';
		  }
		}
    if (obj.open && myEvent.keyCode == 27) {
      obj.Hide();
      return false;
    }
    obj.Update();
  }
  this.linked_to.onkeydown = function(aEvent) { 
	  var myEvent = aEvent ? aEvent : window.event; 
    if (obj.open && myEvent.keyCode == 13) {
      if (obj.active_line >=0 && obj.active_line < obj.entries.length) obj.entries[obj.active_line].onclick();
      return false;
    }
	}
  //this.linked_to.onchange = function() { if (obj.ModeFilter) obj.Show(); }

	// richtige Positionierung des dropdown-Teils
	var offsetObj = this.linked_to;
	var left = offsetObj.offsetLeft + 1;
	var top = offsetObj.offsetTop + offsetObj.offsetHeight + 1;
 	while(offsetObj.offsetParent!=null && offsetObj.offsetParent != document.body && offsetObj.offsetParent != document.documentElement) {
    left += offsetObj.offsetParent.offsetLeft;
  	top  += offsetObj.offsetParent.offsetTop;
  	offsetObj=offsetObj.offsetParent;
 	}
	this.div_box.style.top = top - 131 + 'px'; // Komische Korrektur der Berechnung für BILA-Layout
	this.div_box.style.left= left - 18 + 'px'; // Komische Korrektur der Berechnung für BILA-Layout	
}

DropDownList.prototype.SetButton = function( Button ) {
  var obj = this;
  Button.onmousedown = function() { obj.box_active = true;  }
	Button.onmouseup = function() { obj.linked_to.focus(); obj.Switch();  }
}

DropDownList.prototype.Switch = function( ) {
  if (! this.open) this.Show(); else { this.Hide();	this.stay_close = true; return false; }
}

DropDownList.prototype.Show = function( ) {
  if (this.Update()) {
		this.div_box.style.display='block';
		this.box_active = false;
		this.open = true;
		this.stay_close = false;
	}
}

DropDownList.prototype.Hide = function( value ) {
  this.div_box.style.display='none';
	this.box_active = false;
	this.open = false;
  if (this.active_line >=0 && this.active_line < this.entries.length) this.entries[this.active_line].className='list';
	this.active_line = -1;
}

DropDownList.prototype.Update = function( ) {
	// Wir schauen die Liste durch und setzen die (wenn noetig) Häckchen, oder (im Filter-Modus) eliminieren nicht notwendige
	var text = this.linked_to.value;
	var words = new Array();

	if (this.ModeFilter) words = text.split(" ");
	var count = 0;
	for (i=0;i<this.entries.length;i++) {
	  var img = null;
	  var childs = this.entries[i].childNodes;
	  for (j=0; j<childs.length;j++) {
	    if ( childs[j].tagName=="IMG" && childs[j].className=="checkbox" ) { img = childs[j]; break; }
	  }
		if (this.ModeFilter) {
		  var found = false;
		  for (j=0;j < words.length;j++) {
			  if ( words[j].length && this.entries[i].lang.toUpperCase().indexOf( words[j].toUpperCase() ) == 0 ) { found = true; break; }
		  }
			if (found) {
				this.entries[i].style.display='block'; count++;
			}	else {
				this.entries[i].style.display='none';
			}
		}
		if (img) {
			if (text.toUpperCase().search('( |^)'+this.entries[i].lang.toUpperCase()+'( |$)') != -1) {
				img.src = '/images/markierung_voll.gif';
			} else {
				img.src = '/images/markierung_leer.gif';
			}
		}	
	}
	if (this.ModeFilter) { // hier die Höhe von der Box anpassen
    if (count) {
      this.div_box.style.height = count*14 + 'px';
			this.div_box.style.display='block';
			this.box_active = false;
			this.open = true;
			this.stay_close = false;
    } else {
    	this.div_box.style.display='none';
	    this.box_active = false;
	    this.open = false;
	    this.stay_close = false;
		}
    return false;
	}
	return true;
}

function add_or_del_value(value,dst,del_flag,replace_flag) {
  if (replace_flag) {
    var caretpos = getSelectionStart(dst);
    if (caretpos == dst.value.length) {
      var word_start = dst.value.lastIndexOf(" ")+1;
      var lookup_word = dst.value.substring(word_start);
			if ( value.toUpperCase().indexOf(lookup_word.toUpperCase()) == 0 ) {
			  dst.value = dst.value.substring(0,word_start) + value;
			}
    }
  } else {
		if (dst.value.toUpperCase().search('( |^)'+value.toUpperCase()+'( |$)')==-1) {
			if (dst.value.length>0) dst.value+=' ';
			dst.value+=value;
		} else if (del_flag) {
			re = new RegExp("\"?"+value+"\"? ","i"); dst.value=dst.value.replace(re,"");
			re = new RegExp(" ?\"?"+value+"\"?","i"); dst.value=dst.value.replace(re,"");
		}
	}
}

function getSelectionStart(obj) {
  if (obj.createTextRange) {
    var r = document.selection.createRange().duplicate();
    r.moveEnd('character', obj.value.length);
    if (r.text == '') return obj.value.length; else return obj.value.lastIndexOf(r.text);
  } else {
    return obj.selectionStart;
  }	
}