home *** CD-ROM | disk | FTP | other *** search
/ Chip 2011 March / Chip_2011.03_CD.iso / Tools / modules / tooltip.js < prev    next >
Encoding:
JavaScript  |  2010-12-14  |  10.0 KB  |  396 lines
  1. //<![CDATA[
  2. /* constants */
  3. var LEFT = 1000000;
  4. var RIGHT = 1000001;
  5. var CENTER = 1000002;
  6. var ABOVE = 1000003;
  7. var BELOW = 1000004;
  8.  
  9. /* this variable can change */
  10. var ttl_divid='tooltipDiv';
  11. var ttl_innerdivid='tooltipDivContent';
  12. var ttl_color="#404040";
  13. var ttl_background="#FFFFF0";
  14. var ttl_rounded=true;
  15. var ttl_showempty=false;
  16. var ttl_opacity=1;
  17. var ttl_fontsize;
  18. var ttl_fontname;
  19. var ttl_textalign;
  20. var ttl_width=200;
  21. var ttl_height=0;
  22. var ttl_offsetx=13;
  23. var ttl_offsety=13;
  24. var ttl_hpos=RIGHT;
  25. var ttl_vpos=BELOW;
  26. var ttl_paddingx='3px';
  27. var ttl_paddingy='1px';
  28. var ttl_ontimeout=500;
  29. var ttl_offtimeout=10;
  30.  
  31. /* inernal variables */
  32. var ttl_x=0;
  33. var ttl_y=0;
  34. var ttl_customdiv=true;
  35. var ttl_allowmove=true;
  36. var ttl_ontimer=0;
  37. var ttl_offtimer=0;
  38. var ttl_visible=false;
  39. var ttl_div;
  40. var ttl_Op = (navigator.userAgent.toLowerCase().indexOf('opera') > -1 && document.createTextNode);  // Opera 7
  41. var ttl_Ns6 = (document.getElementById) ? true : false;
  42. var ttl_Ie4 = (document.all) ? true : false;
  43. var ttl_Ie5 = false; 
  44. var ttl_Ie55 = false;
  45. var ttl_docRoot = 'document.body';
  46. var ttl_checkmousecapture=true;
  47. var ttl_hoveringswitch=false;
  48.  
  49. // Microsoft Stupidity Check(tm).
  50. if (ttl_Ie4) {
  51.     var agent = navigator.userAgent;
  52.     if (/MSIE/.test(agent)) {
  53.         var versNum = parseFloat(agent.match(/MSIE[ ](\d\.\d+)\.*/i)[1]);
  54.         if (versNum >= 5){
  55.             ttl_Ie5=true;
  56.             ttl_Ie55=(versNum>=5.5&&!ttl_Op) ? true : false;
  57.             if (ttl_Ns6) ttl_Ns6=false;
  58.         }
  59.     }
  60.     if (ttl_Ns6) ttl_Ie4 = false;
  61. }
  62.  
  63. // Check for compatability mode.
  64. if (document.compatMode && document.compatMode == 'CSS1Compat') {
  65.     ttl_docRoot= ((ttl_Ie4 && !ttl_Op) ? 'document.documentElement' : ttl_docRoot);
  66. }
  67.  
  68. // Capture the mouse and chain other scripts.
  69. function ttlMouseCapture(e) {
  70.     capExtent = document;
  71.     var fN, str = '', l, k, f, wMv, sS, mseHandler = ttlMouseMove;
  72.     var re = /function[ ]*(\w*)\(/;
  73.     
  74.     wMv = (!ttl_Ie4 && window.onmousemove);
  75.     if (document.onmousemove || wMv) {
  76.         if (wMv) capExtent = window;
  77.         f = capExtent.onmousemove.toString();
  78.         fN = f.match(re);
  79.         if (fN == null) {
  80.             str = f+'(e); ';
  81.         } else if (fN[1] == 'anonymous' || fN[1] == 'ttlMouseMove' || (wMv && fN[1] == 'onmousemove')) {
  82.             if (!ttl_Op && wMv) {
  83.                 l = f.indexOf('{')+1;
  84.                 k = f.lastIndexOf('}');
  85.                 sS = f.substring(l,k);
  86.                 if ((l = sS.indexOf('(')) != -1) {
  87.                     sS = sS.substring(0,l).replace(/^\s+/,'').replace(/\s+$/,'');
  88.                     if (eval("typeof " + sS + " == 'undefined'")) window.onmousemove = null;
  89.                     else str = sS + '(e);';
  90.                 }
  91.             }
  92.             if (!str) {
  93.                 ttl_checkmousecapture = false;
  94.                 return;
  95.             }
  96.         } else {
  97.             if (fN[1]) str = fN[1]+'(e); ';
  98.             else {
  99.                 l = f.indexOf('{')+1;
  100.                 k = f.lastIndexOf('}');
  101.                 str = f.substring(l,k) + '\n';
  102.             }
  103.         }
  104.         str += 'ttlMouseMove(e); ';
  105.         mseHandler = new Function('e', str);
  106.     }
  107.     capExtent.onmousemove = mseHandler;
  108.     var div = ttlGetTooltipDiv();
  109.     if(!div) return;
  110.     div.onmouseover = ttlTooltipOver;
  111.     ttlMouseMove(e);
  112. }
  113.  
  114. function ttlGetById(id)
  115. {
  116.     return ttl_Ie4?document.all[id]:document.getElementById(id);
  117. }
  118.  
  119. function ttlCreateTooltipDiv()
  120. {
  121.     var div = document.createElement('DIV');
  122.     div.setAttribute('id',ttl_divid);
  123.     if(ttl_width) 
  124.         if(ttl_width==parseInt(ttl_width,10)) {
  125.             div.style.width=ttl_width+'px';
  126.         } else {
  127.             div.style.width=ttl_width;
  128.         }
  129.     else div.style.width='';
  130.     div.style.overflow='hidden';
  131.     div.style.position='absolute';
  132.     div.style.zIndex=1000;
  133.     div.style.top='0px';
  134.     div.style.left='0px';
  135.     div.style.visibility='hidden';
  136.     document.body.appendChild(div);
  137.     ttl_customdiv=false;
  138.     ttl_div=div;
  139.     return div;
  140. }
  141.  
  142. function ttlGetTooltipDiv()
  143. {
  144.     var div = ttl_div;
  145.     if(div) return div;
  146.     div = ttlGetById(ttl_divid);
  147.     if(div) return div;
  148.     div=ttlCreateTooltipDiv();
  149.     ttlSetTooltipStyle(div);
  150.     return div;
  151. }
  152.  
  153. function ttlSetTooltipStyle(div,text,attrs)
  154. {
  155.     if(!div) return false;
  156.     if(!ttl_customdiv) {
  157.         var color=ttl_color;
  158.         var background=ttl_background;
  159.         var width=ttl_width;
  160.         var fontsize=ttl_fontsize;
  161.         var fontname=ttl_fontname;
  162.         var textalign=ttl_textalign;
  163.         var opacity=ttl_opacity;
  164.  
  165.         if(attrs) {
  166.             if(attrs.color) color=attrs.color;
  167.             if(attrs.background) background=attrs.background;
  168.             if(attrs.width!=undefined) width=attrs.width;
  169.             if(attrs.fontsize) fontsize=attrs.fontsize;
  170.             if(attrs.fontname) fontname=attrs.fontname;
  171.             if(attrs.textalign) textalign=attrs.textalign;
  172.             if(attrs.opacity!=undefined) opacity=attrs.opacity;
  173.         }
  174.         if(width) 
  175.             if(width==parseInt(width,10)) {
  176.                 div.style.width=width+'px';
  177.             } else {
  178.                 div.style.width=width;
  179.             }
  180.         else div.style.width='';
  181.         var html='';
  182.         if(ttl_rounded) {
  183.             html+='<div style="margin:0px"><div style="margin:0px 1px;height:1px;overflow:hidden;font-size:1px;';
  184.             if(background) html+='background:'+background+';';
  185.             html+='"></div></div>';
  186.         }
  187.         html+='<div id="tooltipDivContent" style="padding:'+ttl_paddingy+' '+ttl_paddingx+';';
  188.         if(background) html+='background:'+background+';';
  189.         if(color) html+='color:'+color+';';
  190.         if(fontsize) html+='font-size:'+fontsize+';';
  191.         if(fontname) html+='font-family:'+fontname+';';
  192.         if(textalign) html+='text-align:'+textalign+';';
  193.         html+='"></div>';
  194.         if(ttl_rounded) {
  195.             html+='<div style="margin:0px"><div style="margin:0px 1px;height:1px;overflow:hidden;font-size:1px;';
  196.             if(background) html+='background:'+background+';';
  197.             html+='"></div></div>';
  198.         }
  199.         div.innerHTML=html;
  200.         if(opacity!=undefined) { 
  201.             div.style.opacity=opacity;
  202.             div.style.filter='alpha(opacity='+(opacity*100)+')';
  203.         }
  204.     }
  205.     var div = ttlGetById(ttl_innerdivid);
  206.     if(!div) return false;
  207.     if(attrs && attrs.copyfrom) {
  208.         var source = ttlGetById(attrs.copyfrom);
  209.         if(source) div.innerHTML=source.innerHTML;
  210.     }
  211.     else {
  212.         if(text!=undefined) div.innerHTML=text;
  213.     }
  214.     return true;
  215. }
  216.  
  217. function ttlSetTooltipText(text)
  218. {
  219.     return true;
  220. }
  221.  
  222. function ttlCursorOff(div) {
  223.     if(!div) div=ttlGetTooltipDiv();
  224.     if(!div) return;
  225.     var left = parseInt(div.style.left,10);
  226.     var top = parseInt(div.style.top,10);
  227.     var right = left + (parseInt(div.style.width,10) ? parseInt(div.style.width,10) : div.offsetWidth );
  228.     var bottom = top + (parseInt(div.style.height,10) ? parseInt(div.style.height,10) : div.offsetHeight );
  229.     if (ttl_x < left-1 || ttl_x > right+1 || ttl_y < top-1 || ttl_y > bottom+1) return true;
  230.     return false;
  231. }
  232.  
  233. function ttlMouseMove(e)
  234. {
  235.     e = e || window.event;
  236.     if(!e) return;
  237.     if (e.pageX) {
  238.         ttl_x = e.pageX;
  239.         ttl_y = e.pageY;
  240.     }
  241.     else if (e.clientX) {
  242.         ttl_x = eval('e.clientX + '+ttl_docRoot+'.scrollLeft');
  243.         ttl_y = eval('e.clientY + '+ttl_docRoot+'.scrollTop');
  244.     }
  245.     if(ttl_visible && ttl_allowmove) ttlPlaceTooltip();
  246.     if (ttl_hoveringswitch && ttlCursorOff()) {
  247.         ttlHideTooltip();
  248.         ttl_hoveringswitch = 0;
  249.     }
  250. }
  251.  
  252. // get Browser window width
  253. function ttlWindowWidth() {
  254.     var w;
  255.     if (self.innerWidth) w=self.innerWidth;
  256.     else if(eval("typeof "+ttl_docRoot+".clientWidth=='number'")) 
  257.         w=eval(ttl_docRoot+'.clientWidth');
  258.     return w;            
  259. }
  260.  
  261. function ttlPlaceHorizontal(div,x,winwidth,winoffset,widthfix)
  262. {
  263.  
  264.     var divwidth = parseInt(div.style.width,10);
  265.     if(!divwidth) divwidth = div.offsetWidth;
  266.     if(ttl_hpos == CENTER) { // Center
  267.         x = x+ttl_offsetx-(divwidth/2);
  268.         if (x < winoffset) x = winoffset;
  269.         if((x+divwidth) > (winoffset+winwidth - widthfix)) {
  270.             x = winwidth+winoffset - divwidth - widthfix;
  271.             if(x<0) x=0;
  272.         }
  273.     }
  274.  
  275.     if(ttl_hpos == RIGHT) { // Right
  276.         x = x+ttl_offsetx;
  277.         if((x+divwidth) > (winoffset+winwidth - widthfix)) {
  278.             x = winwidth+winoffset - divwidth - widthfix;
  279.             if(x<0) x=0;
  280.         }
  281.     }
  282.     if (ttl_hpos == LEFT) { // Left
  283.         x = x-ttl_offsetx-divwidth;
  284.         if(x<winoffset) x=winoffset;
  285.     }
  286.     return x;
  287. }
  288.  
  289. function ttlPlaceVertical(div,y,winheight,winoffset)
  290. {
  291.     var divheight=div.style.height;
  292.     if(!divheight) divheight = div.offsetHeight;
  293.     // From mouse
  294.     if (ttl_vpos == ABOVE) {
  295.         y = y - (divheight+ttl_offsety);
  296.         if (y<winoffset) y = winoffset;
  297.     } else {
  298.         // BELOW
  299.         y = y+ttl_offsety;
  300.     } 
  301.     return y;
  302. }
  303.  
  304. function ttlPlaceTooltip(div)
  305. {
  306.     if(!div) div=ttlGetTooltipDiv();
  307.     if(!div) return false;
  308.     var widthFix=0;
  309.     if (self.innerWidth) widthFix=18; 
  310.     var iwidth = ttlWindowWidth();
  311.     var winoffset=(ttl_Ie4) ? eval('self.'+ttl_docRoot+'.scrollLeft') : self.pageXOffset;
  312.     var iheight;
  313.     if (self.innerHeight) {
  314.         iheight=self.innerHeight;
  315.     } else if (eval("typeof "+ttl_docRoot+".clientHeight=='number'")&&eval(ttl_docRoot+'.clientHeight')) { 
  316.         iheight=eval(ttl_docRoot+'.clientHeight');
  317.     }            
  318.  
  319.     // Vertical scroll offset
  320.     var scrolloffset=(ttl_Ie4) ? eval(ttl_docRoot+'.scrollTop') : self.pageYOffset;
  321.     var x=ttlPlaceHorizontal(div,ttl_x,iwidth,winoffset,widthFix);
  322.     var y=ttlPlaceVertical(div,ttl_y,iheight,scrolloffset);
  323.     div.style.left=x+'px';
  324.     div.style.top=y+'px';
  325.     return true;
  326. }
  327.  
  328. function ttlShowTooltip(div)
  329. {
  330.     if(!div) div=ttlGetTooltipDiv();
  331.     if(!div) return;
  332.     ttlPlaceTooltip(div);
  333.     div.style.visibility = 'visible';
  334.     ttl_visible=true;
  335.     if(ttl_offtimer) { clearTimeout(ttl_offtimer); ttl_offtimer=0; }
  336.     if(ttl_ontimer) { clearTimeout(ttl_ontimer); ttl_ontimer=0; }
  337. }
  338.  
  339. function ttlHideTooltip(div)
  340. {
  341.     if(!div) div=ttlGetTooltipDiv();
  342.     if(!div) return;
  343.     div.style.visibility = 'hidden';
  344.     ttl_visible=false;
  345.     if(ttl_offtimer) { clearTimeout(ttl_offtimer); ttl_offtimer=0; }
  346.     ttl_allowmove=false;
  347. }
  348.  
  349. function ttlPopupTooltip()
  350. {
  351.     var div=ttlGetTooltipDiv();
  352.     if(!div) return;
  353.     ttlShowTooltip(div);
  354.     ttlPlaceTooltip(div);
  355. }
  356.  
  357. function ttlTooltipOver()
  358. {
  359.     if(ttl_offtimer) clearTimeout(ttl_offtimer);
  360.     ttl_offtimer=0;
  361.     ttl_hoveringswitch=1;
  362. }
  363.  
  364. function ttlOver(e,text,attrs)
  365. {
  366.     var div = ttlGetTooltipDiv();
  367.     if(!div) return true;
  368.     if (ttl_checkmousecapture) ttlMouseCapture(e);
  369.     e = e || window.event;
  370.     ttl_allowmove = e.type=='mousemove';
  371.     var delay = e.type=='mouseover';
  372.     if(!ttl_visible && (text!='' || ttl_showempty)) {
  373.         ttlSetTooltipStyle(div,text,attrs);
  374.         if(ttl_offtimer) { clearTimeout(ttl_offtimer); ttl_offtimer=0; }
  375.         if(!delay) ttlShowTooltip(div)
  376.         else {
  377.             if(ttl_visible) ttlHideTooltip(div);
  378.             ttl_visible=true;
  379.             ttl_ontimer=setTimeout("ttlPopupTooltip()",ttl_ontimeout);
  380.         }
  381.     }
  382.     return false;
  383. }
  384.  
  385. function ttlOut()
  386. {
  387.     var div = ttlGetTooltipDiv();
  388.     if(!div) return false;
  389.     ttl_visible=false;
  390.     if(ttl_ontimer) { clearTimeout(ttl_ontimer); ttl_ontimer=0; }
  391.     ttl_offtimer=setTimeout("ttlHideTooltip()",ttl_offtimeout);
  392.     return false;
  393. }
  394.  
  395. //]]>
  396.