function getElementsByStyleClass (className) {
  //function to get all elements on a page by class name
  var all = document.all ? document.all :
    document.getElementsByTagName('*');
  var elements = new Array();
  for (var e = 0; e < all.length; e++)
    if (all[e].className == className)
      elements[elements.length] = all[e];
  return elements;
}

function setActiveTab(tab_obj_id, class_name) {
  //get all atctive tab elements
  var elements = getElementsByStyleClass(class_name + ' active');
  var tab_obj = document.getElementById(tab_obj_id);
  
  //reset them back to inactive
  for(var i=elements.length-1; i>=0; --i ){
    elements[i].className = class_name;
  }
  //set the clicked tap to active
  tab_obj.className = tab_obj.className + ' active';
}

function inputChange(obj) {
  obj.style.backgroundPosition = (obj.value == '')?'0px 0px':'0px -31px';
}

function charactersLeft(obj_name, tot) {
  var name = obj_name + '_characters_left';
  var obj = document.getElementById(obj_name);
  var clobj = document.getElementById(name);
  if (obj && clobj) {
    var left = tot - obj.value.length;
    var text = left + ' character' + ((left == 1)?'':'s') + ' left';
    if (left < 0) {
      obj.value = obj.value.substring(0, tot);
      left = 0;
    }
    clobj.innerHTML = text;
    clobj.style.color = (left < 10)?'#AA0000':'';
  }
}