wolnelektury/media/js/jquery.highlightfade.js

   1 /**
   2  *  jQuery Plugin highlightFade (jquery.offput.ca/highlightFade)
   3  *  (c) 2006 Blair Mitchelmore (offput.ca) blair@offput.ca
   4  */
   5 /**
   6  * This is version 0.7 of my highlightFade plugin. It follows the yellow fade technique of Web 2.0 fame
   7  * but expands it to allow any starting colour and allows you to specify the end colour as well.
   8  *
   9  * For the moment, I'm done with this plug-in. Unless I come upon a really cool feature it should have
  10  * this plug-in will only receive updates to ensure future compatibility with jQuery.
  11  *
  12  * As of now (Aug. 16, 2006) the plugin has been written with the 1.0.1 release of jQuery (rev 249) which
  13  * is available from http://jquery.com/src/jquery-1.0.1.js
  14  *
  15  * A note regarding rgb() syntax: I noticed that most browsers implement rgb syntax as either an integer
  16  * (0-255) or percentage (0-100%) value for each field, that is, rgb(i/p,i/p,i/p); however, the W3C
  17  * standard clearly defines it as "either three integer values or three percentage values" [http://www.w3.org/TR/CSS21/syndata.html]
  18  * which I choose to follow despite the error redundancy of the typical behaviour browsers employ.
  19  *
  20  * Changelog:
  21  *
  22  *    0.7:
  23  *        - Added the awesome custom attribute support written by George Adamson (slightly modified)
  24  *        - Removed bgColor plugin dependency seeing as attr is customizable now...
  25  *    0.6:
  26  *        - Abstracted getBGColor into its own plugin with optional test and data retrieval functions
  27  *        - Converted all $ references to jQuery references as John's code seems to be shifting away
  28  *          from that and I don't want to have to update this for a long time.
  29  *    0.5:
  30  *        - Added simple argument syntax for only specifying start colour of event
  31  *        - Removed old style argument syntax
  32  *        - Added 'interval', 'final, and 'end' properties
  33  *        - Renamed 'color' property to 'start'
  34  *        - Added second argument to $.highlightFade.getBGColor to bypass the e.highlighting check
  35  *    0.4:
  36  *        - Added rgb(%,%,%) color syntax
  37  *    0.3:
  38  *        - Fixed bug when event was called while parent was also running event corrupting the
  39  *          the background colour of the child
  40  *    0.2:
  41  *        - Fixed bug where an unspecified onComplete function made the page throw continuous errors
  42  *        - Fixed bug where multiple events on the same element would speed each subsequent event
  43  *    0.1:
  44  *        - Initial Release
  45  *
  46  * @author          Blair Mitchelmore (blair@offput.ca)
  47  * @version         0.5
  48  */
  49 jQuery.fn.highlightFade = function(settings) {
  50         var o = (settings && settings.constructor == String) ? {start: settings} : settings || {};
  51         var d = jQuery.highlightFade.defaults;
  52         var i = o['interval'] || d['interval'];
  53         var a = o['attr'] || d['attr'];
  54         var ts = {
  55                 'linear': function(s,e,t,c) { return parseInt(s+(c/t)*(e-s)); },
  56                 'sinusoidal': function(s,e,t,c) { return parseInt(s+Math.sin(((c/t)*90)*(Math.PI/180))*(e-s)); },
  57                 'exponential': function(s,e,t,c) { return parseInt(s+(Math.pow(c/t,2))*(e-s)); }
  58         };
  59         var t = (o['iterator'] && o['iterator'].constructor == Function) ? o['iterator'] : ts[o['iterator']] || ts[d['iterator']] || ts['linear'];
  60         if (d['iterator'] && d['iterator'].constructor == Function) t = d['iterator'];
  61         return this.each(function() {
  62                 if (!this.highlighting) this.highlighting = {};
  63                 var e = (this.highlighting[a]) ? this.highlighting[a].end : jQuery.highlightFade.getBaseValue(this,a) || [255,255,255];
  64                 var c = jQuery.highlightFade.getRGB(o['start'] || o['colour'] || o['color'] || d['start'] || [255,255,128]);
  65                 var s = jQuery.speed(o['speed'] || d['speed']);
  66                 var r = o['final'] || (this.highlighting[a] && this.highlighting[a].orig) ? this.highlighting[a].orig : jQuery.curCSS(this,a);
  67                 if (o['end'] || d['end']) r = jQuery.highlightFade.asRGBString(e = jQuery.highlightFade.getRGB(o['end'] || d['end']));
  68                 if (typeof o['final'] != 'undefined') r = o['final'];
  69                 if (this.highlighting[a] && this.highlighting[a].timer) window.clearInterval(this.highlighting[a].timer);
  70                 this.highlighting[a] = { steps: ((s.duration) / i), interval: i, currentStep: 0, start: c, end: e, orig: r, attr: a };
  71                 jQuery.highlightFade(this,a,o['complete'],t);
  72         });
  73 };
  74
  75 jQuery.highlightFade = function(e,a,o,t) {
  76         e.highlighting[a].timer = window.setInterval(function() {
  77                 var newR = t(e.highlighting[a].start[0],e.highlighting[a].end[0],e.highlighting[a].steps,e.highlighting[a].currentStep);
  78                 var newG = t(e.highlighting[a].start[1],e.highlighting[a].end[1],e.highlighting[a].steps,e.highlighting[a].currentStep);
  79                 var newB = t(e.highlighting[a].start[2],e.highlighting[a].end[2],e.highlighting[a].steps,e.highlighting[a].currentStep);
  80                 jQuery(e).css(a,jQuery.highlightFade.asRGBString([newR,newG,newB]));
  81                 if (e.highlighting[a].currentStep++ >= e.highlighting[a].steps) {
  82                         jQuery(e).css(a,e.highlighting[a].orig || '');
  83                         window.clearInterval(e.highlighting[a].timer);
  84                         e.highlighting[a] = null;
  85                         if (o && o.constructor == Function) o.call(e);
  86                 }
  87         },e.highlighting[a].interval);
  88 };
  89
  90 jQuery.highlightFade.defaults = {
  91         start: [255,255,128],
  92         interval: 50,
  93         speed: 400,
  94         attr: 'backgroundColor'
  95 };
  96
  97 jQuery.highlightFade.getRGB = function(c,d) {
  98         var result;
  99         if (c && c.constructor == Array && c.length == 3) return c;
 100         if (result = /rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)/.exec(c))
 101                 return [parseInt(result[1]),parseInt(result[2]),parseInt(result[3])];
 102         else if (result = /rgb\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*\)/.exec(c))
 103                 return [parseFloat(result[1])*2.55,parseFloat(result[2])*2.55,parseFloat(result[3])*2.55];
 104         else if (result = /#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/.exec(c))
 105                 return [parseInt("0x" + result[1]),parseInt("0x" + result[2]),parseInt("0x" + result[3])];
 106         else if (result = /#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])/.exec(c))
 107                 return [parseInt("0x"+ result[1] + result[1]),parseInt("0x" + result[2] + result[2]),parseInt("0x" + result[3] + result[3])];
 108         else
 109                 return jQuery.highlightFade.checkColorName(c) || d || null;
 110 };
 111
 112 jQuery.highlightFade.asRGBString = function(a) {
 113         return "rgb(" + a.join(",") + ")";
 114 };
 115
 116 jQuery.highlightFade.getBaseValue = function(e,a,b) {
 117         var s, t;
 118         b = b || false;
 119         t = a = a || jQuery.highlightFade.defaults['attr'];
 120         do {
 121                 s = jQuery(e).css(t || 'backgroundColor');
 122                 if ((s  != '' && s != 'transparent') || (e.tagName.toLowerCase() == "body") || (!b && e.highlighting && e.highlighting[a] && e.highlighting[a].end)) break;
 123                 t = false;
 124         } while (e = e.parentNode);
 125         if (!b && e.highlighting && e.highlighting[a] && e.highlighting[a].end) s = e.highlighting[a].end;
 126         if (s == undefined || s == '' || s == 'transparent') s = [255,255,255];
 127         return jQuery.highlightFade.getRGB(s);
 128 };
 129
 130 jQuery.highlightFade.checkColorName = function(c) {
 131         if (!c) return null;
 132         switch(c.replace(/^\s*|\s*$/g,'').toLowerCase()) {
 133                 case 'aqua': return [0,255,255];
 134                 case 'black': return [0,0,0];
 135                 case 'blue': return [0,0,255];
 136                 case 'fuchsia': return [255,0,255];
 137                 case 'gray': return [128,128,128];
 138                 case 'green': return [0,128,0];
 139                 case 'lime': return [0,255,0];
 140                 case 'maroon': return [128,0,0];
 141                 case 'navy': return [0,0,128];
 142                 case 'olive': return [128,128,0];
 143                 case 'purple': return [128,0,128];
 144                 case 'red': return [255,0,0];
 145                 case 'silver': return [192,192,192];
 146                 case 'teal': return [0,128,128];
 147                 case 'white': return [255,255,255];
 148                 case 'yellow': return [255,255,0];
 149         }
 150 };