mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-11-07 20:17:37 +00:00
8111b53b67
For now, disable opacity effects in moo.fx for Mac users so that testcases display properly. All other platforms should be uneffected. When the core bug 325296 is fixed, this can be removed.
126 lines
3.2 KiB
JavaScript
126 lines
3.2 KiB
JavaScript
/*
|
|
moo.fx, simple effects library built with prototype.js (http://prototype.conio.net).
|
|
by Valerio Proietti (http://mad4milk.net) MIT-style LICENSE.
|
|
for more info (http://moofx.mad4milk.net).
|
|
10/24/2005
|
|
v(1.0.2)
|
|
*/
|
|
|
|
//base
|
|
var fx = new Object();
|
|
fx.Base = function(){};
|
|
fx.Base.prototype = {
|
|
setOptions: function(options) {
|
|
this.options = {
|
|
duration: 500,
|
|
onComplete: ''
|
|
}
|
|
Object.extend(this.options, options || {});
|
|
},
|
|
|
|
go: function() {
|
|
this.duration = this.options.duration;
|
|
this.startTime = (new Date).getTime();
|
|
this.timer = setInterval (this.step.bind(this), 13);
|
|
},
|
|
|
|
step: function() {
|
|
var time = (new Date).getTime();
|
|
var Tpos = (time - this.startTime) / (this.duration);
|
|
if (time >= this.duration+this.startTime) {
|
|
this.now = this.to;
|
|
clearInterval (this.timer);
|
|
this.timer = null;
|
|
if (this.options.onComplete) setTimeout(this.options.onComplete.bind(this), 10);
|
|
}
|
|
else {
|
|
this.now = ((-Math.cos(Tpos*Math.PI)/2) + 0.5) * (this.to-this.from) + this.from;
|
|
//this time-position, sinoidal transition thing is from script.aculo.us
|
|
}
|
|
this.increase();
|
|
},
|
|
|
|
custom: function(from, to) {
|
|
if (this.timer != null) return;
|
|
this.from = from;
|
|
this.to = to;
|
|
this.go();
|
|
},
|
|
|
|
hide: function() {
|
|
this.now = 0;
|
|
this.increase();
|
|
},
|
|
|
|
clearTimer: function() {
|
|
clearInterval(this.timer);
|
|
this.timer = null;
|
|
}
|
|
}
|
|
|
|
//stretchers
|
|
fx.Layout = Class.create();
|
|
fx.Layout.prototype = Object.extend(new fx.Base(), {
|
|
initialize: function(el, options) {
|
|
this.el = $(el);
|
|
this.el.style.overflow = "auto";
|
|
this.el.iniWidth = this.el.offsetWidth;
|
|
this.el.iniHeight = this.el.offsetHeight;
|
|
this.setOptions(options);
|
|
}
|
|
});
|
|
|
|
fx.Height = Class.create();
|
|
Object.extend(Object.extend(fx.Height.prototype, fx.Layout.prototype), {
|
|
increase: function() {
|
|
this.el.style.height = this.now + "px";
|
|
},
|
|
|
|
toggle: function() {
|
|
if (this.el.offsetHeight > 0) this.custom(this.el.offsetHeight, 0);
|
|
else this.custom(0, this.el.scrollHeight);
|
|
}
|
|
});
|
|
|
|
fx.Width = Class.create();
|
|
Object.extend(Object.extend(fx.Width.prototype, fx.Layout.prototype), {
|
|
increase: function() {
|
|
this.el.style.width = this.now + "px";
|
|
},
|
|
|
|
toggle: function(){
|
|
if (this.el.offsetWidth > 0) this.custom(this.el.offsetWidth, 0);
|
|
else this.custom(0, this.el.iniWidth);
|
|
}
|
|
});
|
|
|
|
//fader
|
|
fx.Opacity = Class.create();
|
|
fx.Opacity.prototype = Object.extend(new fx.Base(), {
|
|
initialize: function(el, options) {
|
|
this.el = $(el);
|
|
this.now = 1;
|
|
this.increase();
|
|
this.setOptions(options);
|
|
},
|
|
|
|
increase: function() {
|
|
// XXX - ZLL: disable opacity effects for now on Mac due to
|
|
// gecko bug 328215
|
|
if (navigator.platform && navigator.platform == "MacPPC") {
|
|
if (this.now == 1) this.now = 1;
|
|
} else {
|
|
if (this.now == 1) this.now = 0.9999;
|
|
}
|
|
|
|
if (this.now > 0 && this.el.style.visibility == "hidden") this.el.style.visibility = "visible";
|
|
if (this.now == 0) this.el.style.visibility = "hidden";
|
|
if (window.ActiveXObject) this.el.style.filter = "alpha(opacity=" + this.now*100 + ")";
|
|
this.el.style.opacity = this.now;
|
|
},
|
|
|
|
toggle: function() {
|
|
if (this.now > 0) this.custom(1, 0);
|
|
else this.custom(0, 1);
|
|
}
|
|
}); |