| 1 |
/* |
| 2 |
* jQuery UI Effects Scale 1.7.2 |
| 3 |
* |
| 4 |
* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about) |
| 5 |
* Dual licensed under the MIT (MIT-LICENSE.txt) |
| 6 |
* and GPL (GPL-LICENSE.txt) licenses. |
| 7 |
* |
| 8 |
* http://docs.jquery.com/UI/Effects/Scale |
| 9 |
* |
| 10 |
* Depends: |
| 11 |
* effects.core.js |
| 12 |
*/ |
| 13 |
(function($) { |
| 14 |
|
| 15 |
$.effects.puff = function(o) { |
| 16 |
|
| 17 |
return this.queue(function() { |
| 18 |
|
| 19 |
// Create element |
| 20 |
var el = $(this); |
| 21 |
|
| 22 |
// Set options |
| 23 |
var options = $.extend(true, {}, o.options); |
| 24 |
var mode = $.effects.setMode(el, o.options.mode || 'hide'); // Set Mode |
| 25 |
var percent = parseInt(o.options.percent,10) || 150; // Set default puff percent |
| 26 |
options.fade = true; // It's not a puff if it doesn't fade! :) |
| 27 |
var original = {height: el.height(), width: el.width()}; // Save original |
| 28 |
|
| 29 |
// Adjust |
| 30 |
var factor = percent / 100; |
| 31 |
el.from = (mode == 'hide') ? original : {height: original.height * factor, width: original.width * factor}; |
| 32 |
|
| 33 |
// Animation |
| 34 |
options.from = el.from; |
| 35 |
options.percent = (mode == 'hide') ? percent : 100; |
| 36 |
options.mode = mode; |
| 37 |
|
| 38 |
// Animate |
| 39 |
el.effect('scale', options, o.duration, o.callback); |
| 40 |
el.dequeue(); |
| 41 |
}); |
| 42 |
|
| 43 |
}; |
| 44 |
|
| 45 |
$.effects.scale = function(o) { |
| 46 |
|
| 47 |
return this.queue(function() { |
| 48 |
|
| 49 |
// Create element |
| 50 |
var el = $(this); |
| 51 |
|
| 52 |
// Set options |
| 53 |
var options = $.extend(true, {}, o.options); |
| 54 |
var mode = $.effects.setMode(el, o.options.mode || 'effect'); // Set Mode |
| 55 |
var percent = parseInt(o.options.percent,10) || (parseInt(o.options.percent,10) == 0 ? 0 : (mode == 'hide' ? 0 : 100)); // Set default scaling percent |
| 56 |
var direction = o.options.direction || 'both'; // Set default axis |
| 57 |
var origin = o.options.origin; // The origin of the scaling |
| 58 |
if (mode != 'effect') { // Set default origin and restore for show/hide |
| 59 |
options.origin = origin || ['middle','center']; |
| 60 |
options.restore = true; |
| 61 |
} |
| 62 |
var original = {height: el.height(), width: el.width()}; // Save original |
| 63 |
el.from = o.options.from || (mode == 'show' ? {height: 0, width: 0} : original); // Default from state |
| 64 |
|
| 65 |
// Adjust |
| 66 |
var factor = { // Set scaling factor |
| 67 |
y: direction != 'horizontal' ? (percent / 100) : 1, |
| 68 |
x: direction != 'vertical' ? (percent / 100) : 1 |
| 69 |
}; |
| 70 |
el.to = {height: original.height * factor.y, width: original.width * factor.x}; // Set to state |
| 71 |
|
| 72 |
if (o.options.fade) { // Fade option to support puff |
| 73 |
if (mode == 'show') {el.from.opacity = 0; el.to.opacity = 1;}; |
| 74 |
if (mode == 'hide') {el.from.opacity = 1; el.to.opacity = 0;}; |
| 75 |
}; |
| 76 |
|
| 77 |
// Animation |
| 78 |
options.from = el.from; options.to = el.to; options.mode = mode; |
| 79 |
|
| 80 |
// Animate |
| 81 |
el.effect('size', options, o.duration, o.callback); |
| 82 |
el.dequeue(); |
| 83 |
}); |
| 84 |
|
| 85 |
}; |
| 86 |
|
| 87 |
$.effects.size = function(o) { |
| 88 |
|
| 89 |
return this.queue(function() { |
| 90 |
|
| 91 |
// Create element |
| 92 |
var el = $(this), props = ['position','top','left','width','height','overflow','opacity']; |
| 93 |
var props1 = ['position','top','left','overflow','opacity']; // Always restore |
| 94 |
var props2 = ['width','height','overflow']; // Copy for children |
| 95 |
var cProps = ['fontSize']; |
| 96 |
var vProps = ['borderTopWidth', 'borderBottomWidth', 'paddingTop', 'paddingBottom']; |
| 97 |
var hProps = ['borderLeftWidth', 'borderRightWidth', 'paddingLeft', 'paddingRight']; |
| 98 |
|
| 99 |
// Set options |
| 100 |
var mode = $.effects.setMode(el, o.options.mode || 'effect'); // Set Mode |
| 101 |
var restore = o.options.restore || false; // Default restore |
| 102 |
var scale = o.options.scale || 'both'; // Default scale mode |
| 103 |
var origin = o.options.origin; // The origin of the sizing |
| 104 |
var original = {height: el.height(), width: el.width()}; // Save original |
| 105 |
el.from = o.options.from || original; // Default from state |
| 106 |
el.to = o.options.to || original; // Default to state |
| 107 |
// Adjust |
| 108 |
if (origin) { // Calculate baseline shifts |
| 109 |
var baseline = $.effects.getBaseline(origin, original); |
| 110 |
el.from.top = (original.height - el.from.height) * baseline.y; |
| 111 |
el.from.left = (original.width - el.from.width) * baseline.x; |
| 112 |
el.to.top = (original.height - el.to.height) * baseline.y; |
| 113 |
el.to.left = (original.width - el.to.width) * baseline.x; |
| 114 |
}; |
| 115 |
var factor = { // Set scaling factor |
| 116 |
from: {y: el.from.height / original.height, x: el.from.width / original.width}, |
| 117 |
to: {y: el.to.height / original.height, x: el.to.width / original.width} |
| 118 |
}; |
| 119 |
if (scale == 'box' || scale == 'both') { // Scale the css box |
| 120 |
if (factor.from.y != factor.to.y) { // Vertical props scaling |
| 121 |
props = props.concat(vProps); |
| 122 |
el.from = $.effects.setTransition(el, vProps, factor.from.y, el.from); |
| 123 |
el.to = $.effects.setTransition(el, vProps, factor.to.y, el.to); |
| 124 |
}; |
| 125 |
if (factor.from.x != factor.to.x) { // Horizontal props scaling |
| 126 |
props = props.concat(hProps); |
| 127 |
el.from = $.effects.setTransition(el, hProps, factor.from.x, el.from); |
| 128 |
el.to = $.effects.setTransition(el, hProps, factor.to.x, el.to); |
| 129 |
}; |
| 130 |
}; |
| 131 |
if (scale == 'content' || scale == 'both') { // Scale the content |
| 132 |
if (factor.from.y != factor.to.y) { // Vertical props scaling |
| 133 |
props = props.concat(cProps); |
| 134 |
el.from = $.effects.setTransition(el, cProps, factor.from.y, el.from); |
| 135 |
el.to = $.effects.setTransition(el, cProps, factor.to.y, el.to); |
| 136 |
}; |
| 137 |
}; |
| 138 |
$.effects.save(el, restore ? props : props1); el.show(); // Save & Show |
| 139 |
$.effects.createWrapper(el); // Create Wrapper |
| 140 |
el.css('overflow','hidden').css(el.from); // Shift |
| 141 |
|
| 142 |
// Animate |
| 143 |
if (scale == 'content' || scale == 'both') { // Scale the children |
| 144 |
vProps = vProps.concat(['marginTop','marginBottom']).concat(cProps); // Add margins/font-size |
| 145 |
hProps = hProps.concat(['marginLeft','marginRight']); // Add margins |
| 146 |
props2 = props.concat(vProps).concat(hProps); // Concat |
| 147 |
el.find("*[width]").each(function(){ |
| 148 |
child = $(this); |
| 149 |
if (restore) $.effects.save(child, props2); |
| 150 |
var c_original = {height: child.height(), width: child.width()}; // Save original |
| 151 |
child.from = {height: c_original.height * factor.from.y, width: c_original.width * factor.from.x}; |
| 152 |
child.to = {height: c_original.height * factor.to.y, width: c_original.width * factor.to.x}; |
| 153 |
if (factor.from.y != factor.to.y) { // Vertical props scaling |
| 154 |
child.from = $.effects.setTransition(child, vProps, factor.from.y, child.from); |
| 155 |
child.to = $.effects.setTransition(child, vProps, factor.to.y, child.to); |
| 156 |
}; |
| 157 |
if (factor.from.x != factor.to.x) { // Horizontal props scaling |
| 158 |
child.from = $.effects.setTransition(child, hProps, factor.from.x, child.from); |
| 159 |
child.to = $.effects.setTransition(child, hProps, factor.to.x, child.to); |
| 160 |
}; |
| 161 |
child.css(child.from); // Shift children |
| 162 |
child.animate(child.to, o.duration, o.options.easing, function(){ |
| 163 |
if (restore) $.effects.restore(child, props2); // Restore children |
| 164 |
}); // Animate children |
| 165 |
}); |
| 166 |
}; |
| 167 |
|
| 168 |
// Animate |
| 169 |
el.animate(el.to, { queue: false, duration: o.duration, easing: o.options.easing, complete: function() { |
| 170 |
if(mode == 'hide') el.hide(); // Hide |
| 171 |
$.effects.restore(el, restore ? props : props1); $.effects.removeWrapper(el); // Restore |
| 172 |
if(o.callback) o.callback.apply(this, arguments); // Callback |
| 173 |
el.dequeue(); |
| 174 |
}}); |
| 175 |
|
| 176 |
}); |
| 177 |
|
| 178 |
}; |
| 179 |
|
| 180 |
})(jQuery); |
| 181 |
|