[Sommaire] [Imprimer]

   1  /*
   2  moo.fx, simple effects library built with prototype.js (http://prototype.conio.net).
   3  by Valerio Proietti (http://mad4milk.net) MIT-style LICENSE.
   4  for more info (http://moofx.mad4milk.net).
   5  Friday, February 24, 2006
   6  v 1.2.2
   7  */
   8  
   9  var fx = new Object();
  10  //base
  11  fx.Base = function(){};
  12  fx.Base.prototype = {
  13      setOptions: function(options) {
  14      this.options = {
  15          duration: 500,
  16          onComplete: '',
  17          transition: fx.sinoidal
  18      }
  19      Object.extend(this.options, options || {});
  20      },
  21  
  22      go: function() {
  23          this.startTime = (new Date).getTime();
  24          this.timer = setInterval (this.step.bind(this), 13);
  25      },
  26  
  27      step: function() {
  28          var time  = (new Date).getTime();
  29          if (time >= this.options.duration+this.startTime) {
  30              this.now = this.to;
  31              clearInterval (this.timer);
  32              this.timer = null;
  33              if (this.options.onComplete) setTimeout(this.options.onComplete.bind(this), 10);
  34          }
  35          else {
  36              var Tpos = (time - this.startTime) / (this.options.duration);
  37              this.now = this.options.transition(Tpos) * (this.to-this.from) + this.from;
  38          }
  39          this.increase();
  40      },
  41  
  42      custom: function(from, to) {
  43          if (this.timer != null) return;
  44          this.from = from;
  45          this.to = to;
  46          this.go();
  47      },
  48  
  49      hide: function() {
  50          this.now = 0;
  51          this.increase();
  52      },
  53  
  54      clearTimer: function() {
  55          clearInterval(this.timer);
  56          this.timer = null;
  57      }
  58  }
  59  
  60  //stretchers
  61  fx.Layout = Class.create();
  62  fx.Layout.prototype = Object.extend(new fx.Base(), {
  63      initialize: function(el, options) {
  64          this.el = $(el);
  65          this.el.style.overflow = "hidden";
  66          this.el.iniWidth = this.el.offsetWidth;
  67          this.el.iniHeight = this.el.offsetHeight;
  68          this.setOptions(options);
  69      }
  70  });
  71  
  72  fx.Height = Class.create();
  73  Object.extend(Object.extend(fx.Height.prototype, fx.Layout.prototype), {    
  74      increase: function() {
  75          this.el.style.height = this.now + "px";
  76      },
  77  
  78      toggle: function() {
  79          if (this.el.offsetHeight > 0) this.custom(this.el.offsetHeight, 0);
  80          else this.custom(0, this.el.scrollHeight);
  81      }
  82  });
  83  
  84  fx.Width = Class.create();
  85  Object.extend(Object.extend(fx.Width.prototype, fx.Layout.prototype), {    
  86      increase: function() {
  87          this.el.style.width = this.now + "px";
  88      },
  89  
  90      toggle: function(){
  91          if (this.el.offsetWidth > 0) this.custom(this.el.offsetWidth, 0);
  92          else this.custom(0, this.el.iniWidth);
  93      }
  94  });
  95  
  96  //fader
  97  fx.Opacity = Class.create();
  98  fx.Opacity.prototype = Object.extend(new fx.Base(), {
  99      initialize: function(el, options) {
 100          this.el = $(el);
 101          this.now = 1;
 102          this.increase();
 103          this.setOptions(options);
 104      },
 105  
 106      increase: function() {
 107          if (this.now == 1 && (/Firefox/.test(navigator.userAgent))) this.now = 0.9999;
 108          this.setOpacity(this.now);
 109      },
 110      
 111      setOpacity: function(opacity) {
 112          if (opacity == 0) this.el.style.visibility = "hidden";
 113          else this.el.style.visibility = "visible";
 114          if (window.ActiveXObject) this.el.style.filter = "alpha(opacity=" + opacity*100 + ")";
 115          this.el.style.opacity = opacity;
 116      },
 117  
 118      toggle: function() {
 119          if (this.now > 0) this.custom(1, 0);
 120          else this.custom(0, 1);
 121      }
 122  });
 123  
 124  //transitions
 125  fx.sinoidal = function(pos){
 126      return ((-Math.cos(pos*Math.PI)/2) + 0.5);
 127      //this transition is from script.aculo.us
 128  }
 129  fx.linear = function(pos){
 130      return pos;
 131  }
 132  fx.cubic = function(pos){
 133      return Math.pow(pos, 3);
 134  }
 135  fx.circ = function(pos){
 136      return Math.sqrt(pos);
 137  }