window.addEvent('domready', function(){
	// Checkboxen
	$$('input[type=checkbox]').each(function (el){
		el.addClass('unvisible');
		var img = new Element('img', {'class': 'js-checkbox'});
		if (el.checked){
			img.setProperty('src', $('webhost').value+'/public/images/screen/checkbox_activated_btn.gif');
		} else {
			img.setProperty('src', $('webhost').value+'/public/images/screen/checkbox_btn.gif');
		}
		img.inject(el, 'after');
		img.addEvents({
			mouseup: function (){
				if (el.checked){
					el.checked = false;
					el.getNext().setProperty('src', $('webhost').value+'/public/images/screen/checkbox_btn.gif');
				} else {
					el.checked = true;
					el.getNext().setProperty('src', $('webhost').value+'/public/images/screen/checkbox_activated_btn.gif');
				}
			}
		})
	})
	// Radio-Buttons
	$$('input[type=radio]').each(function (el){
		el.addClass('unvisible');
		var parent = el.getParent();
		var label = parent.getElement('label[for='+el.get('id')+']');
		if (!label.hasClass('activated')){
			label.addClass('deactivated');
		}
		label.addEvents({
			mouseup: function (){
					$$('label[type=radio]').each(function (label){
						label.removeClass('activated');
						label.addClass('deactivated');
					})
					this.removeClass('deactivated');
					this.addClass('activated');
				}
			}
		)
	})
	// Dropdown-Listen
	if (!Browser.Engine.presto && !Browser.Engine.webkit) { // Opera und Safari ausschließen
		$$('select').each(function(select){
			select.addClass('unvisible');
			var container = select.getNext();
			container.removeClass('hide');
			// Hintergrundbild der Liste
			var background = select.getStyle('backgroundImage');
			// Größe und Position
			var coordinates = select.getCoordinates();
			// das Handle der Popup-Liste
			var handle = container.getElement('.dropdown-handle');
			handle.setStyles({
				background: background + ' no-repeat',
				height: coordinates.height
			})
			handle.set('html', '<span>' + select[select.selectedIndex].text + '</span>');
			// der Container für die Popup-Liste
			var list = container.getElement('.dropdown-list');
			list.setStyles({
				width: coordinates.width - 2
			})
			// das Listen-Element
			var listUl = new Element('ul');
			// alle Einträge des Select-Menüs
			var htmlOptions = select.getElements('option');
			var index = 0;
			htmlOptions.each(function(option){
				// Listeneintrag
				var htmlListEntry = new Element('li', {
					'index': index
				});
				// Events
				htmlListEntry.addEvents({
					mouseenter: function(){
						this.addClass('hover')
					},
					mouseleave: function(){
						this.removeClass('hover')
					},
					mouseup: function(){
						select.selectedIndex = this.getProperty('index');
						list.setStyles({
							display: 'none'
						})
						handle.set('html', '<span>' + this.get('html') + '</span>');
						this.removeClass('hover');
						// damit "Weiterempfehlen" funktioniert
						if ($defined($('template'))) {
							$('message').set('text', $(option.value).value);
						}
					}
				})
				var htmlSpan = new Element('span');
				htmlSpan.set('html', option.get('html'));
				//htmlListEntry.set('html', option.get('html'));
				htmlSpan.inject(htmlListEntry);
				if(option.get('value') != '-'){
					htmlListEntry.inject(listUl);
				}
				index++;
			})
			listUl.inject(list);
			listUl.setStyles({
				padding: '5px',
				margin: '5px'
			})
			// Events
			handle.addEvents({
				mouseup: function(){
					list.setStyles({
						display: 'block'
					})
					//list.fade('in')
				},
				mouseleave: function(){
					//list.fade('out')
					list.setStyles({
						//display: 'none'
					})
				}
			})
			// schließt die Liste
			container.addEvents({
				mouseleave: function(){
					list.setStyles({
						display: 'none'
					})
				}
			})
		})
	}
});