Effect.Style = Class.create(Effect.Base, {
  initialize: function( element, style, options ) {
	this.style = style;
  	this.blind_options = options;
	this.effect_state = 'from';
	this.element = $(element);
  },
  toggle_effect: function() {
  	this.effect_state == 'from' ?
	  this.start_effect() :
	  this.rewind_effect();
  },
  start_effect: function() {
  	if( this.effect_state == 'to' )
  		return;
  	var now = 0.0;
  	if( this.position )
	 	now = this.position;
  	this.effect_state = 'to';
  	this.start( Object.extend( this.blind_options, { from: now, to: 1.0 } ));
  },
  rewind_effect: function() {
    if( this.effect_state == 'from' )
      return;
  	var now = 1.0;
    if( this.position )
		  now = this.position;
		this.effect_state = 'from';
		this.start( Object.extend( this.blind_options, { from: now, to: 0.0 } ));
  },
  calculate_style: function( position ) {
  	var distance = this.blind_options.end - this.blind_options.start;
	return position * distance + this.blind_options.start;
  },
  update: function( position ) {
  	var styles = {}
	styles[ this.style ] = this.calculate_style( position ) + 'px';
  	this.element.setStyle( styles );
  }
});

Event.observe(window, 'load', loadblinds, false);	
function loadblinds() 
{
	$$('#vertical_container > div > ul').each
  (
    function(drop) 
    {
        drop.removeClassName("onLoad");
        if(!drop.previous().hasClassName('activebuddy'))
          {
          drop.makeClipping();
          var drop_height = drop.getHeight();
          var blind_duration = drop_height / 350;
          drop.blind = new Effect.Style(drop, 'height', {	start: 0, end: drop_height, duration: blind_duration, delay: 0 });
          drop.setStyle({height:'0px'});
        }
    }
  );
  
  $$('#vertical_container > div').each
  (
    function(div)
    {
      var h2 = div.select("h2")[0];
      if(!h2.hasClassName('activebuddy') && !div.hasClassName('singlebuddy'))
      {
        var ul = div.select('ul')[0];
        div.observe
        (
          'mouseover',
          function()
          {
            h2.addClassName('accordion_toggle_active');
            if(ul)
              ul.blind.start_effect();
          }
        );
        div.observe
        (
          'mouseout',
          function()
          {
            h2.removeClassName('accordion_toggle_active');
            
            if(ul)
              ul.blind.rewind_effect();
          }
        );

      }
    }
  );
}
