Button: Clear and set hover state when disabled; (Closes: #5295)

As there is a posibillity that an button is made disabled at the same
time you are hovering above it, we need to make sure it's state are set
to a ground state; The same accounts for if you are enabling a button
while you are hovering above it; then it should enter ui-state-hover.

Question still is if the same should be made for mousedown/mouseup
events...

Author: Carl Fürstenberg

ui/jquery.ui.button.js

@@ -58,6 +58,7 @@ $.widget( "ui.button", {
 
 		this._determineButtonType();
 		this.hasTitle = !!this.buttonElement.attr( "title" );
+		this.isHovering = false; // To be used if "enable" is called while mouse is hovering over a disabled button
 
 		var self = this,
 			options = this.options,
@@ -77,6 +78,7 @@ $.widget( "ui.button", {
 			.addClass( baseClasses )
 			.attr( "role", "button" )
 			.bind( "mouseenter.button", function() {
+				self.isHovering = true;
 				if ( options.disabled ) {
 					return;
 				}
@@ -86,6 +88,7 @@ $.widget( "ui.button", {
 				}
 			})
 			.bind( "mouseleave.button", function() {
+				self.isHovering = false;
 				if ( options.disabled ) {
 					return;
 				}
@@ -230,6 +233,21 @@ $.widget( "ui.button", {
 	},
 
 	_setOption: function( key, value ) {
+		switch( key ) {
+		case 'disabled':
+			if( value ) {
+				// There is a posibillity that the button is made disabled during hovering/clicking etc...
+				// So to be on the safe side, we'll remove all state classes when calling disabled.
+				this.element.removeClass( "ui-state-active ui-state-hover ui-state-focus" )
+			} else {
+				// We could be hovering (statically) over the disabled button and call "enable" on the button,
+				// lets then mark it as in a hovering state.
+				if( this.isHovering ) {
+					this.element.addClass( "ui-state-hover" );
+				}
+			}
+			break;
+		}
 		$.Widget.prototype._setOption.apply( this, arguments );
 		if ( key === "disabled" ) {
 			if ( value ) {