Forms = Class.create();

Event.observe( window, 'load', function() { 
   var forms = $$( 'form.ajax' );

   forms.each( function( f ) { 
      new Forms.Form( f ); 
   } );
} );


Forms.Form = Class.create();

Forms.Form.prototype = {
   initialize: function( element ) {
      this.element = $( element );
      this.output = this.element.previous( '.output' );
      this.noclear = this.element.hasClassName( 'noclear' );
      this.output.hide();

      Event.observe( this.element, 'submit', 
         this.submit.bindAsEventListener( this ) );
   },

   submit: function( event ) {
      if( this.output.visible() ) {
         this.output.className = "";
         this.output.addClassName( 'neutral' );
         this.output.innerHTML = 'Loading...';
      }

      this.element.request( {
         onComplete: this.complete.bind( this )    
      } );

      Event.stop( event );
   },

   complete: function( response ) {
      var response = response.responseText.evalJSON();

      this.output.className = "";
      this.output.addClassName( response.type );
      this.output.innerHTML = response.message;

      Effect.Appear( this.output, { from: 0.0 } );

      if( response.type == "success" && this.noclear == false )
         Form.reset( this.element );
   }

}