/*

EmptyText decorator for <input type="text"> elements.
Given an input DOM element and the default "empty text" to display:
- Displays the "empty text" when nothing is entered in the input
- Hides the "empty text" when cursor enters the input, re-shows on blur
Sample usage:
var x = new EmptyText(document.getElementById('myInput', 'Type Here!');
That's all. The EmptyText object manages everything else via events.
*/

var EmptyText = function(elem, text) {
  this.elem = elem;
  this.text = text;
  this.setEnabled();
  this.origOnFocus = this.elem.onfocus;
  this.origOnBlur = this.elem.onblur;
  if (this.enableEmptyText) {
    this.elem.value = this.text;
  }
  var self = this;
  this.elem.onfocus = function() { self.doFocus(); };
  this.elem.onblur = function() { self.doBlur(); };
};

EmptyText.prototype.setEnabled = function() {
  this.enableEmptyText = (this.elem.value.length === 0);
};

EmptyText.prototype.doFocus = function() {
  if (this.origOnFocus) this.origOnFocus();
  if (this.enableEmptyText && (this.elem.value == this.text)) {
    this.elem.value = "";
  }
};

EmptyText.prototype.doBlur = function() {
  if (this.origOnBlur) this.origOnBlur();
  this.setEnabled();
  if (this.enableEmptyText) {
    this.elem.value = this.text;
  }
};

