﻿var WatermarkTextBox =
{
    Add: function(txtboxid, watermarktext, watermarkcss, enterKeyPress) {
        var t = el(txtboxid);
        if (typeof t == 'undefined') { return; }
        t.wtb = {};
        t.wtb.parent = t;
        t.wtb.IsPassword = (t.type == 'password');
        t.wtb.Label = watermarktext;
        t.wtb.Text = t.value;
        t.wtb.cssClass = t.className;
        t.wtb.cssClassWatermark = watermarkcss;
        t.wtb.onenterdown = enterKeyPress;
        t.wtb.IsFocused = false;

        // initialize the watermark, only if the text is empty
        if (String.isNullorEmpty(t.value)) {
            t = (t.wtb.IsPassword) ? changeInputType(t, 'text', t.wtb.Label) : t;
            t.value = t.wtb.Label;
            t.className = t.wtb.cssClassWatermark;
        }

        // save the events to call if we need to invoke them
        t.wtb.savedevents = {};
        t.wtb.savedevents.onblur = t.onblur;
        t.wtb.savedevents.onfocus = t.onfocus;
        t.wtb.savedevents.onkeydown = t.onkeydown;

        t.onblur = function() { WatermarkTextBox.OnBlur(this); };
        t.onfocus = function() { WatermarkTextBox.OnFocus(this); };
        //t.onkeydown = function(event) { return WatermarkTextBox.OnEnterDown(this, event); };
        function onKeyDown(e) {
            e = e ? e : event;
            WatermarkTextBox.OnEnterDown(t, e);
        }
        addEventToElement(t, 'keydown', onKeyDown);
    },

    ToggleInit: function(t) {
        if (t.wtb.IsPassword) {
            if (String.compare(t.value, t.wtb.Label) == 0) {
                t = changeInputType(t, 'password', '', true);
                t.className = t.wtb.cssClass;
            } else if (String.isNullorEmpty(t.value)) {
                t = changeInputType(t, 'text', t.wtb.Label);
                t.className = t.wtb.cssClassWatermark;
            }
            return;
        }

        // none password mode textboxes, just do the watermark
        this.ToggleWatermark(t);
    },

    ToggleWatermark: function(t) {
        if (String.compare(t.value, t.wtb.Label) == 0) {
            t.className = t.wtb.cssClass;
            t.value = '';
        } else if (String.isNullorEmpty(t.value)) {
            t.className = t.wtb.cssClassWatermark;
            t.value = t.wtb.Label;
        }
    },

    OnBlur: function(t) {
        t.wtb.IsFocused = false;
        this.ToggleInit(t);
        if (t.wtb.savedevents.onblur) { t.wtb.savedevents.onblur(); }
    },

    OnFocus: function(t) {
        if (t.wtb.IsFocused) // focus is set on
            return;

        t.wtb.IsFocused = true;
        this.ToggleInit(t);
        if (t.wtb.savedevents.onfocus) { t.wtb.savedevents.onfocus(); }
    },

    OnEnterDown: function(t, e) {
        if (t.wtb.savedevents.onkeydown) { t.wtb.savedevents.onkeydown(e); }
        if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {
            e.cancelBubble = true;
            if (e.stopPropagation) {
                e.stopPropagation();
            }
            if (t.wtb.onenterdown) { t.wtb.Text = t.value; e.returnValue = t.wtb.onenterdown(t); }
        }
    },

    Focus: function(id) {
        var t = el(id);
        t.focus();
    }
};

function changeInputType(oldinput, type, value) {
    if (!oldinput || !oldinput.parentNode || (type.length < 4) ||
    !document.getElementById || !document.createElement) return;
    var newinput = document.createElement('input');
    newinput.type = type;
    newinput.value = value;
    newinput.IsFocused = false;
    // copy attributes over
    if (oldinput.name) newinput.name = oldinput.name;
    if (oldinput.id) newinput.id = oldinput.id;
    if (oldinput.className) newinput.className = oldinput.className;
    if (oldinput.size) newinput.size = oldinput.size;
    if (oldinput.tabIndex) newinput.tabIndex = oldinput.tabIndex;
    if (oldinput.accessKey) newinput.accessKey = oldinput.accessKey;
    if (oldinput.onblur) newinput.onblur = oldinput.onblur;
    if (oldinput.onfocus) newinput.onfocus = oldinput.onfocus;
    if (oldinput.onkeydown) newinput.onkeydown = oldinput.onkeydown;
        
    newinput.wtb = oldinput.wtb;
    // replace the object on the Page
    oldinput.parentNode.replaceChild(newinput, oldinput);
    if (newinput.wtb.IsFocused) {
        setTimeout(String.format("WatermarkTextBox.Focus('{0}');", newinput.id), 2);
    }

    // send back new reference
    return newinput;
}