var $_widgetName = 'input_control';

widgetControls[ $_widgetName ] =
{
    input_control__input :
    {
        events :
        {
            mouseover   : function()
            {
                //this.widget.input_control__button.displayHalf();
                this.bricks('input_control__button').displayHalf();
            },

            mouseout    : function()
            {
                this.bricks('input_control__button').displayNone();
            }
        },

        actions :
        {
            __before    : function( obj )
            {
                var self = $( this.template );

                if ( obj instanceof Node ) {
                    $.each(
                        obj.attributes,
                        function( index, attr )
                        {
                            if ( attr.name != "class" )
                            {
                                self.attr( attr.name, attr.value );
                            }
                        }
                    );
                } else {
                    var params = this.widget.params;

                    for ( var param in params )
                    {
                        self.attr( param, params[ param ] );
                    }
                }



            },

            clear       : function()
            {
                this.template.removeAttr( 'disabled' )
                    .val('')
                    .focus();
            }
        }
    },

    input_control__button :
    {
        events :
        {
            click       : function()
            {
                this.bricks('input_control__input').clear()
            },

            mouseover   : function()
            {
                this.displayFull()
            },

            mouseout    : function()
            {
                this.displayNone()
            }
        },

        actions :
        {
            setPosition : function()
            {
                var _input      = this.bricks('input_control__input').template;
                var _input_pos  = _input.position();

                var _left = _input_pos.left + _input.width();
                var _top  = _input_pos.top  + _input.height();
                this.template.css( 'left', ( _left - 15 ) );
                this.template.css( 'top',  ( _top  - 12 ) );

                this.template.css( 'visibility', 'visible' )
            },

            displayFull : function()
            {
                this.setPosition();
                this.template.css( 'opacity', '1' )
            },

            displayHalf : function()
            {
                this.setPosition();
                this.template.css( 'opacity', '0.5' )
            },

            displayNone : function()
            {
                this.template.css( 'opacity', '0' )
                this.template.css( 'visibility', 'hidden' )
            }
        }
    }
}