koha-tmpl/opac-tmpl/prog/en/lib/greybox/GreyBox_v5_5/greybox_source/base/AJS_fx.js

   1 /*
   2 Last Modified: 25/12/06 18:26:30
   3
   4 AJS effects
   5     A very small library with a lot of functionality
   6 AUTHOR
   7     4mir Salihefendic (http://amix.dk) - amix@amix.dk
   8 LICENSE
   9     Copyright (c) 2006 Amir Salihefendic. All rights reserved.
  10     Copyright (c) 2005 Bob Ippolito. All rights reserved.
  11     Copyright (c) 2006 Valerio Proietti, http://www.mad4milk.net
  12     http://www.opensource.org/licenses/mit-license.php
  13 VERSION
  14     3.6
  15 SITE
  16     http://orangoo.com/AmiNation/AJS
  17 **/
  18 AJS.fx = {
  19     _shades: {0: 'ffffff', 1: 'ffffee', 2: 'ffffdd',
  20               3: 'ffffcc', 4: 'ffffbb', 5: 'ffffaa',
  21               6: 'ffff99'},
  22
  23     highlight: function(elm, options) {
  24         var base = new AJS.fx.Base();
  25         base.elm = AJS.$(elm);
  26         base.setOptions(options);
  27         base.options.duration = 600;
  28
  29         AJS.update(base, {
  30             increase: function(){
  31                 if(this.now == 7)
  32                     elm.style.backgroundColor = 'transparent';
  33                 else
  34                     elm.style.backgroundColor = '#' + AJS.fx._shades[Math.floor(this.now)];
  35             }
  36         });
  37         return base.custom(6, 0);
  38     },
  39
  40     fadeIn: function(elm, options) {
  41         options = options || {};
  42         if(!options.from) {
  43             options.from = 0;
  44             AJS.setOpacity(elm, 0);
  45         }
  46         if(!options.to) options.to = 1;
  47         var s = new AJS.fx.Style(elm, 'opacity', options);
  48         return s.custom(options.from, options.to);
  49     },
  50
  51     fadeOut: function(elm, options) {
  52         options = options || {};
  53         if(!options.from) options.from = 1;
  54         if(!options.to) options.to = 0;
  55         options.duration = 300;
  56         var s = new AJS.fx.Style(elm, 'opacity', options);
  57         return s.custom(options.from, options.to);
  58     },
  59
  60     setWidth: function(elm, options) {
  61         var s = new AJS.fx.Style(elm, 'width', options);
  62         return s.custom(options.from, options.to);
  63     },
  64
  65     setHeight: function(elm, options) {
  66         var s = new AJS.fx.Style(elm, 'height', options);
  67         return s.custom(options.from, options.to);
  68     }
  69 }
  70
  71
  72 //From moo.fx
  73 AJS.fx.Base = new AJS.Class({
  74     init: function() {
  75         AJS.bindMethods(this);
  76     },
  77
  78     setOptions: function(options){
  79         this.options = AJS.update({
  80                 onStart: function(){},
  81                 onComplete: function(){},
  82                 transition: AJS.fx.Transitions.sineInOut,
  83                 duration: 500,
  84                 wait: true,
  85                 fps: 50
  86         }, options || {});
  87     },
  88
  89     step: function(){
  90         var time = new Date().getTime();
  91         if (time < this.time + this.options.duration){
  92             this.cTime = time - this.time;
  93             this.setNow();
  94         } else {
  95             setTimeout(AJS.$b(this.options.onComplete, this, [this.elm]), 10);
  96             this.clearTimer();
  97             this.now = this.to;
  98         }
  99         this.increase();
 100     },
 101
 102     setNow: function(){
 103         this.now = this.compute(this.from, this.to);
 104     },
 105
 106     compute: function(from, to){
 107         var change = to - from;
 108         return this.options.transition(this.cTime, from, change, this.options.duration);
 109     },
 110
 111     clearTimer: function(){
 112         clearInterval(this.timer);
 113         this.timer = null;
 114         return this;
 115     },
 116
 117     _start: function(from, to){
 118         if (!this.options.wait) this.clearTimer();
 119         if (this.timer) return;
 120         setTimeout(AJS.$p(this.options.onStart, this.elm), 10);
 121         this.from = from;
 122         this.to = to;
 123         this.time = new Date().getTime();
 124         this.timer = setInterval(this.step, Math.round(1000/this.options.fps));
 125         return this;
 126     },
 127
 128     custom: function(from, to){
 129         return this._start(from, to);
 130     },
 131
 132     set: function(to){
 133         this.now = to;
 134         this.increase();
 135         return this;
 136     },
 137
 138     setStyle: function(elm, property, val) {
 139         if(this.property == 'opacity')
 140             AJS.setOpacity(elm, val);
 141         else
 142             AJS.setStyle(elm, property, val);
 143     }
 144 });
 145
 146 AJS.fx.Style = AJS.fx.Base.extend({
 147     init: function(elm, property, options) {
 148         this.parent();
 149         this.elm = elm;
 150         this.setOptions(options);
 151         this.property = property;
 152     },
 153
 154     increase: function(){
 155         this.setStyle(this.elm, this.property, this.now);
 156     }
 157 });
 158
 159 AJS.fx.Styles = AJS.fx.Base.extend({
 160     init: function(elm, options){
 161         this.parent();
 162         this.elm = AJS.$(elm);
 163         this.setOptions(options);
 164         this.now = {};
 165     },
 166
 167     setNow: function(){
 168         for (p in this.from)
 169             this.now[p] = this.compute(this.from[p], this.to[p]);
 170     },
 171
 172     custom: function(obj){
 173         if (this.timer && this.options.wait) return;
 174         var from = {};
 175         var to = {};
 176         for (p in obj){
 177                 from[p] = obj[p][0];
 178                 to[p] = obj[p][1];
 179         }
 180         return this._start(from, to);
 181     },
 182
 183     increase: function(){
 184         for (var p in this.now) this.setStyle(this.elm, p, this.now[p]);
 185     }
 186 });
 187
 188 //Transitions (c) 2003 Robert Penner (http://www.robertpenner.com/easing/), BSD License.
 189 AJS.fx.Transitions = {
 190     linear: function(t, b, c, d) { return c*t/d + b; },
 191     sineInOut: function(t, b, c, d) { return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b; }
 192 };
 193
 194 script_loaded = true;