InputWatermark = Class.create();

InputWatermark.prototype =

{

    initialize: function(id)

    {

        this.element = $(id);

        this.title_span = null;

        this.is_focused = false;

        Event.observe(this.element, 'focus', this.elementFocus.bind(this));

        Event.observe(this.element, 'blur', this.elementBlur.bind(this));

        Event.observe(window, 'load', this.initElement.bind(this));

    },



    elementFocus: function(e)

    {

        this.is_focused = true;

        if (this.title_span != null)

        {

            this.title_span.hide();

        }

    },



    elementBlur: function(e)

    {

        this.is_focused = false;

        if (this.title_span != null && this.element.getValue() == "")

        {

            this.title_span.show();

        }

    },



    initElement: function(e)

    {

        this.wrapper_span = new Element('div');

        this.wrapper_span.setStyle({position: 'relative'});

        this.title_span = new Element('span');

        this.title_span.addClassName('title_span');

        this.title_span.setStyle({position: 'absolute', left: '0px', top: '0px', width: this.element.getWidth(), height: this.element.getHeight()});

        this.title_span.insert(this.element.readAttribute('title'));

        if (this.element.getValue() != "" || this.is_focused)

        {

            this.title_span.hide();

        }

        this.wrapper_span.insert(this.title_span);

        this.element.wrap(this.wrapper_span);

        this.title_span.observe('click', function(e) { this.element.focus(); }.bind(this));

    }

}