Author: dbiatenia Date: 2007-07-13 14:45:48 -0400 (Fri, 13 Jul 2007) New Revision: 1624 Modified: branches/3.0.2/sandbox/tooltip/src/main/resources/org/richfaces/renderkit/html/scripts/tooltip.js Log: mouseover fix Modified: branches/3.0.2/sandbox/tooltip/src/main/resources/org/richfaces/renderkit/html/scripts/tooltip.js =================================================================== --- branches/3.0.2/sandbox/tooltip/src/main/resources/org/richfaces/renderkit/html/scripts/tooltip.js 2007-07-13 17:44:11 UTC (rev 1623) +++ branches/3.0.2/sandbox/tooltip/src/main/resources/org/richfaces/renderkit/html/scripts/tooltip.js 2007-07-13 18:45:48 UTC (rev 1624) @@ -2,34 +2,6 @@ // If it is not IE, we assume that the browser is NS. var IE = document.all?true:false; -// If NS -- that is, !IE -- then set up for mouse capture -//if (!IE) document.captureEvents(Event.MOUSEMOVE) - -// Temporary variables to hold mouse x-y pos.s -//var cursorX = 0; -//var cursorY = 0; - -// Main function to retrieve mouse x-y pos.s -/* -function getMouseXY(e) { -if (IE) { // grab the x-y pos.s if browser is IE -cursorX = event.clientX + document.body.scrollLeft; -cursorY = event.clientY + document.body.scrollTop; -} else { // grab the x-y pos.s if browser is NS -cursorX = e.pageX; -cursorY = e.pageY; -} -// catch possible negative values in NS4 -if (cursorX < 0){cursorX = 0;} -if (cursorY < 0){cursorY = 0;} -// show the position values in the form named Show -// in the text fields named MouseX and MouseY -return true; -} - -// Set-up to use getMouseXY function onMouseMove -document.onmousemove = getMouseXY; -*/ ToolTip = Class.create(); ToolTip.prototype = { @@ -64,6 +36,7 @@ this.toolTip.style.visibility = 'visible'; this.toolTip.style.display = "none"; this.parentAttached = false; + this.hintParentElement = null; if(IE){ var toolTipZindex = parseInt(this.toolTip.style.zIndex); new Insertion.Before(this.toolTip, @@ -73,8 +46,7 @@ this.iframe = $(this.id + 'iframe'); } - - Event.observe(document.getElementsByTagName("body")[0], "mousemove", this.attachOnLoadEvents.bindAsEventListener(this), true); + if(!this.disabled) Event.observe(document.getElementsByTagName("body")[0], "mousemove", this.attachOnLoadEvents.bindAsEventListener(this), true); }, attachOnLoadEvents: function(){ if(!this.parentAttached){ @@ -88,63 +60,90 @@ }, attachParentEvents: function(){ if(this.followMouse){ - Event.observe(this.parent, this.event, this.doShow.bindAsEventListener(this), false); + Event.observe(this.parent, 'mousemove', this.doShow.bindAsEventListener(this), false); } else { Event.observe(this.parent, this.event, this.doShow.bindAsEventListener(this), false); } - /* - if(this.mode == 'ajax'){ - Event.observe(this.parent, this.event, this.evecuteAjax.bindAsEventListener(this), false); - } - */ Event.observe(this.parent, "mouseout", this.doHide.bindAsEventListener(this), false); + + Event.observe(this.toolTip, 'mouseout', this.leaveHint.bindAsEventListener(this), false) + }, + + detectAncestorNode: function(leaf, element) { + // Return true if "element" is "leaf" or one of its parents + var node = leaf; + while (node != null && node != element) + node = node.parentNode; + return (node != null); + }, + + + leaveHint: function(e) { + + var hintNotLeft = false; + + // detect mouse move from hint to owner + // if mouse entered the just the owner hintNotLeft is set true + hintNotLeft = this.detectAncestorNode(e.toElement,this.hintParentElement); + hintNotLeft = hintNotLeft || this.detectAncestorNode(e.relatedTarget,this.hintParentElement); + + if (!hintNotLeft) + this.doHide(e); + }, + + + + doShow: function(e){ - if (IE) { // grab the x-y pos.s if browser is IE - cursorX = e.clientX + document.body.scrollLeft; - cursorY = e.clientY + document.body.scrollTop; - } else { // grab the x-y pos.s if browser is NS - cursorX = e.pageX; - cursorY = e.pageY; + + if (e.target) + this.hintParentElement = e.target; + if (e.srcElement) + this.hintParentElement = e.srcElement; + + posX = e.clientX + document.body.scrollLeft; + posY = e.clientY + document.body.scrollTop; + + if(this.mode == 'ajax'){ + var event = e; + eval(this.ajaxExecuteString); +// this.toolTip = $(this.id); +// this.setToolTipPosition(); +// if(this.iframe){ +// this.iframe.style.top = parseInt(this.toolTip.style.top) - this.toolTipBorderHeight; +// this.iframe.style.left = parseInt(this.toolTip.style.left) - this.toolTipBorderWidth; +// this.iframe.style.display = "block"; +// } +// this.toolTip.style.display = "block"; } - // catch possible negative values in NS4 - if (cursorX < 0){cursorX = 0;} - if (cursorY < 0){cursorY = 0;} - - this.setToolTipPosition(e, cursorX, cursorY); + + this.setToolTipPosition(e, posX, posY); + + + + this.toolTip.style.display = "block"; if(this.iframe){ this.iframe.style.top = parseInt(this.toolTip.style.top) - this.toolTipBorderHeight; this.iframe.style.left = parseInt(this.toolTip.style.left) - this.toolTipBorderWidth; this.iframe.style.display = "block"; } - this.toolTip.style.display = "block"; + }, + + doHide: function(e){ + var fakeEvent = false; + fakeEvent = this.detectAncestorNode(e.toElement,this.toolTip); + fakeEvent = fakeEvent || this.detectAncestorNode(e.relatedTarget,this.toolTip); + - // - //Event.stopObserving(this.parent, this.event, this.doShow.bindAsEventListener(this), false); - if(this.mode == 'ajax'){ - var event = e; - eval(this.ajaxExecuteString); - - - this.toolTip = $(this.id); - this.setToolTipPosition(); + if (!fakeEvent) { + this.toolTip.style.display = "none"; if(this.iframe){ - this.iframe.style.top = parseInt(this.toolTip.style.top) - this.toolTipBorderHeight; - this.iframe.style.left = parseInt(this.toolTip.style.left) - this.toolTipBorderWidth; - this.iframe.style.display = "block"; + this.iframe.style.display = "none"; } - this.toolTip.style.display = "block"; + this.hintParentElement = null; } - - }, - - doHide: function(e){ - this.toolTip.style.display = "none"; - if(this.iframe){ - this.iframe.style.display = "none"; - } - //Event.observe(this.parent, this.event, this.doShow.bindAsEventListener(this), false); }, doEnable: function(){ @@ -224,11 +223,4 @@ } return [wWidth,wHeight]; } - /* - evecuteAjax: function (e){ - var event = e; - eval(this.ajaxExecuteString); - } - */ - } \ No newline at end of file