PDA

View Full Version : Trying to call hide() before a window finishes showing animation.



hshu
7 Aug 2012, 10:53 AM
Hello Ext gurus!
I have a window displaying the number of things I have access to.
But if that number is 0, I need to hide the window.
A pseudo looks like this:


myDialog.show();
if (getNum() === 0) {
myDialog.hide();
}


That code won't work. It leaves a transparent window remainder behind. Because you try to call hide() before show() finishes animation.
I have a hacky fix:


myDialog.show();
if (getNum() === 0) {
Ext.defer(myDialog.hide, 1, myDialog);
}


Is there any better way? By the way, myDialog.rendered is already true by the time you call hide()
Thanks!

Tim Toady
7 Aug 2012, 11:00 AM
Don't show the window if getNum() is zero.

hshu
7 Aug 2012, 11:59 AM
That is a sensible thing to try.
However the problem is the dialog show is driven by a button click (i.e. the event handler for a button click calls myDialog.show())
Then I attached a listener for the event 'show' which is supposedly fired after the window is shown.
That listener will decide whether or not to hide.

The click event handler is pretty standard, it just shows the dialog, and it should not take care of anything else.
It is the dialog's responsibility to know whether or not to hide itself based on its meta data. (it is actually a custom dialog which extends from Window and it has some custom properties)

That is why I refrain from putting extra logic before myDialog.show().

Anyhow, 'show' event is fired before the window animation is complete, that's what I found. And it causes problems.

Tim Toady
7 Aug 2012, 1:48 PM
If you return false from the beforeshow event on a window, it will not open. Will that work for you?

hshu
9 Aug 2012, 6:22 AM
Hi Tim,
Thanks for the reply.
I didn't use the 'beforeshow' event, instead I override the show() function. I check getNum() first, if that is 0, then return from show() function immediately.
It looks something like this:


show : function () {
if (getNum() === 0) {
//show a warning message
return this;
}
else {
return this.callParent(arguments);
}
}


This is the fix I adopted in the end.