PDA

View Full Version : CenterWindowPlugin



mabello
10 Jun 2008, 4:59 AM
I need a window that autocenter when the browser resize.
So I have created a "plugin" (OK, is so simple that I would not call it plugin) to center the window every time the browser is resized.

Code:


Ext.ux.CenterWindowPlugin = function(){
this.init = function(win) {
Ext.EventManager.onWindowResize(function(){
win.center();
});
}
};


Example:


var win = new Ext.Window({
...
plugins:[new Ext.ux.CenterWindowPlugin()]
});

Cheers

evant
10 Jun 2008, 5:30 AM
That's cool. I think it would make sense for something like this to go in the core.

mabello
10 Jun 2008, 5:36 AM
Thanks evant!
It is really simple...but it has been useful for me so far...besides, this thread is really easy to maintain, only 3 or 4 lines of code :)

Cheers

J.C. Bize
10 Jun 2008, 1:52 PM
We've been using similar code for a while, and I think it definitely make sense to add this to the core, perhaps using an "autocenter" config option.

It would also be nice if Ext automatically ensured, while/after opening a window, that the window's titlebar is visible. If the user's browser is too small, or the window too large, the window covers up the entire screen and the titlebar is hidden off-screen; at that point there is no way for the user to move or close the window, and he/she then has to refresh the entire page and potentially lose their work.

Cheers,
JC

cimperia
10 Jun 2008, 2:09 PM
... the titlebar is hidden off-screen; at that point there is no way for the user to move or close the window, and he/she then has to refresh the entire page and potentially lose their work.
Cheers,
JC

We're having the same problem, however if onEsc has not been overridden, then pressing the escape key will close the window.

bhaidaya
11 Jun 2008, 7:53 AM
Ext.Window has a config option called 'constrain'


constrain : Boolean
True to constrain the window to the viewport, false to allow it to fall outside of the viewport (defaults to false). Optionally the header only can be constrained using constrainHeader.



var win = new Ext.Window({
...
constrain: true
});

J.C. Bize
11 Jun 2008, 9:14 AM
Ext.Window has a config option called 'constrain'

Ah yes, constrainHeader is very close to what I was looking for. Thanks!

Cheers,
JC

Lmouse
14 Aug 2009, 10:08 PM
Thanks for sharing!=D>