[CLOSED] Tab Panel loading synchronization

[vadym.f]

Well, this page does know nothing about an BeforeUpdate listener of its loader.

I think you could try to use the RegisterAfterClientInitScript method or DocumentReady for your needs.

That's true. One direct consequence is a palpable delay between the tab Panel BeforeUpdate listener firing and any client events occurring on the tab page window. If I were to rely on the page events, I'd get a break in the modal mask for the duration of time interval between the tab activation and the start of page loading. There's no way to register all the scripts that I require in one place without touching the tab definition.

At the end of the day, our discussion has put me on the right track to come up with a working hierarchical tab loading sync-up mechanism that's not dependent of custom delays and handles any depth of tab hierarchy.
The mask gets initially shown by the BeforeUpdate listener of the first visible tab of the first TabPanel in the hierarchy. Any subsequent calls to show it by other BeforeUpdate handlers don't have any effect since the mask is already visible. The mask gets hidden in the script that checks for any more tabs on the page on the client, if it doesn't find any. This script is registered by ResourceManager RegisterAfterClientInitScript method in the overridden OnInit event of the BasePage inherited by every page in my application. Of course, the assumption is that there are no elements on any page other than tabs that may contain independently initialized content. That is, no other iframes should be present.
Below are the code snippets in case anyone runs into a similar problem. Many thanks for your help! Please mark this thread as resolved.

Default.aspx

<script>
// Show or hide a modal mask over the entire page
var showHideMask = function (callWnd, tab, showMask) {
    var temp = callWnd;
    var topWnd = null;

    while (true) {
        if (temp.parent == temp) {
            topWnd = temp;
            break;
        }
        else {
            temp = temp.parent;
        }
    }

    if (!topWnd)
        return;

    if (showMask) {
        var body = tab.getBody();
        if (!body.Ext || !body.Ext.isReady) {
            topWnd.Ext.net.Mask.show();
        }
    }
    else {
        var tabPanels = [];

        callWnd.Ext.ComponentMgr.all.each(function (c) {
            if (c instanceof callWnd.Ext.TabPanel) {
                tabPanels.push(c);
            }
        });
        
        // Hide the mask because this is the last document (no more tabs!)
        if (tabPanels.length == 0) {
            topWnd.Ext.net.Mask.hide();
        }
        delete tabPanels;
    }
};
</script>

<ext:TabPanel ID="TabPanel1" runat="server" ActiveIndex="0">
	<Items>
		<ext:Panel ID="Tab1" runat="server" Title="Tab 1">
			<AutoLoad Mode="IFrame" Url="~/TabPage1.aspx" />
			<Listeners>
				<BeforeUpdate Handler="showHideMask(window, this, true);" />
			</Listeners>
		</ext:Panel>
		<ext:Panel ID="Tab2" runat="server" Title="Tab 2">
			<AutoLoad Mode="IFrame" Url="~/TabPage2.aspx" />
			<Listeners>
				<BeforeUpdate Handler="showHideMask(window, this, true);" />
			</Listeners>
		</ext:Panel>
	</Items>
</ext:TabPanel>

BasePage.cs

override protected void OnInit(EventArgs e)
{
	//initialize our base class (System.Web,UI.Page)
	base.OnInit(e);

	ResourceManager rm = ResourceManager.GetInstance();
	rm.RegisterAfterClientInitScript("showHideMask(window, null, false);");
}

[Daniil]

Ok, thanks for clarification and sharing!