CollapsableBox = function(expandedBodyID, collapsedBodyID, isExpanded) {

  this.expandedBody = $get(expandedBodyID);
  
  this.collapsedBody = $get(collapsedBodyID);
  
  this.isExpanded = isExpanded;
  
  if (!this.isExpanded) {
      if (this.expandedBody != null && this.collapsedBody != null) {
        this.expandedBody.style.display = 'none';
        this.collapsedBody.style.display = '';
      }
  }    
}

CollapsableBox.prototype = {

    getIsExpanded : function () {
      return this.isExpanded;
    },

    setIsExpanded : function (newIsExpanded) {
      this.isExpanded = newIsExpanded;
    },

    collapse : function () {
      if (this.expandedBody != null && this.collapsedBody != null) {
        this.expandedBody.style.display = 'none';
        this.collapsedBody.style.display = '';
        this.setIsExpanded(false);
      }
    },

    expand : function () {
      if (this.expandedBody != null && this.collapsedBody != null) {
        this.expandedBody.style.display = '';
        this.collapsedBody.style.display = 'none';
        this.setIsExpanded(true);
      }
    },

    collapseExpand : function () {
      if (this.expandedBody != null && this.collapsedBody != null) {
        if (this.getIsExpanded()) {
          this.collapse();
        }
        else {
          this.expand();
        }
        return this.getIsExpanded();
      }
    }
}