author | ymh <ymh.work@gmail.com> |
Fri, 05 Sep 2025 18:52:52 +0200 | |
changeset 22 | 8c2e4d02f4ef |
parent 21 | 48c4eec2b7e6 |
permissions | -rw-r--r-- |
18 | 1 |
/*! |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
2 |
* jQuery UI Effects Size 1.13.3 |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
3 |
* https://jqueryui.com |
18 | 4 |
* |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
5 |
* Copyright OpenJS Foundation and other contributors |
18 | 6 |
* Released under the MIT license. |
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
7 |
* https://jquery.org/license |
18 | 8 |
*/ |
9 |
||
10 |
//>>label: Size Effect |
|
11 |
//>>group: Effects |
|
12 |
//>>description: Resize an element to a specified width and height. |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
13 |
//>>docs: https://api.jqueryui.com/size-effect/ |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
14 |
//>>demos: https://jqueryui.com/effect/ |
18 | 15 |
|
16 |
( function( factory ) { |
|
19 | 17 |
"use strict"; |
18 |
||
18 | 19 |
if ( typeof define === "function" && define.amd ) { |
20 |
||
21 |
// AMD. Register as an anonymous module. |
|
22 |
define( [ |
|
23 |
"jquery", |
|
21
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
24 |
"../version", |
48c4eec2b7e6
Add CLAUDE.md documentation and sync WordPress core files
ymh <ymh.work@gmail.com>
parents:
19
diff
changeset
|
25 |
"../effect" |
18 | 26 |
], factory ); |
27 |
} else { |
|
28 |
||
29 |
// Browser globals |
|
30 |
factory( jQuery ); |
|
31 |
} |
|
19 | 32 |
} )( function( $ ) { |
33 |
"use strict"; |
|
18 | 34 |
|
35 |
return $.effects.define( "size", function( options, done ) { |
|
36 |
||
37 |
// Create element |
|
38 |
var baseline, factor, temp, |
|
39 |
element = $( this ), |
|
40 |
||
41 |
// Copy for children |
|
42 |
cProps = [ "fontSize" ], |
|
43 |
vProps = [ "borderTopWidth", "borderBottomWidth", "paddingTop", "paddingBottom" ], |
|
44 |
hProps = [ "borderLeftWidth", "borderRightWidth", "paddingLeft", "paddingRight" ], |
|
45 |
||
46 |
// Set options |
|
47 |
mode = options.mode, |
|
48 |
restore = mode !== "effect", |
|
49 |
scale = options.scale || "both", |
|
50 |
origin = options.origin || [ "middle", "center" ], |
|
51 |
position = element.css( "position" ), |
|
52 |
pos = element.position(), |
|
53 |
original = $.effects.scaledDimensions( element ), |
|
54 |
from = options.from || original, |
|
55 |
to = options.to || $.effects.scaledDimensions( element, 0 ); |
|
56 |
||
57 |
$.effects.createPlaceholder( element ); |
|
58 |
||
59 |
if ( mode === "show" ) { |
|
60 |
temp = from; |
|
61 |
from = to; |
|
62 |
to = temp; |
|
63 |
} |
|
64 |
||
65 |
// Set scaling factor |
|
66 |
factor = { |
|
67 |
from: { |
|
68 |
y: from.height / original.height, |
|
69 |
x: from.width / original.width |
|
70 |
}, |
|
71 |
to: { |
|
72 |
y: to.height / original.height, |
|
73 |
x: to.width / original.width |
|
74 |
} |
|
75 |
}; |
|
76 |
||
77 |
// Scale the css box |
|
78 |
if ( scale === "box" || scale === "both" ) { |
|
79 |
||
80 |
// Vertical props scaling |
|
81 |
if ( factor.from.y !== factor.to.y ) { |
|
82 |
from = $.effects.setTransition( element, vProps, factor.from.y, from ); |
|
83 |
to = $.effects.setTransition( element, vProps, factor.to.y, to ); |
|
84 |
} |
|
85 |
||
86 |
// Horizontal props scaling |
|
87 |
if ( factor.from.x !== factor.to.x ) { |
|
88 |
from = $.effects.setTransition( element, hProps, factor.from.x, from ); |
|
89 |
to = $.effects.setTransition( element, hProps, factor.to.x, to ); |
|
90 |
} |
|
91 |
} |
|
92 |
||
93 |
// Scale the content |
|
94 |
if ( scale === "content" || scale === "both" ) { |
|
95 |
||
96 |
// Vertical props scaling |
|
97 |
if ( factor.from.y !== factor.to.y ) { |
|
98 |
from = $.effects.setTransition( element, cProps, factor.from.y, from ); |
|
99 |
to = $.effects.setTransition( element, cProps, factor.to.y, to ); |
|
100 |
} |
|
101 |
} |
|
102 |
||
103 |
// Adjust the position properties based on the provided origin points |
|
104 |
if ( origin ) { |
|
105 |
baseline = $.effects.getBaseline( origin, original ); |
|
106 |
from.top = ( original.outerHeight - from.outerHeight ) * baseline.y + pos.top; |
|
107 |
from.left = ( original.outerWidth - from.outerWidth ) * baseline.x + pos.left; |
|
108 |
to.top = ( original.outerHeight - to.outerHeight ) * baseline.y + pos.top; |
|
109 |
to.left = ( original.outerWidth - to.outerWidth ) * baseline.x + pos.left; |
|
110 |
} |
|
19 | 111 |
delete from.outerHeight; |
112 |
delete from.outerWidth; |
|
18 | 113 |
element.css( from ); |
114 |
||
115 |
// Animate the children if desired |
|
116 |
if ( scale === "content" || scale === "both" ) { |
|
117 |
||
118 |
vProps = vProps.concat( [ "marginTop", "marginBottom" ] ).concat( cProps ); |
|
119 |
hProps = hProps.concat( [ "marginLeft", "marginRight" ] ); |
|
120 |
||
121 |
// Only animate children with width attributes specified |
|
122 |
// TODO: is this right? should we include anything with css width specified as well |
|
123 |
element.find( "*[width]" ).each( function() { |
|
124 |
var child = $( this ), |
|
125 |
childOriginal = $.effects.scaledDimensions( child ), |
|
126 |
childFrom = { |
|
127 |
height: childOriginal.height * factor.from.y, |
|
128 |
width: childOriginal.width * factor.from.x, |
|
129 |
outerHeight: childOriginal.outerHeight * factor.from.y, |
|
130 |
outerWidth: childOriginal.outerWidth * factor.from.x |
|
131 |
}, |
|
132 |
childTo = { |
|
133 |
height: childOriginal.height * factor.to.y, |
|
134 |
width: childOriginal.width * factor.to.x, |
|
135 |
outerHeight: childOriginal.height * factor.to.y, |
|
136 |
outerWidth: childOriginal.width * factor.to.x |
|
137 |
}; |
|
138 |
||
139 |
// Vertical props scaling |
|
140 |
if ( factor.from.y !== factor.to.y ) { |
|
141 |
childFrom = $.effects.setTransition( child, vProps, factor.from.y, childFrom ); |
|
142 |
childTo = $.effects.setTransition( child, vProps, factor.to.y, childTo ); |
|
143 |
} |
|
144 |
||
145 |
// Horizontal props scaling |
|
146 |
if ( factor.from.x !== factor.to.x ) { |
|
147 |
childFrom = $.effects.setTransition( child, hProps, factor.from.x, childFrom ); |
|
148 |
childTo = $.effects.setTransition( child, hProps, factor.to.x, childTo ); |
|
149 |
} |
|
150 |
||
151 |
if ( restore ) { |
|
152 |
$.effects.saveStyle( child ); |
|
153 |
} |
|
154 |
||
155 |
// Animate children |
|
156 |
child.css( childFrom ); |
|
157 |
child.animate( childTo, options.duration, options.easing, function() { |
|
158 |
||
159 |
// Restore children |
|
160 |
if ( restore ) { |
|
161 |
$.effects.restoreStyle( child ); |
|
162 |
} |
|
163 |
} ); |
|
164 |
} ); |
|
165 |
} |
|
166 |
||
167 |
// Animate |
|
168 |
element.animate( to, { |
|
169 |
queue: false, |
|
170 |
duration: options.duration, |
|
171 |
easing: options.easing, |
|
172 |
complete: function() { |
|
173 |
||
174 |
var offset = element.offset(); |
|
175 |
||
176 |
if ( to.opacity === 0 ) { |
|
177 |
element.css( "opacity", from.opacity ); |
|
178 |
} |
|
179 |
||
180 |
if ( !restore ) { |
|
181 |
element |
|
182 |
.css( "position", position === "static" ? "relative" : position ) |
|
183 |
.offset( offset ); |
|
184 |
||
185 |
// Need to save style here so that automatic style restoration |
|
186 |
// doesn't restore to the original styles from before the animation. |
|
187 |
$.effects.saveStyle( element ); |
|
188 |
} |
|
189 |
||
190 |
done(); |
|
191 |
} |
|
192 |
} ); |
|
193 |
||
194 |
} ); |
|
195 |
||
19 | 196 |
} ); |