container = {

  expandImageSource: 'images/podimages/expand.gif',
	collapseImageSource: 'images/podimages/collapse.gif',
	expandImageTooltip: 'Click to expand',
	collapseImageTooltip: 'Click to collapse',

  addEvent: function(obj, event, fn){
    if(obj.addEventListener){
      obj.addEventListener(event, fn, false);
      return true;
    }
    else if(obj.attachEvent){
      var r = obj.attachEvent("on"+event, fn);
      return r;
    }
    else{
      return false;
    }
  },

  getElementsByClassName: function(class_name){
    var all = document.all ? document.all : document.getElementsByTagName('*');
    var elements = new Array();
    for (var i = 0; i < all.length; i++) {
      if (container.hasClass(all[i], class_name))
        elements.push(all[i]);
    }
    return elements;
  },

  hasClass: function (el, class_name){
    if (!el.className) return;         // element has not className property
    var classes = el.className.split(' ');
    for (var i=0; i<classes.length; i++){
      if (classes[i]==class_name)
        return true;
    }
    return false;
  },

  addClass: function (el, class_name){
    var classes = el.className.split(' ');
    for (var i=0; i<classes.length; i++){
      if (classes[i]==class_name)
        return;                        // class found - no need to add
    }
    classes.push(class_name);          // we got here so the class wasn't found - add it
    el.className=classes.join(' ');    // set the element's class(es)
  },

  removeClass: function (el, class_name){
    if (!el.className) return;         // element has not className property
    var classes = el.className.split(' ');
    for (var i=0; i<classes.length; i++){
      if (classes[i]==class_name)
        classes.splice(i, 1);          // class found - remove it
    }
    el.className=classes.join(' ');    // set the element's class(es)
  },

  roundCorners: function(obj){
	/*
    obj{id:id,
        title:title,
        width:width
        collapsible:true|false,
        collapsed:true|false}
		
		Given this: 
			<div id="some_id">content goes here</div>
		
		It will create this:
			<div class="pod">
				<div class="pod_top_left"></div>
				<div class="pod_top"><p>pod title</p></div>
				<div class="pod_top_right"></div>
				<div class="pod_main" id="testPod">pod content</div>
				<div class="pod_bottom">
					<div class="pod_bottom_left"></div>
					<div class="pod_bottom_right"></div>
				</div>
			</div> 
*/

    // get our div to make into a pod
    var el = document.getElementById(obj.id);
		if(!el) return;		// element not found
    container.addClass(el,'pod_main');
    // create the pod container with a class of "pod"
    var pod = el.parentNode.insertBefore(document.createElement('div'), el);
    pod.className = 'pod';
    pod.id = obj.id + '_pod';
    if (obj.width) pod.style.width = obj.width;
    // create the top left corner
    var pod_top_left = document.createElement('div');
    pod_top_left.className = 'pod_top_left';
		pod.appendChild(pod_top_left);
		// create the top center
		var pod_top = document.createElement('div');
    pod_top.className = 'pod_top';
		// add a p element to hold our collapse icon and/or title (or blank title bar)
    var p_elem = document.createElement('span');
    
		if((obj.title)||(obj.collapsible)){
      if(obj.collapsible){
        // add an "expand" image
        var imgExpand = document.createElement('img');
        imgExpand.src = container.expandImageSource;
        imgExpand.id='expand_' + obj.id
        imgExpand.setAttribute('title', container.expandImageTooltip);
        if(!obj.collapsed) imgExpand.style.display = 'none';
        p_elem.appendChild(imgExpand);
        container.addEvent(imgExpand,'click', function(){ container.expand(obj.id); });

        // add a "collapse" image
        var imgCollapse = document.createElement('img');
        imgCollapse.src = container.collapseImageSource;
        imgCollapse.id='collapse_' + obj.id
        imgCollapse.setAttribute('title', container.collapseImageTooltip);
        if(obj.collapsed) imgCollapse.style.display = 'none';
        p_elem.appendChild(imgCollapse);
        container.addEvent(imgCollapse,'click', function(){ container.collapse(obj.id); });

        // add a non-breaking space after the image to prepare for a title
        var text_node1 = document.createTextNode('\u00A0');
        p_elem.appendChild(text_node1);
      }
      if(obj.title){
        var text_node2 = document.createTextNode(obj.title);
        p_elem.appendChild(text_node2);
      }
    }else{
			var text_node1 = document.createTextNode('\u00A0');
      p_elem.appendChild(text_node1);
		}
		
		pod_top.appendChild(p_elem);
    pod.appendChild(pod_top);
    // create the upper right corner
    var pod_top_right = document.createElement('div');
    pod_top_right.className = 'pod_top_right';
    pod.appendChild(pod_top_right);
    // now append our original div (which is now pod_main)
    pod.appendChild(el);
    // create the bottom row pod portion
    var pod_bottom = document.createElement('div');
    pod_bottom.className = 'pod_bottom';
    pod.appendChild(pod_bottom);
    // create the bottom row corners
    var pod_bottom_left = document.createElement('div');
    pod_bottom_left.className = 'pod_bottom_left';
    pod_bottom.appendChild(pod_bottom_left);
    var pod_bottom_right = document.createElement('div');
    pod_bottom_right.className = 'pod_bottom_right';
    pod_bottom.appendChild(pod_bottom_right);

    if ((obj.collapsible)&&(obj.collapsed)){
      // if collapsible and collapsed then hide the div
      document.getElementById(obj.id).style.display = 'none';
    }
  },

  expand: function(section){
    var imgExpand   = document.getElementById('expand_' + section);
    var imgCollapse = document.getElementById('collapse_' + section);
    var el          = document.getElementById(section);

    imgExpand.style.display = 'none';
    imgCollapse.style.display = '';
    el.style.display = '';
  },

  collapse: function(section){
    var imgExpand   = document.getElementById('expand_' + section);
    var imgCollapse = document.getElementById('collapse_' + section);
    var el          = document.getElementById(section);

    imgExpand.style.display = '';
    imgCollapse.style.display = 'none';
    el.style.display = 'none';
  }
}