// JavaScript Document

var Accordion = Class.create();

Accordion.prototype = {
  initialize: function(id, tag, name) {
    this.id = id;
    this.headerTag = tag.toUpperCase();
    this.instance = name;
    this.headingClassName = (arguments[3] || "panel");
    this.contentClassName = (arguments[4] || "panelBody");
    this.panels = new Array();

    var tags = $(id).getElementsByTagName('*');    
    for ( var i = 0; i < tags.length; i++) {
      switch(tags.item(i).tagName) {
        case this.headerTag:
          tags.item(i).style.cursor = "pointer";
          tags.item(i).onclick = this._returnEvalCode(this.instance);
          break;

        default:
          if (tags.item(i).className == this.headingClassName) {
            tags[i]._index = this._returnIndex(this.panels.length);
            this.panels[this.panels.length] = tags.item(i);
            //the line above is same meaning as "this.panels.push(tags.item(i));"
            
            if (this.panels.length == 1) {
              tags.item(i).id = "visible";
            }
          }

          if (tags.item(i).className == this.contentClassName) {
            tags.item(i).style.display = "none";
          }
          break;

      }
    }
    this.length = this.panels.length;
    this.show(0, true);
  },

  show: function(index, force) {
    if ( (index >= this.length) || (index < 0) ) {
      //alert("index out of range");
      return;
    }

    if ( $('visible') == this.panels[index] ){
      if (force) {
        //alert("force to show the visible element.");
        for(var i = 0; i < this.length; i++) {
          if(this._body(this.panels[i]).style.display != "none") {
            new Effect.SlideUp(this._body(this.panels[i]));
          }
        }
        new Effect.SlideDown(this._body(this.panels[index]));
        return;
      }
      
      //alert("it's already shown now.");
      return;
    }

    //alert("show another element.");
    new Effect.Parallel(
      [
        new Effect.SlideUp( this._body($('visible')) ),
        new Effect.SlideDown( this._body(this.panels[index]) )
      ], {
        duration: 0.2
      }
    );
  
    $('visible').id = "";
    this.panels[index].id = "visible";
    return;
  },

  _body: function(e) {
    var tags = e.getElementsByTagName('*');
    for( var i=0; i<tags.length; i++) {
      if (tags.item(i).className == this.contentClassName) {
        return tags.item(i);
      }
    }
  },

  _returnIndex: function(i) {
    return function() {
      return i;
    }
  },

  _returnEvalCode: function(s) {
    return function(){
      eval(s + ".show(" + this.parentNode._index() + ");");
    }
  }
};