/// <reference path="jquery-1.3.2-vsdoc2.js" />
var jBillos = (jBillos == undefined) ? {} : jBillos;

jBillos.textInputs = {
    init : function() {
        $('INPUT[type="text"], INPUT[type="file"], INPUT[type="password"], TEXTAREA').each(function(i) {            
            if ($(this).next().hasClass("watermark")) {
                this.wm = $(this).next();
                this.wm.click(function() {
                    $(this).prev().focus();  // cause we inserted this label AFTER the input, it should be the PREV input
                });                   
            }
            $(this).focus(function() {
                if (this.wm) {
                    this.wm.hide();
                    this.wm.removeClass("error").removeClass("invalid");
                }
                $(this).removeClass("error");
                $(this).addClass("focused").removeClass("invalid");
            });
            $(this).blur(function() {
                $(this).removeClass("focused");
                if (this.wm && $(this).val() == "") {
                    this.wm.show();
                }
            });
        });
    }
};

jBillos.watermarks = {
    watermarkClass : "", 
    init : function(className) {
        watermarkClass = (className) ? className : "watermark";
        $('INPUT[type="text"], INPUT[type="file"], INPUT[type="password"], TEXTAREA').each(function(i) {
            if(this.title && !$(this).hasClass("nowatermark")) {   // only if it has a title, and it's not "nowatermark" (so we can still have a title, but not watermark it)
                if (!this.wm) {  // there hasn't been a watermark attached before, so create it.
                    $(this).wrap("<div class='watermarked'>");
                    $(this).parent().css("position","relative"); 
                    $(this).parent().css("float",$(this).css("float")); 
                    $(this).parent().css("margin-top",$(this).css("margin-top")); 
                    $(this).parent().css("margin-right",$(this).css("margin-right")); 
                    $(this).parent().css("margin-bottom",$(this).css("margin-bottom")); 
                    $(this).parent().css("margin-left",$(this).css("margin-left")); 
                    $(this).parent().css("top",$(this).css("top"));       
                    $(this).parent().css("left",$(this).css("left"));
                    $(this).parent().css("display", ($(this).css("display") == "inline") ? "inline-block" : $(this).css("display")); 
                    if ($(this).css("position") == "absolute" || $(this).css("position") == "fixed") {
                        $(this).parent().css("position",$(this).css("position")); 
                    } else {
                        $(this).parent().css("width",$(this).outerWidth()); 
                        $(this).parent().css("height",$(this).outerHeight()); 
                    }
                    
                    // reset the input
                    $(this).css("display","block");
                    $(this).css("position","absolute");
                    $(this).css("float","none");
                    $(this).css("margin",0);
                    $(this).css("top",0);       
                    $(this).css("left",0);
                    
                    // create the LABEL
                    var wm = $("<label for='"+$(this).attr("id")+"' />");
                    wm.css("width",$(this).css("width"));
                    wm.addClass("watermark");
                    
                    wm.css("font-size",$(this).css("font-size"));
                    wm.css("font-weight",$(this).css("font-weight"));
                    wm.css("font-family",$(this).css("font-family"));
                    wm.css("width",$(this).css("width"));
                    
                    var pLeft = parseInt($(this).css("padding-left"));
                    var pTop = parseInt($(this).css("padding-top"));
                    var bTop = parseInt($(this).css("border-top-width"));
                    var bLeft = parseInt($(this).css("border-left-width"));
                    wm.css("padding-left",pLeft+bLeft);
                    wm.css("padding-top",pTop+bTop);
                    
                    wm.html(this.title);
                    
                    wm.css("left",0);
                    wm.css("top",0);                        
                    wm.css("position","absolute");
                    wm.css("z-index",$(this).css("z-index")+1);
                    this.wm = wm;
                    $(this).after(wm);
                }
                // at this point it has a watermark, so turn it on/off depending on value/display
                $(this.wm).show();
                if (this.value != "" || $(this).css("display") == "none") {
                    $(this.wm).hide();
                }                  
            }
        });
    }
};

$(document).ready(function() {
    jBillos.watermarks.init();
    jBillos.textInputs.init();
});