var K_ComboBox = new Class({
	options: {
		id: '',
		disabled: false,
		addImage: 'images/icons/arrow_right.png',
		removeImage: 'images/icons/arrow_left.png'
	},

	initialize: function(options){
		this.setOptions(options);
		this.build();
	},

	build: function () {

		var selectObject = $(this.options.id);
		var select_dimension = selectObject.getCoordinates();
		var select_width = (select_dimension.width - 80) / 2;
		
		if (this.options.disabled == true) {
			var comboObject = new Element('div').setHTML('<table><tr><td><select id="K_ComboBox_Select_Add" size="'+ selectObject.size +'" style="width: '+ select_width +'px;" disabled="disabled"></select></td><td style="text-align: center; width: 80px;"><button type="button" id="K_ComboBox_Button_Add" disabled="disabled"><img src="'+ this.options.addImage +'" alt="" /></button><br /><button id="K_ComboBox_Button_Remove" disabled="disabled"><img src="'+ this.options.removeImage +'" alt="" /></button></td><td><select id="K_ComboBox_Select_Remove" size="'+ selectObject.size +'" style="width: '+ select_width +'px;" disabled="disabled"></select></td></tr></table>');
		} else {

			
			// to selects
			// to knapper
			// fin tabel
			
			//var select_add = new Element('select').setProperty('size', selectObject.size).setStyle('width', select_width);
			//var select_remove = new Element('select').setProperty('size', selectObject.size).setStyle('width', select_width);

			//var button_add = new Element('button').setProperty('type', 'button').setHTML('<img src="'+ this.options.addImage +'" alt="" />');
			//var button_remove = new Element('button').setProperty('type', 'button').setHTML('<img src="'+ this.options.removeImage +'" alt="" />');
			
			
			//var comboObject = new Element('div').adobt(new Element('table').adobt(new Element('tr').adobt(new Element('td').adobt(select_add)).adobt(new Element('td').setStyle)))
			
			
			var comboObject = new Element('div').setHTML('<table><tr><td><select id="K_ComboBox_Select_Add" size="'+ selectObject.size +'" style="width: '+ select_width +'px;"></select></td><td style="text-align: center; width: 80px;"><button type="button" id="K_ComboBox_Button_Add"><img src="'+ this.options.addImage +'" alt="" /></button><br /><button id="K_ComboBox_Button_Remove"><img src="'+ this.options.removeImage +'" alt="" /></button></td><td><select id="K_ComboBox_Select_Remove" size="'+ selectObject.size +'" style="width: '+ select_width +'px;"></select></td></tr></table>');			
		
		
		
		
		
		
		
		}

		var hiddenObject = new Element('input').setProperties({
			id: this.options.id,
			type: 'hidden'
		});

		$(this.options.id).replaceWith(comboObject);
		hiddenObject.injectAfter(comboObject);

		selectObject.getChildren().each(function (el) {
			if (el.selected == true) {
				el.setProperty('selected', false);
				$('K_ComboBox_Select_Remove').adopt(el);
			} else {
				$('K_ComboBox_Select_Add').adopt(el);
			}
		});

		$('K_ComboBox_Select_Remove').addEvent('dblclick', function () {
			this.remove();
		}.bind(this));
		
		$('K_ComboBox_Button_Remove').addEvent('click', function () {
			this.remove();
		}.bind(this));

		$('K_ComboBox_Select_Add').addEvent('dblclick', function (event) {
			this.add();
		}.bind(this));		
		
		$('K_ComboBox_Button_Add').addEvent('click', function () {
			this.add();
		}.bind(this));

		this.update(this.options.id);
	},

	add: function () {
		$('K_ComboBox_Select_Add').getChildren().each(function (el) {
			if (el.selected == true) {
				var clone = el.clone().injectInside($('K_ComboBox_Select_Remove'));
				el.remove();
			}
		});

		this.update(this.options.id);
	},

	remove: function () {
		$('K_ComboBox_Select_Remove').getChildren().each(function (el) {
			if (el.selected == true) {
				var clone = el.clone().injectInside($('K_ComboBox_Select_Add'));
				el.remove();
			}
		});

		this.update(this.options.id);
	},
	
	update: function (id) {
		$(id).value = '';
		$('K_ComboBox_Select_Remove').getChildren().each(function (el) {
			$(id).value += el.value + ',';
		});		
		
		$(id).value = $(id).getValue().substring(0, $(id).getValue().length-1);
	}
});

K_ComboBox.implement(new Options);