/**
 * @class
 * <p>Simple accordion widget.</p>
 *
 * <p>Expects the accordion to be inside a container with a unique <code>id</code>, and within
 * that container expects to find links with class <code>trigger</code>, each of which should have
 * an <code>href</code> pointing to the <code>id</code> of an element to expand when that link is
 * clicked.</p>
 *
 * @constructor
 * @param {String} id The <code>id</code> of the containing element of the accordion structure.
 * @param {String} initial The <code>id</code> of the content area which will be initially expanded.
 */
WOL.widget.accordion = function(id, initial) {
   /**
    * The containing element.
    * @type HTMLElement
    */
   this.container = document.getElementById(id);
   
   /**
    * List of links which trigger accordion behavior.
    * @type Array
    */
   this.triggerLinks = Dom.getElementsByClassName('trigger', 'a', this.container);
   
   /**
    * List of content areas which can be expanded/collapsed.
    * @type Object
    */
   this.contentAreas = {};
   for(var i=0, max=this.triggerLinks.length; i<max; i++) {
      var contentId = this.triggerLinks[i].href.split('#')[1];
      var elem = document.getElementById(contentId);
      // Ugly hack to work around IE's habit of returning "auto" instead of computed height.
      var elementExtent = Dom.getRegion(elem);
      this.contentAreas[contentId] = { element: elem,
                                       originalHeight: elementExtent.bottom - elementExtent.top
                                     };
      if(typeof(initial) != 'undefined') {
	 if(contentId != initial) {
            Dom.setStyle(this.contentAreas[contentId].element, 'height', 0);
	 } else {
            this.activeContent = this.contentAreas[contentId].element;
	 };
      } else {
	 Dom.setStyle(this.contentAreas[contentId].element, 'height', 0);
	 this.activeContent = null;
      };
   };
   
   Evt.addListener(this.container, 'click', this.toggle, this);
   
};

/**
 * In response to a mouse click on one of the accordion links, expands the newly-selected
 * item and collapses the previous one.
 *
 * @param {Event} e The mouse click event.
 * @param {accordion} instance The instance of <code>accordion</code> in use.
 */
WOL.widget.accordion.prototype.toggle = function(e, instance) {
   var target = WOL.util.Evt.getTargetByTagName(e, 'A');
   if(target && Dom.hasClass(target, 'trigger')) {
      Evt.preventDefault(e);
      var contentId = target.href.split('#')[1];
      if(instance.activeContent) {
	 if(contentId != instance.activeContent.id && instance.contentAreas[contentId]) {
            var closeAnim = new Anim(instance.activeContent.id,
                                     { height: { to: 0 }},
                                     0.2,
                                     YAHOO.util.Easing.easeNone);
	 };
      };
      if(instance.contentAreas[contentId]) {
	 var openAnim = new Anim(contentId,
                                 { height: { to: instance.contentAreas[contentId].originalHeight }},
                                 0.2,
                                 YAHOO.util.Easing.easeNone);
      };
      if(typeof(closeAnim) != 'undefined') {
         closeAnim.animate();
      };
      if(typeof(openAnim != 'undefined')) {
         openAnim.animate();
         instance.activeContent = instance.contentAreas[contentId].element;
      };
   };
};