﻿//Requires prototype.js
var TextWatermark = Class.create({
    initialize: function(textbox, text)
    {
        
        this.textbox = $(textbox);
        this.text = text;
        this.className = this.textbox.className;
        

        if(this.textbox.type != "text")
        {
            //IE cant change a input's type.  This means that to display watermark text
            //in a password field we need to make a stand-in text input and swap it
            //in and out for password fields.  Death to IE!
            
            this.textboxDisplay = this.textbox.style.display;
            var standin = document.createElement("input");
            Element.extend(standin);
            standin.className = this.textbox.className;
            standin.value = this.text;
            standin.addClassName("watermark");
            
            this.textbox.style.display = "none";
            this.textbox.parentNode.insertBefore(standin, this.textbox.nextSibling)
            
            this.standin = standin;
            this.standin.observe("focus", this.pwFocus.bind(this));
            this.textbox.observe("blur", this.pwBlur.bind(this));    
        }
        else
        {
            this.textbox.value = this.text;    
            this.textbox.observe("focus", this.focus.bind(this));
            this.textbox.observe("blur", this.blur.bind(this));
            this.textbox.addClassName("watermark");
        }
    },
    
    focus: function()
    {
        if(this.textbox.value == this.text)
        {
            this.textbox.value = "";
            this.textbox.removeClassName("watermark");
        }
    },
    pwFocus: function()
    {
        if(this.textbox.style.display == "none")
        {
            this.standin.style.display = "none";
            this.textbox.style.display = this.textboxDisplay;
            this.textbox.focus();
        }
    },
    
    blur: function()
    {
        if(this.textbox.value == "")
        {
            this.textbox.value = this.text;
            this.textbox.addClassName("watermark");
        }
    },
    pwBlur: function()
    {
        if(this.textbox.value == "")
        {
            this.textbox.style.display = "none";
            this.standin.style.display = this.textboxDisplay;
        }
    }
});
