changeset 3370:08b2472111aa

New implementation of OverviewOutputTab which has a minimalistic chart toolbar and no chart theme panel. The overview image is fetched as single image from server. flys-client/trunk@5078 c6561f87-3c4e-4783-a992-168aeb5c3f6f
author Ingo Weinzierl <ingo.weinzierl@intevation.de>
date Fri, 20 Jul 2012 07:40:55 +0000
parents 20688790f0c0
children b6575b8c8db0
files flys-client/ChangeLog flys-client/src/main/java/de/intevation/flys/client/client/ui/chart/ChartOutputTab.java flys-client/src/main/java/de/intevation/flys/client/client/ui/chart/ChartToolbar.java flys-client/src/main/java/de/intevation/flys/client/client/ui/chart/OverviewOutputTab.java
diffstat 4 files changed, 147 insertions(+), 187 deletions(-) [+]
line wrap: on
line diff
--- a/flys-client/ChangeLog	Thu Jul 19 11:48:41 2012 +0000
+++ b/flys-client/ChangeLog	Fri Jul 20 07:40:55 2012 +0000
@@ -1,3 +1,18 @@
+2012-07-20  Ingo Weinzierl <ingo@intevation.de>
+
+	* src/main/java/de/intevation/flys/client/client/ui/chart/ChartToolbar.java:
+	  Made getChartOutputTab() protected.
+
+	* src/main/java/de/intevation/flys/client/client/ui/chart/ChartOutputTab.java:
+	  Moved creation of a ChartToolbar and a ChartThemePanel from constructor to
+	  own methods which enables subclasses to override those.
+
+	* src/main/java/de/intevation/flys/client/client/ui/chart/OverviewOutputTab.java:
+	  Override createThemePanel() and createChartToolbar() of parent class. Both
+	  methods return instances of minimalistic implementations of a
+	  ChartThemePanel and ChartToolbar. In addition, the overview chart is
+	  fetched as single image.
+
 2012-07-19  Ingo Weinzierl <ingo@intevation.de>
 
 	* src/main/java/de/intevation/flys/client/client/ui/DoubleInputPanel.java:
--- a/flys-client/src/main/java/de/intevation/flys/client/client/ui/chart/ChartOutputTab.java	Thu Jul 19 11:48:41 2012 +0000
+++ b/flys-client/src/main/java/de/intevation/flys/client/client/ui/chart/ChartOutputTab.java	Fri Jul 20 07:40:55 2012 +0000
@@ -3,6 +3,7 @@
 import com.google.gwt.core.client.GWT;
 import com.google.gwt.user.client.rpc.AsyncCallback;
 import com.smartgwt.client.types.Overflow;
+import com.smartgwt.client.types.Visibility;
 import com.smartgwt.client.widgets.Canvas;
 import com.smartgwt.client.widgets.Img;
 import com.smartgwt.client.widgets.events.ResizedEvent;
@@ -134,24 +135,21 @@
         hLayout.addMember(left);
         hLayout.addMember(right);
 
-        // Output "cross_section" needs slightly modified ThemePanel
-        // (with action buttons).
-        if (mode.getName().equals("cross_section")) {
-            ctp = new CrossSectionChartThemePanel(mode, this.view);
+        ctp = createThemePanel(mode, collectionView);
+        if (ctp != null) {
+            ctp.addRedrawRequestHandler(this);
+            ctp.addOutputParameterChangeHandler(this);
+            left.addChild(ctp);
         }
         else {
-            ctp = new ChartThemePanel(mode, this.view);
+            left.setVisible(false);
         }
 
-        ctp.addRedrawRequestHandler(this);
-        ctp.addOutputParameterChangeHandler(this);
-
         chart = createChartImg();
         right.addChild(chart);
         right.setOverflow(Overflow.HIDDEN);
-        left.addChild(ctp);
 
-        tbarPanel = new ChartToolbar(this);
+        tbarPanel = createChartToolbar(this);
         vLayout.addMember(tbarPanel);
         vLayout.addMember(hLayout);
 
@@ -159,6 +157,25 @@
 
         right.addResizedHandler(this);
     }
+    
+    
+    public ChartThemePanel createThemePanel(
+        OutputMode mode, CollectionView view
+    ) {
+        // Output "cross_section" needs slightly modified ThemePanel
+        // (with action buttons).
+        if (mode.getName().equals("cross_section")) {
+            return new CrossSectionChartThemePanel(mode, view);
+        }
+        else {
+            return new ChartThemePanel(mode, view);
+        }
+    }
+    
+    
+    public ChartToolbar createChartToolbar(ChartOutputTab tab) {
+        return new ChartToolbar(tab);
+    }
 
 
     public void toggleThemePanel() {
--- a/flys-client/src/main/java/de/intevation/flys/client/client/ui/chart/ChartToolbar.java	Thu Jul 19 11:48:41 2012 +0000
+++ b/flys-client/src/main/java/de/intevation/flys/client/client/ui/chart/ChartToolbar.java	Fri Jul 20 07:40:55 2012 +0000
@@ -47,7 +47,13 @@
     /** @param chartTab Output-Tab on which this toolbar is located. */
     public ChartToolbar(ChartOutputTab chartTab) {
         super(chartTab);
-
+        initTools();
+    }
+    
+    
+    protected void initTools() {
+        ChartOutputTab chartTab = getChartOutputTab();
+        
         manageThemes    = new Button(MSG.manageThemes());
         datacage        = new Button(MSG.databasket());
         position        = new MousePositionPanel(chartTab);
@@ -207,7 +213,7 @@
     }
 
 
-    private ChartOutputTab getChartOutputTab() {
+    protected ChartOutputTab getChartOutputTab() {
         return (ChartOutputTab)getOutputTab();
     }
 
--- a/flys-client/src/main/java/de/intevation/flys/client/client/ui/chart/OverviewOutputTab.java	Thu Jul 19 11:48:41 2012 +0000
+++ b/flys-client/src/main/java/de/intevation/flys/client/client/ui/chart/OverviewOutputTab.java	Fri Jul 20 07:40:55 2012 +0000
@@ -1,203 +1,125 @@
 package de.intevation.flys.client.client.ui.chart;
 
-import java.util.Date;
-import java.util.HashMap;
-import java.util.Map;
-import java.util.Set;
-
 import com.google.gwt.core.client.GWT;
 
-import com.smartgwt.client.widgets.Canvas;
-import com.smartgwt.client.widgets.Img;
-import com.smartgwt.client.widgets.events.ResizedEvent;
-import com.smartgwt.client.widgets.events.ResizedHandler;
-import com.smartgwt.client.widgets.layout.HLayout;
-import com.smartgwt.client.widgets.layout.VLayout;
-
-import de.intevation.flys.client.client.Config;
+import de.intevation.flys.client.client.event.OutputParameterChangeHandler;
+import de.intevation.flys.client.client.event.RedrawRequestHandler;
 import de.intevation.flys.client.client.ui.CollectionView;
-import de.intevation.flys.client.client.ui.OutputTab;
-
+import de.intevation.flys.client.client.ui.ImgLink;
 import de.intevation.flys.client.shared.model.Collection;
 import de.intevation.flys.client.shared.model.OutputMode;
-
-
-/**
- * An overview output tab. This tab displays an overview of all charts
- * integrated in the current calculation mode.
- *
- * @author <a href="mailto:raimund.renkert@intevation.de">Raimund Renkert</a>
- */
-public class OverviewOutputTab
-extends OutputTab
-implements   ResizedHandler
-{
-    /** The collection view.*/
-    protected CollectionView view;
-
-    /** The root layout. */
-    protected HLayout root;
-
-    /** The columns */
-    protected VLayout[] columns;
-
-    /** The chart container.*/
-    protected Canvas[][] charts;
-
-    /** All relevant output modes. */
-    protected Map<String, OutputMode> relModes;
+import de.intevation.flys.client.shared.model.Theme;
 
 
-    public OverviewOutputTab(
-        String title,
-        Collection collection,
-        OutputMode mode,
-        CollectionView collectionView)
-    {
-        super(title, collection, collectionView, mode);
+public class OverviewOutputTab extends ChartOutputTab  {
 
-        relModes = new HashMap<String, OutputMode>();
-
-        Map<String, OutputMode> modes = collection.getOutputModes();
-        Set<String> keys = modes.keySet();
+    private class NoChartThemePanel extends ChartThemePanel {
 
-        // Get all relevant outputs.
-        for (String key: keys) {
-            OutputMode m = modes.get(key);
-            if (m.getType().equals("chart")) {
-                relModes.put(key, m);
-            }
+        public NoChartThemePanel(OutputMode mode, CollectionView view) {
+            super(mode, view);
         }
 
-        root = new HLayout();
-        setPane(root);
-        root.addResizedHandler(this);
-
-        // Get the column and row count and initialize the grid.
-        int width = getColumnCount(relModes.size());
-        int height = getRowCount(relModes.size());
-        charts = new Canvas[width][height];
-        columns = new VLayout[width];
-
-        for (int i = 0; i < width; i++) {
-            columns[i] = new VLayout();
-            root.addMember(columns[i]);
+        @Override
+        public void activateTheme(Theme theme, boolean active) { }
 
-            for (int j = 0; j < height; j++) {
-                charts[i][j] = new Canvas();
-
-                // This is for 3, 6 or 9 charts only!
-                // TODO: Calculate the height.
-                charts[i][j].setHeight("50%");
+        @Override
+        public void feedTellArea(
+            final String artifact,
+            Theme under,
+            Theme over,
+            boolean between
+        ) { }
 
-                String type =
-                    ((OutputMode)relModes.values()
-                        .toArray()[j + i * height]).getName();
-                columns[i].addMember(charts[i][j]);
-                charts[i][j].addChild(
-                    new Img(getImgUrl(
-                        charts[i][j].getWidth(),
-                        charts[i][j].getHeight(), type)));
+        @Override
+        public void createAreaArtifact(
+            final Theme   over,
+            final Theme   under,
+            final boolean between
+        ) { }
 
-            }
+        @Override
+        public void addOutputParameterChangeHandler(OutputParameterChangeHandler h) { }
+
+        @Override
+        public void addRedrawRequestHandler(RedrawRequestHandler h){ }
+    }
+
+
+
+    private class MinimumChartToolbar extends ChartToolbar {
+
+        public MinimumChartToolbar(ChartOutputTab tab) {
+            super(tab);
+        }
+
+        @Override
+        protected void initTools() {
+            GWT.log("CREATE NEW MINIMALISTIC CHART TOOLBAR");
+            ChartOutputTab chartTab = getChartOutputTab();
+
+            String baseUrl = GWT.getHostPageBaseURL();
+
+            downloadPNG = new ImgLink(
+                baseUrl + MSG.downloadPNG(),
+                chartTab.getExportUrl(-1, -1, "png"),
+                20,
+                20);
+            downloadPNG.setTooltip(MSG.downloadPNGTooltip());
+
+            downloadPDF = new ImgLink(
+                baseUrl + MSG.downloadPDF(),
+                chartTab.getExportUrl(1280, 1024, "pdf"),
+                20,
+                20);
+            downloadPDF.setTooltip(MSG.downloadPDFTooltip());
+
+            downloadSVG = new ImgLink(
+                baseUrl + MSG.downloadSVG(),
+                chartTab.getExportUrl(1280, 1024, "svg"),
+                20,
+                20);
+            downloadSVG.setTooltip(MSG.downloadSVGTooltip());
+
+            initLayout();
+        }
+
+
+        @Override
+        protected void initLayout() {
+            setWidth100();
+            setHeight(PANEL_HEIGHT);
+            setMembersMargin(10);
+            setPadding(5);
+            setBorder("1px solid black");
+
+            addMember(downloadPNG);
+            addMember(downloadPDF);
+            addMember(downloadSVG);
         }
     }
 
 
-    /**
-     * Resize handler.
-     *
-     * @param event The resize event.
-     */
-    @Override
-    public void onResized(ResizedEvent event) {
-        for (int i = 0; i < charts.length; i++) {
-            // This is for 3, 6 or 9 charts only!
-            // TODO: Calculate the width.
-            columns[i].setWidth(root.getWidth()/3);
 
-            for (int j = 0; j < charts[i].length; j++) {
-                String type =
-                    ((OutputMode)relModes.values()
-                        .toArray()[j + i * charts[i].length]).getName();
-                Canvas[] children = charts[i][j].getChildren();
-                for (int k = 0; k < children.length; k++) {
-                    charts[i][j].removeChild(children[k]);
-                }
-                charts[i][j].addChild(new Img(
-                        getImgUrl(
-                            charts[i][j].getWidth(),
-                            charts[i][j].getHeight(),
-                            type),
-                        charts[i][j].getWidth(),
-                        charts[i][j].getHeight()
-                        ));
-            }
-        }
+    public OverviewOutputTab(
+        String         title,
+        Collection     collection,
+        OutputMode     mode,
+        CollectionView collectionView
+        ){
+        super(title, collection, mode, collectionView);
+        left.setVisible(false);
     }
 
 
-    /**
-     * Returns the column count for the grid.
-     *
-     * @param count all fields
-     * @return the column count
-     */
-    protected int getRowCount(int count) {
-        if (count <= 3) {
-            return 1;
-        }
-        else if (count > 3 && count < 9) {
-            return 2;
-        }
-        else {
-            return 3;
-        }
+    @Override
+    public ChartThemePanel createThemePanel(
+        OutputMode mode, CollectionView view
+        ) {
+        return new NoChartThemePanel(mode, view);
     }
 
-
-    /**
-     * Returns the row count for the grid.
-     *
-     * @param count all fields
-     * @return the row count
-     */
-    protected int getColumnCount(int count) {
-        if(count <= 3) {
-            return count;
-        }
-        else if(count > 3 && count < 9) {
-            return ((count + (count % 2))/getRowCount(count));
-        }
-        else {
-            return (count + (3 - (count % 3))/getRowCount(count));
-        }
-    }
-
-
-    /**
-     * Builds the URL that points to the chart image.
-     *
-     * @param width The width of the requested chart.
-     * @param height The height of the requested chart.
-     * @param xr Optional x range (used for zooming).
-     * @param yr Optional y range (used for zooming).
-     *
-     * @return the URL to the chart image.
-     */
-    protected String getImgUrl(int width, int height, String type) {
-        Config config = Config.getInstance();
-
-        String imgUrl = GWT.getModuleBaseURL();
-        imgUrl += "chart";
-        imgUrl += "?uuid=" + collection.identifier();
-        imgUrl += "&type=" + type;
-        imgUrl += "&locale=" + config.getLocale();
-        imgUrl += "&timestamp=" + new Date().getTime();
-        imgUrl += "&width=" + Integer.toString(width);
-        imgUrl += "&height=" + Integer.toString(height);
-
-        return imgUrl;
+    @Override
+    public ChartToolbar createChartToolbar(ChartOutputTab tab) {
+        return new MinimumChartToolbar(tab);
     }
 }
-// vim:set ts=4 sw=4 si et sta sts=4 fenc=utf8 :

http://dive4elements.wald.intevation.org