Disable panel with a translucent dark mask

[Ahmed]

I am programming the authentication system of the application I am
working on. When the application loads for the first time, it asks the
user for a username and a password. The login credentials are entered
by the user using a form inside a gwt Window. This window is shown
over the application interface (with its own layout).

Then, I want to mask the underlying application interface so that the
user can barely see the gui, but is not allowed to use any of its
widgets. The effect I want to create is to put an dark translucent
layer between the login window and the main application gui. In
conclusion: I want to attain the same effect as the one shown when an
alert MessageBox is displayed.

Is it possible to do that? Thank you in advance.

[Sean]

You may want to check out the DialogBox with setGlassEnabled() to true. 

[redjhawk]

If you want to do it manually, you can add a layer (called B) over the
layer you want to hide (called A). Create also a CSS property similar
to:

.blackBackground
{
background-color:black;
filter: alpha(opacity=70);
opacity:0.7;
}

Then, when the layer A should be hidden, add the property
blackBackground to the layer B

I use this and it works. I use all float panels so I can control the
exact position of each one but I'm sure it works with any kind of
panel.