js/my_tooltip.js

   1 /*\r
   2  My tooltip lib\r
   3 */\r
   4 var config = new Object();\r
   5 \r
   6 config. width       =   0   // Tooltip width, 0 for auto\r
   7 config. OffsetX     =  40   // Horizontal offset of left-top corner from mousepointer\r
   8 config. OffsetY     = -30   // Vertical offset\r
   9 config. Sticky      = true  // Move or not while shown\r
  10 config. Border      = true  // Show border\r
  11 config. step        = 15    // Opacity step time\r
  12 config. timeUp      = 0     // Show opacity time\r
  13 config. timeDown    = 300   // Hide opacity time\r
  14 tt_aV = new Array();        // Caches and enumerates config data for currently active tooltip\r
  15 \r
  16 // Mouse data\r
  17 var tt_musX = 0, tt_musY = 0;\r
  18 \r
  19 // tip data\r
  20 var tt_opaTimer = new Number(0),\r
  21 tt_mainDiv = 0,     // Main div\r
  22 tt_subDiv = 0,      // Main sub div - for opacity\r
  23 tt_status  = 0,     // Status & 1 - tip shown/hide\r
  24 tt_element = 0,     // onmouseover element for hide tooltip\r
  25 tt_opacity = 0,     // Current sub div opacity\r
  26 tt_isIE = 0,\r
  27 tt_currentTip = -1,\r
  28 tt_loading_text = '<div class=loading> </div>';\r
  29 \r
  30 function ajaxTip()\r
  31 {\r
  32         tt_currentTip = arguments[0];\r
  33         arguments[0] = tt_loading_text;\r
  34         var id = tt_currentTip;\r
  35         tt_Tip(arguments);\r
  36         my_AJAX.GETupload("ajax.php?tip=" + id, function(text){tt_updateTipData(id, text);});\r
  37 }\r
  38 function tt_hrefTip()\r
  39 {\r
  40         if (!this.id)\r
  41                 return;\r
  42         if (this.firstChild.tagName=='IMG')\r
  43                 ajaxTip(this.id);\r
  44         else\r
  45                 ajaxTip(this.id, STICKY, false);\r
  46 }\r
  47 \r
  48 function Tip()\r
  49 {\r
  50         tt_currentTip = -1;\r
  51         tt_Tip(arguments);\r
  52 }\r
  53 function tt_Tip(arg)\r
  54 {\r
  55         tt_ReadCmds(arg);\r
  56         tt_UpdateTip(arg[0]);\r
  57         tt_updatePosition();\r
  58         tt_startShowTip();\r
  59 }\r
  60 function tt_updateTipData(id, text)\r
  61 {\r
  62         if (tt_currentTip != id)\r
  63                 return;\r
  64         if ((tt_status & 1) == 0)\r
  65                 return;\r
  66         tt_UpdateTip(text);\r
  67         setOpacity(tt_subDiv, tt_opacity);\r
  68         tt_updatePosition();\r
  69 }\r
  70 function tt_opaStepUp(step)\r
  71 {\r
  72         tt_opacity+=(100*step/tt_aV[TIMEUP]);\r
  73         if (tt_opacity < 100)\r
  74                 tt_opaTimer.Timer("tt_opaStepUp(" + step + ")", step, true);\r
  75         else\r
  76                 {tt_opaTimer.EndTimer();tt_opacity = 100;}\r
  77         setOpacity(tt_subDiv, tt_opacity);\r
  78 }\r
  79 function tt_opaStepDown(step)\r
  80 {\r
  81         tt_opacity-=(100*step/tt_aV[TIMEDOWN]);\r
  82         if (tt_opacity > 0)\r
  83                 tt_opaTimer.Timer("tt_opaStepDown(" + step + ")", step, true);\r
  84         else\r
  85                 {tt_opaTimer.EndTimer();tt_finishHideTip();}\r
  86         setOpacity(tt_subDiv, tt_opacity);\r
  87 }\r
  88 function tt_startShowTip()\r
  89 {\r
  90         tt_opaTimer.EndTimer();\r
  91         if (tt_element)\r
  92         {\r
  93                 removeEvent(tt_element, "mouseout", tt_Hide);\r
  94                 tt_element = 0;\r
  95         }\r
  96 \r
  97         tt_status|=1;\r
  98         tt_mainDiv.style.visibility = "visible";\r
  99         if (tt_aV[TIMEUP])\r
 100         {\r
 101                 tt_opacity = 0;\r
 102                 tt_opaStepUp(tt_aV[STEP]);\r
 103         }\r
 104         else\r
 105         {\r
 106                 tt_opacity = 100;\r
 107                 setOpacity(tt_subDiv, tt_opacity);\r
 108         }\r
 109 }\r
 110 function tt_startHideTip()\r
 111 {\r
 112         tt_opaTimer.EndTimer();\r
 113         tt_status&=~1;\r
 114         if (tt_aV[TIMEDOWN])\r
 115                 tt_opaStepDown(tt_aV[STEP]);\r
 116         else\r
 117                 tt_finishHideTip();\r
 118 }\r
 119 function tt_finishHideTip()\r
 120 {\r
 121         tt_mainDiv.style.visibility = "hidden";\r
 122         tt_opacity = 0;\r
 123 }\r
 124 function tt_updatePosition()\r
 125 {\r
 126         var p = getPageRect(),\r
 127         width = tt_subDiv.offsetWidth,\r
 128         height= tt_subDiv.offsetHeight,\r
 129         max_x = p.left + p.width - width,\r
 130         max_y = p.top + p.height - height,\r
 131         x = tt_musX + tt_aV[OFFSETX],\r
 132         y = tt_musY + tt_aV[OFFSETY];\r
 133         if (x >= max_x) x = max_x;\r
 134         if (y >= max_y) y = max_y;\r
 135 \r
 136         var inX_ByX = (tt_musX > x && tt_musX < x + width);\r
 137         var inY_ByY = (tt_musY > y && tt_musY < y + height);\r
 138         if (inX_ByX && inY_ByY)\r
 139         {\r
 140                 x = tt_musX - width - tt_aV[OFFSETX];\r
 141                 x = x<p.left?p.left:x;\r
 142                 inX_ByX = (tt_musX > x && tt_musX < x + width);\r
 143                 if (inX_ByX) y = tt_musY - height - tt_aV[OFFSETY];\r
 144     }\r
 145         var css = tt_mainDiv.style;\r
 146         css.left = (x<p.left?p.left:x) + 'px';\r
 147         css.top  = (y<p.top?p.top:y) + 'px';\r
 148 }\r
 149 \r
 150 function tt_UpdateTip(text)\r
 151 {\r
 152         if (tt_aV[BORDER])\r
 153         {\r
 154                 var tt_tipBody = $('tt_tip_body');\r
 155                 if (tt_tipBody)\r
 156                 {\r
 157                         tt_tipBody.innerHTML = text;\r
 158                         return;\r
 159                 }\r
 160                 tt_mainDiv.innerHTML = ''\r
 161                 + '<div id=tt_tooltip>'\r
 162                 + '<table class=tooltip cellSpacing=0 cellPadding=0><tbody>'\r
 163                 + '<tr><td class=tiptopl></td><td class=tiptop></td><td class=tiptopr></td></tr>'\r
 164                 + '<tr><td class=tipl>&nbsp;</td><td class=tipbody id=tt_tip_body>'\r
 165                 + text\r
 166                 + '</td><td class=tipr>&nbsp;</td></tr>'\r
 167                 + '<tr><td class=tipbottoml></td><td class=tipbottom></td><td class=tipbottomr></td></tr>'\r
 168                 + '</tbody></table></div>';\r
 169         }\r
 170         else\r
 171                 tt_mainDiv.innerHTML = ''\r
 172                 + '<div id=tt_tooltip>'\r
 173                 + text\r
 174                 + '</div>';\r
 175         tt_subDiv = $('tt_tooltip');\r
 176         tt_subDiv.style.width = tt_aV[WIDTH] ? tt_aV[WIDTH] + 'px' : 'auto';\r
 177 }\r
 178 \r
 179 function tt_Hide(e)\r
 180 {\r
 181         e = window.event || e;\r
 182         if (!e) return;\r
 183         var target = e.target || e.srcElement;\r
 184         if (tt_element == target) {\r
 185                 removeEvent(tt_element, "mouseout", tt_Hide);\r
 186                 tt_element = 0;\r
 187                 tt_startHideTip();\r
 188         }\r
 189 }\r
 190 \r
 191 function tt_Move(e)\r
 192 {\r
 193         e = window.event || e;\r
 194         if (!e) return;\r
 195         var b = document.body || document.documentElement;\r
 196         tt_musX = e.pageX || (e.clientX + b.scrollLeft);\r
 197         tt_musY = e.pageY || (e.clientY + b.scrollTop);\r
 198         if (tt_element == 0 && tt_status & 1)\r
 199         {\r
 200                 tt_element = e.target || e.srcElement;\r
 201                 addEvent(tt_element, "mouseout", tt_Hide);\r
 202         }\r
 203         if (!tt_aV[STICKY] && tt_status&1)\r
 204            tt_updatePosition();\r
 205 }\r
 206 function Init()\r
 207 {\r
 208         // Create the tooltip DIV\r
 209         tt_mainDiv = insertElement(getBody(), 'DIV','tt_mytooltip');\r
 210         tt_mainDiv.style.position = "absolute";\r
 211         tt_mainDiv.style.zIndex   = 1000;\r
 212         tt_MkCmdEnum();\r
 213         addEvent(document, "mousemove", tt_Move);\r
 214         tt_finishHideTip();\r
 215 }\r
 216 \r
 217 // Creates command names by translating config variable names to upper case\r
 218 function tt_MkCmdEnum()\r
 219 {\r
 220         var n = 0;\r
 221         for(var i in config)\r
 222                 eval("window." + i.toString().toUpperCase() + " = " + n++);\r
 223 }\r
 224 function tt_ReadCmds(a)\r
 225 {\r
 226         var i=0;\r
 227         // First load the global config values, to initialize also values\r
 228         // for which no command has been passed\r
 229         for(var j in config)\r
 230                 tt_aV[i++] = config[j];\r
 231         // Then replace each cached config value for which a command has been\r
 232         // passed (ensure the # of command args plus value args be even)\r
 233         if(a.length & 1)\r
 234         {\r
 235                 for(i = a.length - 1; i > 0; i -= 2)\r
 236                         tt_aV[a[i - 1]] = a[i];\r
 237                 return true;\r
 238         }\r
 239         tt_Err("Incorrect call of Tip() or ajaxTip().\n"\r
 240                         + "Each command must be followed by a value.");\r
 241         return false;\r
 242 }\r
 243 Init();\r