Ext.onReady(function(){

    var switchScreen = function(num) {
        Ext.getCmp('MainScreen').layout.setActiveItem(num-1);
    };

    var bbar = new Ext.Toolbar({});
    for(var i=1; i<=10; i++) {

        var id = 'category' + i,
            text = 'カテゴリ' + i;

        bbar.addButton({
            id: id,
            text: text,
            hideOnClick: false
        });

        var sub = [];
        for(var j=1; j<=10; j++) {
            var o = {
                id: id + '_' + j,
                text: 'サブカテゴリ' + j,
                hideOnClick: false
            };

            var menu = [];
            for(var k=1; k<=10; k++) {
                menu.push({
                    id: id + '_' + j + '_' + k,
                    text: '画面' + ((i-1)*100 + (j-1)*10 + k),
                    handler: switchScreen.createDelegate(this, [((i-1)*100 + (j-1)*10 + k)])
                });
            }
            o.menu = menu;
            sub.push(o);
        }
        Ext.getCmp(id).menu = Ext.menu.MenuMgr.get(sub);
    }

    var screens = [];
    for(var i=1; i<=1000; i++) {
        screens.push({
            id: 'Screen' + i,
            html: '画面' + i
        });
    }

    var viewport = new Ext.Viewport({
        layout: 'border',
        items: [{
            title: 'Ext.ux.Screen Example',
            region: 'north',
            bbar: bbar
        },{
            id: 'MainScreen',
            layout: 'card',
            activeItem: 0,
            border: false,
            items: screens,
            region: 'center'
        }],
        renderTo: Ext.getBody()
    });

});
