adding a specific number of tabs and problems with mistakenly closing them

[kstevens]

I have a requirement for a currently working registration form to be updated so I can have one person register for up to four people. I have been thinking of using the tabs-adv example as a starting point but I have some problems.

Where is documentation on ux.TabCloseMenu?

When I add tabs:

Ext.onReady(function(){

    var tabs = new Ext.TabPanel({
        renderTo:'tabs',
        resizeTabs:true, // turn on tab resizing
        minTabWidth: 115,
        tabWidth:135,
        enableTabScroll:true,
        width:600,
        height:250,
        defaults: {autoScroll:true},
        plugins: new Ext.ux.TabCloseMenu()
    });

    // tab generation code
    var index = 0;
    addTab();
   
    function addTab(){
        index++;
        if (index >= 5)
        return False;
        tabs.add({
            title: 'New Tab ' + (index),
            iconCls: 'tabs',
            html: 'Tab Body ' + (index) + '<br/><br/>'
                    + Ext.example.bogusMarkup,
            closable:true
        }).show();
    }

    new Ext.Button({
        text: 'Add Tab',
        handler: addTab,
        iconCls:'new-tab'
    }).render(document.body, 'tabs');
}); 

I give each one a number but if a user closes one by mistake the program doesn't know
that it has been closed. This causes several problems if they have added 4 already and closed one by mistake it will not add another tab, if they haven't opened 4 already (say they have added two) then close number two by mistake the next tab will be number 3 not 2 again.

How can I let the program know that I have closed a tab so I can somehow reset the Indexes and change the tab names?