'loading' bar

Classic Servoy
1

Hi There is it possible to change the color/font of the ‘loading’ bar in the webclient?

2

No, you should file a feature request for this.

3

You can modify the default template that Servoy uses to generate web client forms:

<html xmlns:servoy>
    <head>
        <title servoy:id='title'>Container for holding a form and navigator</title>
        <style servoy:id='dynamic_css' type="text/css">
        </style>
		<link servoy:id='main_form_style' rel='stylesheet' type='text/css' />
		<meta servoy:id='refresh' http-equiv="refresh" />
	</head>
    <body servoy:id='servoy_page' id='servoy_page' topmargin=0 leftmargin=0 bottommargin=0 rightmargin=0 bgcolor='#FFFFFF' STYLE="HEIGHT: 100%; WIDTH: 100%;overflow: auto;">
	  <div id='mktipmsg' class='mktipmsg'></div>
	  <span style="display:none;position:absolute;right:0px;top:0px;z-index: 99999; background: #ff0000; foreground: #000000;" id="indicator">Loading...</span>
	  <span servoy:id='contribution'></span> 
      <div servoy:id="modalwindow"></div>
	  <form id='servoy_dataform' servoy:id='servoy_dataform' method='post'>
	  <input servoy:id='defaultsubmitbutton' type="submit" style="top: 0px;left: 100px;width: 0px;height: 0px;position: absolute;z-index: -2" value="">
		<div servoy:id='forms'>
        	<div servoy:id="webform"></div>
        </div>
      </form>
    </body>
</html>

The line you are looking for is:

<span style="display:none;position:absolute;right:0px;top:0px;z-index: 99999; background: #ff0000; foreground: #000000;" id="indicator">Loading...</span>

To modify the default template, connect to “http://localhost:8080/servoy-webclient/templates” via webdav and it is called “MainPage.html”.

I agree with Nicola – it would be nice if there was a “default” way to change the loading indicator style. Maybe via styles like how the default navigator is done:

.navigatornumber
{
   font: 10pt "Arial";
}

.navigatornext
{
   display: none;
}

.navigatorprev
{
   display: none;
}

.navigatorfirst
{
   display: none;
}

.navigatorlast
{
   display: none;
}
4

Hey David,

What WebDAV editor do you use on the Mac? (from a MAC newbie) :D

5

I use one called “Finder”. ;-)

6

Good thing I read your blog this morning Bob or I might have missed the subtleties of this exchange :) “Finder” lol.

7

Greg & David - :oops:

Thanks very much guys!

8

Thanks David for your solution.

9

Has anyone had any luck in getting a “loading” image to work along with the text “loading…” ? I’ve put the .gif file in almost every directory up the tree - but Servoy doesn’t seem to recognize it… IDEAS?

10

Looks like you need to qualify from Servoy’s webclient root:

<span style="display:none;position:absolute;right:0px;top:0px;z-index: 99999; background: #ff0000; foreground: #000000;" id="indicator"><img src="/servoy-webclient/templates/default/clickware.gif" alt="Clickware" /></span>

If in a custom css file:

#someContainer
{
	background-image: url(/servoy-webclient/templates/default/clickware.gif)
}
11

Hey guys, are you aware that if you edit the templates through webdav you cannot use anymore the servoy.webclient.templates.use_local_ids option? Using local ids reduces the weight of the html and makes things be snappier so if your app is quite complex I’d rather stay with the default loading bar to maximize on performance.

12

Hey David - :oops: duh… I suck.

13

ngervasi:
Hey guys, are you aware that if you edit the templates through webdav you cannot use anymore the servoy.webclient.templates.use_local_ids option? Using local ids reduces the weight of the html and makes things be snappier so if your app is quite complex I’d rather stay with the default loading bar to maximize on performance.

I’ve never really used this option - what’s the purpose of it? How much much more efficient is it?

Thanks for bringing it up!

14

It reduces the weight of the html by using shorter IDs, try to open a complex webclient page in a browser, save the source code, turn the option on and do it again, then compare the 2 saved html pages, you’ll see quite a difference in KB. The more complex the form is the more saving you get, it’s especially noticeable with complex table view forms.

15

I am using Sevoy 3.5.10 and i want to modify the “Loading” label, therefore “Loading” word from MainPage.html to other word, but i am not sure how to do it since it is not a physical file on the server. Can anyone give me some advices?
Thank you,
Diana

16

See my post above: it’s in the MainPage.html template.

david:
The line you are looking for is:

<span style="display:none;position:absolute;right:0px;top:0px;z-index: 99999; background: #ff0000; foreground: #000000;" id="indicator">Loading...</span>

More webdav instructions:

http://www.servoymagazine.com/home/2007 … t-web.html

17

in servoy > 5.2 you can try to inject some css/js so that you set the text of the “indicator” element in the web
Or you overwrite the html template of the MainPage.html (but this must then be checked and tested with every upgrade!)

In the next version of servoy there will be a i18n key that you can set.