admin | 7ffa703 | 2006-09-27 21:06:30 +0000 | [diff] [blame] | 1 | /*
|
| 2 | moo.fx pack, effects extensions for moo.fx.
|
| 3 | by Valerio Proietti (http://mad4milk.net) MIT-style LICENSE
|
| 4 | for more info visit (http://moofx.mad4milk.net).
|
| 5 | Wednesday, November 16, 2005
|
| 6 | v1.0.4
|
| 7 | */
|
| 8 |
|
| 9 | //text size modify, now works with pixels too.
|
| 10 | fx.Text = Class.create();
|
| 11 | fx.Text.prototype = Object.extend(new fx.Base(), {
|
| 12 | initialize: function(el, options) {
|
| 13 | this.el = $(el);
|
| 14 | this.setOptions(options);
|
| 15 | if (!this.options.unit) this.options.unit = "em";
|
| 16 | },
|
| 17 |
|
| 18 | increase: function() {
|
| 19 | this.el.style.fontSize = this.now + this.options.unit;
|
| 20 | }
|
| 21 | });
|
| 22 |
|
| 23 | //composition effect, calls Width and Height alltogheter
|
| 24 | fx.Resize = Class.create();
|
| 25 | fx.Resize.prototype = {
|
| 26 | initialize: function(el, options) {
|
admin | e334c47 | 2006-10-21 19:44:22 +0000 | [diff] [blame] | 27 | this.h = new fx.Height(el, options);
|
admin | 7ffa703 | 2006-09-27 21:06:30 +0000 | [diff] [blame] | 28 | if (options) options.onComplete = null;
|
| 29 | this.w = new fx.Width(el, options);
|
| 30 | this.el = $(el);
|
| 31 | },
|
| 32 |
|
| 33 | toggle: function(){
|
| 34 | this.h.toggle();
|
| 35 | this.w.toggle();
|
| 36 | },
|
| 37 |
|
| 38 | modify: function(hto, wto) {
|
| 39 | this.h.custom(this.el.offsetHeight, this.el.offsetHeight + hto);
|
| 40 | this.w.custom(this.el.offsetWidth, this.el.offsetWidth + wto);
|
| 41 | },
|
| 42 |
|
| 43 | custom: function(hto, wto) {
|
| 44 | this.h.custom(this.el.offsetHeight, hto);
|
| 45 | this.w.custom(this.el.offsetWidth, wto);
|
| 46 | },
|
| 47 |
|
| 48 | hide: function(){
|
| 49 | this.h.hide();
|
| 50 | this.w.hide();
|
| 51 | }
|
| 52 | }
|
| 53 |
|
| 54 | //composition effect, calls Opacity and (Width and/or Height) alltogheter
|
| 55 | fx.FadeSize = Class.create();
|
| 56 | fx.FadeSize.prototype = {
|
| 57 | initialize: function(el, options) {
|
| 58 | this.el = $(el);
|
| 59 | this.el.o = new fx.Opacity(el, options);
|
| 60 | if (options) options.onComplete = null;
|
| 61 | this.el.h = new fx.Height(el, options);
|
| 62 | this.el.w = new fx.Width(el, options);
|
| 63 | },
|
| 64 |
|
| 65 | toggle: function() {
|
| 66 | this.el.o.toggle();
|
| 67 | for (var i = 0; i < arguments.length; i++) {
|
| 68 | if (arguments[i] == 'height') this.el.h.toggle();
|
| 69 | if (arguments[i] == 'width') this.el.w.toggle();
|
| 70 | }
|
| 71 | },
|
| 72 |
|
| 73 | hide: function(){
|
| 74 | this.el.o.hide();
|
| 75 | for (var i = 0; i < arguments.length; i++) {
|
| 76 | if (arguments[i] == 'height') this.el.h.hide();
|
| 77 | if (arguments[i] == 'width') this.el.w.hide();
|
| 78 | }
|
| 79 | }
|
| 80 | }
|
| 81 |
|
| 82 | //intended to work with arrays.
|
| 83 | var Multi = new Object();
|
| 84 | Multi = function(){};
|
| 85 | Multi.prototype = {
|
| 86 | initialize: function(elements, options){
|
| 87 | this.options = options;
|
| 88 | this.el = this.getElementsFromArray(elements);
|
| 89 | for (i=0;i<this.el.length;i++){
|
| 90 | this.effect(this.el[i]);
|
| 91 | }
|
| 92 | },
|
| 93 |
|
| 94 | getElementsFromArray: function(array) {
|
| 95 | var elements = new Array();
|
admin | e334c47 | 2006-10-21 19:44:22 +0000 | [diff] [blame] | 96 | for (i=0;i<array.length;i++) {
|
| 97 | elements.push($(array[i]));
|
admin | 7ffa703 | 2006-09-27 21:06:30 +0000 | [diff] [blame] | 98 | }
|
| 99 | return elements;
|
| 100 | }
|
| 101 | }
|
| 102 |
|
| 103 | //Fadesize with arrays
|
| 104 | fx.MultiFadeSize = Class.create();
|
| 105 | fx.MultiFadeSize.prototype = Object.extend(new Multi(), {
|
| 106 | effect: function(el){
|
| 107 | el.fs = new fx.FadeSize(el, this.options);
|
| 108 | },
|
| 109 |
|
| 110 | showThisHideOpen: function(el, delay, mode){
|
| 111 | for (i=0;i<this.el.length;i++){
|
| 112 | if (this.el[i].offsetHeight > 0 && this.el[i] != el && this.el[i].h.timer == null && el.h.timer == null){
|
| 113 | this.el[i].fs.toggle(mode);
|
| 114 | setTimeout(function(){el.fs.toggle(mode);}.bind(el), delay);
|
| 115 | }
|
| 116 |
|
| 117 | }
|
| 118 | },
|
| 119 |
|
| 120 | hide: function(el, mode){
|
| 121 | el.fs.hide(mode);
|
| 122 | }
|
| 123 | });
|
| 124 |
|
| 125 | var Remember = new Object();
|
| 126 | Remember = function(){};
|
| 127 | Remember.prototype = {
|
| 128 | initialize: function(el, options){
|
| 129 | this.el = $(el);
|
| 130 | this.days = 365;
|
| 131 | this.options = options;
|
| 132 | this.effect();
|
| 133 | var cookie = this.readCookie();
|
| 134 | if (cookie) {
|
| 135 | this.fx.now = cookie;
|
| 136 | this.fx.increase();
|
| 137 | }
|
| 138 | },
|
| 139 |
|
| 140 | //cookie functions based on code by Peter-Paul Koch
|
| 141 | setCookie: function(value) {
|
| 142 | var date = new Date();
|
| 143 | date.setTime(date.getTime()+(this.days*24*60*60*1000));
|
| 144 | var expires = "; expires="+date.toGMTString();
|
| 145 | document.cookie = this.el+this.el.id+this.prefix+"="+value+expires+"; path=/";
|
| 146 | },
|
| 147 |
|
| 148 | readCookie: function() {
|
| 149 | var nameEQ = this.el+this.el.id+this.prefix + "=";
|
| 150 | var ca = document.cookie.split(';');
|
| 151 | for(var i=0;i < ca.length;i++) {
|
| 152 | var c = ca[i];
|
| 153 | while (c.charAt(0)==' ') c = c.substring(1,c.length);
|
| 154 | if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
|
| 155 | }
|
| 156 | return false;
|
| 157 | },
|
| 158 |
|
| 159 | custom: function(from, to){
|
| 160 | if (this.fx.now != to) {
|
| 161 | this.setCookie(to);
|
| 162 | this.fx.custom(from, to);
|
| 163 | }
|
| 164 | }
|
| 165 | }
|
| 166 |
|
| 167 | fx.RememberHeight = Class.create();
|
| 168 | fx.RememberHeight.prototype = Object.extend(new Remember(), {
|
| 169 | effect: function(){
|
| 170 | this.fx = new fx.Height(this.el, this.options);
|
| 171 | this.prefix = 'height';
|
| 172 | },
|
| 173 |
|
| 174 | toggle: function(){
|
| 175 | if (this.el.offsetHeight == 0) this.setCookie(this.el.scrollHeight);
|
| 176 | else this.setCookie(0);
|
| 177 | this.fx.toggle();
|
| 178 | },
|
| 179 |
|
| 180 | resize: function(to){
|
| 181 | this.setCookie(this.el.offsetHeight+to);
|
| 182 | this.fx.custom(this.el.offsetHeight,this.el.offsetHeight+to);
|
| 183 | },
|
| 184 |
|
| 185 | hide: function(){
|
| 186 | if (!this.readCookie()) {
|
| 187 | this.fx.hide();
|
| 188 | }
|
| 189 | }
|
| 190 | });
|
| 191 |
|
| 192 | fx.RememberText = Class.create();
|
| 193 | fx.RememberText.prototype = Object.extend(new Remember(), {
|
| 194 | effect: function(){
|
| 195 | this.fx = new fx.Text(this.el, this.options);
|
| 196 | this.prefix = 'text';
|
| 197 | }
|
| 198 | });
|
| 199 |
|
| 200 |
|
| 201 | //use to attach effects without using js code, just classnames and rel attributes.
|
| 202 | ParseClassNames = Class.create();
|
| 203 | ParseClassNames.prototype = {
|
| 204 | initialize: function(options){
|
| 205 | var babies = document.getElementsByTagName('*') || document.all;
|
| 206 | for (var i = 0; i < babies.length; i++) {
|
| 207 | var el = babies[i];
|
| 208 | //attach the effect, from the classNames;
|
| 209 | var effects = this.getEffects(el);
|
| 210 | for (var j = 0; j < effects.length; j++) {
|
| 211 | if (j == 1 && options) options.onComplete = null;
|
| 212 | el[effects[j]+"fx"] = new fx[effects[j]](el, options);
|
| 213 | }
|
| 214 | //execute methods, from rel
|
| 215 | if (el.rel) {
|
| 216 | el.crel = el.rel.split(' ');
|
| 217 | if (el.crel[0].indexOf("fx_") > -1) {
|
| 218 | var event = el.crel[0].replace('fx_', '');
|
| 219 | var tocompute = this.getEffects($(el.crel[1]));
|
| 220 | el["on"+event] = function(){
|
| 221 | for (var f = 0; f < tocompute.length; f++) {
|
| 222 | $(this.crel[1])[tocompute[f]+"fx"][this.crel[2] || "toggle"](this.crel[3] || null, this.crel[4] || null);
|
| 223 | }
|
| 224 | }
|
| 225 | }
|
| 226 | }
|
| 227 | }
|
| 228 | },
|
| 229 |
|
| 230 | getEffects: function(el){
|
| 231 | var effects = new Array();
|
| 232 | var css = el.className.split(' ');
|
| 233 | for (var i = 0; i < css.length; i++) {
|
| 234 | if (css[i].indexOf('fx_') > -1) {
|
| 235 | var effect = css[i].replace('fx_', '');
|
| 236 | effects.push(effect);
|
| 237 | }
|
| 238 | }
|
| 239 | return effects;
|
| 240 | }
|
| 241 | } |