view flys-client/src/main/java/de/intevation/flys/client/client/ui/chart/ChartOutputTab.java @ 1281:4782c0ce9cec

Re-added the function to zoom-out charts by a given factor (10%). flys-client/trunk@2863 c6561f87-3c4e-4783-a992-168aeb5c3f6f
author Ingo Weinzierl <ingo.weinzierl@intevation.de>
date Thu, 29 Sep 2011 12:55:17 +0000
parents 66192d170c79
children 3904519ec161
line wrap: on
line source
package de.intevation.flys.client.client.ui.chart;

import java.util.Date;
import java.util.HashMap;
import java.util.Map;
import java.util.Stack;

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.widgets.Canvas;
import com.smartgwt.client.widgets.Img;

import com.smartgwt.client.widgets.layout.HLayout;
import com.smartgwt.client.widgets.layout.VLayout;

import com.smartgwt.client.widgets.events.ResizedEvent;
import com.smartgwt.client.widgets.events.ResizedHandler;

import de.intevation.flys.client.shared.Transform2D;
import de.intevation.flys.client.shared.model.Axis;
import de.intevation.flys.client.shared.model.ChartInfo;
import de.intevation.flys.client.shared.model.Collection;
import de.intevation.flys.client.shared.model.OutputMode;
import de.intevation.flys.client.shared.model.ZoomObj;
import de.intevation.flys.client.client.Config;
import de.intevation.flys.client.client.event.OutputParameterChangeEvent;
import de.intevation.flys.client.client.event.OutputParameterChangeHandler;
import de.intevation.flys.client.client.event.PanEvent;
import de.intevation.flys.client.client.event.PanHandler;
import de.intevation.flys.client.client.event.RedrawRequestHandler;
import de.intevation.flys.client.client.event.RedrawRequestEvent;
import de.intevation.flys.client.client.event.RedrawRequestEvent.Type;
import de.intevation.flys.client.client.event.ZoomEvent;
import de.intevation.flys.client.client.event.ZoomHandler;
import de.intevation.flys.client.client.services.ChartInfoService;
import de.intevation.flys.client.client.services.ChartInfoServiceAsync;
import de.intevation.flys.client.client.ui.CollectionView;
import de.intevation.flys.client.client.ui.OutputTab;


/**
 * @author <a href="mailto:ingo.weinzierl@intevation.de">Ingo Weinzierl</a>
 */
public class ChartOutputTab
extends      OutputTab
implements   ResizedHandler,
             OutputParameterChangeHandler,
             ZoomHandler,
             PanHandler,
             RedrawRequestHandler
{
    public static final int DEFAULT_CHART_WIDTH  = 600;
    public static final int DEFAULT_CHART_HEIGHT = 500;

    public static final int THEMEPANEL_MIN_WIDTH = 200;


    /** The service that is used to fetch chart information. */
    protected ChartInfoServiceAsync info = GWT.create(ChartInfoService.class);


    /** The ChartInfo object that provides information about the current
     * chart. */
    protected ChartInfo chartInfo;

    /** Transformer used to transform image pixels into chart coordinates. */
    protected Transform2D[] transformer;

    /** The collection view.*/
    protected CollectionView view;

    protected ChartThemePanel ctp;


    /** The canvas that wraps the chart toolbar. */
    protected Canvas tbarPanel;

    /** The canvas that wraps the theme editor. */
    protected Canvas left;

    /** The canvas that wraps the chart. */
    protected Canvas right;

    protected Img chart;


    /** Chart zoom options. */
    protected int[] xrange;
    protected int[] yrange;

    protected Stack<ZoomObj> zoomStack;
    protected double[]       zoom;


    /**
     * The default constructor to create a new ChartOutputTab.
     *
     * @param title The title of this tab.
     * @param collection The Collection which this chart belongs to.
     * @param mode The OutputMode.
     * @param collectionView The shown collection.
     */
    public ChartOutputTab(
        String         title,
        Collection     collection,
        OutputMode     mode,
        CollectionView collectionView
    ){
        super(title, collection, mode);

        view      = collectionView;
        left      = new Canvas();
        right     = new Canvas();
        xrange    = new int[2];
        yrange    = new int[2];
        zoom      = new double[4];
        zoomStack = new Stack<ZoomObj>();

        left.setBorder("1px solid black");
        left.setWidth(THEMEPANEL_MIN_WIDTH);
        left.setMinWidth(THEMEPANEL_MIN_WIDTH);
        right.setWidth("*");

        VLayout vLayout = new VLayout();
        vLayout.setMembersMargin(2);

        HLayout hLayout = new HLayout();
        hLayout.setWidth100();
        hLayout.setHeight100();
        hLayout.setMembersMargin(10);

        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(collection, mode);
        }
        else {
            ctp = new ChartThemePanel(collection, mode);
        }

        ctp.addRedrawRequestHandler(this);
        ctp.addOutputParameterChangeHandler(this);

        chart = createChartImg();
        right.addChild(chart);
        right.setOverflow(Overflow.HIDDEN);
        //right.addChild(createChartPanel());
        left.addChild(ctp);

        tbarPanel = new ChartToolbar(collectionView, this);
        vLayout.addMember(tbarPanel);
        vLayout.addMember(hLayout);

        setPane(vLayout);

        right.addResizedHandler(this);
    }


    /**
     * This method is called after the chart panel has resized. It removes the
     * chart - if existing - and requests a new one with adjusted size.
     *
     * @param event The resize event.
     */
    public void onResized(ResizedEvent event) {
        updateChartPanel();
        updateChartInfo();
    }


    public void onRedrawRequest(RedrawRequestEvent event) {
        if (event.getType() == Type.RESET) {
            resetRanges();
        }
        else {
            ctp.updateCollection();
            updateChartPanel();
            updateChartInfo();
        }
    }


    /**
     * Listens to change event in the chart them panel and updates chart after
     * receiving such an event.
     *
     * @param event The OutputParameterChangeEvent.
     */
    public void onOutputParameterChanged(OutputParameterChangeEvent event) {
        updateChartPanel();
    }


    /**
     * Listens to zoom events and refreshes the current chart in such case.
     *
     * @param evt The ZoomEvent that stores the coordinates for zooming.
     */
    public void onZoom(ZoomEvent evt) {
        zoomStack.push(new ZoomObj(zoom[0], zoom[1], zoom[2], zoom[3]));

        xrange[0] = evt.getStartX();
        xrange[1] = evt.getEndX();
        yrange[0] = evt.getStartY();
        yrange[1] = evt.getEndY();

        xrange[0] = xrange[0] < xrange[1] ? xrange[0] : xrange[1];
        yrange[0] = yrange[0] < yrange[1] ? yrange[0] : yrange[1];

        translateCoordinates();

        updateChartInfo();
        updateChartPanel();
    }


    protected double[] translateCoordinates() {
        if (xrange == null || (xrange[0] == 0 && xrange[1] == 0)) {
            zoom[0] = 0d;
            zoom[1] = 1d;
        }
        else {
            translateXCoordinates();
        }

        if (yrange == null || (yrange[0] == 0 && yrange[1] == 0)) {
            zoom[2] = 0d;
            zoom[3] = 1d;
        }
        else {
            translateYCoordinates();
        }

        return zoom;
    }


    protected void translateXCoordinates() {
        Axis xAxis = chartInfo.getXAxis(0);

        double xmin   = xAxis.getMin();
        double xmax   = xAxis.getMax();
        double xRange = xmax - xmin;

        Transform2D transformer = getTransformer(0);

        double[] start = transformer.transform(xrange[0], yrange[0]);
        double[] end   = transformer.transform(xrange[1], yrange[1]);

        zoom[0] = (start[0] - xmin) / xRange;
        zoom[1] = (end[0] - xmin) / xRange;
    }


    protected void translateYCoordinates() {
        Axis yAxis = chartInfo.getYAxis(0);

        double ymin   = yAxis.getMin();
        double ymax   = yAxis.getMax();
        double yRange = ymax - ymin;

        Transform2D transformer = getTransformer(0);

        double[] start = transformer.transform(xrange[0], yrange[0]);
        double[] end   = transformer.transform(xrange[1], yrange[1]);

        zoom[2] = (start[1] - ymin) / yRange;
        zoom[3] = (end[1] - ymin) / yRange;
    }


    public void onPan(PanEvent event) {
        if (chartInfo == null) {
            return;
        }

        int[] start = event.getStartPos();
        int[] end   = event.getEndPos();

        Transform2D t = getTransformer();

        double[] ts = t.transform(start[0], start[1]);
        double[] tt = t.transform(end[0], end[1]);

        double diffX = ts[0] - tt[0];
        double diffY = ts[1] - tt[1];

        Axis xAxis = chartInfo.getXAxis(0);
        Axis yAxis = chartInfo.getYAxis(0);

        double[] x = panAxis(xAxis, diffX);
        double[] y = panAxis(yAxis, diffY);

        zoom[0] = x[0];
        zoom[1] = x[1];
        zoom[2] = y[0];
        zoom[3] = y[1];

        updateChartInfo();
        updateChartPanel();
    }


    protected double[] panAxis(Axis axis, double diff) {
        double min = axis.getFrom();
        double max = axis.getTo();

        min += diff;
        max += diff;

        return computeZoom(axis, min, max);
    }


    public void resetRanges() {
        zoomStack.push(new ZoomObj(zoom[0], zoom[1], zoom[2], zoom[3]));

        zoom[0] = 0d;
        zoom[1] = 1d;
        zoom[2] = 0d;
        zoom[3] = 1d;

        updateChartInfo();
        updateChartPanel();
    }


    /**
     * This method zooms the current chart out by a given <i>factor</i>.
     *
     * @param factor The factor should be between 0-100.
     */
    public void zoomOut(int factor) {
        if (factor < 0 || factor > 100 || chartInfo == null) {
            return;
        }

        zoomStack.push(new ZoomObj(zoom[0], zoom[1], zoom[2], zoom[3]));

        Axis xAxis = chartInfo.getXAxis(0);
        Axis yAxis = chartInfo.getYAxis(0);

        double[] x = zoomAxis(xAxis, factor);
        double[] y = zoomAxis(yAxis, factor);

        zoom[0] = x[0];
        zoom[1] = x[1];
        zoom[2] = x[0];
        zoom[3] = y[1];

        updateChartInfo();
        updateChartPanel();
    }


    /**
     * This method is used to zoom out. Zooming out is realizied with a stacked
     * logic. Initially, you cannot zoom out. For each time you start a zoom-in
     * action, the extent of the chart is stored and pushed onto a stack. A
     * zoom-out will now lead you to the last extent that is poped from stack.
     *
     */
    public void zoomOut() {
        if (!zoomStack.empty()) {
            zoom = zoomStack.pop().getZoom();

            updateChartInfo();
            updateChartPanel();
        }
    }


    public double[] zoomAxis(Axis axis, int factor) {
        double min  = axis.getFrom();
        double max  = axis.getTo();

        double add = (max - min) / 100 * factor;
        add = add < 0 ? (-1) * add : add;

        min -= add;
        max += add;

        return computeZoom(axis, min, max);
    }


    public static double[] computeZoom(Axis axis, double min, double max) {
        double[] zoom = new double[2];

        double absMin = axis.getMin();
        double absMax = axis.getMax();
        double diff   = absMax > absMin ? absMax - absMin : absMin - absMax;

        zoom[0] = (min - absMin) / diff;
        zoom[1] = (max - absMin) / diff;

        return zoom;
    }


    /**
     * Updates the Transform2D object using the chart info service.
     */
    public void updateChartInfo() {
        Config config = Config.getInstance();
        String url    = config.getServerUrl();
        String locale = config.getLocale();

        info.getChartInfo(
            view.getCollection(),
            url,
            locale,
            mode.getName(),
            getChartAttributes(),
            new AsyncCallback<ChartInfo>() {
                public void onFailure(Throwable caught) {
                    GWT.log("ChartInfo ERROR: " + caught.getMessage());
                }

                public void onSuccess(ChartInfo chartInfo) {
                    setChartInfo(chartInfo);
                }
            });
    }


    public void updateChartPanel() {
        int w = right.getWidth();
        int h = right.getHeight();

        chart.setSrc(getImgUrl(w, h));
    }


    /**
     * Returns the existing chart panel.
     *
     * @return the existing chart panel.
     */
    public Canvas getChartPanel() {
        return right;
    }


    public Canvas getChartImg() {
        return chart;
    }


    public ChartInfo getChartInfo() {
        return chartInfo;
    }


    protected void setChartInfo(ChartInfo chartInfo) {
        this.chartInfo = chartInfo;
    }


    public Transform2D getTransformer() {
        if (chartInfo == null) {
            return null;
        }

        return chartInfo.getTransformer(0);
    }


    /**
     * Returns the Transform2D object used to transform image coordinates into
     * chart coordinates.
     *
     * @param pos The index of a specific transformer.
     *
     * @return the Transform2D object.
     */
    public Transform2D getTransformer(int pos) {
        if (chartInfo == null) {
            return null;
        }

        return chartInfo.getTransformer(pos);
    }


    /**
     * Creates a new chart panel with default size.
     *
     * @return the created chart panel.
     */
    protected Img createChartImg() {
        return createChartImg(DEFAULT_CHART_WIDTH, DEFAULT_CHART_HEIGHT);
    }


    /**
     * Creates a new chart panel with specified width and height.
     *
     * @param width The width for the chart panel.
     * @param height The height for the chart panel.
     *
     * @return the created chart panel.
     */
    protected Img createChartImg(int width, int height) {
        Img chart  = getChartImg(width, height);
        chart.setWidth100();
        chart.setHeight100();

        return chart;
    }


    /**
     * Builds the chart image and returns it.
     *
     * @param width The chart width.
     * @param height The chart height.
     *
     * @return the chart image.
     */
    protected Img getChartImg(int width, int height) {
        return new Img(getImgUrl(width, height));
    }


    /**
     * 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) {
        Config config = Config.getInstance();

        String imgUrl = GWT.getModuleBaseURL();
        imgUrl += "chart";
        imgUrl += "?uuid=" + collection.identifier();
        imgUrl += "&type=" + mode.getName();
        imgUrl += "&server=" + config.getServerUrl();
        imgUrl += "&locale=" + config.getLocale();
        imgUrl += "&timestamp=" + new Date().getTime();
        imgUrl += "&width=" + Integer.toString(width);
        imgUrl += "&height=" + Integer.toString(height);

        double[] zoom = getZoomValues();

        if (zoom != null) {
            if (zoom[0] != 0 || zoom[1] != 1) {
                // a zoom range of 0-1 means displaying the whole range. In such
                // case we don't need to zoom.
                imgUrl += "&minx=" + Double.toString(zoom[0]);
                imgUrl += "&maxx=" + Double.toString(zoom[1]);
            }
            if (zoom[2] != 0 || zoom[3] != 1) {
                // a zoom range of 0-1 means displaying the whole range. In such
                // case we don't need to zoom.
                imgUrl += "&miny=" + Double.toString(zoom[2]);
                imgUrl += "&maxy=" + Double.toString(zoom[3]);
            }
        }

        return imgUrl;
    }


    public Map getChartAttributes() {
        Map<String, String> attr = new HashMap<String, String>();

        Canvas chart = getChartPanel();
        attr.put("width", chart.getWidth().toString());
        attr.put("height", chart.getHeight().toString());

        double[] zoom = getZoomValues();

        if (zoom != null) {
            if (zoom[0] != 0 || zoom[1] != 1) {
                // a zoom range of 0-1 means displaying the whole range. In such
                // case we don't need to zoom.
                attr.put("minx", Double.toString(zoom[0]));
                attr.put("maxx", Double.toString(zoom[1]));
            }
            if (zoom[2] != 0 || zoom[3] != 1) {
                // a zoom range of 0-1 means displaying the whole range. In such
                // case we don't need to zoom.
                attr.put("miny", Double.toString(zoom[2]));
                attr.put("maxy", Double.toString(zoom[3]));
            }
        }

        return attr;
    }


    protected double[] getZoomValues() {
        return zoom;
    }
}
// vim:set ts=4 sw=4 si et sta sts=4 fenc=utf8 :

http://dive4elements.wald.intevation.org