Overriding Servoy's default Loading... Ajax message

Find out how to get things done with Servoy. Post how YOU get things done with Servoy

Overriding Servoy's default Loading... Ajax message

Postby sbutler » Thu May 09, 2013 7:25 pm

I had a client that really didn't like the "Loading..." in the upper right. Some users don't notice it, and they think the screen is frozen. There is the busy plugin, but as you all know, sometimes its a pain to run all functions through the busy plugin. So, below is a simple example of how to change the Loading... to something different. This shows how to change the message, and the location. In this example, we change "Loading..." to an animated spinner gif, and move it to the center of the screen. This works by adjusting the SPAN element that Servoy uses, so Servoy takes care of hiding and showing it.

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.
Image

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)
Scott Butler
iTech Professionals, Inc.
SAN Partner

Servoy Consulting & Development
Servoy University- Training Videos
Servoy Components- Plugins, Beans, and Web Components
Servoy Guy- Tips & Resources
ServoyForge- Open Source Components
User avatar
sbutler
Servoy Expert
 
Posts: 759
Joined: Sun Jan 08, 2006 7:15 am
Location: Cincinnati, OH

Re: Overriding Servoy's default Loading... Ajax message

Postby sbutler » Thu May 09, 2013 7:41 pm

Also, I've considered including something like this in the Busy plugin. Something like below:

plugins.busy.overrideLoadingMessage(pathToImageOrText, shouldCenter)
Scott Butler
iTech Professionals, Inc.
SAN Partner

Servoy Consulting & Development
Servoy University- Training Videos
Servoy Components- Plugins, Beans, and Web Components
Servoy Guy- Tips & Resources
ServoyForge- Open Source Components
User avatar
sbutler
Servoy Expert
 
Posts: 759
Joined: Sun Jan 08, 2006 7:15 am
Location: Cincinnati, OH

Re: Overriding Servoy's default Loading... Ajax message

Postby david » Thu May 09, 2013 8:45 pm

Data Sutra's latest "busy" blocker:

loading.png
loading.png (339.15 KiB) Viewed 13820 times


Two demo servers to try it out on:

http://demo.data-sutra.com
http://europe.data-sutra.com
David Workman, Kabootit

Image
Everything you need to build great apps with Servoy
User avatar
david
 
Posts: 1727
Joined: Thu Apr 24, 2003 4:18 pm
Location: Washington, D.C.

Re: Overriding Servoy's default Loading... Ajax message

Postby Kahuna » Fri May 10, 2013 12:33 pm

Excellent thanks Scott!
(Servoy Version: 6.0.7 Win XP / 7 - SQL Server 2008 R2)
Ian Cordingley (Kahuna)
Kahuna
 
Posts: 1235
Joined: Thu Oct 26, 2006 1:39 am
Location: 1/2 NE UK 1/2 Olvera Spain

Re: Overriding Servoy's default Loading... Ajax message

Postby bobcusick1332964082 » Thu Jun 27, 2013 3:50 pm

Scott,

WHOA! This is simply AWESOME! Thanks so much for sharing this! It should be the default... :D

Bob
bobcusick1332964082
 
Posts: 85
Joined: Wed Mar 28, 2012 9:48 pm

Re: Overriding Servoy's default Loading... Ajax message

Postby pbakker » Thu Jun 27, 2013 5:36 pm

Good news for you Bob: it is...
pbakker
 
Posts: 2822
Joined: Wed Oct 01, 2003 8:12 pm
Location: Amsterdam, the Netherlands

Re: Overriding Servoy's default Loading... Ajax message

Postby pbakker » Fri Jun 28, 2013 12:48 pm

Some clarification: as of Servoy 7.1 the setting "servoy.webclient.blockinputonrequest" is enabled by default and shows a loading cursor instead of a loading indicator while communication with the server is taking place.

See SVY-4036 - replace "loading..." indicator with busy cursor
pbakker
 
Posts: 2822
Joined: Wed Oct 01, 2003 8:12 pm
Location: Amsterdam, the Netherlands

Re: Overriding Servoy's default Loading... Ajax message

Postby bobcusick1332964082 » Fri Jun 28, 2013 6:28 pm

Paul,

That's really great! It's those "little" touches that make a HUGE difference in the product!

NICE WORK! :D

Bob
bobcusick1332964082
 
Posts: 85
Joined: Wed Mar 28, 2012 9:48 pm

Re: Overriding Servoy's default Loading... Ajax message

Postby bobcusick1332964082 » Fri Jun 28, 2013 6:33 pm

Paul,

Is this only when deployed on the application server? I'm still seeing the "Loading..." message (7.1.0). When I run the code above at startup, then it DOES have a spinner... is that maybe in an up-coming build or am I just doing it wrong? :wink:
bobcusick1332964082
 
Posts: 85
Joined: Wed Mar 28, 2012 9:48 pm

Re: Overriding Servoy's default Loading... Ajax message

Postby jcarlos » Tue Jul 02, 2013 8:30 am

In the example of Scott, in his code, he changes "Loading..." to the animated spinner gif from NASA (ajax-loader.gif). I supposed you can use instead any other image (such as the one that David is using for the CMS).

My question: does Servoy allows -or makes it easy for developers- the use of another image than the loading cursor that is now the default? Is it Servoy's approach as flexible as the example code from Scott?

Thanks, Carlos
Juan-Carlos Sanchez, Stanford University - Law and Economics
jcarlos
 
Posts: 578
Joined: Thu May 04, 2006 8:55 pm
Location: Palo Alto, California USA


Return to How To

Who is online

Users browsing this forum: No registered users and 1 guest