
document.observe("dom:loaded", function(event) {
  $$("input.default-value").each(function(input) {
    var defaultClass = "default-value";

    /* Get the default value */
    var defaultValue = input.value;

    /* Get the form */
    var form = input.form;

    /* When input gets focus, set value to "" if value is default value */
    input.observe("focus", function(event) {
      if (input.value == defaultValue) {
        input.value = "";
        input.removeClassName(defaultClass);
      }
    });

    /* When input loses focus, set value to default value if value = "" */
    input.observe("blur", function(event) {
      if (input.value == "") {
        input.value = defaultValue;
        input.addClassName(defaultClass);
      }
    });

    /* Set default values to "" when form is submitted */
    if (form) {
      form.observe("submit", function(event) {
        if (input.value == defaultValue) {
          input.value = "";
        }
      });
    }

    /* Set default value when page loads */
    if (input.value == "" || input.value == defaultValue) {
      input.value = defaultValue;
      input.addClassName(defaultClass);
    }

  });
});



/* CLOSED_IMAGE - the image to be displayed when the sublists are closed
 * OPEN_IMAGE   - the image to be displayed when the sublists are opened
 */
CLOSED_IMAGE='/images/section_arrow_close.png';
OPEN_IMAGE='/images/section_arrow_open.png';
HOVER_IMAGE='/images/section_arrow_hover.png';
/* makeCollapsible - makes a list have collapsible sublists
 * 
 * listElement - the element representing the list to make collapsible
 */
function makeCollapsible(listElement){

  listElement.style.listStyle='none';
  listElement.style.marginLeft='0';
  listElement.style.paddingLeft='0';

  // loop over all child elements of the list
  var child=listElement.firstChild;
  while (child!=null){

    // only process li elements (and not text elements)
    if (child.nodeType==1){

      // build a list of child ol and ul elements and hide them
      var list=new Array();
      var grandchild=child.firstChild;
      while (grandchild!=null){
        if (grandchild.tagName=='OL' || grandchild.tagName=='UL'){
          if (child.getAttribute('class')!='collapsibleOpen') {
            grandchild.style.display='none';
          }
          grandchild.style.paddingLeft='20px';
          list.push(grandchild);
        }
        grandchild=grandchild.nextSibling;
      }

      // add toggle buttons
      var node=document.createElement('img');
      if (child.getAttribute('class')!='collapsibleOpen') {
        node.setAttribute('src',CLOSED_IMAGE);
        child.setAttribute('class','collapsibleClosed');
      } else {
        node.setAttribute('src',OPEN_IMAGE);
      }
      child.onclick=createToggleFunction(child,list,node);
      child.onmouseover=createHoverFunction(child,node,true);
      child.onmouseout=createHoverFunction(child,node,false);
      child.insertBefore(node,child.firstChild);

    }

    child=child.nextSibling;
  }

}

/* createToggleFunction - returns a function that toggles the sublist display
 * 
 * toggleElement  - the element representing the toggle gadget
 * sublistElement - an array of elements representing the sublists that should
 *                  be opened or closed when the toggle gadget is clicked
 */
function createToggleFunction(toggleElement,sublistElements,image){

  return function(){

    // toggle status of toggle gadget
    if (toggleElement.getAttribute('class')=='collapsibleClosed'){
      toggleElement.setAttribute('class','collapsibleOpen');
      image.setAttribute('src',OPEN_IMAGE);
      for (var i=0;i<sublistElements.length;i++){
        sublistElements[i].style.display='block';
      }
    }else{
      toggleElement.setAttribute('class','collapsibleClosed');
      image.setAttribute('src',CLOSED_IMAGE);
      for (var i=0;i<sublistElements.length;i++){
        sublistElements[i].style.display='none';
      }
    }
  }

}

function createHoverFunction(toggleElement,image, entered){

  return function(){
    if (toggleElement.getAttribute('class')=='collapsibleClosed'){
      if (entered)
      {
        image.setAttribute('src',HOVER_IMAGE);
      }else{
        image.setAttribute('src',CLOSED_IMAGE);
      }
    }
  }

}
