/**
 * JQueryplugin
 * Wrapper für Select-, Checkbox-, Radio- Elemente.
 * Elemente werden mit einer Klasse versehen, die diesem Script beim 
 * Aufruf mit übergeben werden. 
 * Direkt Style-Angaben (Margins, Dimensionen, Align) des Original-Elements werden vorrangig übernommen.
 * Am Select-Element können optional weitere CSS-Einstellungen vorgenommen werden:
 * [Name der vergebenen Klasse]_button: Ein Button-Image kann als Hintergrundbild mit abgegeben werden.
 * [Name der vergebenen Klasse] li: Die einzelnen Listeneinträge im Menue werden in dieser Klasse eingestellt.
 * 
 * ------Aufruf-Beispiel:
 * 
 * jQuery(document).ready(function(){
 * 		jQuery(this).FEWrapper('aukKatSearch,aukSearchChk,aukSearchRadio');
 * });
 *	
 * ------Styling-Beispiel: Selectelement
 * 
 * .aukKatSearch {
 * 		border: 1px solid #187AC0;
 *		width:190px; 
 *		height:18px;			
 *		background: url(/img/m/dropDownBg.gif) repeat-x #fff;
 *		color: #000;
 * 		padding: 0 4px;
 *		font-size: 11px;
 *		cursor:pointer;
 *		visibility:hidden;
 * }
 * 
 * .aukKatSearch_button {
 *		background: url(/img/m/dropDownBut18.gif) no-repeat right center;
 * }
 * 
 * .aukKatSearch li {
 * 		background: url(/img/detailseite/dot.gif) no-repeat 0 4px;
 *		padding-left:10px;
 * }
 * 
 * .aukKatSearch li:hover {
 *		background-color: #ddd;
 * }
 * 
 * ------Styling-Beispiel: Checkbox-Element
 * 
 * .aukSearchChk{
 *	background: url(/img/btform/chkBox16_off.gif);
 *	width:16px;
 *	height:16px;
 *	visibility:hidden;
 * }
 * ------Styling-Beispiel: Radio-Element
 * 
 * .aukSearchRadio{
 *	background: url(/img/btform/radio16_off.gif);
 *	width:16px;
 *	height:16px;
 *	visibility:hidden;
 * }
 * 
 * (c)2009 trisinus
 * 
 */
jQuery.noConflict();
(function(jQuery){
	jQuery.fn.FEWrapper= function(classesStr)
	{
		init();
		
		function init()
		{
			if(classesStr==null) return;
			
			// inlineBlock Hack füe IE kleiner 8
			jQuery('head').prepend('<!--[if lt IE 8]><style type="text/css">.inlineBlock{display:inline}</style><![endif]-->');
			jQuery('head').prepend('<style type="text/css">.inlineBlock{display:inline-block}</style>');

			var classes= classesStr.split(',');
			for(var t=0;t<classes.length;t++)
			{
				classes[t]= classes[t].replace(/ /g, "");
				var tmp= jQuery('.'+classes[t]);
				if(tmp==null || tmp.get(0)==null) continue;

				switch(tmp.get(0).nodeName)
				{
					case 'SELECT': buildDropDown(classes[t]);
						break;
					case 'INPUT': var tmp2= tmp.attr('type');
						if(tmp2=='checkbox') buildChkBox(classes[t]);
						else if(tmp2=='radio') buildRadio(classes[t]);
						break;
				}
			}
		}
		
		// -------------------------------- selectwrapper ----------------------------------
		
		function buildDropDown(selectorClass)
		{				
			// Einstellungen	
			var animSpeed= 'fast';		
			// Menu-Basiseinstellungen
			var menuStyles= {
					'overflow': 'auto',
					'background-image': 'none',
					'padding-top': '2px',
					'visibility': 'visible'
			};
			
			// Stati der einzelnen neuen Selectoren
			var dontClose= false;
			var expanded= new Array();			
			var menus= new Array(); // die Menus der neuen Selectoren
			// Event für alle Selectoren: alle Menus einklappen
			jQuery(document).click(function(){onEmptyClick(jQuery(this))});
			
			var sels= jQuery("select."+selectorClass); // die alten Selectoren
			
			for(var t=0;t<sels.length;t++)
			{
				expanded[t]= false;
				var sel= jQuery(sels[t]);
				var contId= selectorClass+'_cont_'+t;
				var selId= selectorClass+'_sel_'+t;
				var butId= selectorClass+'_but_'+t;
				var menuId= selectorClass+'_menu_'+t;
				var options= sel.find('option');

				// Container
				sel.after("<div id=\""+contId+"\" ></div>").hide();
				var container= jQuery('#'+contId);

				// Selectordiv in Container einfügen			
				container.append('<div id="'+selId+'" style=\"position:absolute\"></div>');
				var newSel= jQuery('#'+selId);	
				newSel.addClass(selectorClass);
				
				
				// Dims aus style des alten SelectorsselectorClass oder, wenn nicht vorhanden,
				// aus class des neuen Selectors.
				if(sel.css('width')=='auto') 
				{					
					if(parseFloat(newSel.css('width'))==0) newSel.css('width', '150px'); 
				}
				else newSel.css('width',sel.css('width'));
				
				if(sel.css('height')=='auto') 
				{					
					if(parseFloat(newSel.css('height'))==0) newSel.css('height', '20px'); 
				}
				else newSel.css('height',sel.css('height')); 
				
					
				// Anpassen der Dimensionen (angegebene Dimensionen immer Aussen)
				var innerW= parseFloat(newSel.css('padding-left'))
				+parseFloat(newSel.css('padding-right'));
				+parseFloat(newSel.css('border-left-width'))
				+parseFloat(newSel.css('border-right-width'));
				if(innerW>0) newSel.width(newSel.width()-innerW);
				
				var innerH= parseFloat(newSel.css('padding-top'))
				+parseFloat(newSel.css('padding-bottom'))
				+parseFloat(newSel.css('border-top-width'))
				+parseFloat(newSel.css('border-bottom-width'));
				if(innerH>0) newSel.height(newSel.height()-innerH);

				// NewSelector Basiseinstellungen
				newSel.css('line-height', newSel.height()+'px');
				newSel.css('z-index', 2+10*(sels.length-t));
				newSel.css('visibility', 'visible');									
				newSel.html(sel.find('option:selected').text());
						
				// Basiseinstellungen Container (Übernahme der originalen Margins des alten Selectors)
				container.width(newSel.innerWidth()).height(newSel.innerHeight());
				processBaseStyles(sel, container);

				// Button-Div über den Selector legen			
				newSel.after('<div id="'+butId+'" style=\"position:absolute\"></div>');
				var newSelBut= newSel.next();
				var linW= parseFloat(newSel.css('border-right-width'));
				newSelBut.css('z-index', 3+10*(sels.length-t));
				newSelBut.width(newSel.outerWidth()-linW).height(newSel.outerHeight());
				newSelBut.addClass(selectorClass+'_button');

				// Menu-Div an Selector-Div anhängen			
				container.prepend("<div id=\""+menuId+"\" style=\"position:absolute\"></div>");
				menus[t]= jQuery('#'+menuId);
				var fSize= parseFloat(newSel.css('font-size'));
				var mLineHeight= fSize*1.3;
				var mHeight= mLineHeight*options.length;
				if(mHeight>150) mHeight= 150;
				menus[t].addClass(selectorClass);	
				menus[t].css(menuStyles);	
				menus[t].css('margin-top',newSel.height()+'px');
				menus[t].css('line-height', mLineHeight+'px');
				menus[t].css('height',mHeight+'px');
				menus[t].css('z-index', 1+10*(sels.length-t));	
				menus[t].css('width',newSel.css('width'));
				menus[t].hide();
				menus[t].html(createOpts(options));			

				// Events			
				newSelBut.click(function(){onSelClick(jQuery(this))});							
				jQuery('#'+menuId+' li').click(function(){onItemClick(jQuery(this))});
			}
		
			// ------------------------------- options 
		
			function createOpts(opts)
			{
				if(opts==null) return "";

				var ret= "<ul style=\"list-style:none;list-style-image:none;margin:0;padding:0\">";
				for(var t2=0;t2<opts.length;t2++)
					ret+= "<li class=\"optinx"+t2+"\">"+options[t2].text+"</li>";
				ret+= "</ul>";
				return ret;
			}

			// ------------------------ event-handler 
			
			function onSelClick(who)
			{	
				var inx= who.attr('id');
				inx= inx.substring(inx.lastIndexOf("_")+1);

				if(expanded[inx]) 
				{
					menus[inx].slideUp(animSpeed);
					expanded[inx]= false;
					return;
				}
				dontClose= true;
				for(var p=0;p<expanded.length;p++) if(expanded[p]) menus[p].slideUp(animSpeed);
				menus[inx].slideDown(animSpeed);
				expanded[inx]= true;
			}

			function onItemClick(item)
			{
				var selec;
				var inx;
				for(var r=0; r<expanded.length;r++)
					if(expanded[r]) inx= r;

				selec= selectorClass+'_sel_'+inx;
				jQuery('#'+selec).html(item.html());
				var optinx= item.attr('class');
				optinx= optinx.substring(6);
				var opts= jQuery(sels[inx]).find('option');
				opts[optinx].selected= true;
				jQuery(sels[inx]).val(opts[optinx].value).change();
			}
		
			function onEmptyClick(who)
			{
				if(dontClose)
				{
					dontClose= false;
					return;
				}
				dontClose= false;
				for(var i=0;i<expanded.length;i++)
				{			
					if(!expanded[i]) continue;
					expanded[i]= false;
					menus[i].slideUp(animSpeed);
				}
			}
		}
				
		// ---------------------------------- checkboxwrapper --------------------------------
		
		function buildChkBox(className)
		{
			var chks= jQuery("input:checkbox."+className); // die alten Checkboxen
			//jQuery("div."+className).each(function(){chks[c++]= jQuery(this).css('display','none').prev('input');});
			
			for(var t=0;t<chks.length;t++)
			{		
				var chk= jQuery(chks[t]);
				var chkId= className+'_chk_'+t;
				chk.after("<div id=\""+chkId+"\" ></div>").hide();
				var newChk= jQuery('#'+chkId);								
				newChk.addClass(className);	
				processBaseStyles(chk, newChk);				
				var imgOff= newChk.css('background-image');
				var i= imgOff.lastIndexOf('_off.');
				var imgOn= imgOff.substring(0,i)+'_on.'+imgOff.substring(i+5);	
				if(chk.attr('checked')) newChk.css('background-image',imgOn);				
				newChk.click(function(){onChkClick(jQuery(this))});		
			}	
		
			function onChkClick(chk)
			{
				var inx= chk.attr('id');
				inx= inx.substring(inx.lastIndexOf("_")+1);
				chks[inx].checked= !chks[inx].checked;
				if(chks[inx].checked) chk.css('background-image', imgOn);
				else chk.css('background-image', imgOff);
			}
		}
		
		// ---------------------------------- RadioButtons --------------------------------
		
		function buildRadio(className)
		{
			var radios= jQuery("input:radio."+className); // die alten Radios
			//jQuery("div."+className).each(function(){radios[c++]= jQuery(this).css('display','none').prev('input');});
			
			for(var t=0;t<radios.length;t++)
			{		
				var radio= jQuery(radios[t]);
				var radioId= className+'_radio_'+t;
				radio.after("<div id=\""+radioId+"\" ></div>").hide();
				var newRadio= jQuery('#'+radioId);								
				newRadio.addClass(className);	
				processBaseStyles(radio, newRadio);				
				var imgOff= newRadio.css('background-image');
				var i= imgOff.lastIndexOf('_off.');
				var imgOn= imgOff.substring(0,i)+'_on.'+imgOff.substring(i+5);	
				if(radio.attr('checked')) newRadio.css('background-image',imgOn);
				newRadio.click(function(){onRadioClick(jQuery(this))});		
			}	
		
			function onRadioClick(radio)
			{
				for(var tt=0;tt<radios.length;tt++) // alle Radios zurücksetzen
				{
					jQuery(radios[tt]).checked= false;
					jQuery('#'+className+'_radio_'+tt).css('background-image',imgOff);
				}
				
				var inx= radio.attr('id');
				inx= inx.substring(inx.lastIndexOf("_")+1);
				radios[inx].checked= !radios[inx].checked;
				if(radios[inx].checked) radio.css('background-image', imgOn);
				else radio.css('background-image', imgOff);
			}
		}
		
		// ----------------------------------- util --------------------------------------
		
		/**
		 * überträgt margins und aligns der original-Elemente und
		 * setzt visibility und display.
		 */
		function processBaseStyles(element, wrapper)
		{			
			wrapper.css('margin-right',element.css('margin-right'));
			wrapper.css('margin-left',element.css('margin-left'));
			wrapper.css('margin-top',element.css('margin-top'));
			wrapper.css('margin-bottom',element.css('margin-bottom'));
			wrapper.css('vertical-align',element.css('vertical-align'));
			wrapper.css('text-align',element.css('text-align'));
			wrapper.css('visibility','visible');
			wrapper.addClass('inlineBlock');
		}
	}
})
(jQuery);