changeset 540:a866cdf1ca40

Implemented a zoombox control and added it to the chart toolbar. flys-client/trunk@2040 c6561f87-3c4e-4783-a992-168aeb5c3f6f
author Ingo Weinzierl <ingo.weinzierl@intevation.de>
date Wed, 01 Jun 2011 13:43:35 +0000
parents fea93eebd2fa
children ed29599e06e5
files flys-client/ChangeLog flys-client/src/main/java/de/intevation/flys/client/client/event/HasZoomHandlers.java flys-client/src/main/java/de/intevation/flys/client/client/event/ZoomEvent.java flys-client/src/main/java/de/intevation/flys/client/client/event/ZoomHandler.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/ZoomboxControl.java
diffstat 6 files changed, 323 insertions(+), 0 deletions(-) [+]
line wrap: on
line diff
--- a/flys-client/ChangeLog	Wed Jun 01 11:59:59 2011 +0000
+++ b/flys-client/ChangeLog	Wed Jun 01 13:43:35 2011 +0000
@@ -1,3 +1,21 @@
+2011-06-01  Ingo Weinzierl <ingo@intevation.de>
+
+	* src/main/java/de/intevation/flys/client/client/event/HasZoomHandlers.java,
+	  src/main/java/de/intevation/flys/client/client/event/ZoomHandler.java,
+	  src/main/java/de/intevation/flys/client/client/event/ZoomEvent.java:
+	  New. Necessary interfaces and classes for a listener mechanism for zoom
+	  events.
+
+	* src/main/java/de/intevation/flys/client/client/ui/chart/ZoomboxControl.java:
+	  New. A zoombox control that draws - if activated - an semi opaque
+	  rectangle on the top of the observed panel. This control uses mouse
+	  up/down/move events to draw the rectangle. A mouse down event starts the
+	  zoom process, a mouse up event determines the coordinates for the zoom
+	  and fires a ZoomEvent.
+
+	* src/main/java/de/intevation/flys/client/client/ui/chart/ChartToolbar.java:
+	  Added the ZoomboxControl.
+
 2011-06-01  Ingo Weinzierl <ingo@intevation.de>
 
 	* src/main/java/de/intevation/flys/client/client/ui/chart/ChartToolbar.java:
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/flys-client/src/main/java/de/intevation/flys/client/client/event/HasZoomHandlers.java	Wed Jun 01 13:43:35 2011 +0000
@@ -0,0 +1,11 @@
+package de.intevation.flys.client.client.event;
+
+
+/**
+ * @author <a href="mailto:ingo.weinzierl@intevation.de">Ingo Weinzierl</a>
+ */
+public interface HasZoomHandlers {
+
+    void addZoomHandler(ZoomHandler handler);
+}
+// vim:set ts=4 sw=4 si et sta sts=4 fenc=utf8 :
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/flys-client/src/main/java/de/intevation/flys/client/client/event/ZoomEvent.java	Wed Jun 01 13:43:35 2011 +0000
@@ -0,0 +1,43 @@
+package de.intevation.flys.client.client.event;
+
+
+/**
+ * @author <a href="mailto:ingo.weinzierl@intevation.de">Ingo Weinzierl</a>
+ */
+public class ZoomEvent {
+
+    protected int xmin;
+    protected int ymin;
+
+    protected int xmax;
+    protected int ymax;
+
+
+    public ZoomEvent(int xmin, int ymin, int xmax, int ymax) {
+        this.xmin = xmin;
+        this.xmax = xmax;
+        this.ymin = ymin;
+        this.ymax = ymax;
+    }
+
+
+    public int getStartX() {
+        return xmin;
+    }
+
+
+    public int getEndX() {
+        return xmax;
+    }
+
+
+    public int getStartY() {
+        return ymin;
+    }
+
+
+    public int getEndY() {
+        return ymax;
+    }
+}
+// vim:set ts=4 sw=4 si et sta sts=4 fenc=utf8 :
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/flys-client/src/main/java/de/intevation/flys/client/client/event/ZoomHandler.java	Wed Jun 01 13:43:35 2011 +0000
@@ -0,0 +1,11 @@
+package de.intevation.flys.client.client.event;
+
+
+/**
+ * @author <a href="mailto:ingo.weinzierl@intevation.de">Ingo Weinzierl</a>
+ */
+public interface ZoomHandler {
+
+    void onZoom(ZoomEvent event);
+}
+// vim:set ts=4 sw=4 si et sta sts=4 fenc=utf8 :
--- a/flys-client/src/main/java/de/intevation/flys/client/client/ui/chart/ChartToolbar.java	Wed Jun 01 11:59:59 2011 +0000
+++ b/flys-client/src/main/java/de/intevation/flys/client/client/ui/chart/ChartToolbar.java	Wed Jun 01 13:43:35 2011 +0000
@@ -37,6 +37,8 @@
 
     protected MousePositionPanel position;
 
+    protected ZoomboxControl zoombox;
+
 
 
     public ChartToolbar(CollectionView view, ChartOutputTab chartTab) {
@@ -47,6 +49,7 @@
 
         datacage = new Button(MSG.databasket());
         position = new MousePositionPanel(chartTab);
+        zoombox  = new ZoomboxControl(chartTab);
 
         datacage.addClickHandler(new ClickHandler() {
             public void onClick(ClickEvent event) {
@@ -77,6 +80,7 @@
         position.setWidth("200px");
 
         addMember(datacage);
+        addMember(zoombox);
         addMember(spacer);
         addMember(position);
     }
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/flys-client/src/main/java/de/intevation/flys/client/client/ui/chart/ZoomboxControl.java	Wed Jun 01 13:43:35 2011 +0000
@@ -0,0 +1,236 @@
+package de.intevation.flys.client.client.ui.chart;
+
+import java.util.ArrayList;
+import java.util.List;
+
+import com.smartgwt.client.types.Positioning;
+import com.smartgwt.client.types.SelectionType;
+import com.smartgwt.client.widgets.Button;
+import com.smartgwt.client.widgets.Canvas;
+import com.smartgwt.client.widgets.events.MouseDownEvent;
+import com.smartgwt.client.widgets.events.MouseDownHandler;
+import com.smartgwt.client.widgets.events.MouseMoveEvent;
+import com.smartgwt.client.widgets.events.MouseMoveHandler;
+import com.smartgwt.client.widgets.events.MouseUpEvent;
+import com.smartgwt.client.widgets.events.MouseUpHandler;
+
+import de.intevation.flys.client.client.event.HasZoomHandlers;
+import de.intevation.flys.client.client.event.ZoomEvent;
+import de.intevation.flys.client.client.event.ZoomHandler;
+
+
+/**
+ * This control observes that panel retrieved by ChartOutputTab.getChartPanel().
+ * If activated, a zoombox is drawn. One of the two edges is the position of the
+ * mouse down event on the observed panel. The other edge is specified by the
+ * current mouse position. If the mouse up event occurs, start and end point
+ * relative to the left and upper border of the observed panel is determined and
+ * a ZoomEvent is fired.
+ *
+ * @author <a href="mailto:ingo.weinzierl@intevation.de">Ingo Weinzierl</a>
+ */
+public class ZoomboxControl
+extends      Button
+implements   MouseDownHandler, MouseUpHandler, MouseMoveHandler, HasZoomHandlers
+{
+    protected List<ZoomHandler> handlers;
+
+    protected ChartOutputTab chartTab;
+
+    protected Canvas zoombox;
+
+    protected int[] start;
+    protected int[] end;
+
+
+    public ZoomboxControl(ChartOutputTab chartTab) {
+        super("Zoombox");
+
+        this.handlers = new ArrayList<ZoomHandler>();
+        this.chartTab = chartTab;
+        this.start    = new int[2];
+        this.end      = new int[2];
+        this.zoombox  = new Canvas();
+
+        initZoombox();
+
+        setActionType(SelectionType.CHECKBOX);
+        setSelected(false);
+
+        chartTab.getChartPanel().addMouseDownHandler(this);
+        chartTab.getChartPanel().addMouseMoveHandler(this);
+        chartTab.getChartPanel().addMouseUpHandler(this);
+    }
+
+
+    /**
+     * Initializes the zoombox that is displayed over the observed area. The
+     * zoombox has an opaque background. Its height/width and x/y values are
+     * determined by the start point (mouse down) and the current mouse
+     * position.
+     */
+    protected void initZoombox() {
+        zoombox.setPosition(Positioning.ABSOLUTE);
+        zoombox.setBackgroundColor("red");
+        zoombox.setOpacity(50);
+        zoombox.setWidth(0);
+        zoombox.setHeight(0);
+    }
+
+
+    /**
+     * Registers a new ZoomHandler that wants to listen to ZoomEvents.
+     *
+     * @param handler A new ZoomHandler.
+     */
+    public void addZoomHandler(ZoomHandler handler) {
+        if (handler != null) {
+            handlers.add(handler);
+        }
+    }
+
+
+    /**
+     * A mouse down event on the specified area will set the start point for the
+     * zoombox.
+     *
+     * @param event The mouse down event which contains the xy coordinates of
+     * the observed area.
+     */
+    public void onMouseDown(MouseDownEvent event) {
+        if (!isSelected()) {
+            return;
+        }
+
+        start[0] = getRelativeX(event.getX());
+        start[1] = getRelativeY(event.getY());
+
+        end[0] = start[0];
+        end[1] = start[1];
+
+        chartTab.getChartPanel().addChild(zoombox);
+
+        positionZoombox();
+    }
+
+
+    /**
+     * A mouse move event on the specified area will set the end point for the
+     * zoombox. If the end point differs from the start point, an opaque box is
+     * displayed.
+     *
+     * @param event The mouse move event which contains the xy coordinates of
+     * the observed area.
+     */
+    public void onMouseMove(MouseMoveEvent event) {
+        if (!isSelected()) {
+            return;
+        }
+
+        end[0] = getRelativeX(event.getX());
+        end[1] = getRelativeY(event.getY());
+
+        positionZoombox();
+    }
+
+
+    /**
+     * The mouse up event finalizes the zoom operation. It sets the end point
+     * for this operation, clears the zoombox and fires a ZoomEvent.
+     *
+     * @param event The mouse up event which contains the xy coordinates of the
+     * observed area.
+     */
+    public void onMouseUp(MouseUpEvent event) {
+        if (!isSelected()) {
+            return;
+        }
+
+        end[0] = getRelativeX(event.getX());
+        end[1] = getRelativeY(event.getY());
+
+        clearZoombox();
+
+        chartTab.getChartPanel().removeChild(zoombox);
+    }
+
+
+    /**
+     * Returns the X coordinate relative to the left border.
+     *
+     * @param x The X coordinate relative to the window.
+     *
+     * @return the X coordinate relative to the left border.
+     */
+    protected int getRelativeX(int x) {
+        return x - chartTab.getChartPanel().getPageLeft();
+    }
+
+
+    /**
+     * Returns the Y coordinate relative to the top border.
+     *
+     * @param y The Y coordinate relative to the window.
+     *
+     * @return the Y coordinate relative to the top border.
+     */
+    protected int getRelativeY(int y) {
+        return y - chartTab.getChartPanel().getPageTop();
+    }
+
+
+    /**
+     * Returns min and max x/y values based on the stored values in <i>start</i>
+     * and <i>end</i>.
+     *
+     * @return an int[] as follows: [xmin, ymin, xmax, ymax].
+     */
+    protected int[] orderPositions() {
+        int xmin = start[0] < end[0] ? start[0] : end[0];
+        int ymin = start[1] < end[1] ? start[1] : end[1];
+
+        int xmax = start[0] >= end[0] ? start[0] : end[0];
+        int ymax = start[1] >= end[1] ? start[1] : end[1];
+
+        return new int[] { xmin, ymin, xmax, ymax };
+    }
+
+
+    /**
+     * Sets the width, height, x and y values of the zoombox.
+     */
+    protected void positionZoombox() {
+        int[] values = orderPositions();
+
+        zoombox.setLeft(values[0]);
+        zoombox.setTop(values[1]);
+        zoombox.setWidth(values[2] - values[0]);
+        zoombox.setHeight(values[3] - values[1]);
+    }
+
+
+    /**
+     * Clears the zoombox (set position and size to null).
+     */
+    protected void clearZoombox() {
+        zoombox.setLeft(0);
+        zoombox.setTop(0);
+        zoombox.setWidth(0);
+        zoombox.setHeight(0);
+    }
+
+
+    /**
+     * Fires a ZoomEvent to all registered listeners.
+     */
+    protected void fireZoomEvent() {
+        int[] pos = orderPositions();
+
+        ZoomEvent event = new ZoomEvent(pos[0], pos[1], pos[2], pos[3]);
+
+        for (ZoomHandler handler: handlers) {
+            handler.onZoom(event);
+        }
+    }
+}
+// vim:set ts=4 sw=4 si et sta sts=4 fenc=utf8 :

http://dive4elements.wald.intevation.org