Merge branch 'master' of github.com:solgenomics/sgn into topic/onto_browser
[sgn.git] / js / wz_tooltip.js
bloba6a364561cd3a998d68d73dc96b30ae1185acd55
1 /* This notice must be untouched at all times.
3 wz_tooltip.js    v. 3.38
5 The latest version is available at
6 http://www.walterzorn.com
7 or http://www.devira.com
8 or http://www.walterzorn.de
10 Copyright (c) 2002-2005 Walter Zorn. All rights reserved.
11 Created 1. 12. 2002 by Walter Zorn (Web: http://www.walterzorn.com )
12 Last modified: 9. 12. 2005
14 Cross-browser tooltips working even in Opera 5 and 6,
15 as well as in NN 4, Gecko-Browsers, IE4+, Opera 7+ and Konqueror.
16 No onmouseouts required.
17 Appearance of tooltips can be individually configured
18 via commands within the onmouseovers.
20 LICENSE: LGPL
22 This library is free software; you can redistribute it and/or
23 modify it under the terms of the GNU Lesser General Public
24 License (LGPL) as published by the Free Software Foundation; either
25 version 2.1 of the License, or (at your option) any later version.
27 This library is distributed in the hope that it will be useful,
28 but WITHOUT ANY WARRANTY; without even the implied warranty of
29 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
31 For more details on the GNU Lesser General Public License,
32 see http://www.gnu.org/copyleft/lesser.html
37 ////////////////  GLOBAL TOOPTIP CONFIGURATION  /////////////////////
38 var ttAbove       = false;        // tooltip above mousepointer? Alternative: true
39 var ttBgColor     = "#e6ecff";
40 var ttBgImg       = "";           // path to background image;
41 var ttBorderColor = "#003399";
42 var ttBorderWidth = 1;
43 var ttDelay       = 500;          // time span until tooltip shows up [milliseconds]
44 var ttFontColor   = "#000066";
45 var ttFontFace    = "arial,helvetica,sans-serif";
46 var ttFontSize    = "11px";
47 var ttFontWeight  = "normal";     // alternative: "bold";
48 var ttLeft        = false;        // tooltip on the left of the mouse? Alternative: true
49 var ttOffsetX     = 12;           // horizontal offset of left-top corner from mousepointer
50 var ttOffsetY     = 15;           // vertical offset                   "
51 var ttOpacity     = 100;          // opacity of tooltip in percent (must be integer between 0 and 100)
52 var ttPadding     = 3;            // spacing between border and content
53 var ttShadowColor = "";
54 var ttShadowWidth = 0;
55 var ttStatic      = false;        // tooltip NOT move with the mouse? Alternative: true
56 var ttSticky      = false;        // do NOT hide tooltip on mouseout? Alternative: true
57 var ttTemp        = 0;            // time span after which the tooltip disappears; 0 (zero) means "infinite timespan"
58 var ttTextAlign   = "left";
59 var ttTitleColor  = "#ffffff";    // color of caption text
60 var ttWidth       = 300;
61 ////////////////////  END OF TOOLTIP CONFIG  ////////////////////////
65 //////////////  TAGS WITH TOOLTIP FUNCTIONALITY  ////////////////////
66 // List may be extended or shortened:
67 var tt_tags = new Array("a","area","b","big","caption","center","code","dd","div","dl","dt","em","h1","h2","h3","h4","h5","h6","i","img","input","li","map","ol","p","pre","s", "select", "small","span","strike","strong","sub","sup","table","td","th","tr","tt","u","var","ul","layer");
68 /////////////////////////////////////////////////////////////////////
72 ///////// DON'T CHANGE ANYTHING BELOW THIS LINE /////////////////////
73 var tt_obj = null,         // current tooltip
74 tt_ifrm = null,            // iframe to cover windowed controls in IE
75 tt_objW = 0, tt_objH = 0,  // width and height of tt_obj
76 tt_objX = 0, tt_objY = 0,
77 tt_offX = 0, tt_offY = 0,
78 xlim = 0, ylim = 0,        // right and bottom borders of visible client area
79 tt_sup = false,            // true if T_ABOVE cmd
80 tt_sticky = false,         // tt_obj sticky?
81 tt_wait = false,
82 tt_act = false,            // tooltip visibility flag
83 tt_sub = false,            // true while tooltip below mousepointer
84 tt_u = "undefined",
85 tt_mf = null,              // stores previous mousemove evthandler
86 // Opera: disable href when hovering <a>
87 tt_tag = null;             // stores hovered dom node, href and previous statusbar txt
90 var tt_db = (document.compatMode && document.compatMode != "BackCompat")? document.documentElement : document.body? document.body : null,
91 tt_n = navigator.userAgent.toLowerCase(),
92 tt_nv = navigator.appVersion;
93 // Browser flags
94 var tt_op = !!(window.opera && document.getElementById),
95 tt_op6 = tt_op && !document.defaultView,
96 tt_op7 = tt_op && !tt_op6,
97 tt_ie = tt_n.indexOf("msie") != -1 && document.all && tt_db && !tt_op,
98 tt_ie6 = tt_ie && parseFloat(tt_nv.substring(tt_nv.indexOf("MSIE")+5)) >= 5.5,
99 tt_n4 = (document.layers && typeof document.classes != tt_u),
100 tt_n6 = (!tt_op && document.defaultView && typeof document.defaultView.getComputedStyle != tt_u),
101 tt_w3c = !tt_ie && !tt_n6 && !tt_op && document.getElementById;
103 function tt_Int(t_x)
105         var t_y;
106         return isNaN(t_y = parseInt(t_x))? 0 : t_y;
108 function wzReplace(t_x, t_y)
110         var t_ret = "",
111         t_str = this,
112         t_xI;
113         while((t_xI = t_str.indexOf(t_x)) != -1)
114         {
115                 t_ret += t_str.substring(0, t_xI) + t_y;
116                 t_str = t_str.substring(t_xI + t_x.length);
117         }
118         return t_ret+t_str;
120 String.prototype.wzReplace = wzReplace;
121 function tt_N4Tags(tagtyp, t_d, t_y)
123         t_d = t_d || document;
124         t_y = t_y || new Array();
125         var t_x = (tagtyp=="a")? t_d.links : t_d.layers;
126         for(var z = t_x.length; z--;) t_y[t_y.length] = t_x[z];
127         for(z = t_d.layers.length; z--;) t_y = tt_N4Tags(tagtyp, t_d.layers[z].document, t_y);
128         return t_y;
130 function tt_Htm(tt, t_id, txt)
132         var t_bgc = (typeof tt.T_BGCOLOR != tt_u)? tt.T_BGCOLOR : ttBgColor,
133         t_bgimg   = (typeof tt.T_BGIMG != tt_u)? tt.T_BGIMG : ttBgImg,
134         t_bc      = (typeof tt.T_BORDERCOLOR != tt_u)? tt.T_BORDERCOLOR : ttBorderColor,
135         t_bw      = (typeof tt.T_BORDERWIDTH != tt_u)? tt.T_BORDERWIDTH : ttBorderWidth,
136         t_ff      = (typeof tt.T_FONTFACE != tt_u)? tt.T_FONTFACE : ttFontFace,
137         t_fc      = (typeof tt.T_FONTCOLOR != tt_u)? tt.T_FONTCOLOR : ttFontColor,
138         t_fsz     = (typeof tt.T_FONTSIZE != tt_u)? tt.T_FONTSIZE : ttFontSize,
139         t_fwght   = (typeof tt.T_FONTWEIGHT != tt_u)? tt.T_FONTWEIGHT : ttFontWeight,
140         t_opa     = (typeof tt.T_OPACITY != tt_u)? tt.T_OPACITY : ttOpacity,
141         t_padd    = (typeof tt.T_PADDING != tt_u)? tt.T_PADDING : ttPadding,
142         t_shc     = (typeof tt.T_SHADOWCOLOR != tt_u)? tt.T_SHADOWCOLOR : (ttShadowColor || 0),
143         t_shw     = (typeof tt.T_SHADOWWIDTH != tt_u)? tt.T_SHADOWWIDTH : (ttShadowWidth || 0),
144         t_algn    = (typeof tt.T_TEXTALIGN != tt_u)? tt.T_TEXTALIGN : ttTextAlign,
145         t_tit     = (typeof tt.T_TITLE != tt_u)? tt.T_TITLE : "",
146         t_titc    = (typeof tt.T_TITLECOLOR != tt_u)? tt.T_TITLECOLOR : ttTitleColor,
147         t_w       = (typeof tt.T_WIDTH != tt_u)? tt.T_WIDTH  : ttWidth;
148         if(t_shc || t_shw)
149         {
150                 t_shc = t_shc || "#cccccc";
151                 t_shw = t_shw || 5;
152         }
153         if(tt_n4 && (t_fsz == "10px" || t_fsz == "11px")) t_fsz = "12px";
155         var t_optx = (tt_n4? '' : tt_n6? ('-moz-opacity:'+(t_opa/100.0)) : tt_ie? ('filter:Alpha(opacity='+t_opa+')') : ('opacity:'+(t_opa/100.0))) + ';';
156         var t_y = '<div id="'+t_id+'" style="position:absolute;z-index:1010;';
157         t_y += 'left:0px;top:0px;width:'+(t_w+t_shw)+'px;visibility:'+(tt_n4? 'hide' : 'hidden')+';'+t_optx+'">' +
158                 '<table border="0" cellpadding="0" cellspacing="0"'+(t_bc? (' bgcolor="'+t_bc+'" style="background:'+t_bc+';"') : '')+' width="'+t_w+'">';
159         if(t_tit)
160         {
161                 t_y += '<tr><td style="padding-left:3px;padding-right:3px;" align="'+t_algn+'"><font color="'+t_titc+'" face="'+t_ff+'" ' +
162                         'style="color:'+t_titc+';font-family:'+t_ff+';font-size:'+t_fsz+';"><b>' +
163                         (tt_n4? '&nbsp;' : '')+t_tit+'</b></font></td></tr>';
164         }
165         t_y += '<tr><td><table border="0" cellpadding="'+t_padd+'" cellspacing="'+t_bw+'" width="100%">' +
166                 '<tr><td'+(t_bgc? (' bgcolor="'+t_bgc+'"') : '')+(t_bgimg? ' background="'+t_bgimg+'"' : '')+' style="text-align:'+t_algn+';';
167         if(tt_n6) t_y += 'padding:'+t_padd+'px;';
168         t_y += '" align="'+t_algn+'"><font color="'+t_fc+'" face="'+t_ff+'"' +
169                 ' style="color:'+t_fc+';font-family:'+t_ff+';font-size:'+t_fsz+';font-weight:'+t_fwght+';">';
170         if(t_fwght == 'bold') t_y += '<b>';
171         t_y += txt;
172         if(t_fwght == 'bold') t_y += '</b>';
173         t_y += '</font></td></tr></table></td></tr></table>';
174         if(t_shw)
175         {
176                 var t_spct = Math.round(t_shw*1.3);
177                 if(tt_n4)
178                 {
179                         t_y += '<layer bgcolor="'+t_shc+'" left="'+t_w+'" top="'+t_spct+'" width="'+t_shw+'" height="0"></layer>' +
180                                 '<layer bgcolor="'+t_shc+'" left="'+t_spct+'" align="bottom" width="'+(t_w-t_spct)+'" height="'+t_shw+'"></layer>';
181                 }
182                 else
183                 {
184                         t_optx = tt_n6? '-moz-opacity:0.85;' : tt_ie? 'filter:Alpha(opacity=85);' : 'opacity:0.85;';
185                         t_y += '<div id="'+t_id+'R" style="position:absolute;background:'+t_shc+';left:'+t_w+'px;top:'+t_spct+'px;width:'+t_shw+'px;height:1px;overflow:hidden;'+t_optx+'"></div>' +
186                                 '<div style="position:relative;background:'+t_shc+';left:'+t_spct+'px;top:0px;width:'+(t_w-t_spct)+'px;height:'+t_shw+'px;overflow:hidden;'+t_optx+'"></div>';
187                 }
188         }
189         return(t_y+'</div>' +
190                 (tt_ie6 ? '<iframe id="TTiEiFrM" src="javascript:false" scrolling="no" frameborder="0" style="filter:Alpha(opacity=0);position:absolute;top:0px;left:0px;display:none;"></iframe>' : ''));
192 function tt_EvX(t_e)
194         var t_y = tt_Int(t_e.pageX || t_e.clientX || 0) +
195                 tt_Int(tt_ie? tt_db.scrollLeft : 0) +
196                 tt_offX;
197         if(t_y > xlim) t_y = xlim;
198         var t_scr = tt_Int(window.pageXOffset || (tt_db? tt_db.scrollLeft : 0) || 0);
199         if(t_y < t_scr) t_y = t_scr;
200         return t_y;
202 function tt_EvY(t_e)
204         var t_y = tt_Int(t_e.pageY || t_e.clientY || 0) +
205                 tt_Int(tt_ie? tt_db.scrollTop : 0);
206         if(tt_sup) t_y -= (tt_objH + tt_offY - 15);
207         else if(t_y > ylim || !tt_sub && t_y > ylim-24)
208         {
209                 t_y -= (tt_objH + 5);
210                 tt_sub = false;
211         }
212         else
213         {
214                 t_y += tt_offY;
215                 tt_sub = true;
216         }
217         return t_y;
219 function tt_ReleasMov()
221         if(document.onmousemove == tt_Move)
222         {
223                 if(!tt_mf && document.releaseEvents) document.releaseEvents(Event.MOUSEMOVE);
224                 document.onmousemove = tt_mf;
225         }
227 function tt_ShowIfrm(t_x)
229         if(!tt_obj || !tt_ifrm) return;
230         if(t_x)
231         {
232                 tt_ifrm.style.width = tt_objW+'px';
233                 tt_ifrm.style.height = tt_objH+'px';
234                 tt_ifrm.style.display = "block";
235         }
236         else tt_ifrm.style.display = "none";
238 function tt_GetDiv(t_id)
240         return(
241                 tt_n4? (document.layers[t_id] || null)
242                 : tt_ie? (document.all[t_id] || null)
243                 : (document.getElementById(t_id) || null)
244         );
246 function tt_GetDivW()
248         return tt_Int(
249                 tt_n4? tt_obj.clip.width
250                 : (tt_obj.style.pixelWidth || tt_obj.offsetWidth)
251         );
253 function tt_GetDivH()
255         return tt_Int(
256                 tt_n4? tt_obj.clip.height
257                 : (tt_obj.style.pixelHeight || tt_obj.offsetHeight)
258         );
261 // Compat with DragDrop Lib: Ensure that z-index of tooltip is lifted beyond toplevel dragdrop element
262 function tt_SetDivZ()
264         var t_i = tt_obj.style || tt_obj;
265         if(t_i)
266         {
267                 if(window.dd && dd.z)
268                         t_i.zIndex = Math.max(dd.z+1, t_i.zIndex);
269                 if(tt_ifrm) tt_ifrm.style.zIndex = t_i.zIndex-1;
270         }
272 function tt_SetDivPos(t_x, t_y)
274         var t_i = tt_obj.style || tt_obj;
275         var t_px = (tt_op6 || tt_n4)? '' : 'px';
276         t_i.left = (tt_objX = t_x) + t_px;
277         t_i.top = (tt_objY = t_y) + t_px;
278         if(tt_ifrm)
279         {
280                 tt_ifrm.style.left = t_i.left;
281                 tt_ifrm.style.top = t_i.top;
282         }
284 function tt_ShowDiv(t_x)
286         tt_ShowIfrm(t_x);
287         if(tt_n4) tt_obj.visibility = t_x? 'show' : 'hide';
288         else tt_obj.style.visibility = t_x? 'visible' : 'hidden';
289         tt_act = t_x;
291 function tt_OpDeHref(t_e)
293         var t_tag;
294         if(t_e)
295         {
296                 t_tag = t_e.target;
297                 while(t_tag)
298                 {
299                         if(t_tag.hasAttribute("href"))
300                         {
301                                 tt_tag = t_tag
302                                 tt_tag.t_href = tt_tag.getAttribute("href");
303                                 tt_tag.removeAttribute("href");
304                                 tt_tag.style.cursor = "hand";
305                                 tt_tag.onmousedown = tt_OpReHref;
306                                 tt_tag.stats = window.status;
307                                 window.status = tt_tag.t_href;
308                                 break;
309                         }
310                         t_tag = t_tag.parentElement;
311                 }
312         }
314 function tt_OpReHref()
316         if(tt_tag)
317         {
318                 tt_tag.setAttribute("href", tt_tag.t_href);
319                 window.status = tt_tag.stats;
320                 tt_tag = null;
321         }
323 function tt_Show(t_e, t_id, t_sup, t_delay, t_fix, t_left, t_offx, t_offy, t_static, t_sticky, t_temp)
325         if(tt_obj) tt_Hide();
326         tt_mf = document.onmousemove || null;
327         if(window.dd && (window.DRAG && tt_mf == DRAG || window.RESIZE && tt_mf == RESIZE)) return;
328         var t_sh, t_h;
330         tt_obj = tt_GetDiv(t_id);
331         if(tt_obj)
332         {
333                 t_e = t_e || window.event;
334                 tt_sub = !(tt_sup = t_sup);
335                 tt_sticky = t_sticky;
336                 tt_objW = tt_GetDivW();
337                 tt_objH = tt_GetDivH();
338                 tt_offX = t_left? -(tt_objW+t_offx) : t_offx;
339                 tt_offY = t_offy;
340                 if(tt_op7) tt_OpDeHref(t_e);
341                 if(tt_n4)
342                 {
343                         if(tt_obj.document.layers.length)
344                         {
345                                 t_sh = tt_obj.document.layers[0];
346                                 t_sh.clip.height = tt_objH - Math.round(t_sh.clip.width*1.3);
347                         }
348                 }
349                 else
350                 {
351                         t_sh = tt_GetDiv(t_id+'R');
352                         if(t_sh)
353                         {
354                                 t_h = tt_objH - tt_Int(t_sh.style.pixelTop || t_sh.style.top || 0);
355                                 if(typeof t_sh.style.pixelHeight != tt_u) t_sh.style.pixelHeight = t_h;
356                                 else t_sh.style.height = t_h+'px';
357                         }
358                 }
360                 xlim = tt_Int((tt_db && tt_db.clientWidth)? tt_db.clientWidth : window.innerWidth) +
361                         tt_Int(window.pageXOffset || (tt_db? tt_db.scrollLeft : 0) || 0) -
362                         tt_objW -
363                         (tt_n4? 21 : 0);
364                 ylim = tt_Int(window.innerHeight || tt_db.clientHeight) +
365                         tt_Int(window.pageYOffset || (tt_db? tt_db.scrollTop : 0) || 0) -
366                         tt_objH - tt_offY;
368                 tt_SetDivZ();
369                 if(t_fix) tt_SetDivPos(tt_Int((t_fix = t_fix.split(','))[0]), tt_Int(t_fix[1]));
370                 else tt_SetDivPos(tt_EvX(t_e), tt_EvY(t_e));
372                 var t_txt = 'tt_ShowDiv(\'true\');';
373                 if(t_sticky) t_txt += '{'+
374                                 'tt_ReleasMov();'+
375                                 'window.tt_upFunc = document.onmouseup || null;'+
376                                 'if(document.captureEvents) document.captureEvents(Event.MOUSEUP);'+
377                                 'document.onmouseup = new Function("window.setTimeout(\'tt_Hide();\', 10);");'+
378                         '}';
379                 else if(t_static) t_txt += 'tt_ReleasMov();';
380                 if(t_temp > 0) t_txt += 'window.tt_rtm = window.setTimeout(\'tt_sticky = false; tt_Hide();\','+t_temp+');';
381                 window.tt_rdl = window.setTimeout(t_txt, t_delay);
383                 if(!t_fix)
384                 {
385                         if(document.captureEvents) document.captureEvents(Event.MOUSEMOVE);
386                         document.onmousemove = tt_Move;
387                 }
388         }
390 var tt_area = false;
391 function tt_Move(t_ev)
393         if(!tt_obj) return;
394         if(tt_n6 || tt_w3c)
395         {
396                 if(tt_wait) return;
397                 tt_wait = true;
398                 setTimeout('tt_wait = false;', 5);
399         }
400         var t_e = t_ev || window.event;
401         tt_SetDivPos(tt_EvX(t_e), tt_EvY(t_e));
402         if(tt_op6)
403         {
404                 if(tt_area && t_e.target.tagName != 'AREA') tt_Hide();
405                 else if(t_e.target.tagName == 'AREA') tt_area = true;
406         }
408 function tt_Hide()
410         if(window.tt_obj)
411         {
412                 if(window.tt_rdl) window.clearTimeout(tt_rdl);
413                 if(!tt_sticky || !tt_act)
414                 {
415                         if(window.tt_rtm) window.clearTimeout(tt_rtm);
416                         tt_ShowDiv(false);
417                         tt_SetDivPos(-tt_objW, -tt_objH);
418                         tt_obj = null;
419                         if(typeof window.tt_upFunc != tt_u) document.onmouseup = window.tt_upFunc;
420                 }
421                 tt_sticky = false;
422                 if(tt_op6 && tt_area) tt_area = false;
423                 tt_ReleasMov();
424                 if(tt_op7) tt_OpReHref();
425         }
427 function tt_Init()
429         if(!(tt_op || tt_n4 || tt_n6 || tt_ie || tt_w3c)) return;
431         var htm = tt_n4? '<div style="position:absolute;"></div>' : '',
432         tags,
433         t_tj,
434         over,
435         esc = 'return escape(';
436         var i = tt_tags.length; while(i--)
437         {
438                 tags = tt_ie? (document.all.tags(tt_tags[i]) || 1)
439                         : document.getElementsByTagName? (document.getElementsByTagName(tt_tags[i]) || 1)
440                         : (!tt_n4 && tt_tags[i]=="a")? document.links
441                         : 1;
442                 if(tt_n4 && (tt_tags[i] == "a" || tt_tags[i] == "layer")) tags = tt_N4Tags(tt_tags[i]);
443                 var j = tags.length; while(j--)
444                 {
445                         if(typeof (t_tj = tags[j]).onmouseover == "function" && t_tj.onmouseover.toString().indexOf(esc) != -1 && !tt_n6 || tt_n6 && (over = t_tj.getAttribute("onmouseover")) && over.indexOf(esc) != -1)
446                         {
447                                 if(over) t_tj.onmouseover = new Function(over);
448                                 var txt = unescape(t_tj.onmouseover());
449                                 htm += tt_Htm(
450                                         t_tj,
451                                         "tOoLtIp"+i+""+j,
452                                         txt.wzReplace("& ","&")
453                                 );
455                                 t_tj.onmouseover = new Function('e',
456                                         'tt_Show(e,'+
457                                         '"tOoLtIp' +i+''+j+ '",'+
458                                         ((typeof t_tj.T_ABOVE != tt_u)? t_tj.T_ABOVE : ttAbove)+','+
459                                         ((typeof t_tj.T_DELAY != tt_u)? t_tj.T_DELAY : ttDelay)+','+
460                                         ((typeof t_tj.T_FIX != tt_u)? '"'+t_tj.T_FIX+'"' : '""')+','+
461                                         ((typeof t_tj.T_LEFT != tt_u)? t_tj.T_LEFT : ttLeft)+','+
462                                         ((typeof t_tj.T_OFFSETX != tt_u)? t_tj.T_OFFSETX : ttOffsetX)+','+
463                                         ((typeof t_tj.T_OFFSETY != tt_u)? t_tj.T_OFFSETY : ttOffsetY)+','+
464                                         ((typeof t_tj.T_STATIC != tt_u)? t_tj.T_STATIC : ttStatic)+','+
465                                         ((typeof t_tj.T_STICKY != tt_u)? t_tj.T_STICKY : ttSticky)+','+
466                                         ((typeof t_tj.T_TEMP != tt_u)? t_tj.T_TEMP : ttTemp)+
467                                         ');'
468                                 );
469                                 t_tj.onmouseout = tt_Hide;
470                                 if(t_tj.alt) t_tj.alt = "";
471                                 if(t_tj.title) t_tj.title = "";
472                         }
473                 }
474         }
475         document.write(htm);
476         if(document.getElementById) tt_ifrm = document.getElementById("TTiEiFrM");
478 tt_Init();