Date: Fri, 21 Aug 2015 00:12:17 -0400
Subject: [PATCH 18/26] Effects: Style updates
---
demos/effect/default.html | 8 +-
demos/effect/easing.html | 10 +-
demos/effect/hide.html | 8 +-
demos/effect/show.html | 6 +-
demos/effect/toggle.html | 6 +-
tests/unit/effects/core.js | 10 +-
ui/effect.js | 365 ++++++++++++++++++-----------------
ui/effects/effect-bounce.js | 13 +-
ui/effects/effect-explode.js | 10 +-
9 files changed, 227 insertions(+), 209 deletions(-)
diff --git a/demos/effect/default.html b/demos/effect/default.html
index bd28652a6b3..59479539f45 100644
--- a/demos/effect/default.html
+++ b/demos/effect/default.html
@@ -19,7 +19,7 @@
// get effect type from
var selectedEffect = $( "#effectTypes" ).val();
- // most effect types need no options passed by default
+ // Most effect types need no options passed by default
var options = {};
// some effects have required parameters
if ( selectedEffect === "scale" ) {
@@ -30,18 +30,18 @@
options = { to: { width: 200, height: 60 } };
}
- // run the effect
+ // Run the effect
$( "#effect" ).effect( selectedEffect, options, 500, callback );
};
- // callback function to bring a hidden box back
+ // Callback function to bring a hidden box back
function callback() {
setTimeout(function() {
$( "#effect" ).removeAttr( "style" ).hide().fadeIn();
}, 1000 );
};
- // set effect from select menu value
+ // Set effect from select menu value
$( "#button" ).on( "click", function() {
runEffect();
return false;
diff --git a/demos/effect/easing.html b/demos/effect/easing.html
index 5985dc69919..7d5f4b98281 100644
--- a/demos/effect/easing.html
+++ b/demos/effect/easing.html
@@ -37,7 +37,7 @@
ctx = canvas.getContext( "2d" );
ctx.fillStyle = "black";
- // draw background
+ // Draw background
ctx.beginPath();
ctx.moveTo( cradius, 0 );
ctx.quadraticCurveTo( 0, 0, 0, cradius );
@@ -49,21 +49,21 @@
ctx.lineTo( cradius, 0 );
ctx.fill();
- // draw bottom line
+ // Draw bottom line
ctx.strokeStyle = "#555";
ctx.beginPath();
ctx.moveTo( width * 0.1, drawHeight + .5 );
ctx.lineTo( width * 0.9, drawHeight + .5 );
ctx.stroke();
- // draw top line
+ // Draw top line
ctx.strokeStyle = "#555";
ctx.beginPath();
ctx.moveTo( width * 0.1, drawHeight * .3 - .5 );
ctx.lineTo( width * 0.9, drawHeight * .3 - .5 );
ctx.stroke();
- // plot easing
+ // Plot easing
ctx.strokeStyle = "white";
ctx.beginPath();
ctx.lineWidth = 2;
@@ -76,7 +76,7 @@
});
ctx.stroke();
- // animate on click
+ // Animate on click
graph.on( "click", function() {
wrap
.animate( { height: "hide" }, 2000, name )
diff --git a/demos/effect/hide.html b/demos/effect/hide.html
index 1fcd6477e1f..38ac3e157f8 100644
--- a/demos/effect/hide.html
+++ b/demos/effect/hide.html
@@ -18,7 +18,7 @@
// get effect type from
var selectedEffect = $( "#effectTypes" ).val();
- // most effect types need no options passed by default
+ // Most effect types need no options passed by default
var options = {};
// some effects have required parameters
if ( selectedEffect === "scale" ) {
@@ -27,18 +27,18 @@
options = { to: { width: 200, height: 60 } };
}
- // run the effect
+ // Run the effect
$( "#effect" ).hide( selectedEffect, options, 1000, callback );
};
- // callback function to bring a hidden box back
+ // Callback function to bring a hidden box back
function callback() {
setTimeout(function() {
$( "#effect" ).removeAttr( "style" ).hide().fadeIn();
}, 1000 );
};
- // set effect from select menu value
+ // Set effect from select menu value
$( "#button" ).on( "click", function() {
runEffect();
});
diff --git a/demos/effect/show.html b/demos/effect/show.html
index 4bb0919e485..19a6cca973d 100644
--- a/demos/effect/show.html
+++ b/demos/effect/show.html
@@ -18,7 +18,7 @@
// get effect type from
var selectedEffect = $( "#effectTypes" ).val();
- // most effect types need no options passed by default
+ // Most effect types need no options passed by default
var options = {};
// some effects have required parameters
if ( selectedEffect === "scale" ) {
@@ -27,7 +27,7 @@
options = { to: { width: 280, height: 185 } };
}
- // run the effect
+ // Run the effect
$( "#effect" ).show( selectedEffect, options, 500, callback );
};
@@ -38,7 +38,7 @@
}, 1000 );
};
- // set effect from select menu value
+ // Set effect from select menu value
$( "#button" ).on( "click", function() {
runEffect();
});
diff --git a/demos/effect/toggle.html b/demos/effect/toggle.html
index 65c4747a907..7ecf8c9c0dd 100644
--- a/demos/effect/toggle.html
+++ b/demos/effect/toggle.html
@@ -33,7 +33,7 @@
// get effect type from
var selectedEffect = $( "#effectTypes" ).val();
- // most effect types need no options passed by default
+ // Most effect types need no options passed by default
var options = {};
// some effects have required parameters
if ( selectedEffect === "scale" ) {
@@ -42,11 +42,11 @@
options = { to: { width: 200, height: 60 } };
}
- // run the effect
+ // Run the effect
$( "#effect" ).toggle( selectedEffect, options, 500 );
};
- // set effect from select menu value
+ // Set effect from select menu value
$( "#button" ).on( "click", function() {
runEffect();
});
diff --git a/tests/unit/effects/core.js b/tests/unit/effects/core.js
index c8e7c26321d..5f634a78293 100644
--- a/tests/unit/effects/core.js
+++ b/tests/unit/effects/core.js
@@ -30,7 +30,7 @@ function notPresent( value, array, message ) {
// minDuration is used for "short" animate tests where we are only concerned about the final
var minDuration = 15,
- // duration is used for "long" animates where we plan on testing properties during animation
+ // Duration is used for "long" animates where we plan on testing properties during animation
duration = 200;
module( "effects.core" );
@@ -115,11 +115,11 @@ asyncTest( "animateClass works with colors", function() {
expect(2);
- // we want to catch the first frame of animation
+ // We want to catch the first frame of animation
jQuery.fx.step.backgroundColor = function( fx ) {
oldStep.apply( this, arguments );
- // make sure it has animated somewhere we can detect
+ // Make sure it has animated somewhere we can detect
if ( fx.pos > 255 / 2000 ) {
jQuery.fx.step.backgroundColor = oldStep;
notPresent( test.css("backgroundColor"),
@@ -206,14 +206,14 @@ function( assert ) {
expect( 2 );
var test = $( "div.ticket7106" );
- // ensure the class stays and that the css property stays
+ // Ensure the class stays and that the css property stays
function animationComplete() {
assert.hasClasses( test, "testClass", "class change during animateClass was not lost" );
equal( test.height(), 100, "css change during animateClass was not lost" );
start();
}
- // add a class and change a style property after starting an animated class
+ // Add a class and change a style property after starting an animated class
test.addClass( "animate", minDuration, animationComplete )
.addClass( "testClass" )
.height( 100 );
diff --git a/ui/effect.js b/ui/effect.js
index 7fa45cfc0c6..322c31a981f 100644
--- a/ui/effect.js
+++ b/ui/effect.js
@@ -13,7 +13,7 @@
//>>docs: http://api.jqueryui.com/category/effects-core/
//>>demos: http://jqueryui.com/effect/
-(function( factory ) {
+( function( factory ) {
if ( typeof define === "function" && define.amd ) {
// AMD. Register as an anonymous module.
@@ -23,7 +23,7 @@
// Browser globals
factory( jQuery );
}
-}(function( $ ) {
+}( function( $ ) {
var dataSpace = "ui-effects-",
dataSpaceStyle = "ui-effects-style",
@@ -47,13 +47,14 @@ $.effects = {
*
* Date: Wed Jan 16 08:47:09 2013 -0600
*/
-(function( jQuery, undefined ) {
+( function( jQuery, undefined ) {
var stepHooks = "backgroundColor borderBottomColor borderLeftColor borderRightColor borderTopColor color columnRuleColor outlineColor textDecorationColor textEmphasisColor",
- // plusequals test for += 100 -= 100
+ // Plusequals test for += 100 -= 100
rplusequals = /^([\-+])=\s*(\d+\.?\d*)/,
- // a set of RE's that can match strings and generate color tuples.
+
+ // A set of RE's that can match strings and generate color tuples.
stringParsers = [ {
re: /rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*(\d?(?:\.\d+)?)\s*)?\)/,
parse: function( execResult ) {
@@ -75,7 +76,8 @@ $.effects = {
];
}
}, {
- // this regex ignores A-F because it's compared against an already lowercased string
+
+ // This regex ignores A-F because it's compared against an already lowercased string
re: /#([a-f0-9]{2})([a-f0-9]{2})([a-f0-9]{2})/,
parse: function( execResult ) {
return [
@@ -85,7 +87,8 @@ $.effects = {
];
}
}, {
- // this regex ignores A-F because it's compared against an already lowercased string
+
+ // This regex ignores A-F because it's compared against an already lowercased string
re: /#([a-f0-9])([a-f0-9])([a-f0-9])/,
parse: function( execResult ) {
return [
@@ -107,7 +110,7 @@ $.effects = {
}
} ],
- // jQuery.Color( )
+ // JQuery.Color( )
color = jQuery.Color = function( color, green, blue, alpha ) {
return new jQuery.Color.fn.parse( color, green, blue, alpha );
},
@@ -161,20 +164,20 @@ $.effects = {
},
support = color.support = {},
- // element for support tests
+ // Element for support tests
supportElem = jQuery( "" )[ 0 ],
- // colors = jQuery.Color.names
+ // Colors = jQuery.Color.names
colors,
- // local aliases of functions called often
+ // Local aliases of functions called often
each = jQuery.each;
-// determine rgba support immediately
+// Determine rgba support immediately
supportElem.style.cssText = "background-color:rgba(1,1,1,.5)";
support.rgba = supportElem.style.backgroundColor.indexOf( "rgba" ) > -1;
-// define cache name and alpha properties
+// Define cache name and alpha properties
// for rgba and hsla spaces
each( spaces, function( spaceName, space ) {
space.cache = "_" + spaceName;
@@ -183,13 +186,13 @@ each( spaces, function( spaceName, space ) {
type: "percent",
def: 1
};
-});
+} );
function clamp( value, prop, allowEmpty ) {
var type = propTypes[ prop.type ] || {};
if ( value == null ) {
- return (allowEmpty || !prop.def) ? null : prop.def;
+ return ( allowEmpty || !prop.def ) ? null : prop.def;
}
// ~~ is an short way of doing floor for positive numbers
@@ -202,12 +205,13 @@ function clamp( value, prop, allowEmpty ) {
}
if ( type.mod ) {
- // we add mod before modding to make sure that negatives values
+
+ // We add mod before modding to make sure that negatives values
// get converted properly: -10 -> 350
- return (value + type.mod) % type.mod;
+ return ( value + type.mod ) % type.mod;
}
- // for now all property types without mod have min and max
+ // For now all property types without mod have min and max
return 0 > value ? 0 : type.max < value ? type.max : value;
}
@@ -226,20 +230,20 @@ function stringParse( string ) {
if ( values ) {
parsed = inst[ spaceName ]( values );
- // if this was an rgba parse the assignment might happen twice
+ // If this was an rgba parse the assignment might happen twice
// oh well....
inst[ spaces[ spaceName ].cache ] = parsed[ spaces[ spaceName ].cache ];
rgba = inst._rgba = parsed._rgba;
- // exit each( stringParsers ) here because we matched
+ // Exit each( stringParsers ) here because we matched
return false;
}
- });
+ } );
// Found a stringParser that handled it
if ( rgba.length ) {
- // if this came from a parsed string, force "transparent" when alpha is 0
+ // If this came from a parsed string, force "transparent" when alpha is 0
// chrome, (and maybe others) return "transparent" as rgba(0,0,0,0)
if ( rgba.join() === "0,0,0,0" ) {
jQuery.extend( rgba, colors.transparent );
@@ -247,7 +251,7 @@ function stringParse( string ) {
return inst;
}
- // named colors
+ // Named colors
return colors[ string ];
}
@@ -266,7 +270,7 @@ color.fn = jQuery.extend( color.prototype, {
type = jQuery.type( red ),
rgba = this._rgba = [];
- // more than 1 argument specified - assume ( red, green, blue, alpha )
+ // More than 1 argument specified - assume ( red, green, blue, alpha )
if ( green !== undefined ) {
red = [ red, green, blue, alpha ];
type = "array";
@@ -279,7 +283,7 @@ color.fn = jQuery.extend( color.prototype, {
if ( type === "array" ) {
each( spaces.rgba.props, function( key, prop ) {
rgba[ prop.idx ] = clamp( red[ prop.idx ], prop );
- });
+ } );
return this;
}
@@ -289,16 +293,16 @@ color.fn = jQuery.extend( color.prototype, {
if ( red[ space.cache ] ) {
inst[ space.cache ] = red[ space.cache ].slice();
}
- });
+ } );
} else {
each( spaces, function( spaceName, space ) {
var cache = space.cache;
each( space.props, function( key, prop ) {
- // if the cache doesn't exist, and we know how to convert
+ // If the cache doesn't exist, and we know how to convert
if ( !inst[ cache ] && space.to ) {
- // if the value was null, we don't need to copy it
+ // If the value was null, we don't need to copy it
// if the key was alpha, we don't need to copy it either
if ( key === "alpha" || red[ key ] == null ) {
return;
@@ -306,20 +310,21 @@ color.fn = jQuery.extend( color.prototype, {
inst[ cache ] = space.to( inst._rgba );
}
- // this is the only case where we allow nulls for ALL properties.
+ // This is the only case where we allow nulls for ALL properties.
// call clamp with alwaysAllowEmpty
inst[ cache ][ prop.idx ] = clamp( red[ key ], prop, true );
- });
+ } );
- // everything defined but alpha?
+ // Everything defined but alpha?
if ( inst[ cache ] && jQuery.inArray( null, inst[ cache ].slice( 0, 3 ) ) < 0 ) {
- // use the default of 1
+
+ // Use the default of 1
inst[ cache ][ 3 ] = 1;
if ( space.from ) {
inst._rgba = space.from( inst[ cache ] );
}
}
- });
+ } );
}
return this;
}
@@ -332,17 +337,17 @@ color.fn = jQuery.extend( color.prototype, {
each( spaces, function( _, space ) {
var localCache,
isCache = is[ space.cache ];
- if (isCache) {
+ if ( isCache ) {
localCache = inst[ space.cache ] || space.to && space.to( inst._rgba ) || [];
each( space.props, function( _, prop ) {
if ( isCache[ prop.idx ] != null ) {
same = ( isCache[ prop.idx ] === localCache[ prop.idx ] );
return same;
}
- });
+ } );
}
return same;
- });
+ } );
return same;
},
_space: function() {
@@ -352,7 +357,7 @@ color.fn = jQuery.extend( color.prototype, {
if ( inst[ space.cache ] ) {
used.push( spaceName );
}
- });
+ } );
return used.pop();
},
transition: function( other, distance ) {
@@ -370,11 +375,12 @@ color.fn = jQuery.extend( color.prototype, {
endValue = end[ index ],
type = propTypes[ prop.type ] || {};
- // if null, don't override start value
+ // If null, don't override start value
if ( endValue === null ) {
return;
}
- // if null - use end
+
+ // If null - use end
if ( startValue === null ) {
result[ index ] = endValue;
} else {
@@ -387,11 +393,12 @@ color.fn = jQuery.extend( color.prototype, {
}
result[ index ] = clamp( ( endValue - startValue ) * distance + startValue, prop );
}
- });
+ } );
return this[ spaceName ]( result );
},
blend: function( opaque ) {
- // if we are already opaque - return ourself
+
+ // If we are already opaque - return ourself
if ( this._rgba[ 3 ] === 1 ) {
return this;
}
@@ -402,13 +409,13 @@ color.fn = jQuery.extend( color.prototype, {
return color( jQuery.map( rgb, function( v, i ) {
return ( 1 - a ) * blend[ i ] + a * v;
- }));
+ } ) );
},
toRgbaString: function() {
var prefix = "rgba(",
rgba = jQuery.map( this._rgba, function( v, i ) {
return v == null ? ( i > 2 ? 1 : 0 ) : v;
- });
+ } );
if ( rgba[ 3 ] === 1 ) {
rgba.pop();
@@ -424,12 +431,12 @@ color.fn = jQuery.extend( color.prototype, {
v = i > 2 ? 1 : 0;
}
- // catch 1 and 2
+ // Catch 1 and 2
if ( i && i < 3 ) {
v = Math.round( v * 100 ) + "%";
}
return v;
- });
+ } );
if ( hsla[ 3 ] === 1 ) {
hsla.pop();
@@ -447,18 +454,18 @@ color.fn = jQuery.extend( color.prototype, {
return "#" + jQuery.map( rgba, function( v ) {
- // default to 0 when nulls exist
+ // Default to 0 when nulls exist
v = ( v || 0 ).toString( 16 );
return v.length === 1 ? "0" + v : v;
- }).join("");
+ } ).join( "" );
},
toString: function() {
return this._rgba[ 3 ] === 0 ? "transparent" : this.toRgbaString();
}
-});
+} );
color.fn.parse.prototype = color.fn;
-// hsla conversions adapted from:
+// Hsla conversions adapted from:
// https://code.google.com/p/maashaack/source/browse/packages/graphics/trunk/src/graphics/colors/HUE2RGB.as?r=5021
function hue2rgb( p, q, h ) {
@@ -466,7 +473,7 @@ function hue2rgb( p, q, h ) {
if ( h * 6 < 1 ) {
return p + ( q - p ) * h * 6;
}
- if ( h * 2 < 1) {
+ if ( h * 2 < 1 ) {
return q;
}
if ( h * 3 < 2 ) {
@@ -500,7 +507,7 @@ spaces.hsla.to = function( rgba ) {
h = ( 60 * ( r - g ) / diff ) + 240;
}
- // chroma (diff) == 0 means greyscale which, by definition, saturation = 0%
+ // Chroma (diff) == 0 means greyscale which, by definition, saturation = 0%
// otherwise, saturation is based on the ratio of chroma (diff) to lightness (add)
if ( diff === 0 ) {
s = 0;
@@ -509,7 +516,7 @@ spaces.hsla.to = function( rgba ) {
} else {
s = diff / ( 2 - add );
}
- return [ Math.round(h) % 360, s, l, a == null ? 1 : a ];
+ return [ Math.round( h ) % 360, s, l, a == null ? 1 : a ];
};
spaces.hsla.from = function( hsla ) {
@@ -537,10 +544,10 @@ each( spaces, function( spaceName, space ) {
to = space.to,
from = space.from;
- // makes rgba() and hsla()
+ // Makes rgba() and hsla()
color.fn[ spaceName ] = function( value ) {
- // generate a cache for this space if it doesn't exist
+ // Generate a cache for this space if it doesn't exist
if ( to && !this[ cache ] ) {
this[ cache ] = to( this._rgba );
}
@@ -559,7 +566,7 @@ each( spaces, function( spaceName, space ) {
val = local[ prop.idx ];
}
local[ prop.idx ] = clamp( val, prop );
- });
+ } );
if ( from ) {
ret = color( from( local ) );
@@ -570,9 +577,10 @@ each( spaces, function( spaceName, space ) {
}
};
- // makes red() green() blue() alpha() hue() saturation() lightness()
+ // Makes red() green() blue() alpha() hue() saturation() lightness()
each( props, function( key, prop ) {
- // alpha is included in more than one space
+
+ // Alpha is included in more than one space
if ( color.fn[ key ] ) {
return;
}
@@ -603,10 +611,10 @@ each( spaces, function( spaceName, space ) {
local[ prop.idx ] = value;
return this[ fn ]( local );
};
- });
-});
+ } );
+} );
-// add cssHook and .fx.step function for each named hook.
+// Add cssHook and .fx.step function for each named hook.
// accept a space separated string of properties
color.hook = function( hook ) {
var hooks = hook.split( " " );
@@ -621,7 +629,7 @@ color.hook = function( hook ) {
if ( !support.rgba && value._rgba[ 3 ] !== 1 ) {
curElem = hook === "backgroundColor" ? elem.parentNode : elem;
while (
- (backgroundColor === "" || backgroundColor === "transparent") &&
+ ( backgroundColor === "" || backgroundColor === "transparent" ) &&
curElem && curElem.style
) {
try {
@@ -641,7 +649,8 @@ color.hook = function( hook ) {
try {
elem.style[ hook ] = value;
} catch ( e ) {
- // wrapped to prevent IE from throwing errors on "invalid" values like 'auto' or 'inherit'
+
+ // Wrapped to prevent IE from throwing errors on "invalid" values like 'auto' or 'inherit'
}
}
};
@@ -653,7 +662,7 @@ color.hook = function( hook ) {
}
jQuery.cssHooks[ hook ].set( fx.elem, fx.start.transition( fx.end, fx.pos ) );
};
- });
+ } );
};
@@ -665,7 +674,7 @@ jQuery.cssHooks.borderColor = {
each( [ "Top", "Right", "Bottom", "Left" ], function( i, part ) {
expanded[ "border" + part + "Color" ] = value;
- });
+ } );
return expanded;
}
};
@@ -674,6 +683,7 @@ jQuery.cssHooks.borderColor = {
// Usage of any of the other color names requires adding yourself or including
// jquery.color.svg-names.js.
colors = jQuery.Color.names = {
+
// 4.1. Basic color keywords
aqua: "#00ffff",
black: "#000000",
@@ -698,12 +708,12 @@ colors = jQuery.Color.names = {
_default: "#ffffff"
};
-})( jQuery );
+} )( jQuery );
/******************************************************************************/
/****************************** CLASS ANIMATIONS ******************************/
/******************************************************************************/
-(function() {
+( function() {
var classAnimationActions = [ "add", "remove", "toggle" ],
shorthandStyles = {
@@ -718,14 +728,14 @@ var classAnimationActions = [ "add", "remove", "toggle" ],
padding: 1
};
-$.each([ "borderLeftStyle", "borderRightStyle", "borderBottomStyle", "borderTopStyle" ], function( _, prop ) {
+$.each( [ "borderLeftStyle", "borderRightStyle", "borderBottomStyle", "borderTopStyle" ], function( _, prop ) {
$.fx.step[ prop ] = function( fx ) {
if ( fx.end !== "none" && !fx.setAttr || fx.pos === 1 && !fx.setAttr ) {
jQuery.style( fx.elem, prop, fx.end );
fx.setAttr = true;
}
};
-});
+} );
function getElementStyles( elem ) {
var key, len,
@@ -742,7 +752,8 @@ function getElementStyles( elem ) {
styles[ $.camelCase( key ) ] = style[ key ];
}
}
- // support: Opera, IE <9
+
+ // Support: Opera, IE <9
} else {
for ( key in style ) {
if ( typeof style[ key ] === "string" ) {
@@ -772,7 +783,7 @@ function styleDifference( oldStyle, newStyle ) {
return diff;
}
-// support: jQuery <1.8
+// Support: jQuery <1.8
if ( !$.fn.addBack ) {
$.fn.addBack = function( selector ) {
return this.add( selector == null ?
@@ -790,136 +801,139 @@ $.effects.animateClass = function( value, duration, easing, callback ) {
applyClassChange,
allAnimations = o.children ? animated.find( "*" ).addBack() : animated;
- // map the animated objects to store the original styles.
- allAnimations = allAnimations.map(function() {
+ // Map the animated objects to store the original styles.
+ allAnimations = allAnimations.map( function() {
var el = $( this );
return {
el: el,
start: getElementStyles( this )
};
- });
+ } );
- // apply class change
+ // Apply class change
applyClassChange = function() {
- $.each( classAnimationActions, function(i, action) {
+ $.each( classAnimationActions, function( i, action ) {
if ( value[ action ] ) {
animated[ action + "Class" ]( value[ action ] );
}
- });
+ } );
};
applyClassChange();
- // map all animated objects again - calculate new styles and diff
- allAnimations = allAnimations.map(function() {
+ // Map all animated objects again - calculate new styles and diff
+ allAnimations = allAnimations.map( function() {
this.end = getElementStyles( this.el[ 0 ] );
this.diff = styleDifference( this.start, this.end );
return this;
- });
+ } );
- // apply original class
+ // Apply original class
animated.attr( "class", baseClass );
- // map all animated objects again - this time collecting a promise
- allAnimations = allAnimations.map(function() {
+ // Map all animated objects again - this time collecting a promise
+ allAnimations = allAnimations.map( function() {
var styleInfo = this,
dfd = $.Deferred(),
- opts = $.extend({}, o, {
+ opts = $.extend( {}, o, {
queue: false,
complete: function() {
dfd.resolve( styleInfo );
}
- });
+ } );
this.el.animate( this.diff, opts );
return dfd.promise();
- });
+ } );
- // once all animations have completed:
- $.when.apply( $, allAnimations.get() ).done(function() {
+ // Once all animations have completed:
+ $.when.apply( $, allAnimations.get() ).done( function() {
- // set the final class
+ // Set the final class
applyClassChange();
- // for each animated element,
+ // For each animated element,
// clear all css properties that were animated
$.each( arguments, function() {
var el = this.el;
- $.each( this.diff, function(key) {
+ $.each( this.diff, function( key ) {
el.css( key, "" );
- });
- });
+ } );
+ } );
- // this is guarnteed to be there if you use jQuery.speed()
+ // This is guarnteed to be there if you use jQuery.speed()
// it also handles dequeuing the next anim...
o.complete.call( animated[ 0 ] );
- });
- });
+ } );
+ } );
};
-$.fn.extend({
- addClass: (function( orig ) {
+$.fn.extend( {
+ addClass: ( function( orig ) {
return function( classNames, speed, easing, callback ) {
return speed ?
$.effects.animateClass.call( this,
{ add: classNames }, speed, easing, callback ) :
orig.apply( this, arguments );
};
- })( $.fn.addClass ),
+ } )( $.fn.addClass ),
- removeClass: (function( orig ) {
+ removeClass: ( function( orig ) {
return function( classNames, speed, easing, callback ) {
return arguments.length > 1 ?
$.effects.animateClass.call( this,
{ remove: classNames }, speed, easing, callback ) :
orig.apply( this, arguments );
};
- })( $.fn.removeClass ),
+ } )( $.fn.removeClass ),
- toggleClass: (function( orig ) {
+ toggleClass: ( function( orig ) {
return function( classNames, force, speed, easing, callback ) {
if ( typeof force === "boolean" || force === undefined ) {
if ( !speed ) {
- // without speed parameter
+
+ // Without speed parameter
return orig.apply( this, arguments );
} else {
return $.effects.animateClass.call( this,
- (force ? { add: classNames } : { remove: classNames }),
+ ( force ? { add: classNames } : { remove: classNames } ),
speed, easing, callback );
}
} else {
- // without force parameter
+
+ // Without force parameter
return $.effects.animateClass.call( this,
{ toggle: classNames }, force, speed, easing );
}
};
- })( $.fn.toggleClass ),
+ } )( $.fn.toggleClass ),
- switchClass: function( remove, add, speed, easing, callback) {
+ switchClass: function( remove, add, speed, easing, callback ) {
return $.effects.animateClass.call( this, {
add: add,
remove: remove
}, speed, easing, callback );
}
-});
+} );
-})();
+} )();
/******************************************************************************/
/*********************************** EFFECTS **********************************/
/******************************************************************************/
-(function() {
+( function() {
if ( $.expr && $.expr.filters && $.expr.filters.animated ) {
- $.expr.filters.animated = (function( orig ) {
+ $.expr.filters.animated = ( function( orig ) {
return function( elem ) {
return !!$( elem ).data( dataSpaceAnimated ) || orig( elem );
};
- })( $.expr.filters.animated );
+ } )( $.expr.filters.animated );
}
if ( $.uiBackCompat !== false ) {
$.extend( $.effects, {
+
// Saves a set of properties in a data storage
save: function( element, set ) {
var i = 0, length = set.length;
@@ -951,12 +965,12 @@ if ( $.uiBackCompat !== false ) {
// Wraps the element around a wrapper that copies position properties
createWrapper: function( element ) {
- // if the element is already wrapped, return it
+ // If the element is already wrapped, return it
if ( element.parent().is( ".ui-effects-wrapper" ) ) {
return element.parent();
}
- // wrap the element
+ // Wrap the element
var props = {
width: element.outerWidth( true ),
height: element.outerHeight( true ),
@@ -964,13 +978,14 @@ if ( $.uiBackCompat !== false ) {
},
wrapper = $( "
" )
.addClass( "ui-effects-wrapper" )
- .css({
+ .css( {
fontSize: "100%",
background: "transparent",
border: "none",
margin: 0,
padding: 0
- }),
+ } ),
+
// Store the size in case width/height are defined in % - Fixes #5245
size = {
width: element.width(),
@@ -978,7 +993,7 @@ if ( $.uiBackCompat !== false ) {
},
active = document.activeElement;
- // support: Firefox
+ // Support: Firefox
// Firefox incorrectly exposes anonymous content
// https://bugzilla.mozilla.org/show_bug.cgi?id=561664
try {
@@ -996,30 +1011,30 @@ if ( $.uiBackCompat !== false ) {
wrapper = element.parent(); //Hotfix for jQuery 1.4 since some change in wrap() seems to actually lose the reference to the wrapped element
- // transfer positioning properties to the wrapper
+ // Transfer positioning properties to the wrapper
if ( element.css( "position" ) === "static" ) {
- wrapper.css({ position: "relative" });
- element.css({ position: "relative" });
+ wrapper.css( { position: "relative" } );
+ element.css( { position: "relative" } );
} else {
$.extend( props, {
position: element.css( "position" ),
zIndex: element.css( "z-index" )
- });
- $.each([ "top", "left", "bottom", "right" ], function(i, pos) {
+ } );
+ $.each( [ "top", "left", "bottom", "right" ], function( i, pos ) {
props[ pos ] = element.css( pos );
if ( isNaN( parseInt( props[ pos ], 10 ) ) ) {
props[ pos ] = "auto";
}
- });
- element.css({
+ } );
+ element.css( {
position: "relative",
top: 0,
left: 0,
right: "auto",
bottom: "auto"
- });
+ } );
}
- element.css(size);
+ element.css( size );
return wrapper.css( props ).show();
},
@@ -1038,7 +1053,7 @@ if ( $.uiBackCompat !== false ) {
return element;
}
- });
+ } );
}
$.extend( $.effects, {
@@ -1167,19 +1182,19 @@ $.extend( $.effects, {
// will change margin if you explicitly set height
// see: http://jsfiddle.net/JZSMt/3/ https://bugs.webkit.org/show_bug.cgi?id=107380
// Support: Safari
- element.css({
+ element.css( {
marginTop: element.css( "marginTop" ),
marginBottom: element.css( "marginBottom" ),
marginLeft: element.css( "marginLeft" ),
marginRight: element.css( "marginRight" )
- })
+ } )
.outerWidth( element.outerWidth() )
.outerHeight( element.outerHeight() );
if ( /^(static|relative)/.test( cssPosition ) ) {
cssPosition = "absolute";
- placeholder = $( "<" + element[ 0 ].nodeName + ">" ).insertAfter( element ).css({
+ placeholder = $( "<" + element[ 0 ].nodeName + ">" ).insertAfter( element ).css( {
// Convert inline to inline block to account for inline elements
// that turn to inline block based on content (like img)
@@ -1192,7 +1207,7 @@ $.extend( $.effects, {
marginLeft: element.css( "marginLeft" ),
marginRight: element.css( "marginRight" ),
"float": element.css( "float" )
- })
+ } )
.outerWidth( element.outerWidth() )
.outerHeight( element.outerHeight() )
.addClass( "ui-effects-placeholder" );
@@ -1200,11 +1215,11 @@ $.extend( $.effects, {
element.data( dataSpace + "placeholder", placeholder );
}
- element.css({
+ element.css( {
position: cssPosition,
left: position.left,
top: position.top
- });
+ } );
return placeholder;
},
@@ -1233,49 +1248,49 @@ $.extend( $.effects, {
if ( unit[ 0 ] > 0 ) {
value[ x ] = unit[ 0 ] * factor + unit[ 1 ];
}
- });
+ } );
return value;
}
-});
+} );
-// return an effect options object for the given parameters:
+// Return an effect options object for the given parameters:
function _normalizeArguments( effect, options, speed, callback ) {
- // allow passing all options as the first parameter
+ // Allow passing all options as the first parameter
if ( $.isPlainObject( effect ) ) {
options = effect;
effect = effect.effect;
}
- // convert to an object
+ // Convert to an object
effect = { effect: effect };
- // catch (effect, null, ...)
+ // Catch (effect, null, ...)
if ( options == null ) {
options = {};
}
- // catch (effect, callback)
+ // Catch (effect, callback)
if ( $.isFunction( options ) ) {
callback = options;
speed = null;
options = {};
}
- // catch (effect, speed, ?)
+ // Catch (effect, speed, ?)
if ( typeof options === "number" || $.fx.speeds[ options ] ) {
callback = speed;
speed = options;
options = {};
}
- // catch (effect, options, callback)
+ // Catch (effect, options, callback)
if ( $.isFunction( speed ) ) {
callback = speed;
speed = null;
}
- // add options to effect
+ // Add options to effect
if ( options ) {
$.extend( effect, options );
}
@@ -1292,6 +1307,7 @@ function _normalizeArguments( effect, options, speed, callback ) {
}
function standardAnimationOption( option ) {
+
// Valid standard speeds (nothing, number, named speed)
if ( !option || typeof option === "number" || $.fx.speeds[ option ] ) {
return true;
@@ -1316,8 +1332,8 @@ function standardAnimationOption( option ) {
return false;
}
-$.fn.extend({
- effect: function( /* effect, options, speed, callback */ ) {
+$.fn.extend( {
+ effect: function( /* Effect, options, speed, callback */ ) {
var args = _normalizeArguments.apply( this, arguments ),
effectMethod = $.effects.effect[ args.effect ],
defaultMode = effectMethod.mode,
@@ -1354,7 +1370,8 @@ $.fn.extend({
};
if ( $.fx.off || !effectMethod ) {
- // delegate to the original method (e.g., .show()) if possible
+
+ // Delegate to the original method (e.g., .show()) if possible
if ( mode ) {
return this[ mode ]( args.duration, complete );
} else {
@@ -1362,7 +1379,7 @@ $.fn.extend({
if ( complete ) {
complete.call( this );
}
- });
+ } );
}
}
@@ -1424,7 +1441,7 @@ $.fn.extend({
this.queue( queueName, prefilter ).queue( queueName, run );
},
- show: (function( orig ) {
+ show: ( function( orig ) {
return function( option ) {
if ( standardAnimationOption( option ) ) {
return orig.apply( this, arguments );
@@ -1434,9 +1451,9 @@ $.fn.extend({
return this.effect.call( this, args );
}
};
- })( $.fn.show ),
+ } )( $.fn.show ),
- hide: (function( orig ) {
+ hide: ( function( orig ) {
return function( option ) {
if ( standardAnimationOption( option ) ) {
return orig.apply( this, arguments );
@@ -1446,9 +1463,9 @@ $.fn.extend({
return this.effect.call( this, args );
}
};
- })( $.fn.hide ),
+ } )( $.fn.hide ),
- toggle: (function( orig ) {
+ toggle: ( function( orig ) {
return function( option ) {
if ( standardAnimationOption( option ) || typeof option === "boolean" ) {
return orig.apply( this, arguments );
@@ -1458,9 +1475,9 @@ $.fn.extend({
return this.effect.call( this, args );
}
};
- })( $.fn.toggle ),
+ } )( $.fn.toggle ),
- cssUnit: function(key) {
+ cssUnit: function( key ) {
var style = this.css( key ),
val = [];
@@ -1468,14 +1485,14 @@ $.fn.extend({
if ( style.indexOf( unit ) > 0 ) {
val = [ parseFloat( style ), unit ];
}
- });
+ } );
return val;
},
cssClip: function( clipObj ) {
return clipObj ?
this.css( "clip", "rect(" + clipObj.top + "px " + clipObj.right + "px " + clipObj.bottom + "px " + clipObj.left + "px)" ) :
- parseClip( this.css("clip"), this );
+ parseClip( this.css( "clip" ), this );
},
transfer: function( options, done ) {
@@ -1496,21 +1513,21 @@ $.fn.extend({
transfer = $( "" )
.appendTo( "body" )
.addClass( options.className )
- .css({
+ .css( {
top: startPosition.top - fixTop,
left: startPosition.left - fixLeft,
height: element.innerHeight(),
width: element.innerWidth(),
position: targetFixed ? "fixed" : "absolute"
- })
+ } )
.animate( animation, options.duration, options.easing, function() {
transfer.remove();
if ( $.isFunction( done ) ) {
done();
}
- });
+ } );
}
-});
+} );
function parseClip( str, element ) {
var outerWidth = element.outerWidth(),
@@ -1535,23 +1552,23 @@ $.fx.step.clip = function( fx ) {
fx.clipInit = true;
}
- $( fx.elem ).cssClip({
- top: fx.pos * (fx.end.top - fx.start.top) + fx.start.top,
- right: fx.pos * (fx.end.right - fx.start.right) + fx.start.right,
- bottom: fx.pos * (fx.end.bottom - fx.start.bottom) + fx.start.bottom,
- left: fx.pos * (fx.end.left - fx.start.left) + fx.start.left
- });
+ $( fx.elem ).cssClip( {
+ top: fx.pos * ( fx.end.top - fx.start.top ) + fx.start.top,
+ right: fx.pos * ( fx.end.right - fx.start.right ) + fx.start.right,
+ bottom: fx.pos * ( fx.end.bottom - fx.start.bottom ) + fx.start.bottom,
+ left: fx.pos * ( fx.end.left - fx.start.left ) + fx.start.left
+ } );
};
-})();
+} )();
/******************************************************************************/
/*********************************** EASING ***********************************/
/******************************************************************************/
-(function() {
+( function() {
-// based on easing equations from Robert Penner (http://www.robertpenner.com/easing)
+// Based on easing equations from Robert Penner (http://www.robertpenner.com/easing)
var baseEasings = {};
@@ -1559,7 +1576,7 @@ $.each( [ "Quad", "Cubic", "Quart", "Quint", "Expo" ], function( i, name ) {
baseEasings[ name ] = function( p ) {
return Math.pow( p, i + 2 );
};
-});
+} );
$.extend( baseEasings, {
Sine: function( p ) {
@@ -1570,7 +1587,7 @@ $.extend( baseEasings, {
},
Elastic: function( p ) {
return p === 0 || p === 1 ? p :
- -Math.pow( 2, 8 * (p - 1) ) * Math.sin( ( (p - 1) * 80 - 7.5 ) * Math.PI / 15 );
+ -Math.pow( 2, 8 * ( p - 1 ) ) * Math.sin( ( ( p - 1 ) * 80 - 7.5 ) * Math.PI / 15 );
},
Back: function( p ) {
return p * p * ( 3 * p - 2 );
@@ -1582,7 +1599,7 @@ $.extend( baseEasings, {
while ( p < ( ( pow2 = Math.pow( 2, --bounce ) ) - 1 ) / 11 ) {}
return 1 / Math.pow( 4, 3 - bounce ) - 7.5625 * Math.pow( ( pow2 * 3 - 2 ) / 22 - p, 2 );
}
-});
+} );
$.each( baseEasings, function( name, easeIn ) {
$.easing[ "easeIn" + name ] = easeIn;
@@ -1594,10 +1611,10 @@ $.each( baseEasings, function( name, easeIn ) {
easeIn( p * 2 ) / 2 :
1 - easeIn( p * -2 + 2 ) / 2;
};
-});
+} );
-})();
+} )();
return $.effects;
-}));
+} ) );
diff --git a/ui/effects/effect-bounce.js b/ui/effects/effect-bounce.js
index 06bc84426dd..1743ef50398 100644
--- a/ui/effects/effect-bounce.js
+++ b/ui/effects/effect-bounce.js
@@ -33,7 +33,7 @@ return $.effects.define( "bounce", function( options, done ) {
var upAnim, downAnim, refValue,
element = $( this ),
- // defaults:
+ // Defaults:
mode = options.mode,
hide = mode === "hide",
show = mode === "show",
@@ -41,12 +41,12 @@ return $.effects.define( "bounce", function( options, done ) {
distance = options.distance,
times = options.times || 5,
- // number of internal animations
+ // Number of internal animations
anims = times * 2 + ( show || hide ? 1 : 0 ),
speed = options.duration / anims,
easing = options.easing,
- // utility:
+ // Utility:
ref = ( direction === "up" || direction === "down" ) ? "top" : "left",
motion = ( direction === "up" || direction === "left" ),
i = 0,
@@ -57,7 +57,7 @@ return $.effects.define( "bounce", function( options, done ) {
refValue = element.css( ref );
- // default distance for the BIGGEST bounce is the outer Distance / 3
+ // Default distance for the BIGGEST bounce is the outer Distance / 3
if ( !distance ) {
distance = element[ ref === "top" ? "outerHeight" : "outerWidth" ]() / 3;
}
@@ -66,7 +66,7 @@ return $.effects.define( "bounce", function( options, done ) {
downAnim = { opacity: 1 };
downAnim[ ref ] = refValue;
- // if we are showing, force opacity 0 and set the initial position
+ // If we are showing, force opacity 0 and set the initial position
// then do the "first" animation
element
.css( "opacity", 0 )
@@ -74,13 +74,14 @@ return $.effects.define( "bounce", function( options, done ) {
.animate( downAnim, speed, easing );
}
- // start at the smallest distance if we are hiding
+ // Start at the smallest distance if we are hiding
if ( hide ) {
distance = distance / Math.pow( 2, times - 1 );
}
downAnim = {};
downAnim[ ref ] = refValue;
+
// Bounces up/down/left/right then back to 0 -- times * 2 animations happen here
for ( ; i < times; i++ ) {
upAnim = {};
diff --git a/ui/effects/effect-explode.js b/ui/effects/effect-explode.js
index 55c247d3e89..92b83f5452f 100644
--- a/ui/effects/effect-explode.js
+++ b/ui/effects/effect-explode.js
@@ -38,15 +38,15 @@ return $.effects.define( "explode", "hide", function( options, done ) {
mode = options.mode,
show = mode === "show",
- // show and then visibility:hidden the element before calculating offset
+ // Show and then visibility:hidden the element before calculating offset
offset = element.show().css( "visibility", "hidden" ).offset(),
- // width and height of a piece
+ // Width and height of a piece
width = Math.ceil( element.outerWidth() / cells ),
height = Math.ceil( element.outerHeight() / rows ),
pieces = [];
- // children animate complete:
+ // Children animate complete:
function childComplete() {
pieces.push( this );
if ( pieces.length === rows * cells ) {
@@ -54,7 +54,7 @@ return $.effects.define( "explode", "hide", function( options, done ) {
}
}
- // clone the element for each row and cell.
+ // Clone the element for each row and cell.
for ( i = 0; i < rows; i++ ) { // ===>
top = offset.top + i * height;
my = i - ( rows - 1 ) / 2;
@@ -76,7 +76,7 @@ return $.effects.define( "explode", "hide", function( options, done ) {
top: -i * height
} )
- // select the wrapper - make it overflow: hidden and absolute positioned based on
+ // Select the wrapper - make it overflow: hidden and absolute positioned based on
// where the original was located +left and +top equal to the size of pieces
.parent()
.addClass( "ui-effects-explode" )
From 90169ebd178ffc69359ec7346be3dffe14966361 Mon Sep 17 00:00:00 2001
From: Alexander Schmitz
Date: Fri, 21 Aug 2015 00:12:35 -0400
Subject: [PATCH 19/26] Button: Style updates
---
tests/unit/button/common.js | 4 +-
tests/unit/button/core.js | 163 ++++++++++++++++++-----------------
tests/unit/button/events.js | 22 ++---
tests/unit/button/methods.js | 40 ++++-----
tests/unit/button/options.js | 120 +++++++++++++-------------
5 files changed, 175 insertions(+), 174 deletions(-)
diff --git a/tests/unit/button/common.js b/tests/unit/button/common.js
index 0372cddbf1f..4ef136facc7 100644
--- a/tests/unit/button/common.js
+++ b/tests/unit/button/common.js
@@ -14,9 +14,9 @@ common.testWidget( "button", {
label: null,
text: true,
- // callbacks
+ // Callbacks
create: null
}
-});
+} );
} );
diff --git a/tests/unit/button/core.js b/tests/unit/button/core.js
index f3ae2e58361..f4e5d35a783 100644
--- a/tests/unit/button/core.js
+++ b/tests/unit/button/core.js
@@ -3,58 +3,58 @@ define( [
"ui/widgets/button"
], function( $ ) {
-module("button: core");
+module( "button: core" );
-test("checkbox", function( assert ) {
+test( "checkbox", function( assert ) {
expect( 4 );
- var input = $("#check"),
- label = $("label[for=check]");
- ok( input.is(":visible") );
- ok( label.is(":not(.ui-button)") );
+ var input = $( "#check" ),
+ label = $( "label[for=check]" );
+ ok( input.is( ":visible" ) );
+ ok( label.is( ":not(.ui-button)" ) );
input.button();
assert.hasClasses( input, "ui-helper-hidden-accessible" );
assert.hasClasses( label, "ui-button" );
-});
+} );
-test("radios", function( assert ) {
+test( "radios", function( assert ) {
expect( 8 );
- var inputs = $("#radio0 input"),
- labels = $("#radio0 label");
- ok( inputs.is(":visible") );
- ok( labels.is(":not(.ui-button)") );
+ var inputs = $( "#radio0 input" ),
+ labels = $( "#radio0 label" );
+ ok( inputs.is( ":visible" ) );
+ ok( labels.is( ":not(.ui-button)" ) );
inputs.button();
- inputs.each(function() {
+ inputs.each( function() {
assert.hasClasses( this, "ui-helper-hidden-accessible" );
- });
- labels.each(function() {
+ } );
+ labels.each( function() {
assert.hasClasses( this, "ui-button" );
- });
-});
+ } );
+} );
-test("radio groups", function( assert ) {
+test( "radio groups", function( assert ) {
expect( 12 );
- function assertClasses(noForm, form1, form2) {
- assert.hasClasses( $("#radio0 .ui-button" + noForm ), "ui-state-active" );
- assert.hasClasses( $("#radio1 .ui-button" + form1 ), "ui-state-active" );
- assert.hasClasses( $("#radio2 .ui-button" + form2 ), "ui-state-active" );
+ function assertClasses( noForm, form1, form2 ) {
+ assert.hasClasses( $( "#radio0 .ui-button" + noForm ), "ui-state-active" );
+ assert.hasClasses( $( "#radio1 .ui-button" + form1 ), "ui-state-active" );
+ assert.hasClasses( $( "#radio2 .ui-button" + form2 ), "ui-state-active" );
}
- $("input[type=radio]").button();
- assertClasses(":eq(0)", ":eq(1)", ":eq(2)");
+ $( "input[type=radio]" ).button();
+ assertClasses( ":eq(0)", ":eq(1)", ":eq(2)" );
- // click outside of forms
- $("#radio0 .ui-button:eq(1)").trigger( "click" );
- assertClasses(":eq(1)", ":eq(1)", ":eq(2)");
+ // Click outside of forms
+ $( "#radio0 .ui-button:eq(1)" ).trigger( "click" );
+ assertClasses( ":eq(1)", ":eq(1)", ":eq(2)" );
- // click in first form
- $("#radio1 .ui-button:eq(0)").trigger( "click" );
- assertClasses(":eq(1)", ":eq(0)", ":eq(2)");
+ // Click in first form
+ $( "#radio1 .ui-button:eq(0)" ).trigger( "click" );
+ assertClasses( ":eq(1)", ":eq(0)", ":eq(2)" );
- // click in second form
- $("#radio2 .ui-button:eq(0)").trigger( "click" );
- assertClasses(":eq(1)", ":eq(0)", ":eq(0)");
-});
+ // Click in second form
+ $( "#radio2 .ui-button:eq(0)" ).trigger( "click" );
+ assertClasses( ":eq(1)", ":eq(0)", ":eq(0)" );
+} );
test( "radio groups - ignore elements with same name", function() {
expect( 1 );
@@ -63,47 +63,48 @@ test( "radio groups - ignore elements with same name", function() {
checkbox = $( "", {
type: "checkbox",
name: radios.attr( "name" )
- });
+ } );
form.append( checkbox );
radios.button( "refresh" );
ok( true, "no exception from accessing button instance of checkbox" );
-});
+} );
-test("input type submit, don't create child elements", function() {
+test( "input type submit, don't create child elements", function() {
expect( 2 );
- var input = $("#submit");
+ var input = $( "#submit" );
deepEqual( input.children().length, 0 );
input.button();
deepEqual( input.children().length, 0 );
-});
+} );
-test("buttonset", function( assert ) {
+test( "buttonset", function( assert ) {
expect( 6 );
- var set = $("#radio1").buttonset();
+ var set = $( "#radio1" ).buttonset();
assert.hasClasses( set, "ui-buttonset" );
- deepEqual( set.children(".ui-button").length, 3 );
- deepEqual( set.children("input[type=radio].ui-helper-hidden-accessible").length, 3 );
- ok( set.children("label:eq(0)").is(".ui-button.ui-corner-left:not(.ui-corner-all)") );
- ok( set.children("label:eq(1)").is(".ui-button:not(.ui-corner-all)") );
- ok( set.children("label:eq(2)").is(".ui-button.ui-corner-right:not(.ui-corner-all)") );
-});
-
-test("buttonset (rtl)", function( assert ) {
+ deepEqual( set.children( ".ui-button" ).length, 3 );
+ deepEqual( set.children( "input[type=radio].ui-helper-hidden-accessible" ).length, 3 );
+ ok( set.children( "label:eq(0)" ).is( ".ui-button.ui-corner-left:not(.ui-corner-all)" ) );
+ ok( set.children( "label:eq(1)" ).is( ".ui-button:not(.ui-corner-all)" ) );
+ ok( set.children( "label:eq(2)" ).is( ".ui-button.ui-corner-right:not(.ui-corner-all)" ) );
+} );
+
+test( "buttonset (rtl)", function( assert ) {
expect( 6 );
var set,
- parent = $("#radio1").parent();
+ parent = $( "#radio1" ).parent();
+
// Set to rtl
- parent.attr("dir", "rtl");
+ parent.attr( "dir", "rtl" );
- set = $("#radio1").buttonset();
+ set = $( "#radio1" ).buttonset();
assert.hasClasses( set, "ui-buttonset" );
- deepEqual( set.children(".ui-button").length, 3 );
- deepEqual( set.children("input[type=radio].ui-helper-hidden-accessible").length, 3 );
- ok( set.children("label:eq(0)").is(".ui-button.ui-corner-right:not(.ui-corner-all)") );
- ok( set.children("label:eq(1)").is(".ui-button:not(.ui-corner-all)") );
- ok( set.children("label:eq(2)").is(".ui-button.ui-corner-left:not(.ui-corner-all)") );
-});
+ deepEqual( set.children( ".ui-button" ).length, 3 );
+ deepEqual( set.children( "input[type=radio].ui-helper-hidden-accessible" ).length, 3 );
+ ok( set.children( "label:eq(0)" ).is( ".ui-button.ui-corner-right:not(.ui-corner-all)" ) );
+ ok( set.children( "label:eq(1)" ).is( ".ui-button:not(.ui-corner-all)" ) );
+ ok( set.children( "label:eq(2)" ).is( ".ui-button.ui-corner-left:not(.ui-corner-all)" ) );
+} );
// TODO: simulated click events don't behave like real click events in IE
// remove this when simulate properly simulates this
@@ -112,22 +113,22 @@ if ( !$.ui.ie || ( document.documentMode && document.documentMode > 8 ) ) {
asyncTest( "ensure checked and aria after single click on checkbox label button, see #5518", function( assert ) {
expect( 3 );
- $("#check2").button().on( "change", function() {
- var lbl = $( this ).button("widget");
+ $( "#check2" ).button().on( "change", function() {
+ var lbl = $( this ).button( "widget" );
ok( this.checked, "checked ok" );
- ok( lbl.attr("aria-pressed") === "true", "aria ok" );
+ ok( lbl.attr( "aria-pressed" ) === "true", "aria ok" );
assert.hasClasses( lbl, "ui-state-active" );
- });
+ } );
- // support: Opera
+ // Support: Opera
// Opera doesn't trigger a change event when this is done synchronously.
// This seems to be a side effect of another test, but until that can be
// tracked down, this delay will have to do.
- setTimeout(function() {
- $("#check2").button("widget").simulate("click");
+ setTimeout( function() {
+ $( "#check2" ).button( "widget" ).simulate( "click" );
start();
}, 1 );
- });
+ } );
}
test( "#7092 - button creation that requires a matching label does not find label in all cases", function( assert ) {
@@ -151,15 +152,15 @@ test( "#7092 - button creation that requires a matching label does not find labe
group = $( "" );
group.filter( "input[type=checkbox]" ).button();
assert.hasClasses( group.find( "label" ), "ui-button" );
-});
+} );
test( "#5946 - buttonset should ignore buttons that are not :visible", function( assert ) {
expect( 2 );
$( "#radio01" ).next().addBack().hide();
- var set = $( "#radio0" ).buttonset({ items: "input[type=radio]:visible" });
+ var set = $( "#radio0" ).buttonset( { items: "input[type=radio]:visible" } );
ok( set.find( "label:eq(0)" ).is( ":not(.ui-button):not(.ui-corner-left)" ) );
assert.hasClasses( set.find( "label:eq(1)" ), "ui-button ui-corner-left" );
-});
+} );
test( "#6262 - buttonset not applying ui-corner to invisible elements", function( assert ) {
expect( 3 );
@@ -169,7 +170,7 @@ test( "#6262 - buttonset not applying ui-corner to invisible elements", function
assert.hasClasses( set.find( "label:eq(1)" ), "ui-button" );
assert.hasClasses( set.find( "label:eq(2)" ), "ui-button ui-corner-right" );
-});
+} );
asyncTest( "Resetting a button's form should refresh the visual state of the button widget to match.", function( assert ) {
expect( 2 );
@@ -185,15 +186,15 @@ asyncTest( "Resetting a button's form should refresh the visual state of the but
form.get( 0 ).reset();
- // #9213: If a button has been removed, refresh should not be called on it when
+ // If a button has been removed, refresh should not be called on it when
// its corresponding form is reset.
button.remove();
- setTimeout(function() {
+ setTimeout( function() {
assert.hasClasses( checkbox.button( "widget" ), "ui-state-active" );
start();
}, 1 );
-});
+} );
asyncTest( "#6711 Checkbox/Radiobutton do not Show Focused State when using Keyboard Navigation", function( assert ) {
expect( 2 );
@@ -201,30 +202,30 @@ asyncTest( "#6711 Checkbox/Radiobutton do not Show Focused State when using Keyb
label = $( "label[for='check']" );
assert.lacksClasses( label, "ui-state-focus" );
check.trigger( "focus" );
- setTimeout(function() {
+ setTimeout( function() {
assert.hasClasses( label, "ui-state-focus" );
start();
- });
-});
+ } );
+} );
test( "#7534 - Button label selector works for ids with \":\"", function( assert ) {
expect( 1 );
var group = $( "" );
group.find( "input" ).button();
- assert.hasClasses( group.find( "label" ), "ui-button" , "Found an id with a :" );
-});
+ assert.hasClasses( group.find( "label" ), "ui-button", "Found an id with a :" );
+} );
asyncTest( "#9169 - Disabled button maintains ui-state-focus", function( assert ) {
expect( 2 );
var element = $( "#button1" ).button();
element[ 0 ].focus();
- setTimeout(function() {
+ setTimeout( function() {
assert.hasClasses( element, "ui-state-focus" );
element.button( "disable" );
assert.lacksClasses( element, "ui-state-focus",
"button does not have ui-state-focus when disabled" );
start();
- });
-});
+ } );
+} );
} );
diff --git a/tests/unit/button/events.js b/tests/unit/button/events.js
index d778b4a2bf3..15a285046de 100644
--- a/tests/unit/button/events.js
+++ b/tests/unit/button/events.js
@@ -3,15 +3,15 @@ define( [
"ui/widgets/button"
], function( $ ) {
-module("button: events");
+module( "button: events" );
-test("buttonset works with single-quote named elements (#7505)", function() {
+test( "buttonset works with single-quote named elements (#7505)", function() {
expect( 1 );
- $("#radio3").buttonset();
- $("#radio33").on( "click", function(){
+ $( "#radio3" ).buttonset();
+ $( "#radio33" ).on( "click", function() {
ok( true, "button clicks work with single-quote named elements" );
- }).trigger( "click" );
-});
+ } ).trigger( "click" );
+} );
asyncTest( "when button loses focus, ensure active state is removed (#8559)", function( assert ) {
expect( 1 );
@@ -22,15 +22,15 @@ asyncTest( "when button loses focus, ensure active state is removed (#8559)", fu
element.one( "blur", function() {
assert.lacksClasses( element, "ui-state-active", "button loses active state appropriately" );
start();
- }).trigger( "blur" );
- });
+ } ).trigger( "blur" );
+ } );
element.trigger( "focus" );
- setTimeout(function() {
+ setTimeout( function() {
element
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } )
.simulate( "keypress", { keyCode: $.ui.keyCode.ENTER } );
- });
-});
+ } );
+} );
} );
diff --git a/tests/unit/button/methods.js b/tests/unit/button/methods.js
index 29e91702219..0bafd90f918 100644
--- a/tests/unit/button/methods.js
+++ b/tests/unit/button/methods.js
@@ -3,50 +3,50 @@ define( [
"ui/widgets/button"
], function( $ ) {
-module("button: methods");
+module( "button: methods" );
-test("destroy", function( assert ) {
+test( "destroy", function( assert ) {
expect( 1 );
assert.domEqual( "#button", function() {
$( "#button" ).button().button( "destroy" );
- });
-});
+ } );
+} );
test( "refresh: Ensure disabled state is preserved correctly.", function() {
expect( 8 );
var element = $( "" );
- element.button({ disabled: true }).button( "refresh" );
+ element.button( { disabled: true } ).button( "refresh" );
ok( element.button( "option", "disabled" ), "Anchor button should remain disabled after refresh" ); //See #8237
element = $( "" );
- element.button({ disabled: true }).button( "refresh" );
+ element.button( { disabled: true } ).button( "refresh" );
ok( element.button( "option", "disabled" ), " buttons should remain disabled after refresh" );
element = $( "
" );
- element.button( { disabled: true} ).button( "refresh" );
- ok( element.button( "option", "disabled" ), "