Permalink
Browse files

[buttonMarkup] Track addition/removal of up/down/hover classes to rec…

…onstruct button state during re-enhancement -- Fixes #3637
  • Loading branch information...
1 parent 2e21c6b commit b5db639bb7cd1269c2a86bebab3a42d0db678fe7 @gabrielschulhof gabrielschulhof committed Oct 29, 2012
Showing with 27 additions and 7 deletions.
  1. +27 −7 js/jquery.mobile.buttonMarkup.js
@@ -36,6 +36,8 @@ $.fn.buttonMarkup = function( options ) {
innerClass = "ui-btn-inner",
textClass = "ui-btn-text",
buttonClass, iconClass,
+ hover = false,
+ state = "up",
// Button inner markup
buttonInner,
buttonText,
@@ -60,6 +62,8 @@ $.fn.buttonMarkup = function( options ) {
// We will recreate this icon below
$( buttonElements.icon ).remove();
buttonElements.icon = null;
+ hover = buttonElements.hover;
+ state = buttonElements.state;
}
else {
buttonInner = document.createElement( o.wrapperEls );
@@ -76,7 +80,9 @@ $.fn.buttonMarkup = function( options ) {
o.theme = $.mobile.getInheritedTheme( el, "c" );
}
- buttonClass = "ui-btn ui-btn-up-" + o.theme;
+ buttonClass = "ui-btn ";
+ buttonClass += ( hover ? "ui-btn-hover-" + o.theme : "" );
+ buttonClass += ( state ? " ui-btn-" + state + "-" + o.theme : "" );
buttonClass += o.shadow ? " ui-shadow" : "";
buttonClass += o.corners ? " ui-btn-corner-all" : "";
@@ -145,6 +151,8 @@ $.fn.buttonMarkup = function( options ) {
// Assign a structure containing the elements of this button to the elements of this button. This
// will allow us to recognize this as an already-enhanced button in future calls to buttonMarkup().
buttonElements = {
+ hover : hover,
+ state : state,
bcls : buttonClass,
outer : e,
inner : buttonInner,
@@ -189,6 +197,18 @@ function closestEnabledButton( element ) {
return element;
}
+function updateButtonClass( $btn, classToRemove, classToAdd, hover, state ) {
+ var buttonElements = $.data( $btn[ 0 ], "buttonElements" );
+ $btn.removeClass( classToRemove ).addClass( classToAdd );
+ if ( buttonElements ) {
+ buttonElements.bcls = $btn[ 0 ].className;
+ if ( hover !== undefined ) {
+ buttonElements.hover = hover;
+ }
+ buttonElements.state = state;
+ }
+}
+
var attachEvents = function() {
var hoverDelay = $.mobile.buttonMarkup.hoverDelay, hov, foc;
@@ -206,24 +226,24 @@ var attachEvents = function() {
if ( isTouchEvent ) {
// Use a short delay to determine if the user is scrolling before highlighting
hov = setTimeout( function() {
- $btn.removeClass( "ui-btn-up-" + theme ).addClass( "ui-btn-down-" + theme );
+ updateButtonClass( $btn, "ui-btn-up-" + theme, "ui-btn-down-" + theme, undefined, "down" );
}, hoverDelay );
} else {
- $btn.removeClass( "ui-btn-up-" + theme ).addClass( "ui-btn-down-" + theme );
+ updateButtonClass( $btn, "ui-btn-up-" + theme, "ui-btn-down-" + theme, undefined, "down" );
}
} else if ( evt === "vmousecancel" || evt === "vmouseup" ) {
- $btn.removeClass( "ui-btn-down-" + theme ).addClass( "ui-btn-up-" + theme );
+ updateButtonClass( $btn, "ui-btn-down-" + theme, "ui-btn-up-" + theme, undefined, "up" );
} else if ( evt === "vmouseover" || evt === "focus" ) {
if ( isTouchEvent ) {
// Use a short delay to determine if the user is scrolling before highlighting
foc = setTimeout( function() {
- $btn.removeClass( "ui-btn-up-" + theme ).addClass( "ui-btn-hover-" + theme );
+ updateButtonClass( $btn, "ui-btn-up-" + theme, "ui-btn-hover-" + theme, true, "" );
}, hoverDelay );
} else {
- $btn.removeClass( "ui-btn-up-" + theme ).addClass( "ui-btn-hover-" + theme );
+ updateButtonClass( $btn, "ui-btn-up-" + theme, "ui-btn-hover-" + theme, true, "" );
}
} else if ( evt === "vmouseout" || evt === "blur" || evt === "scrollstart" ) {
- $btn.removeClass( "ui-btn-hover-" + theme + " ui-btn-down-" + theme ).addClass( "ui-btn-up-" + theme );
+ updateButtonClass( $btn, "ui-btn-hover-" + theme + " ui-btn-down-" + theme, "ui-btn-up-" + theme, false, "up" );
if ( hov ) {
clearTimeout( hov );
}

0 comments on commit b5db639

Please sign in to comment.