

/**
 * ButtonHandler class witch replaces all input.btn elements by a custom
 * button element.
 *
 * @author  Bob Gaudaen
 */

var ButtonHandler = Class.create({
	/**
	 * Constructor
	 */
	initialize: function() {},
	
	/**
	 * Collects all button inputs and replaces them with a customized button.
	 */
	run: function( container ) {
		var inputList;
		if ( typeof(container) == 'undefined' )
			inputList = $$( 'input.btn' );
		else
			inputList = $(container).getElementsBySelector( 'input.btn' );
		
		var nbInputs = inputList.length;
		for ( var i=0; i<nbInputs; ++i )
			this.createButtonFromInput(inputList[i]);
	},
	
	/**
	 * Return a DOM element representing the button.
	 *
	 * @return Element A button element.
	 */
	getButton: function( type ) {
		var btn, span = document.createElement('span');
		type = type || 'submit';
		if ( Prototype.Browser.IE ) {
			btn = '<button type="'+type+'" onmouseover="$(this).addClassName(\'hover\');" onmouseout="$(this).removeClassName(\'hover\');"></button>';
			btn = document.createElement(btn);
		} else {
			btn = document.createElement('button');
			btn.setAttribute( 'type', type );
			btn.setAttribute( 'onmouseover', "$(this).addClassName('hover');" );
			btn.setAttribute( 'onmouseout', "$(this).removeClassName('hover');" );
		}
		btn.appendChild(span.cloneNode(true)).appendChild(span.cloneNode(true)).appendChild(span.cloneNode(true)).appendChild(span.cloneNode(true));
		return $(btn);
	},
	
	/**
	 * Replaces the input by a custom button element.
	 *
	 * @param input  DOM input element
	 */
	createButtonFromInput: function( input )
	{
		// Get a dom button:
		var btn = this.getButton( input.getAttribute('type') );
		// Defines the label for the button:
		var label = input.getAttribute('value') == null ? 'Button':input.getAttribute('value');
		// Sets the label:
		btn.down().down().down().down().update( label );
		// Removes value attribute:
		input.removeAttribute('value');
		//
		btn.setAttribute( 'id', input.getAttribute('id') );
		btn.setAttribute( 'name', input.getAttribute('name') );
		//
		for ( var i=0; i<input.attributes.length; ++i ) {
			if ( input.attributes[i].specified === true && input.attributes[i].nodeName.indexOf('on') === 0 )
				btn.setAttribute( input.attributes[i].nodeName, input.getAttribute(input.attributes[i].nodeName) );
		}
		// Replaces the current input by the new button:
		// input.replace( btn ) > doesn't work on opera
		Element.wrap(input,'div').replace(btn);
	}
});

Object.extend( Form.Element.Serializers, {
	button: function() {
		return Form.Element.Serializers.textarea.apply( null, arguments );
	}
});

// Extend Form.Element.Methods for disabled status
Form.Element.ButtonHandler = {
	$disable: Form.Element.Methods.disable,
	$enable: Form.Element.Methods.enable,
	
	disable: function() {
		var elmt = Form.Element.ButtonHandler.$disable.apply( null, arguments );
		elmt.removeClassName('hover');
		elmt.addClassName('disabled');
		return elmt;
	},
	enable: function() {
		var elmt = Form.Element.ButtonHandler.$enable.apply( null, arguments );
		elmt.removeClassName('disabled');
		return elmt;
	}
};
Object.extend( Form.Element.Methods, Form.Element.ButtonHandler );
Element.addMethods( 'button', Form.Element.Methods );

// Run button handler on dynamically genereted html:
if ( typeof(Service) != 'undefined' ) {
	try {
		var old_onUpdate = Service.prototype.onUpdate;
		Object.extend( Service.prototype, {
			onUpdate: function() {
				old_onUpdate.apply( this, arguments );
				buttonHandler.run(this);
			}
		});
	} catch (e) {}
}

// New instance:
var buttonHandler = new ButtonHandler();
// Creates an instance of the button handler when DOM has finished loading:
Event.observe( window, 'load', function() { buttonHandler.run(); } );
