
var inputs = new Array('User','username','mockpass','password', 'Pass', '')
var defaultColor = '#333333';
var watermarkColor = '#aaa';
// Defining "indexOf" function for Internet Explorer
// It returns the index of the first occurance of an item in the array
 
if(!Array.indexOf){
	Array.prototype.indexOf = function(obj, start){
		for(var i = ( start || 0 ); i < this.length; i++){
			if(this[i] == obj){ return i; }
		}
	}
}
 
function inputWatermark(){
	if(inputs.length < 2 || inputs.length%2 != 0){
		alert('Wrong usage - please read the source comments!');
	}
 
	for (i = 0; i < inputs.length; i++){
		if(i%2 == 0 && (document.getElementById(inputs[i]) || document.getElementsByName(inputs[i])[0])){
			var cur = (document.getElementById(inputs[i])) ? (document.getElementById(inputs[i])) : (document.getElementsByName(inputs[i])[0]);
			cur.value=inputs[i + 1];
			addEvent(cur,"focus",onFocusHandler);
			addEvent(cur,"blur",onBlurHandler);
		}
	}
}
 
function onFocusHandler(){
	var inpname = this.id ? this.id: this.name;
    if (this.value == '' || this.value == inputs[inputs.indexOf(inpname) + 1]) {
        if(this.id == 'User') {
			this.value = '';
			this.style.color = defaultColor;
		}
		else {
			document.getElementById('mockpass').style.display='none';
			document.getElementById('Pass').style.display='';	
			document.getElementById('Pass').focus();
		}
    }
}
 
function onBlurHandler(){
	var inpname = this.id ? this.id : this.name;
	if(this.value == ''){
		if(this.id == 'User') {
			this.value = inputs[inputs.indexOf(inpname) + 1];
			this.style.color = watermarkColor;
		}
		else {
			document.getElementById('mockpass').style.display='';
			document.getElementById('Pass').style.display='none';	
		}
	}
}