/** smart labels from alistapart
 * http://www.alistapart.com/articles/makingcompactformsmoreaccessible
 */
function initOverLabels (form) {
  if (!document.getElementById || !form) return;      

  var labels, id, field;

  // Set focus and blur handlers to hide and show 
  // labels with 'overlabel' class names.
  labels = form.getElementsByTagName('label');
  for (var i = 0; i < labels.length; i++) {
      // Skip labels that do not have a named association
      // with another field.
      id = labels[i].htmlFor || labels[i].getAttribute('for');

      if (!id || !(field = document.getElementById(id))) {
        continue;
      } 

      // Change the applied class to hover the label 
      // over the form field.
      labels[i].className = 'overlabel';

      // Hide any fields having an initial value.
      if (field.value !== '') {
        hideLabel(field.getAttribute('id'), true);
      }

      // Set handlers to show and hide labels.
      field.onfocus = function () {
        hideLabel(this.getAttribute('id'), true);
      };
      field.onblur = function () {
        if (this.value === '') {
          hideLabel(this.getAttribute('id'), false);
        }
      };

      // Handle clicks to label elements (for Safari).
      labels[i].onclick = function () {
        var id, field;
        id = this.getAttribute('for');
        if (id && (field = document.getElementById(id))) {
          field.focus();
        }
      };

    }
  }

function hideLabel (field_id, hide) {
    var field_for;
    var labels = document.getElementsByTagName('label');
    for (var i = 0; i < labels.length; i++) {
	field_for = labels[i].htmlFor || labels[i].getAttribute('for');
	if (field_for == field_id) {
	    labels[i].style.zIndex = (hide) ? '3' : '5';
      return true;
	}
    }
}


$(function() {
      var form = document.getElementById('user-login-form');
      setTimeout(function() { initOverLabels(form); }, 50);
      
      var oe = null;
      $('#node-3 .expander').each(function() {
				      var $t = $(this);
				      var po = $t.offset();
				      var p = $t.parent();
				      var img = $t.find('img');
				      $(this).css({ left: (p.width() - img.width()) / 2, top: 0, position: "absolute"});
				  });
      var expand = function() {
	  unexpand();
	  var $t = $(this);
	  var img = $t.find('img');
	  var h = img.height() || 0;
	  oe = this;
	  if(!this.oh) this.oh = $t.height();
	  $t.stop(true, true);
	  $t.animate({ height: h }, { duration: 250 });
      };
      var unexpand = function() {
	  var $t = $(this);
	  if(oe) {
	      $(oe).stop(true, true);
	      $t.animate({ 
			     height: this.oh
			 }, 
			 {
			     duration: 250, complete: function() { oe = null; } 
			 });
	      oe = null;
	  }
      };
      $('#node-3 .expander').hover(expand, unexpand);
  });