Using button widget for the spinner buttons. Can still use some improvements, droppin...

diff --git a/ui/jquery.ui.spinner.js b/ui/jquery.ui.spinner.js
index 4fc77389b449a03cc41155c4a559f4923f4352ec..f4227b8f6eec9f1e3eae1404253f334d0d4349e1 100644 (file)
--- a/ui/jquery.ui.spinner.js
+++ b/ui/jquery.ui.spinner.js
@@ -101,16 +101,18 @@ $.widget('ui.spinner', {
                // button bindings\r
                this.buttons = uiSpinner.find('.ui-spinner-button')\r
                        .attr("tabIndex", -1)\r
+                       .button()\r
+                       .first()\r
+                               .removeClass("ui-corner-all")\r
+                       .end()\r
+                       .last()\r
+                               .removeClass("ui-corner-all")\r
+                       .end()\r
                        .bind('mousedown', function(event) {                            \r
                                if (self._start(event) === false) {\r
                                        return false;\r
                                }\r
                                self._repeat(null, $(this).hasClass('ui-spinner-up') ? 1 : -1, event);\r
-                               \r
-                               if (!self.options.disabled) {\r
-                                       $(this).addClass(active);\r
-                                       uiSpinner.addClass(active);\r
-                               }\r
                        })\r
                        .bind('mouseup', function(event) {\r
                                if (self.counter == 1) {\r
@@ -120,19 +122,22 @@ $.widget('ui.spinner', {
                                        self._stop(event);\r
                                        self._change(event);                                    \r
                                }\r
-                               $(this).removeClass(active);\r
                        })\r
-                       .hover(function() {\r
-                               if (!self.options.disabled) {\r
-                                       $(this).addClass(hover);                                        \r
+                       .bind("mouseenter", function() {\r
+                               // button will add ui-state-active if mouse was down while mouseleave and kept down\r
+                               if ($(this).hasClass("ui-state-active")) {\r
+                                       if (self._start(event) === false) {\r
+                                               return false;\r
+                                       }\r
+                                       self._repeat(null, $(this).hasClass('ui-spinner-up') ? 1 : -1, event);\r
                                }\r
-                       }, function(event) {\r
-                               $(this).removeClass(active + ' ' + hover);\r
+                       })\r
+                       .bind("mouseleave", function() {\r
                                if (self.timer && self.spinning) {\r
                                        self._stop(event);\r
                                        self._change(event);\r
                                }\r
-                       });\r
+                       })\r
                                        \r
                self.uiSpinner = uiSpinner;\r
        },\r
@@ -143,9 +148,9 @@ $.widget('ui.spinner', {
                                '"></div>';\r
        },\r
        _buttonHtml: function() {\r
-               return '<a class="ui-spinner-button ui-spinner-up ui-state-default ui-corner-t' + this.options.dir.substr(-1,1) + \r
+               return '<a class="ui-spinner-button ui-spinner-up ui-corner-t' + this.options.dir.substr(-1,1) + \r
                                '"><span class="ui-icon ui-icon-triangle-1-n">&#9650;</span></a>' +\r
-                               '<a class="ui-spinner-button ui-spinner-down ui-state-default ui-corner-b' + this.options.dir.substr(-1,1) + \r
+                               '<a class="ui-spinner-button ui-spinner-down ui-corner-b' + this.options.dir.substr(-1,1) + \r
                                '"><span class="ui-icon ui-icon-triangle-1-s">&#9660;</span></a>';\r
        },\r
        _start: function(event) {\r