import java.util.ArrayList;
import java.util.Iterator;
+import com.google.gwt.user.client.Command;
import com.google.gwt.user.client.DOM;
+import com.google.gwt.user.client.DeferredCommand;
import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.ui.FlowPanel;
import com.google.gwt.user.client.ui.SourcesTabEvents;
int activeTabIndex = 0;
private TabBar tb;
+
private ITabsheetPanel tp;
+
private Element deco;
private TabListener tl = new TabListener() {
- public void onTabSelected(SourcesTabEvents sender, int tabIndex) {
- if (client != null && activeTabIndex != tabIndex)
- ITabsheet.this.client.updateVariable(id, "selected", ""
- + tabKeys.get(tabIndex), true);
+ public void onTabSelected(SourcesTabEvents sender, final int tabIndex) {
+ if (client != null && activeTabIndex != tabIndex) {
+ addStyleDependentName("loading");
+ DeferredCommand.addCommand(new Command() {
+ public void execute() {
+ ITabsheet.this.client.updateVariable(id, "selected", ""
+ + tabKeys.get(tabIndex), true);
+ }
+ });
+ }
}
public boolean onBeforeTabSelected(SourcesTabEvents sender, int tabIndex) {
- // TODO give user indication of progress
return true;
}
deco = DOM.createDiv();
tp.setStyleName(CLASSNAME + "-content");
+ addStyleDependentName("loading"); // Indicate initial progress
tb.setStyleName(CLASSNAME + "-tabs");
DOM.setElementProperty(deco, "className", CLASSNAME + "-deco");
if (client.updateComponent(this, uidl, false))
return;
-
+
// Add proper stylenames for all elements
if (uidl.hasAttribute("style")) {
String[] styles = uidl.getStringAttribute("style").split(" ");
- String tabsBaseClass = CLASSNAME + "-tabs";
- String contentBaseClass = CLASSNAME + "-content";
String decoBaseClass = CLASSNAME + "-deco";
- String tabsClass = tabsBaseClass;
- String contentClass = contentBaseClass;
String decoClass = decoBaseClass;
for (int i = 0; i < styles.length; i++) {
- tabsClass += " " + tabsBaseClass + "-" + styles[i];
- contentClass += " " + contentBaseClass + "-" + styles[i];
+ tb.addStyleDependentName(styles[i]);
+ tp.addStyleDependentName(styles[i]);
decoClass += " " + decoBaseClass + "-" + styles[i];
}
- tp.setStyleName(contentClass);
- tb.setStyleName(tabsClass);
DOM.setElementProperty(deco, "className", decoClass);
}
this.height = null;
tp.setHeight("auto");
// We don't need overflow:auto when tabsheet height is not set
+ // TODO reconsider, we might sometimes have wide, non-breaking
+ // content
DOM.setStyleAttribute(tp.getElement(), "overflow", "hidden");
}
UIDL tab = (UIDL) it.next();
if (tab.getBooleanAttribute("selected")) {
activeTabIndex = index;
- UIDL contentUIDL = tab.getChildUIDL(0);
- Widget content = client.getWidget(contentUIDL);
- ((Paintable) content).updateFromUIDL(contentUIDL, client);
- tp.remove(index);
- tp.insert(content, index);
+ renderContent(tab.getChildUIDL(0));
}
index++;
}
captions.add(caption);
tabKeys.add(key);
- tb.addTab(caption);
+ // Add new tab (additional SPAN-element for loading indication)
+ tb.insertTab("<span>"+caption+"</span>", true, tb.getTabCount());
+
+ // Add placeholder content
+ tp.add(new ILabel(""));
if (tab.getBooleanAttribute("selected")) {
- Widget content = client.getWidget(tab.getChildUIDL(0));
- tp.add(content);
activeTabIndex = index;
- ((Paintable) content).updateFromUIDL(tab.getChildUIDL(0),
- client);
- } else
- tp.add(new ILabel(""));
-
+ renderContent(tab.getChildUIDL(0));
+ }
index++;
}
}
// Open selected tab
tb.selectTab(activeTabIndex);
- tp.showWidget(activeTabIndex);
+ // tp.showWidget(activeTabIndex);
}
+ private void renderContent(final UIDL contentUIDL) {
+ DeferredCommand.addCommand(new Command() {
+ public void execute() {
+ // Loading done, start drawing
+ Widget content = client.getWidget(contentUIDL);
+ tp.remove(activeTabIndex);
+ tp.insert(content, activeTabIndex);
+ tp.showWidget(activeTabIndex);
+ ((Paintable) content).updateFromUIDL(contentUIDL, client);
+ removeStyleDependentName("loading");
+ }
+ });
+ }
+
private void clearTabs() {
int i = tb.getTabCount();
while (i > 0)
public void iLayout() {
if (height != null) {
+ // Make content zero height
+ tp.setHeight("0");
+ DOM.setStyleAttribute(tp.getElement(), "overflow", "hidden");
// First, calculate needed pixel height
super.setHeight(height);
int neededHeight = getOffsetHeight();
super.setHeight("");
// Then calculate the size the content area needs to be
- tp.setHeight("0");
- DOM.setStyleAttribute(tp.getElement(), "overflow", "hidden");
int pixelHeight = getOffsetHeight();
tp.setHeight(neededHeight - pixelHeight + "px");
DOM.setStyleAttribute(tp.getElement(), "overflow", "");