1 |
503b3f7b
|
Assos Assos
|
|
2 |
|
|
|
3 |
|
|
|
4 |
|
|
|
5 |
|
|
|
6 |
|
|
|
7 |
|
|
|
8 |
|
|
|
9 |
|
|
|
10 |
|
|
|
11 |
|
|
|
12 |
|
|
|
13 |
|
|
|
14 |
|
|
(function( $, undefined ) {
|
15 |
|
|
|
16 |
|
|
$.effects.effect.puff = function( o, done ) {
|
17 |
|
|
var elem = $( this ),
|
18 |
|
|
mode = $.effects.setMode( elem, o.mode || "hide" ),
|
19 |
|
|
hide = mode === "hide",
|
20 |
|
|
percent = parseInt( o.percent, 10 ) || 150,
|
21 |
|
|
factor = percent / 100,
|
22 |
|
|
original = {
|
23 |
|
|
height: elem.height(),
|
24 |
|
|
width: elem.width(),
|
25 |
|
|
outerHeight: elem.outerHeight(),
|
26 |
|
|
outerWidth: elem.outerWidth()
|
27 |
|
|
};
|
28 |
|
|
|
29 |
|
|
$.extend( o, {
|
30 |
|
|
effect: "scale",
|
31 |
|
|
queue: false,
|
32 |
|
|
fade: true,
|
33 |
|
|
mode: mode,
|
34 |
|
|
complete: done,
|
35 |
|
|
percent: hide ? percent : 100,
|
36 |
|
|
from: hide ?
|
37 |
|
|
original :
|
38 |
|
|
{
|
39 |
|
|
height: original.height * factor,
|
40 |
|
|
width: original.width * factor,
|
41 |
|
|
outerHeight: original.outerHeight * factor,
|
42 |
|
|
outerWidth: original.outerWidth * factor
|
43 |
|
|
}
|
44 |
|
|
});
|
45 |
|
|
|
46 |
|
|
elem.effect( o );
|
47 |
|
|
};
|
48 |
|
|
|
49 |
|
|
$.effects.effect.scale = function( o, done ) {
|
50 |
|
|
|
51 |
|
|
|
52 |
|
|
var el = $( this ),
|
53 |
|
|
options = $.extend( true, {}, o ),
|
54 |
|
|
mode = $.effects.setMode( el, o.mode || "effect" ),
|
55 |
|
|
percent = parseInt( o.percent, 10 ) ||
|
56 |
|
|
( parseInt( o.percent, 10 ) === 0 ? 0 : ( mode === "hide" ? 0 : 100 ) ),
|
57 |
|
|
direction = o.direction || "both",
|
58 |
|
|
origin = o.origin,
|
59 |
|
|
original = {
|
60 |
|
|
height: el.height(),
|
61 |
|
|
width: el.width(),
|
62 |
|
|
outerHeight: el.outerHeight(),
|
63 |
|
|
outerWidth: el.outerWidth()
|
64 |
|
|
},
|
65 |
|
|
factor = {
|
66 |
|
|
y: direction !== "horizontal" ? (percent / 100) : 1,
|
67 |
|
|
x: direction !== "vertical" ? (percent / 100) : 1
|
68 |
|
|
};
|
69 |
|
|
|
70 |
|
|
|
71 |
|
|
options.effect = "size";
|
72 |
|
|
options.queue = false;
|
73 |
|
|
options.complete = done;
|
74 |
|
|
|
75 |
|
|
|
76 |
|
|
if ( mode !== "effect" ) {
|
77 |
|
|
options.origin = origin || ["middle","center"];
|
78 |
|
|
options.restore = true;
|
79 |
|
|
}
|
80 |
|
|
|
81 |
|
|
options.from = o.from || ( mode === "show" ? {
|
82 |
|
|
height: 0,
|
83 |
|
|
width: 0,
|
84 |
|
|
outerHeight: 0,
|
85 |
|
|
outerWidth: 0
|
86 |
|
|
} : original );
|
87 |
|
|
options.to = {
|
88 |
|
|
height: original.height * factor.y,
|
89 |
|
|
width: original.width * factor.x,
|
90 |
|
|
outerHeight: original.outerHeight * factor.y,
|
91 |
|
|
outerWidth: original.outerWidth * factor.x
|
92 |
|
|
};
|
93 |
|
|
|
94 |
|
|
|
95 |
|
|
if ( options.fade ) {
|
96 |
|
|
if ( mode === "show" ) {
|
97 |
|
|
options.from.opacity = 0;
|
98 |
|
|
options.to.opacity = 1;
|
99 |
|
|
}
|
100 |
|
|
if ( mode === "hide" ) {
|
101 |
|
|
options.from.opacity = 1;
|
102 |
|
|
options.to.opacity = 0;
|
103 |
|
|
}
|
104 |
|
|
}
|
105 |
|
|
|
106 |
|
|
|
107 |
|
|
el.effect( options );
|
108 |
|
|
|
109 |
|
|
};
|
110 |
|
|
|
111 |
|
|
$.effects.effect.size = function( o, done ) {
|
112 |
|
|
|
113 |
|
|
|
114 |
|
|
var original, baseline, factor,
|
115 |
|
|
el = $( this ),
|
116 |
|
|
props0 = [ "position", "top", "bottom", "left", "right", "width", "height", "overflow", "opacity" ],
|
117 |
|
|
|
118 |
|
|
|
119 |
|
|
props1 = [ "position", "top", "bottom", "left", "right", "overflow", "opacity" ],
|
120 |
|
|
|
121 |
|
|
|
122 |
|
|
props2 = [ "width", "height", "overflow" ],
|
123 |
|
|
cProps = [ "fontSize" ],
|
124 |
|
|
vProps = [ "borderTopWidth", "borderBottomWidth", "paddingTop", "paddingBottom" ],
|
125 |
|
|
hProps = [ "borderLeftWidth", "borderRightWidth", "paddingLeft", "paddingRight" ],
|
126 |
|
|
|
127 |
|
|
|
128 |
|
|
mode = $.effects.setMode( el, o.mode || "effect" ),
|
129 |
|
|
restore = o.restore || mode !== "effect",
|
130 |
|
|
scale = o.scale || "both",
|
131 |
|
|
origin = o.origin || [ "middle", "center" ],
|
132 |
|
|
position = el.css( "position" ),
|
133 |
|
|
props = restore ? props0 : props1,
|
134 |
|
|
zero = {
|
135 |
|
|
height: 0,
|
136 |
|
|
width: 0,
|
137 |
|
|
outerHeight: 0,
|
138 |
|
|
outerWidth: 0
|
139 |
|
|
};
|
140 |
|
|
|
141 |
|
|
if ( mode === "show" ) {
|
142 |
|
|
el.show();
|
143 |
|
|
}
|
144 |
|
|
original = {
|
145 |
|
|
height: el.height(),
|
146 |
|
|
width: el.width(),
|
147 |
|
|
outerHeight: el.outerHeight(),
|
148 |
|
|
outerWidth: el.outerWidth()
|
149 |
|
|
};
|
150 |
|
|
|
151 |
|
|
if ( o.mode === "toggle" && mode === "show" ) {
|
152 |
|
|
el.from = o.to || zero;
|
153 |
|
|
el.to = o.from || original;
|
154 |
|
|
} else {
|
155 |
|
|
el.from = o.from || ( mode === "show" ? zero : original );
|
156 |
|
|
el.to = o.to || ( mode === "hide" ? zero : original );
|
157 |
|
|
}
|
158 |
|
|
|
159 |
|
|
|
160 |
|
|
factor = {
|
161 |
|
|
from: {
|
162 |
|
|
y: el.from.height / original.height,
|
163 |
|
|
x: el.from.width / original.width
|
164 |
|
|
},
|
165 |
|
|
to: {
|
166 |
|
|
y: el.to.height / original.height,
|
167 |
|
|
x: el.to.width / original.width
|
168 |
|
|
}
|
169 |
|
|
};
|
170 |
|
|
|
171 |
|
|
|
172 |
|
|
if ( scale === "box" || scale === "both" ) {
|
173 |
|
|
|
174 |
|
|
|
175 |
|
|
if ( factor.from.y !== factor.to.y ) {
|
176 |
|
|
props = props.concat( vProps );
|
177 |
|
|
el.from = $.effects.setTransition( el, vProps, factor.from.y, el.from );
|
178 |
|
|
el.to = $.effects.setTransition( el, vProps, factor.to.y, el.to );
|
179 |
|
|
}
|
180 |
|
|
|
181 |
|
|
|
182 |
|
|
if ( factor.from.x !== factor.to.x ) {
|
183 |
|
|
props = props.concat( hProps );
|
184 |
|
|
el.from = $.effects.setTransition( el, hProps, factor.from.x, el.from );
|
185 |
|
|
el.to = $.effects.setTransition( el, hProps, factor.to.x, el.to );
|
186 |
|
|
}
|
187 |
|
|
}
|
188 |
|
|
|
189 |
|
|
|
190 |
|
|
if ( scale === "content" || scale === "both" ) {
|
191 |
|
|
|
192 |
|
|
|
193 |
|
|
if ( factor.from.y !== factor.to.y ) {
|
194 |
|
|
props = props.concat( cProps ).concat( props2 );
|
195 |
|
|
el.from = $.effects.setTransition( el, cProps, factor.from.y, el.from );
|
196 |
|
|
el.to = $.effects.setTransition( el, cProps, factor.to.y, el.to );
|
197 |
|
|
}
|
198 |
|
|
}
|
199 |
|
|
|
200 |
|
|
$.effects.save( el, props );
|
201 |
|
|
el.show();
|
202 |
|
|
$.effects.createWrapper( el );
|
203 |
|
|
el.css( "overflow", "hidden" ).css( el.from );
|
204 |
|
|
|
205 |
|
|
|
206 |
|
|
if (origin) {
|
207 |
|
|
baseline = $.effects.getBaseline( origin, original );
|
208 |
|
|
el.from.top = ( original.outerHeight - el.outerHeight() ) * baseline.y;
|
209 |
|
|
el.from.left = ( original.outerWidth - el.outerWidth() ) * baseline.x;
|
210 |
|
|
el.to.top = ( original.outerHeight - el.to.outerHeight ) * baseline.y;
|
211 |
|
|
el.to.left = ( original.outerWidth - el.to.outerWidth ) * baseline.x;
|
212 |
|
|
}
|
213 |
|
|
el.css( el.from );
|
214 |
|
|
|
215 |
|
|
|
216 |
|
|
if ( scale === "content" || scale === "both" ) {
|
217 |
|
|
|
218 |
|
|
|
219 |
|
|
vProps = vProps.concat([ "marginTop", "marginBottom" ]).concat(cProps);
|
220 |
|
|
hProps = hProps.concat([ "marginLeft", "marginRight" ]);
|
221 |
|
|
props2 = props0.concat(vProps).concat(hProps);
|
222 |
|
|
|
223 |
|
|
el.find( "*[width]" ).each( function(){
|
224 |
|
|
var child = $( this ),
|
225 |
|
|
c_original = {
|
226 |
|
|
height: child.height(),
|
227 |
|
|
width: child.width(),
|
228 |
|
|
outerHeight: child.outerHeight(),
|
229 |
|
|
outerWidth: child.outerWidth()
|
230 |
|
|
};
|
231 |
|
|
if (restore) {
|
232 |
|
|
$.effects.save(child, props2);
|
233 |
|
|
}
|
234 |
|
|
|
235 |
|
|
child.from = {
|
236 |
|
|
height: c_original.height * factor.from.y,
|
237 |
|
|
width: c_original.width * factor.from.x,
|
238 |
|
|
outerHeight: c_original.outerHeight * factor.from.y,
|
239 |
|
|
outerWidth: c_original.outerWidth * factor.from.x
|
240 |
|
|
};
|
241 |
|
|
child.to = {
|
242 |
|
|
height: c_original.height * factor.to.y,
|
243 |
|
|
width: c_original.width * factor.to.x,
|
244 |
|
|
outerHeight: c_original.height * factor.to.y,
|
245 |
|
|
outerWidth: c_original.width * factor.to.x
|
246 |
|
|
};
|
247 |
|
|
|
248 |
|
|
|
249 |
|
|
if ( factor.from.y !== factor.to.y ) {
|
250 |
|
|
child.from = $.effects.setTransition( child, vProps, factor.from.y, child.from );
|
251 |
|
|
child.to = $.effects.setTransition( child, vProps, factor.to.y, child.to );
|
252 |
|
|
}
|
253 |
|
|
|
254 |
|
|
|
255 |
|
|
if ( factor.from.x !== factor.to.x ) {
|
256 |
|
|
child.from = $.effects.setTransition( child, hProps, factor.from.x, child.from );
|
257 |
|
|
child.to = $.effects.setTransition( child, hProps, factor.to.x, child.to );
|
258 |
|
|
}
|
259 |
|
|
|
260 |
|
|
|
261 |
|
|
child.css( child.from );
|
262 |
|
|
child.animate( child.to, o.duration, o.easing, function() {
|
263 |
|
|
|
264 |
|
|
|
265 |
|
|
if ( restore ) {
|
266 |
|
|
$.effects.restore( child, props2 );
|
267 |
|
|
}
|
268 |
|
|
});
|
269 |
|
|
});
|
270 |
|
|
}
|
271 |
|
|
|
272 |
|
|
|
273 |
|
|
el.animate( el.to, {
|
274 |
|
|
queue: false,
|
275 |
|
|
duration: o.duration,
|
276 |
|
|
easing: o.easing,
|
277 |
|
|
complete: function() {
|
278 |
|
|
if ( el.to.opacity === 0 ) {
|
279 |
|
|
el.css( "opacity", el.from.opacity );
|
280 |
|
|
}
|
281 |
|
|
if( mode === "hide" ) {
|
282 |
|
|
el.hide();
|
283 |
|
|
}
|
284 |
|
|
$.effects.restore( el, props );
|
285 |
|
|
if ( !restore ) {
|
286 |
|
|
|
287 |
|
|
|
288 |
|
|
if ( position === "static" ) {
|
289 |
|
|
el.css({
|
290 |
|
|
position: "relative",
|
291 |
|
|
top: el.to.top,
|
292 |
|
|
left: el.to.left
|
293 |
|
|
});
|
294 |
|
|
} else {
|
295 |
|
|
$.each([ "top", "left" ], function( idx, pos ) {
|
296 |
|
|
el.css( pos, function( _, str ) {
|
297 |
|
|
var val = parseInt( str, 10 ),
|
298 |
|
|
toRef = idx ? el.to.left : el.to.top;
|
299 |
|
|
|
300 |
|
|
|
301 |
|
|
if ( str === "auto" ) {
|
302 |
|
|
return toRef + "px";
|
303 |
|
|
}
|
304 |
|
|
|
305 |
|
|
return val + toRef + "px";
|
306 |
|
|
});
|
307 |
|
|
});
|
308 |
|
|
}
|
309 |
|
|
}
|
310 |
|
|
|
311 |
|
|
$.effects.removeWrapper( el );
|
312 |
|
|
done();
|
313 |
|
|
}
|
314 |
|
|
});
|
315 |
|
|
|
316 |
|
|
};
|
317 |
|
|
|
318 |
|
|
})(jQuery); |