gwtquery.plugins.droppable.client.gwtsimplesample.GwtSimpleSample.java Source code

Introduction

Here is the source code for gwtquery.plugins.droppable.client.gwtsimplesample.GwtSimpleSample.java

Source

/*
 * Copyright 2010 The gwtquery plugins team.
 * 
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not
 * use this file except in compliance with the License. You may obtain a copy of
 * the License at
 * 
 * http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
 * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 * License for the specific language governing permissions and limitations under
 * the License.
 */
package gwtquery.plugins.droppable.client.gwtsimplesample;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.core.client.GWT;
import com.google.gwt.dom.client.Style.Cursor;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.resources.client.ClientBundle;
import com.google.gwt.resources.client.CssResource;
import com.google.gwt.resources.client.ImageResource;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.Grid;
import com.google.gwt.user.client.ui.Image;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.Widget;
import com.google.gwt.user.client.ui.HTMLTable.CellFormatter;

import gwtquery.plugins.draggable.client.DraggableOptions.RevertOption;
import gwtquery.plugins.draggable.client.gwt.DraggableWidget;
import gwtquery.plugins.droppable.client.events.DropEvent;
import gwtquery.plugins.droppable.client.events.DropEvent.DropEventHandler;
import gwtquery.plugins.droppable.client.gwt.DroppableWidget;

/**
 * Example showing how it is easy to add drag and drop functionality to GWT
 * Widget
 * 
 * @author Julien Dramaix (julien.dramaix@gmail.com)
 * 
 */
public class GwtSimpleSample implements EntryPoint {

    interface Css extends CssResource {
        String droppableHover();

        String trashBin();

        String resetButton();
    }

    interface Resources extends ClientBundle {
        Resources INSTANCE = GWT.create(Resources.class);

        @Source("style.css")
        Css css();

        ImageResource gwtLogo();
    }

    public void onModuleLoad() {

        Resources.INSTANCE.css().ensureInjected();

        RootPanel.get("grid").add(createImageGrid());
        RootPanel.get("trashBin").add(createTrashBin());

        addResetButton();

    }

    private void addResetButton() {
        Button resetButton = new Button("Reset");
        resetButton.addStyleName(Resources.INSTANCE.css().resetButton());
        resetButton.addClickHandler(new ClickHandler() {
            public void onClick(ClickEvent event) {
                RootPanel.get("grid").clear();
                RootPanel.get("trashBin").clear();
                onModuleLoad();
            }
        });

        RootPanel.get("trashBin").add(resetButton);

    }

    private Widget createDraggableImage() {
        Image gwtLogo = new Image(Resources.INSTANCE.gwtLogo());
        // make the imgae draggable
        DraggableWidget<Image> draggableLogo = new DraggableWidget<Image>(gwtLogo);
        // revert the image to its initial position if no drop
        draggableLogo.setRevert(RevertOption.ON_INVALID_DROP);
        // ensure that dragging image is above the others during drag operation
        draggableLogo.setDraggingZIndex(100);
        // set the cursor during the drag operation
        draggableLogo.setDraggingCursor(Cursor.MOVE);
        return draggableLogo;
    }

    /**
     * Create a 5x5 grid. Each cell contains a draggable gwt logo.
     * 
     * @return
     */
    private Widget createImageGrid() {

        Grid grid = new Grid(5, 5);
        CellFormatter cellFormatter = grid.getCellFormatter();

        int numRows = grid.getRowCount();
        int numColumns = grid.getColumnCount();

        for (int row = 0; row < numRows; row++) {
            for (int col = 0; col < numColumns; col++) {
                //add draggable logo
                grid.setWidget(row, col, createDraggableImage());

                //add size to cell in order to keep place when image will be removed
                cellFormatter.setHeight(row, col, "50px");
                cellFormatter.setWidth(row, col, "61px");
            }
        }

        return grid;
    }

    /**
     * Simply create a {@link Label} and make it droppable
     * 
     * @return
     */
    private Widget createTrashBin() {

        final Label trashBinLabel = new Label("Feed me !");
        trashBinLabel.addStyleName(Resources.INSTANCE.css().trashBin());

        // make the label droppable
        DroppableWidget<Label> trashBin = new DroppableWidget<Label>(trashBinLabel);
        // specify wich class has to be used when a draggable widget is over the
        // droppable
        trashBin.setDroppableHoverClass(Resources.INSTANCE.css().droppableHover());
        // add a drop handler
        trashBin.addDropHandler(new DropEventHandler() {

            int counter = 0;

            public void onDrop(DropEvent event) {
                Widget droppedImage = event.getDraggableWidget();
                droppedImage.removeFromParent();
                counter++;
                trashBinLabel.setText("I ate " + counter + " image" + (counter > 1 ? "s" : ""));

            }
        });

        // return the droppable widget
        return trashBin;
    }

}