Skip to content

Commit 1c1a3b1

Browse files
gnarfgnarf
committed
Effects.*: Updating Effect Method API to avoid duplicating the queue call - Fixes #7318 - Add the queue functions to $.fn.effect()
1 parent fb210ae commit 1c1a3b1

14 files changed

+785
-814
lines changed

‎ui/jquery.effects.blind.js‎

Lines changed: 54 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -12,73 +12,69 @@
1212
*/
1313
(function( $, undefined ) {
1414

15-
var rvertical = /up|down|vertical/;
16-
var rpositivemotion = /up|left|vertical|horizontal/;
15+
var rvertical = /up|down|vertical/,
16+
rpositivemotion = /up|left|vertical|horizontal/;
1717

18-
$.effects.effect.blind = function( o ) {
18+
$.effects.effect.blind = function( o, next ) {
19+
// Create element
20+
var el = $( this ),
21+
props = [ "position", "top", "bottom", "left", "right", "height", "width" ],
22+
mode = $.effects.setMode( el, o.mode || "hide" ),
23+
direction = o.direction || "up",
24+
vertical = rvertical.test( direction ),
25+
ref = vertical ? "height" : "width",
26+
ref2 = vertical ? "top" : "left",
27+
motion = rpositivemotion.test( direction ),
28+
animation = {},
29+
show = mode === "show",
30+
wrapper, distance;
1931

20-
return this.queue( function() {
21-
22-
// Create element
23-
var el = $( this ),
24-
props = [ "position", "top", "bottom", "left", "right", "height", "width" ],
25-
mode = $.effects.setMode( el, o.mode || "hide" ),
26-
direction = o.direction || "up",
27-
vertical = rvertical.test( direction ),
28-
ref = vertical ? "height" : "width",
29-
ref2 = vertical ? "top" : "left",
30-
motion = rpositivemotion.test( direction ),
31-
animation = {},
32-
wrapper, distance;
32+
// if already wrapped, the wrapper's properties are my property. #6245
33+
if ( el.parent().is( ".ui-effects-wrapper" ) ) {
34+
$.effects.save( el.parent(), props );
35+
} else {
36+
$.effects.save( el, props );
37+
}
38+
el.show();
39+
wrapper = $.effects.createWrapper( el ).css({
40+
overflow: "hidden"
41+
});
3342

34-
// if already wrapped, the wrapper's properties are my property. #6245
35-
if ( el.parent().is( ".ui-effects-wrapper" ) ) {
36-
$.effects.save( el.parent(), props );
37-
} else {
38-
$.effects.save( el, props );
39-
}
40-
el.show();
41-
wrapper = $.effects.createWrapper( el ).css({
42-
overflow: "hidden"
43-
});
43+
distance = wrapper[ ref ]();
4444

45-
distance = wrapper[ ref ]();
45+
animation[ ref ] = ( mode === "show" ? distance : 0 );
46+
if ( !motion ) {
47+
el
48+
.css( vertical ? "bottom" : "right", 0 )
49+
.css( vertical ? "top" : "left", "" )
50+
.css({ position: "absolute" });
51+
animation[ ref2 ] = ( mode === "show" ) ? 0 : distance;
52+
}
4653

47-
animation[ ref ] = ( mode === "show" ? distance : 0 );
48-
if ( !motion ) {
49-
el
50-
.css( vertical ? "bottom" : "right", 0 )
51-
.css( vertical ? "top" : "left", "" )
52-
.css({ position: "absolute" });
53-
animation[ ref2 ] = ( mode === "show" ) ? 0 : distance;
54+
// start at 0 if we are showing
55+
if ( mode === "show" ) {
56+
wrapper.css( ref, 0 );
57+
if ( ! motion ) {
58+
wrapper.css( ref2, distance );
5459
}
60+
}
5561

56-
// start at 0 if we are showing
57-
if ( mode == "show" ) {
58-
wrapper.css( ref, 0 );
59-
if ( ! motion ) {
60-
wrapper.css( ref2, distance );
62+
// Animate
63+
wrapper.animate( animation, {
64+
duration: o.duration,
65+
easing: o.easing,
66+
queue: false,
67+
complete: function() {
68+
if ( mode == "hide" ) {
69+
el.hide();
6170
}
62-
}
63-
64-
// Animate
65-
wrapper.animate( animation, {
66-
duration: o.duration,
67-
easing: o.easing,
68-
queue: false,
69-
complete: function() {
70-
if ( mode == "hide" ) {
71-
el.hide();
72-
}
73-
$.effects.restore( el, props );
74-
$.effects.removeWrapper( el );
75-
if ( $.isFunction( o.complete ) ) {
76-
o.complete.apply( el[ 0 ], arguments );
77-
}
78-
el.dequeue();
71+
$.effects.restore( el, props );
72+
$.effects.removeWrapper( el );
73+
if ( $.isFunction( o.complete ) ) {
74+
o.complete.apply( el[ 0 ], arguments );
7975
}
80-
});
81-
76+
next();
77+
}
8278
});
8379

8480
};

‎ui/jquery.effects.bounce.js‎

Lines changed: 90 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -12,108 +12,104 @@
1212
*/
1313
(function( $, undefined ) {
1414

15-
$.effects.effect.bounce = function(o) {
16-
17-
return this.queue( function( next ) {
18-
var el = $( this ),
19-
props = [ "position", "top", "bottom", "left", "right", "height", "width" ],
20-
21-
// defaults:
22-
mode = $.effects.setMode( el, o.mode || "effect" ),
23-
hide = mode === "hide",
24-
show = mode === "show",
25-
direction = o.direction || "up",
26-
distance = o.distance,
27-
times = o.times || 5,
28-
29-
// number of internal animations
30-
anims = times * 2 + ( show || hide ? 1 : 0 ),
31-
speed = o.duration / anims,
32-
easing = o.easing,
33-
34-
// utility:
35-
ref = ( direction === "up" || direction === "down" ) ? "top" : "left",
36-
motion = ( direction === "up" || direction === "left" ),
37-
i,
38-
upAnim,
39-
downAnim,
40-
41-
// we will need to re-assemble the queue to stack our animations in place
42-
queue = el.queue(),
43-
queuelen = queue.length;
44-
45-
// Avoid touching opacity to prevent clearType and PNG issues in IE
46-
if ( show || hide ) {
47-
props.push( "opacity" );
48-
}
49-
50-
$.effects.save( el, props );
51-
el.show();
52-
$.effects.createWrapper( el ); // Create Wrapper
53-
54-
// default distance for the BIGGEST bounce is the outer Distance / 3
55-
if ( !distance ) {
56-
distance = el[ ref === "top" ? "outerHeight" : "outerWidth" ]() / 3;
57-
}
58-
59-
if ( show ) {
60-
downAnim = { opacity: 1 };
61-
downAnim[ ref ] = 0;
62-
63-
// if we are showing, force opacity 0 and set the initial position
64-
// then do the "first" animation
65-
el.css( "opacity", 0 )
66-
.css( ref, motion ? -distance*2 : distance*2 )
67-
.animate( downAnim, speed, easing );
68-
}
69-
70-
// start at the smallest distance if we are hiding
71-
if ( hide ) {
72-
distance = distance / Math.pow( 2, times - 1 );
73-
}
74-
75-
downAnim = {};
15+
$.effects.effect.bounce = function( o, next ) {
16+
var el = $( this ),
17+
props = [ "position", "top", "bottom", "left", "right", "height", "width" ],
18+
19+
// defaults:
20+
mode = $.effects.setMode( el, o.mode || "effect" ),
21+
hide = mode === "hide",
22+
show = mode === "show",
23+
direction = o.direction || "up",
24+
distance = o.distance,
25+
times = o.times || 5,
26+
27+
// number of internal animations
28+
anims = times * 2 + ( show || hide ? 1 : 0 ),
29+
speed = o.duration / anims,
30+
easing = o.easing,
31+
32+
// utility:
33+
ref = ( direction === "up" || direction === "down" ) ? "top" : "left",
34+
motion = ( direction === "up" || direction === "left" ),
35+
i,
36+
upAnim,
37+
downAnim,
38+
39+
// we will need to re-assemble the queue to stack our animations in place
40+
queue = el.queue(),
41+
queuelen = queue.length;
42+
43+
// Avoid touching opacity to prevent clearType and PNG issues in IE
44+
if ( show || hide ) {
45+
props.push( "opacity" );
46+
}
47+
48+
$.effects.save( el, props );
49+
el.show();
50+
$.effects.createWrapper( el ); // Create Wrapper
51+
52+
// default distance for the BIGGEST bounce is the outer Distance / 3
53+
if ( !distance ) {
54+
distance = el[ ref === "top" ? "outerHeight" : "outerWidth" ]() / 3;
55+
}
56+
57+
if ( show ) {
58+
downAnim = { opacity: 1 };
7659
downAnim[ ref ] = 0;
77-
// Bounces up/down/left/right then back to 0 -- times * 2 animations happen here
78-
for ( i = 0; i < times; i++ ) {
79-
upAnim = {};
80-
upAnim[ ref ] = ( motion ? "-=" : "+=" ) + distance;
81-
82-
el.animate( upAnim, speed, easing )
83-
.animate( downAnim, speed, easing );
84-
85-
distance = hide ? distance * 2 : distance / 2;
86-
}
8760

88-
// Last Bounce when Hiding
61+
// if we are showing, force opacity 0 and set the initial position
62+
// then do the "first" animation
63+
el.css( "opacity", 0 )
64+
.css( ref, motion ? -distance*2 : distance*2 )
65+
.animate( downAnim, speed, easing );
66+
}
67+
68+
// start at the smallest distance if we are hiding
69+
if ( hide ) {
70+
distance = distance / Math.pow( 2, times - 1 );
71+
}
72+
73+
downAnim = {};
74+
downAnim[ ref ] = 0;
75+
// Bounces up/down/left/right then back to 0 -- times * 2 animations happen here
76+
for ( i = 0; i < times; i++ ) {
77+
upAnim = {};
78+
upAnim[ ref ] = ( motion ? "-=" : "+=" ) + distance;
79+
80+
el.animate( upAnim, speed, easing )
81+
.animate( downAnim, speed, easing );
82+
83+
distance = hide ? distance * 2 : distance / 2;
84+
}
85+
86+
// Last Bounce when Hiding
87+
if ( hide ) {
88+
upAnim = { opacity: 0 };
89+
upAnim[ ref ] = ( motion ? "-=" : "+=" ) + distance;
90+
91+
el.animate( upAnim, speed, easing );
92+
}
93+
94+
el.queue( function( next ) {
8995
if ( hide ) {
90-
upAnim = { opacity: 0 };
91-
upAnim[ ref ] = ( motion ? "-=" : "+=" ) + distance;
92-
93-
el.animate( upAnim, speed, easing );
96+
el.hide();
9497
}
95-
96-
el.queue( function( next ) {
97-
if ( hide ) {
98-
el.hide();
99-
}
100-
$.effects.restore( el, props );
101-
$.effects.removeWrapper( el );
102-
if ( o.complete ) {
103-
o.complete.apply( el[ 0 ] );
104-
}
105-
next();
106-
});
107-
108-
// inject all the animations we just queued to be first in line (after "inprogress")
109-
if ( queuelen > 1) {
110-
queue.splice.apply( queue,
111-
[ 1, 0 ].concat( queue.splice( queuelen, anims + 1 ) ) );
98+
$.effects.restore( el, props );
99+
$.effects.removeWrapper( el );
100+
if ( o.complete ) {
101+
o.complete.apply( el[ 0 ] );
112102
}
113103
next();
114-
115104
});
116105

106+
// inject all the animations we just queued to be first in line (after "inprogress")
107+
if ( queuelen > 1) {
108+
queue.splice.apply( queue,
109+
[ 1, 0 ].concat( queue.splice( queuelen, anims + 1 ) ) );
110+
}
111+
next();
112+
117113
};
118114

119115
})(jQuery);

0 commit comments

Comments
 (0)