/*
*/
(function($)
{
    $.fn.selectOther = function(settings)
    {
        settings = $.fn.extend(
        {
            style: '',
            cssClass: '',
            otherValueText: 'other',
            selectedValue: null,
            mask: null
        }, settings);


        $.fn.selectOther.InputValueChange = function(e)
        {
            var $OtherInputControl = $(e[0]);
            var otherVal = $OtherInputControl.val();
            var associatedControlID = $OtherInputControl.attr('assoccontrolid');
            var $AssociatedControl = $('#' + associatedControlID);
            $.fn.selectOther.SetValue($AssociatedControl, otherVal);
            $OtherInputControl.remove();
        }

        $.fn.selectOther.SetValue = function($AssociatedControl, value)
        {
            var exists = false;
            $('option', $AssociatedControl).each(function()
            {
                if ($(this).val() == value)
                {
                    exists = true;
                }
            });
            if (!exists)
            {
                $AssociatedControl.append(String.format("<option value='{0}'>{0}</option>", value));
            }

            $AssociatedControl.val(value);

            //this is required to let inputValidation control know that the value of select has been changed
            $AssociatedControl.trigger('change');
        }

        return this.each(function()
        {

            var $select = $(this);
            $select.append(String.format("<option value='{0}'>{0}</option>", settings.otherValueText));

            $(this).change(function()
            {

                if ($select.val() == settings.otherValueText)
                {
                    var associatedControlID = $select.attr('id');
                    var id = associatedControlID + '_other';
                    if ($("#" + id).length == 0)
                    {
                        var otherHTML = String.format("<input type='text' id='{0}' style='{1}' class='{2}' assoccontrolid='{3}' ></input>"
                                                      , id, settings.style, settings.cssClass, associatedControlID);
                        $select.after(otherHTML);

                        if (settings.mask)
                        {
                            $('#' + id).setMask({ mask: settings.mask});
                        }
                        
                        $("#" + id).blur(function(event)
                        {
                            $.fn.selectOther.InputValueChange($(event.currentTarget));
                        });

                        $("#" + id).keypress(function(event)
                        {
                            if (isEnterKey(event))
                            {
                                $("#" + id).blur();
                                return false;
                            }
                        });

                        $("#" + id).focus();
                    }
                }
            });

            if (settings.selectedValue)
            {
                $.fn.selectOther.SetValue($select, settings.selectedValue);
            }
        });
    };
})(jQuery);