changeset 3825:e91c5112d67c

Implement a scrolling gauge info tree flys-client/trunk@5515 c6561f87-3c4e-4783-a992-168aeb5c3f6f
author Bjoern Ricks <bjoern.ricks@intevation.de>
date Wed, 19 Sep 2012 07:59:35 +0000
parents 591891d612b6
children 7a34af684ed4
files flys-client/ChangeLog flys-client/src/main/java/de/intevation/flys/client/client/ui/GaugePanel.java flys-client/src/main/webapp/FLYS.css
diffstat 3 files changed, 99 insertions(+), 52 deletions(-) [+]
line wrap: on
line diff
--- a/flys-client/ChangeLog	Wed Sep 19 07:56:42 2012 +0000
+++ b/flys-client/ChangeLog	Wed Sep 19 07:59:35 2012 +0000
@@ -1,3 +1,10 @@
+2012-09-19	Björn Ricks	<bjoern.ricks@intevation.de>
+
+	* src/main/webapp/FLYS.css,
+	  src/main/java/de/intevation/flys/client/client/ui/GaugePanel.java:
+	  Get a working GaugeInfo solution with scrolling adjustments if gauge info
+	  elements are folded in an out.
+
 2012-09-15	Sascha L. Teichmann	<sascha.teichmann@intevation.de>
 
 	* src/main/java/de/intevation/flys/client/client/FLYSConstants.java:
--- a/flys-client/src/main/java/de/intevation/flys/client/client/ui/GaugePanel.java	Wed Sep 19 07:56:42 2012 +0000
+++ b/flys-client/src/main/java/de/intevation/flys/client/client/ui/GaugePanel.java	Wed Sep 19 07:59:35 2012 +0000
@@ -8,13 +8,17 @@
 import com.google.gwt.user.client.ui.TreeItem;
 import com.google.gwt.user.client.ui.Grid;
 import com.google.gwt.user.client.ui.DecoratorPanel;
+import com.google.gwt.user.client.ui.ScrollPanel;
+import com.google.gwt.user.client.ui.Label;
+import com.google.gwt.user.client.ui.HorizontalPanel;
 
 import com.smartgwt.client.types.Overflow;
 import com.smartgwt.client.types.Alignment;
 import com.smartgwt.client.widgets.layout.SectionStackSection;
 import com.smartgwt.client.widgets.layout.HLayout;
 import com.smartgwt.client.widgets.layout.VLayout;
-import com.smartgwt.client.widgets.Label;
+import com.smartgwt.client.widgets.events.ResizedHandler;
+import com.smartgwt.client.widgets.events.ResizedEvent;
 
 import de.intevation.flys.client.client.FLYSConstants;
 import de.intevation.flys.client.client.services.GaugeOverviewInfoService;
@@ -27,7 +31,7 @@
  * It extends the VLayout by two methods to show and hide the
  * section stack section.
  */
-public class GaugePanel extends VLayout {
+public class GaugePanel extends VLayout implements ResizedHandler {
 
     /** SectionStackSection where this GaugePanel belongs in*/
     private SectionStackSection sectionStack;
@@ -41,17 +45,21 @@
     protected GaugeOverviewInfoServiceAsync gaugeOverviewInfoService =
         GWT.create(GaugeOverviewInfoService.class);
 
+    protected GaugeTree gaugetree = new GaugeTree();
+
+    protected RiverInfoPanel riverinfopanel;
+
     /**
      * Creates a new VLayout with a SectionStackSection
      * The GaugePanel's SectionStackSection is hidden by default.
      * @param sectionStack The section stack section to place the VLayout in.
      */
     public GaugePanel(SectionStackSection sectionStack) {
-        super();
+        setOverflow(Overflow.HIDDEN);
         sectionStack.setItems(this);
-        sectionStack.setHidden(true);
         this.sectionStack = sectionStack;
-        setStyleName("gaugeoverview");
+        setStyleName("gaugepanel");
+        addResizedHandler(this);
     }
 
     public void setRiver(String river) {
@@ -76,33 +84,33 @@
     }
 
     public void renderGaugeOverviewInfo(RiverInfo riverinfo) {
-        setStyleName("gaugepanel");
-        sectionStack.setResizeable(true);
-
-        RiverInfoPanel riverinfopanel = new RiverInfoPanel(riverinfo);
-
-        addMember(riverinfopanel);
-
-        VLayout treewrapper = new VLayout();
-        Tree gaugetree = new Tree();
-        gaugetree.setHeight("100%");
+        removeMembers(getMembers());
 
-        treewrapper.addMember(gaugetree);
-        treewrapper.setHeight100();
-        treewrapper.setOverflow(Overflow.AUTO);
-
-        addMember(treewrapper);
+        riverinfopanel = new RiverInfoPanel(riverinfo);
+        addMember(riverinfopanel);
+        addMember(gaugetree);
 
-        List<GaugeInfo> gauges = riverinfo.getGauges();
-        if (!gauges.isEmpty()) {
+        gaugetree.setGauges(riverinfo.getGauges());
+    }
 
-            for (GaugeInfo gauge : gauges) {
-                TreeItem gaugeitem = new GaugeInfoItem(gauge);
-                gaugetree.addItem(gaugeitem);
-            }
+    @Override
+    public void onResized(ResizedEvent event) {
+        /* this height calculation is only an approximation and doesn't reflect
+         * the real height of the the gaugetree. */
+        int height = getInnerContentHeight() -
+            (RiverInfoPanel.HEIGHT +
+            (2 * RiverInfoPanel.BORDER_WIDTH) +
+            (2 * RiverInfoPanel.PADDING) +
+            (2 * RiverInfoPanel.MARGIN));
+
+        if (height < 0) {
+            height = 0;
         }
+
+        gaugetree.setHeight("" + height + "px");
     }
 
+
     /**
      * Hide the section stack section.
      */
@@ -119,25 +127,45 @@
         this.sectionStack.setHidden(false);
     }
 
-    class RiverInfoPanel extends HLayout {
+    class GaugeTree extends ScrollPanel {
+
+        private Tree tree;
+
+        public GaugeTree() {
+            tree = new Tree();
+            setWidget(tree);
+        }
+
+        /**
+         * Resets the items of the tree.
+         * If the list of gauges is empty or null the tree will be empty.
+         */
+        public void setGauges(List<GaugeInfo> gauges) {
+            tree.clear();
+
+            if (gauges != null && !gauges.isEmpty()) {
+
+                for (GaugeInfo gauge : gauges) {
+                    TreeItem gaugeitem = new GaugeInfoItem(gauge);
+                    tree.addItem(gaugeitem);
+                }
+            }
+        }
+    }
+
+    class RiverInfoPanel extends HorizontalPanel {
+
+        public final static int HEIGHT = 30;
+        public final static int BORDER_WIDTH = 3;
+        public final static int PADDING = 8;
+        public final static int MARGIN = 10;
 
         public RiverInfoPanel(RiverInfo riverinfo) {
-            setStyleName("riverinfo");
-            setShowEdges(true);
-            setEdgeSize(3);
-            setBackgroundColor("white");
-            setEdgeImage("");
-            setEdgeBackgroundColor("#CFE1F1");
-            setPadding(8);
-            setOverflow(Overflow.VISIBLE);
-            setAutoHeight();
-            setWidth100();
-            setMembersMargin(10);
-            setMinHeight(30);
+            setStyleName("riverinfopanel");
+            setHeight("" + HEIGHT + "px");
+            setVerticalAlignment(ALIGN_MIDDLE);
 
-            Label label = new Label(riverinfo.getName());
-            label.setWidth("*");
-            addMember(label);
+            addLabel(riverinfo.getName(), false);
 
             String kmtext = "";
             Double start = riverinfo.getKmStart();
@@ -157,10 +185,7 @@
             }
             kmtext += " km";
 
-            label = new Label(kmtext);
-            label.setWidth("*");
-            label.setAlign(Alignment.CENTER);
-            addMember(label);
+            addLabel(kmtext, false);
 
             String qtext = "";
             Double qmin = riverinfo.getMinQ();
@@ -175,10 +200,13 @@
                 qtext += " qm/s";
             }
 
-            label = new Label(qtext);
-            label.setWidth("*");
-            label.setAlign(Alignment.CENTER);
-            addMember(label);
+            addLabel(qtext, false);
+        }
+
+        private void addLabel(String text, boolean wordwrap) {
+            Label label = new Label(text, wordwrap);
+            add(label);
+            setCellHeight(label, "" + HEIGHT + "px");
         }
     }
 
@@ -195,11 +223,10 @@
 
         public GaugeInfoHead(GaugeInfo gauge) {
             setStyleName("gaugeinfohead");
-            setOverflow(Overflow.VISIBLE);
             setAutoHeight();
             setAutoWidth();
 
-            Label label = new Label(gauge.getName());
+            Label label = new Label(gauge.getName(), true);
             addMember(label);
 
             Double start = gauge.getKmStart();
--- a/flys-client/src/main/webapp/FLYS.css	Wed Sep 19 07:56:42 2012 +0000
+++ b/flys-client/src/main/webapp/FLYS.css	Wed Sep 19 07:59:35 2012 +0000
@@ -171,3 +171,16 @@
 #authentication table {
     margin-bottom: 1em;
 }
+
+.riverinfopanel {
+    border: 3px solid #CFE1F1;
+    padding: 8px;
+    margin-top: 10px;
+    margin-left: 10px;
+    margin-bottom: 10px;
+    font-size: 1.3em;
+}
+
+.riverinfopanel .gwt-Label {
+    margin-right: 10px;
+}

http://dive4elements.wald.intevation.org