Written in Servoy 6
Requires the WebClientUtils plugin
- Code: Select all
var js = 'function centerElem(elem) {\
var parent = window;\
elem.css({\
"background-color": "transparent",\
"position": "absolute",\
"top": ((($(parent).height() - elem.outerHeight()) / 2) + $(parent).scrollTop() + "px"),\
"left": ((($(parent).width() - elem.outerWidth()) / 2) + $(parent).scrollLeft() + "px")\
});\
}\
centerElem($("#indicator"));\
$("#indicator").html("<img src=\'http://www.nasa.gov/multimedia/videogallery/ajax-loader.gif\' />");'
plugins.WebClientUtils.executeClientSideJS(js)
Note: for simplicity the code references the ajax-loader.gif on another website, but in your real code you should download the gif and host it in your Servoy ROOT/images directory, and modify the reference appropriately (/images/ajax-loader.gif).
Here is an example, as you can see the spinner in the middle of the screen.
In my solution setup, I generally only have one main form which contains tab panels, and I swab forms in and out of the tab panels in the navigation framework (so I never change the main form). So, in my case I only have to run this code once, onSolutionOpen. If you switch main forms, you may need to run it multiple times, or find a different approach (I haven't tried it with other types of navigation)