A quick hack for the XPages Loading Mask Custom Control

The control, written by Mark Hughes and published on OpenNTF creates loading masks on the loading of a page and in partial refreshes. Just include the control into your XPage and it will start working immediately. The disadvantage is that it shows a loading mask for ALL partial events that are fired. This can be slightly annoying if you have an input field that updates a view panel when you type in your search query. It also displays the loading mask, when you drag and drop portlets in a grid container.

Here is a quick hack to exclude some events. First of all, you have to find out, which element fires the refresh. This can easily be done using firebug.

Just include the following line after

dojo.subscribe( ‘partialrefresh-start’,  function( method, form, refreshId ){

console.debug(refreshId) // add this line

In the firebug console debug window you can now see the Id of the element that triggers the refresh.

And with a few lines of javascript added to the existing code, you can now control, if the loading mask is displayed or not.

 dojo.subscribe( ‘partialrefresh-start’,  function( method, form, refreshId ){
//exclude some elements; Ulrich Krause, 10.12.2011
//console.debug(refreshId)
isInputBox = (refreshId.indexOf(‘pnl_entries_company’) > 0  || refreshId.indexOf(‘searchEntriesPeople’) > 0) ? true:false
//dragging of boxes returns @none
if (refreshId.toString() != ‘@none’ && (isInputBox == false)) {
loading()
}
} );

There are perhaps more elegant ways to achieve the aim; as I already said, this is only a quick hack.