var timeoutID; //id to track our timeout function for cancellation |
var slidingZoneID; |
var slidingPaneID; |
var timeoutMS = 2000; //time until the pane will close in milliseconds. |
function RadSlidingPane_OnClientExpanded(sender, args) { |
slidingZoneID = sender.get_parent().get_id(); |
slidingPaneID = sender.get_id(); |
|
document.body.onclick = body_onclick; |
|
//Set the pane to close if the user doesn't "enter" the pane within the time frame. |
timeoutID = setTimeout("CollapseOnTimeout('" + slidingPaneID + "')", timeoutMS); |
|
//Set up mouse enter and leave events to track auto close: |
sender.getContentContainer().onmouseleave = contentElement_OnMouseLeave; |
sender.getContentContainer().onmouseenter = function () { clearTimeout(timeoutID); }; |
} |
|
//Closes the sliding pane if elements outside the pane are clicked. |
function body_onclick(e) { |
var element; |
if (e == null) |
element = event.srcElement; // I.E. |
else |
element = e.target; // Firefox |
|
var slidingPane = $find(slidingPaneID); |
|
if (!slidingPane.get_docked() && !slidingPane.get_collapsed()) //Make sure dock isn't pinned and that it's expanded when setting time out javascript!!! |
if (!IsChildOfSlidingPane(element)) //Only close pane if the user clicked outside of the sliding pane: |
CollapseOnTimeout(slidingPaneID); |
} |
|
function RadSlidingPane_OnClientCollapsing(sender, args) { |
document.body.onclick = null; //no longer need to collapse on body click as pane is closed. |
clearTimeout(timeoutID); |
} |
|
function contentElement_OnMouseLeave(e) { |
var element; |
var posx = 0; |
var posy = 0; |
|
//get the source of the event (should always be the contentElement object of the rad sliding zone: |
if (!e) { |
var e = window.event; |
element = e.srcElement; |
} |
else |
element = e.target; |
|
//get our mouse coordinates: |
if (e.pageX || e.pageY) { |
posx = e.pageX; |
posy = e.pageY; |
} |
else if (e.clientX || e.clientY) { |
posx = e.clientX + document.body.scrollLeft |
+ document.documentElement.scrollLeft; |
posy = e.clientY + document.body.scrollTop |
+ document.documentElement.scrollTop; |
} |
|
//get our element coordinates |
var xleft = element.offsetLeft; |
var xelement = element; |
while (xelement = xelement.offsetParent) xleft += xelement.offsetLeft; |
var xright = element.clientWidth + xleft; |
|
var ytop = element.offsetTop; |
var yelement = element; |
while (yelement = yelement.offsetParent) ytop += yelement.offsetTop; |
var ybottom = element.clientHeight + ytop; |
|
//only set time out if the mouse left the contentElement: |
if (posx < xleft || posx > xright || posy < ytop || posy > ybottom) |
timeoutID = setTimeout("CollapseOnTimeout('" + slidingPaneID + "')", timeoutMS); |
} |
|
function CollapseOnTimeout(radSlidingPaneID) { |
$find(radSlidingPaneID).get_parent().collapsePane(radSlidingPaneID); |
} |
|
function IsChildOfSlidingPane(element) { |
var isChildOfSlidingPane = false; |
|
while (element.id == "" && element.parentElement) |
element = element.parentElement; |
if (element.id == slidingZoneID) |
isChildOfSlidingPane = true; |
else if (element.id != "") { |
if ($telerik.$("#" + element.id).parents("[id=" + slidingZoneID + "]").length > 0) |
isChildOfSlidingPane = true; |
else if ($telerik.$("#" + element.id).parents("[class=rcbSlide]").length > 0) //make sure that the element isn't the iframe part of a radcombobox: |
isChildOfSlidingPane = true; |
} |
return isChildOfSlidingPane; |
} |