Fixed replaceChildComponent for TabSheet and Accordion (#2204)

Fixed showing/hiding of tabs in TabSheet and Accordion

svn changeset:5887/svn branch:trunk

6 files changed, 137 insertions, 29 deletions

diff --git a/WebContent/ITMILL/themes/default/accordion/accordion.css b/WebContent/ITMILL/themes/default/accordion/accordion.css
index 05ac5aa70b..477562e0df 100644
--- a/WebContent/ITMILL/themes/default/accordion/accordion.css
+++ b/WebContent/ITMILL/themes/default/accordion/accordion.css
@@ -1,9 +1,15 @@
 .i-accordion {
+	position: relative;
 	outline: none;
 	overflow: hidden;
 	text-align: left /* Force default alignment */
 }
 
+.i-accordion-item {
+	position: relative; 
+	background-color: #fff;
+}
+
 .i-accordion-item-caption {
 	height: 31px;
 	overflow: hidden;
@@ -33,4 +39,7 @@
 }
 
 .i-accordion-item-content {
-}
\ No newline at end of file
+	position: absolute;
+	overflow: auto;
+	width: 100%;
+}
diff --git a/WebContent/ITMILL/themes/default/styles.css b/WebContent/ITMILL/themes/default/styles.css
index e54df07c05..9671f3c117 100644
--- a/WebContent/ITMILL/themes/default/styles.css
+++ b/WebContent/ITMILL/themes/default/styles.css
@@ -1,10 +1,16 @@
 /* Automatically compiled css file from subdirectories. */
 .i-accordion {
+	position: relative;
 	outline: none;
 	overflow: hidden;
 	text-align: left /* Force default alignment */
 }
 
+.i-accordion-item {
+	position: relative; 
+	background-color: #fff;
+}
+
 .i-accordion-item-caption {
 	height: 31px;
 	overflow: hidden;
@@ -34,6 +40,9 @@
 }
 
 .i-accordion-item-content {
+	position: absolute;
+	overflow: auto;
+	width: 100%;
 }
 .i-button {
 	cursor: pointer;
diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IAccordion.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IAccordion.java
index f93d0908a1..4bbe14c05f 100644
--- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IAccordion.java
+++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IAccordion.java
@@ -16,6 +16,7 @@ import com.itmill.toolkit.terminal.gwt.client.BrowserInfo;
 import com.itmill.toolkit.terminal.gwt.client.ContainerResizedListener;
 import com.itmill.toolkit.terminal.gwt.client.ICaption;
 import com.itmill.toolkit.terminal.gwt.client.Paintable;
+import com.itmill.toolkit.terminal.gwt.client.RenderInformation;
 import com.itmill.toolkit.terminal.gwt.client.RenderSpace;
 import com.itmill.toolkit.terminal.gwt.client.UIDL;
 import com.itmill.toolkit.terminal.gwt.client.Util;
@@ -43,6 +44,8 @@ public class IAccordion extends ITabsheetBase implements
 
     private int selectedUIDLItemIndex = -1;
 
+    private RenderInformation renderInformation = new RenderInformation();
+
     public IAccordion() {
         super(CLASSNAME);
         // IE6 needs this to calculate offsetHeight correctly
@@ -79,10 +82,14 @@ public class IAccordion extends ITabsheetBase implements
             }
             lazyUpdateMap.clear();
         }
+
+        renderInformation.updateSize(getElement());
+
         rendering = false;
     }
 
-    protected void renderTab(UIDL tabUidl, int index, boolean selected) {
+    protected void renderTab(UIDL tabUidl, int index, boolean selected,
+            boolean hidden) {
         StackItem item;
         int itemIndex;
         if (stack.size() <= index) {
@@ -100,6 +107,8 @@ public class IAccordion extends ITabsheetBase implements
             item.updateCaption(tabUidl);
         }
 
+        item.setVisible(!hidden);
+
         if (selected) {
             selectedUIDLItemIndex = itemIndex;
         }
@@ -222,6 +231,8 @@ public class IAccordion extends ITabsheetBase implements
             openTab.setHeight(spaceForOpenItem);
         } else {
             renderSpace.setHeight(0);
+            openTab.setHeightFromWidget();
+
         }
 
     }
@@ -272,6 +283,21 @@ public class IAccordion extends ITabsheetBase implements
             }
         }
 
+        public void setVisible(boolean visible) {
+            super.setVisible(visible);
+        }
+
+        public void setHeightFromWidget() {
+            Widget paintable = getPaintable();
+            if (paintable == null) {
+                return;
+            }
+
+            int paintableHeight = (paintable).getElement().getOffsetHeight();
+            setHeight(paintableHeight);
+
+        }
+
         /**
          * Returns caption width including padding
          * 
@@ -308,7 +334,6 @@ public class IAccordion extends ITabsheetBase implements
         private boolean open = false;
         private Element content = DOM.createDiv();
         private Element captionNode = DOM.createDiv();
-        private Paintable paintable;
 
         public StackItem(UIDL tabUidl) {
             setElement(DOM.createDiv());
@@ -340,6 +365,16 @@ public class IAccordion extends ITabsheetBase implements
             }
         }
 
+        public void replacePaintable(Paintable newPntbl) {
+            if (getWidgetCount() > 1) {
+                client.unregisterPaintable((Paintable) getWidget(1));
+                paintables.remove(getWidget(1));
+                remove(1);
+            }
+            add((Widget) newPntbl, content);
+            paintables.add(newPntbl);
+        }
+
         public void open() {
             open = true;
             DOM.setStyleAttribute(content, "top", getCaptionHeight() + "px");
@@ -371,19 +406,12 @@ public class IAccordion extends ITabsheetBase implements
                 add((Widget) newPntbl, content);
                 paintables.add(newPntbl);
             } else if (getPaintable() != newPntbl) {
-                client.unregisterPaintable((Paintable) getWidget(1));
-                paintables.remove(getWidget(1));
-                remove(1);
-                add((Widget) newPntbl, content);
-                paintables.add(newPntbl);
+                replacePaintable(newPntbl);
             }
-            paintable = newPntbl;
-            paintable.updateFromUIDL(contentUidl, client);
+            newPntbl.updateFromUIDL(contentUidl, client);
 
-            if (isOpen()) {
-                if (isDynamicHeight()) {
-                    setHeight(((Widget) paintable).getOffsetHeight());
-                }
+            if (isOpen() && isDynamicHeight()) {
+                setHeightFromWidget();
             }
         }
 
@@ -399,6 +427,14 @@ public class IAccordion extends ITabsheetBase implements
             return DOM.getFirstChild(content).getOffsetWidth();
         }
 
+        public boolean contains(Paintable p) {
+            return (getPaintable() == p);
+        }
+
+        public boolean isCaptionVisible() {
+            return caption.isVisible();
+        }
+
     }
 
     protected void clearPaintables() {
@@ -427,22 +463,56 @@ public class IAccordion extends ITabsheetBase implements
     }
 
     public void replaceChildComponent(Widget oldComponent, Widget newComponent) {
-        // TODO Auto-generated method stub
+        for (StackItem item : stack) {
+            if (item.getPaintable() == oldComponent) {
+                item.replacePaintable((Paintable) newComponent);
+                return;
+            }
+        }
     }
 
     public void updateCaption(Paintable component, UIDL uidl) {
         for (Iterator iterator = stack.iterator(); iterator.hasNext();) {
             StackItem si = (StackItem) iterator.next();
             if (si.getPaintable() == component) {
+                boolean visible = si.isVisible();
                 si.updateCaption(uidl);
+                if (si.isCaptionVisible() != visible) {
+                    si.setVisible(si.isCaptionVisible());
+                }
+
                 return;
             }
         }
     }
 
     public boolean requestLayout(Set<Paintable> child) {
-        // TODO Auto-generated method stub
-        return false;
+        if (!isDynamicHeight() && !isDynamicWidth()) {
+            /*
+             * If the height and width has been specified for this container the
+             * child components cannot make the size of the layout change
+             */
+
+            return true;
+        }
+
+        updateOpenTabSize();
+
+        if (renderInformation.updateSize(getElement())) {
+            /*
+             * Size has changed so we let the child components know about the
+             * new size.
+             */
+            iLayout();
+            return false;
+        } else {
+            /*
+             * Size has not changed so we do not need to propagate the event
+             * further
+             */
+            return true;
+        }
+
     }
 
     public RenderSpace getAllocatedSpace(Widget child) {
diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITabsheet.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITabsheet.java
index d0f624f608..197eddd05d 100644
--- a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITabsheet.java
+++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITabsheet.java
@@ -105,6 +105,15 @@ public class ITabsheet extends ITabsheetBase implements
             return (ICaption) getWidget(index);
         }
 
+        public void setVisible(int index, boolean visible) {
+            Element e = DOM.getParent(getTab(index).getElement());
+            if (visible) {
+                DOM.setStyleAttribute(e, "display", "");
+            } else {
+                DOM.setStyleAttribute(e, "display", "none");
+            }
+        }
+
     }
 
     public static final String CLASSNAME = "i-tabsheet";
@@ -339,7 +348,8 @@ public class ITabsheet extends ITabsheetBase implements
         super.setWidth(realWidth + "px");
     }
 
-    protected void renderTab(final UIDL tabUidl, int index, boolean selected) {
+    protected void renderTab(final UIDL tabUidl, int index, boolean selected,
+            boolean hidden) {
         ICaption c = tb.getTab(index);
         if (c == null) {
             c = new ICaption(null, client);
@@ -347,6 +357,8 @@ public class ITabsheet extends ITabsheetBase implements
         }
         c.updateCaption(tabUidl);
 
+        tb.setVisible(index, !hidden);
+
         /*
          * Force the width of the caption container so the content will not wrap
          * and tabs won't be too narrow in certain browsers
@@ -399,7 +411,7 @@ public class ITabsheet extends ITabsheetBase implements
 
         ITabsheet.this.iLayout();
         (content).updateFromUIDL(contentUIDL, client);
-        fixVisibleTabSize();
+        updateOpenTabSize();
         ITabsheet.this.removeStyleDependentName("loading");
         if (previousVisibleWidget != null) {
             DOM.setStyleAttribute(previousVisibleWidget.getElement(),
@@ -426,7 +438,7 @@ public class ITabsheet extends ITabsheetBase implements
             DOM.setStyleAttribute(contentNode, "height", "");
             renderSpace.setHeight(0);
         }
-        fixVisibleTabSize();
+        updateOpenTabSize();
         iLayout();
     }
 
@@ -447,7 +459,7 @@ public class ITabsheet extends ITabsheetBase implements
             contentNode.getStyle().setProperty("width", contentWidth + "px");
             renderSpace.setWidth(contentWidth);
         }
-        fixVisibleTabSize();
+        updateOpenTabSize();
         iLayout();
     }
 
@@ -466,7 +478,7 @@ public class ITabsheet extends ITabsheetBase implements
      * position: absolute (to work around a firefox flickering bug) we must keep
      * this up-to-date by hand.
      */
-    private void fixVisibleTabSize() {
+    private void updateOpenTabSize() {
         /*
          * The overflow=auto element must have a height specified, otherwise it
          * will be just as high as the contents and no scrollbars will appear
@@ -554,7 +566,11 @@ public class ITabsheet extends ITabsheetBase implements
     public void updateCaption(Paintable component, UIDL uidl) {
         int i = tp.getWidgetIndex((Widget) component);
         ICaption c = (ICaption) captions.get("" + i);
+        boolean visible = c.isVisible();
         c.updateCaption(uidl);
+        if (c.isVisible() != visible) {
+            tb.setVisible(i, c.isVisible());
+        }
     }
 
     public boolean requestLayout(Set<Paintable> child) {
@@ -567,7 +583,7 @@ public class ITabsheet extends ITabsheetBase implements
             return true;
         }
 
-        fixVisibleTabSize();
+        updateOpenTabSize();
 
         if (renderInformation.updateSize(getElement())) {
             /*
diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITabsheetBase.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITabsheetBase.java
index c66d6980b1..a5093a8797 100644
--- a/src/com/itmill/toolkit/terminal/gwt/client/ui/ITabsheetBase.java
+++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/ITabsheetBase.java
@@ -57,6 +57,7 @@ abstract class ITabsheetBase extends ComplexPanel implements Container {
             final UIDL tab = (UIDL) it.next();
             final String key = tab.getStringAttribute("key");
             final boolean selected = tab.getBooleanAttribute("selected");
+            final boolean hidden = tab.getBooleanAttribute("hidden");
 
             if (tab.getBooleanAttribute("disabled")) {
                 disabledTabKeys.add(key);
@@ -71,7 +72,7 @@ abstract class ITabsheetBase extends ComplexPanel implements Container {
                 Paintable p = client.getPaintable(tab.getChildUIDL(0));
                 oldPaintables.remove(p);
             }
-            renderTab(tab, index, selected);
+            renderTab(tab, index, selected, hidden);
             index++;
         }
 
@@ -103,7 +104,7 @@ abstract class ITabsheetBase extends ComplexPanel implements Container {
      * and set the visibility of the tab according to the 'selected' parameter.
      */
     protected abstract void renderTab(final UIDL tabUidl, int index,
-            boolean selected);
+            boolean selected, boolean hidden);
 
     /**
      * Implement in extending classes. This method should render any previously
diff --git a/src/com/itmill/toolkit/ui/TabSheet.java b/src/com/itmill/toolkit/ui/TabSheet.java
index ba1f22e46d..f334761766 100644
--- a/src/com/itmill/toolkit/ui/TabSheet.java
+++ b/src/com/itmill/toolkit/ui/TabSheet.java
@@ -191,16 +191,19 @@ public class TabSheet extends AbstractComponentContainer implements
 
         for (final Iterator i = getComponentIterator(); i.hasNext();) {
             final Component c = (Component) i.next();
-            if (!c.isVisible()) {
-                continue;
-            }
+
             if (selected == null || !selected.isVisible()) {
                 selected = c;
             }
             target.startTag("tab");
-            if (!c.isEnabled()) {
+            if (!c.isEnabled() && c.isVisible()) {
                 target.addAttribute("disabled", true);
             }
+
+            if (!c.isVisible()) {
+                target.addAttribute("hidden", true);
+            }
+
             final Resource icon = getTabIcon(c);
             if (icon != null) {
                 target.addAttribute("icon", icon);