PDA

View Full Version : Ext.Panel initialization



SJFreeland
10 Apr 2011, 6:11 PM
I have created an app that starts with an panel of buttons, each meant to show a panel associated with its button after hiding the home panel. Each panel has a HOME button to return to the home panel. I find that expected behavior of each panel cannot be achived unless the buttons are pressed in reverse order to the way they were created. In the following code fragment each button's panel is aggregated in the order 1, 3, 6. To make them work correctly (specifically tweet lists and google maps) I must press buttons 6, (home), 3, (home), and 1, (home). After that, any button may be pressed and its panels works fine. NOT working means that a map shows up when a tweet list should be displayed.

////////////////////////////////////////////////////////////////////////////////
// Button 1 card panel
////////////////////////////////////////////////////////////////////////////////

alert("Button 1 card panel");

tweetCoPCard = new Ext.TabPanel({
fullscreen: true,
cardSwitchAnimation: {
type: 'fade',
duration: '500',
},
ui: 'light',

dockedItems: [{
xtype: 'toolbar',
dock: 'top',
title: 'City of Plano',

items: [{
xtype: 'button',
text: 'Home',
handler: goHome,
}],
}],
items: [tweetCoPPanel, helpTweetCoPPanel],
});

////////////////////////////////////////////////////////////////////////////////
// Button 3 card panel
////////////////////////////////////////////////////////////////////////////////

alert("Button 3 card panel");

tweetCard = new Ext.TabPanel({
fullscreen: true,
cardSwitchAnimation: {
type: 'fade',
duration: '500',
},
ui: 'light',

dockedItems: [{
xtype: 'toolbar',
dock: 'top',
title: 'Tweets',

items: [{
xtype: 'button',
text: 'Home',
handler: goHome,
}],
}],
items: [mapPanel, tweetPanel, helpTweetPanel],
});

tweetBubble = new google.maps.InfoWindow();

////////////////////////////////////////////////////////////////////////////////
// Button 6 card panel
////////////////////////////////////////////////////////////////////////////////

alert("Button 6 card panel");

mapCard = new Ext.TabPanel({
fullscreen: true,
cardSwitchAnimation: {
type: 'fade',
duration: '500',
},
ui: 'light',

dockedItems: [{
xtype: 'toolbar',
dock: 'top',
title: 'Maps',

items: [{
xtype: 'button',
text: 'Home',
handler: goHome,
}],
}],
items: [mapReportsPanel, mapFacilitiesPanel, mapParksPanel, mapEventsPanel, helpMapPanel],
});