/*
	Component.MultiSelect v1.0
	Copyryght 2007 Imperavi
	http://lab.imperavi.ru
*/

if(typeof(Component) == 'undefined')
    var Component = {};
    Component.MultiSelect = Class.create();
    Object.extend(Component.MultiSelect.prototype,{
	initialize: function(element, options)
	{
		this.element = $(element);
		this.element_id = element;
		this.load_id = element + '_load';
		this.container_id = element + '_container';
		this.box_id = element + '_box';
		this.button_id = element + '_button';
		this.element_br = element + '_element_br';

        this.options = Object.extend({
			text_link: false,
            button: true,
			text: 'done'
        }, options || {});

        this.element.visibility = "hidden";
        
    var link;

    if (match == false)
    {
      link = 'make selections';
    }
    else
    {
	    link = '';
    }


		if (this.options.text_link) link = this.options.text_link;

		var element_load = Builder.node('a', {id: this.load_id, href: 'javascript:;', className: 'component_multiselect'}, link);
		var element_br = Builder.node('div', {id: this.element_br});

		Insertion.After(this.element, element_load);
		Insertion.After(this.load_id, element_br);

		this.create();

		Event.observe(this.element, 'change', this.scan.bindAsEventListener(this));
		Event.observe(this.load_id, 'click', this.show.bindAsEventListener(this));
		this.scan_checkbox();
		
		if (match == true)
    {
      this.show();
    }
	},
	show: function()
	{
		//this.scan();
		//this.scan_checkbox();
		$(this.container_id).toggle();
	},
	hide: function()
	{
		$(this.container_id).hide();
	},
    create: function()
	{
		var container = Builder.node('div', {id: this.container_id, style: 'display: none;', className: 'component_multiselect_container'}, [
			Builder.node('ul', {id: this.box_id, className: 'component_multiselect_box'})
		]);

		if (this.options.button)
		{
			var button = Builder.node('div', {className: 'component_multiselect_submit'}, [
				Builder.node('input', {id: this.button_id, type: 'button', value: this.options.text})
			]);
			container.appendChild(button);

		}

		Insertion.After(this.element_br, container);

		if (this.options.button) Event.observe(this.button_id, 'click', this.hide.bindAsEventListener(this));

		this.element_options = new Array();
		var _self = this;

		var count = this.element.length;
		for (var i=0; i < count; i++)
		{
            id = this.element_id + this.element.options[i].value;

            var li;
              if(this.element.options[i].value != '')
              {
                li = Builder.node('li', {id: 'li_ch_' + id});
        			}
              else
              {
                //li = Builder.node('li', {id: 'li_ch_' + id, class:'hideme'});
                li = Builder.node('li', {id: 'li_ch_' + id, style:'display:none'});
              }

              var ch;
              if (this.element.options[i].selected == true)
              {
                ch = Builder.node('input', {id: 'ch_' + id, type: 'checkbox', value: this.element.options[i].value, checked: 1});
              }
              else
              {
                ch = Builder.node('input', {id: 'ch_' + id, type: 'checkbox', value: this.element.options[i].value});
              }

			ch.onclick =  function() {
                _self.add_value(this.value);
                //($('filterlog') != undefined){

                    //$('filterlog').innerHTML = $('filterlog').innerHTML + this.value;


                //}
             };
			//MultiSelect.
			this.element_options[this.element.options[i].value] = 'ch_' + id;

			var sp = document.createElement('label');
			sp.htmlFor = 'ch_' + id;
			sp.id = 'l_ch_' + id;
			sp.innerHTML = this.element.options[i].text;

			li.appendChild(ch);
			li.appendChild(sp);
			$(this.box_id).appendChild(li);
            //}
		}
	},
	add_value: function(value)
	{
		$('li_ch_' + this.element_id + value).addClassName('active');

		if (this.extra_option == false)
		{
			this.scan_checkbox(0);
			this.extra_option = true;
		}
		else this.scan_checkbox(1);
	},
   	add_extra_option: function(text, value)
	{
		this.element.options[this.element.length] = new Option(text,value);
		this.element.options.selectedIndex = this.element.options.length - 1;
	},
    scan: function()
	{
		var index = this.element.options.selectedIndex;
		var str = this.element.options[index].value;

		str = str.replace(/,/gi,' ');

		var arr = $w(str);
		arr_new = new Array();

		this.element_options.each(
			function (s, n)
			{
				$(s).checked = false;
				$('li_' + s).removeClassName('active');
				arr_new[n] = s;
			}
		);

		arr.each(
			function (s, n)
			{
                //alert(s);
				$(arr_new[s]).checked = true;
				$('li_' + arr_new[s]).addClassName('active');
                //alert('s: ' + s + ' ,n: ' + n);
			}
		);
	},
	scan_checkbox: function(mode)
	{
		var value_result = '';
		var text_result = '';
		var id = this.element_id;

		this.element_options.each
        (
        function (s, n)
		{
            var e = $(s);
            if(e != null)
            {
  				if (e.checked == true)
  				{
     			    value_result += e.value + ',';
                    text_result += $('l_ch_' + id + e.value).innerHTML + ',';
                    $('li_' + s).addClassName('active');
  				   //alert(value_result);
  				}
                else
                {
                  $('li_' + s).removeClassName('active');
                  $(s).checked = false;
                }
            }
		}
		);

		text_result = text_result.replace(/,$/,'');
		value_result = value_result.replace(/,$/,'');

		if (mode == 0)
    {
      this.add_extra_option(text_result, value_result);
    }
		else
		{
			this.element.options[this.element.length-1].selected = true;
			this.element.options[this.element.length-1].value =  value_result;
			this.element.options[this.element.length-1].text = text_result;
		}
	}
});
if(typeof(Object.Event) != 'undefined')
	Object.Event.extend(Component.MultiSelect);