rsDropdown = Ext.extend(Object,  {
	element:0,
	param: {},
	open: 0,
	css:'',
	selected:-1,
	fnItemOver: function(e) {Ext.get(this.id).addClass("rs-dropdown-list-item-hover");},
	fnItemOut: function(e) {Ext.get(this.id).removeClass("rs-dropdown-list-item-hover");},

	setSelection: function(value) {
		var index = 0;
		var id=this.param.id;
		var sel = Ext.get(id+'-select');
		Ext.each(this.param.data,function(e,i) {
			if(e.value==value) {
				Ext.each(sel.dom.options,function(x,ix) {if(x.value==e.value) sel.dom.selectedIndex=ix;});
				Ext.get(id+'-dropdown-selected').dom.innerHTML = e.text;
				Ext.get(id+'-dropdown-selected').removeClass('empty');
				Ext.get(id+'-dropdown-info').setStyle("display","none");
				Ext.get(id+'-dropdown-info2').setStyle("display","inline");
			}
		});
	},
	getSelection:function() {
		var sel = Ext.get(this.param.id+'-select');
		return sel.dom.options[sel.dom.selectedIndex].value;
	},

	constructor: function(params) {
		if(!Ext.isObject(params)) {console.log("error in creating dropdown - params not specified");return null;}
		this.param = params;
		var p = params;
		this.css = (!Ext.isEmpty(p.css))?p.css+' ':'';
		var me = this;
		var empty = p.empty;

		var list = []; // create list-elements for my dropdown
		var options = [{tag:'option',html:'option 0',value:0}]; // create option-elements for form faking
		Ext.each(params.data,function(e,i) {
			if(Ext.isEmpty(e.type)) e.type = 'item';
			var list_css = (!Ext.isEmpty(e.css))?e.css+' ':'';
			switch(e.type) {
				case 'link':
					list[list.length] = {tag:'a',cls:list_css+'rs-dropdown-list-item rs-dropdown-list-link',id:p.id+'-item'+i,html:e.text,value:e.value,href:e.url};
					break;
				case 'item':
				default:
					list[list.length] = {tag:'div',cls:list_css+'rs-dropdown-list-item',id:p.id+'-item'+i,html:e.text,value:e.value};
					options[options.length] = {tag:'option',html:'option '+i,value:e.value};
					break;
			}
		});

		Ext.get(p.id).addClass(this.css);
		Ext.DomHelper.overwrite(p.id,{
			id:p.id+'-dropdown',
			cls:'rs-dropdown',
			cn: [{tag:'span',id:p.id+'-dropdown-info',cls:'rs-dropdown-info',html:p.info},
								{tag:'span',id:p.id+'-dropdown-info2',cls:'rs-dropdown-info',html:(p.info2)?p.info2:p.empty,style:'display:none;'},
								{id:p.id+'-dropdown-picker',cls:'rs-dropdown-picker'},
			{id:p.id+'-select',
				style:'display:none;',
				tag:'select',
				name:p.name,
				cn: options
			},{
				id:p.id+'-dropdown-selected',
				cls:'rs-dropdown-selected empty',
				html:empty
			},{
				id:p.id+'-dropdown-list',
				cls:'rs-dropdown-list',
				cn: list}]
		});

		var me = this;
		var info = Ext.get(p.id+'-dropdown-info');
		var info2 = Ext.get(p.id+'-dropdown-info2');

		var events = {'mouseover': {fn: function(ev,el) {me.open++;}},
																'mouseout':  {fn: function(ev,el) {me.open--;if(!me.open) {Ext.get(p.id+'-dropdown-list').hide();}},delay:500}};
		var hover =  {'mouseover': {fn: function(ev,el) {Ext.get(p.id+'-dropdown-picker').addClass('rs-dropdown-picker-hover');Ext.get(p.id+'-dropdown-selected').addClass('rs-dropdown-selected-hover');}},
																'mouseout':  {fn: function(ev,el) {Ext.get(p.id+'-dropdown-picker').removeClass('rs-dropdown-picker-hover');Ext.get(p.id+'-dropdown-selected').removeClass('rs-dropdown-selected-hover');}}};
		var listClick = function() {if(Ext.get(p.id+'-dropdown-list').isVisible()) Ext.get(p.id+'-dropdown-list').hide(); else Ext.get(p.id+'-dropdown-list').show();}

		// add to all created elements the needed handlers
		Ext.get(p.id+'-dropdown-selected').on('click',listClick);
		Ext.get(p.id+'-dropdown-selected').on(hover);
		Ext.get(p.id+'-dropdown-selected').on(events);
		Ext.get(p.id+'-dropdown-info').on('click',listClick);
		Ext.get(p.id+'-dropdown-info').on(hover);
		Ext.get(p.id+'-dropdown-info').on(events);
		Ext.get(p.id+'-dropdown-info2').on('click',listClick);
		Ext.get(p.id+'-dropdown-info2').on(hover);
		Ext.get(p.id+'-dropdown-info2').on(events);
		Ext.get(p.id+'-dropdown-picker').on('click',function() {if(Ext.get(p.id+'-dropdown-list').isVisible()) Ext.get(p.id+'-dropdown-list').hide(); else Ext.get(p.id+'-dropdown-list').show();});
		Ext.get(p.id+'-dropdown-picker').on(hover);
		Ext.get(p.id+'-dropdown-picker').on(events);
		Ext.get(p.id+'-dropdown-list').setOpacity(0.9);
		Ext.get(p.id+'-dropdown-list').on(events);

		Ext.each(params.data,function(e,i) {
			var el = Ext.get(p.id+'-item'+i);

			el.hover(me.fnItemOver,me.fnItemOut);
			el.on('click',function() {
				var sel = Ext.get(p.id+'-select');
				me.selected=e.value;
				Ext.each(sel.dom.options,function(x,ix) {if(x.value==e.value) sel.dom.selectedIndex=ix;});
				Ext.get(p.id+'-dropdown-selected').dom.innerHTML = e.text;
				Ext.get(p.id+'-dropdown-list').hide();
				Ext.get(p.id+'-dropdown-selected').removeClass('empty');
				info.setStyle("display","none");
				info2.setStyle("display","inline");
				if(!Ext.isEmpty(e.callback)) eval(e.callback);
			});
		});
	}
});