document.observe('dom:loaded', function()
{
    var Placeholder = Class.create(
    {
        initialize: function (element)
        {
            this.element = element;
            this.placeholder = element.readAttribute('x-ns-placeholder');
            this.blur();
            Event.observe(this.element, 'focus', this.focus.bindAsEventListener(this));
            Event.observe(this.element, 'blur', this.blur.bindAsEventListener(this));
        },
        focus: function ()
        {
            if (this.element.hasClassName('placeholder-active'))
            {
                this.element.clear().removeClassName('placeholder-active');
            }
        },
        blur: function ()
        {
            if (this.element.value.blank())
            {
                this.element.addClassName('placeholder-active').value = this.placeholder;
            }
        }
    });
    $$('input[x-ns-placeholder]').each(function (input)
    {
        new Placeholder(input);
    });
});