Java tutorial
/* * 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.contactcellsample; import com.google.gwt.cell.client.AbstractCell; import com.google.gwt.core.client.EntryPoint; import com.google.gwt.core.client.GWT; import com.google.gwt.resources.client.ClientBundle; import com.google.gwt.resources.client.ImageResource; import com.google.gwt.safehtml.shared.SafeHtmlBuilder; import com.google.gwt.user.cellview.client.CellList; import com.google.gwt.user.cellview.client.HasKeyboardPagingPolicy.KeyboardPagingPolicy; import com.google.gwt.user.client.ui.AbstractImagePrototype; import com.google.gwt.user.client.ui.RootPanel; import com.google.gwt.view.client.SelectionChangeEvent; import com.google.gwt.view.client.SingleSelectionModel; import gwtquery.plugins.draggable.client.DraggableOptions; import gwtquery.plugins.draggable.client.DraggableOptions.HelperType; import gwtquery.plugins.droppable.client.DroppableOptions.AcceptFunction; import gwtquery.plugins.droppable.client.contactcellsample.ContactDatabase.Category; import gwtquery.plugins.droppable.client.contactcellsample.ContactDatabase.ContactInfo; import gwtquery.plugins.droppable.client.events.DragAndDropContext; import gwtquery.plugins.droppable.client.events.DropEvent; import gwtquery.plugins.droppable.client.events.DropEvent.DropEventHandler; import gwtquery.plugins.droppable.client.gwt.DragAndDropCellList; import gwtquery.plugins.droppable.client.gwt.DroppableWidget; /** * This example shows how to implement drag and drop in CellList. * * Just use {@link DragAndDropCellList} instead of {@link CellList} * * @author Julien Dramaix (julien.dramaix@gmail.com) * */ public class ContactCellSample implements EntryPoint { /** * The images used for this example. */ static interface Images extends ClientBundle { public Images INSTANCE = GWT.create(Images.class); ImageResource contact(); } /** * The Cell used to render a {@link ContactInfo}. Code coming from the GWT * showcase * */ private static class ContactCell extends AbstractCell<ContactInfo> { /** * The html of the image used for contacts. * */ private final String imageHtml; public ContactCell(ImageResource image) { this.imageHtml = AbstractImagePrototype.create(image).getHTML(); } @Override public void render(Context ctx, ContactInfo value, SafeHtmlBuilder sb) { // Value can be null, so do a null check.. if (value == null) { return; } sb.appendHtmlConstant("<table>"); // Add the contact image. sb.appendHtmlConstant("<tr><td rowspan='3'><div>"); sb.appendHtmlConstant(imageHtml); sb.appendHtmlConstant("</div></td>"); // Add the name and address. sb.appendHtmlConstant("<td style='font-size:95%;'>"); sb.appendEscaped(value.getFullName()); sb.appendHtmlConstant("</td></tr><tr><td>"); sb.appendEscaped(value.getAddress()); sb.appendHtmlConstant("</td></tr></table>"); } } /** * Object handling the drop event. * * @author Julien Dramaix (julien.dramaix@gmail.com) * */ private class DropHandler implements DropEventHandler { @SuppressWarnings("unchecked") public void onDrop(DropEvent event) { // retrieve the category linked to panel where the draggable was dropped. DroppableWidget<ShowMorePagerPanel> droppabelWidget = (DroppableWidget<ShowMorePagerPanel>) event .getDroppableWidget(); ShowMorePagerPanel dropPanel = droppabelWidget.getOriginalWidget(); Category dropCategory = dropPanel.getCategory(); // retrieve the ContactInfo associated with the draggable element ContactInfo draggedContact = event.getDraggableData(); Category oldCategory = draggedContact.getCategory(); if (oldCategory == dropCategory) { return; } // change the category of the contact that was being dragged and prevent // the data source. draggedContact.setCategory(dropCategory); ContactDatabase.get().moveContact(draggedContact, oldCategory); contactForm.setContact(draggedContact); } } /* * Form displaying info of the selected contact */ private ContactInfoForm contactForm; public void onModuleLoad() { // add the contact form contactForm = new ContactInfoForm(); RootPanel.get("contactForm").add(contactForm); // add the 4 lists for the 4 different categories RootPanel.get("cell").add(createList(Category.OTHERS)); RootPanel.get("cell").add(createList(Category.FAMILY)); RootPanel.get("cell").add(createList(Category.FRIENDS)); RootPanel.get("cell").add(createList(Category.BUSINESS)); } private DraggableOptions createDraggableOptions() { DraggableOptions options = new DraggableOptions(); // use a clone of the original cell as drag helper options.setHelper(HelperType.CLONE); // set the opacity of the drag helper options.setOpacity((float) 0.9); // append the drag helper to the body element options.setAppendTo("body"); return options; } /** * Code coming from GWT showcase. * * We just use a {@link DragAndDropCellList} instead of a {@link CellList} and * make the pager panel droppable. * * @param contactForm * * @return */ private DroppableWidget<ShowMorePagerPanel> createList(final Category category) { // Create a ConcactCel ContactCell contactCell = new ContactCell(Images.INSTANCE.contact()); // Create a drag and drop cell list DragAndDropCellList<ContactInfo> cellList = new DragAndDropCellList<ContactInfo>(contactCell, ContactDatabase.ContactInfo.KEY_PROVIDER); // The cell of this cell list are only draggable cellList.setCellDraggableOnly(); // setup the drag operation cellList.setDraggableOptions(createDraggableOptions()); cellList.setPageSize(30); cellList.setKeyboardPagingPolicy(KeyboardPagingPolicy.INCREASE_RANGE); final SingleSelectionModel<ContactInfo> selectionModel = new SingleSelectionModel<ContactInfo>( ContactDatabase.ContactInfo.KEY_PROVIDER); cellList.setSelectionModel(selectionModel); selectionModel.addSelectionChangeHandler(new SelectionChangeEvent.Handler() { public void onSelectionChange(SelectionChangeEvent event) { contactForm.setContact(selectionModel.getSelectedObject()); } }); ContactDatabase.get().addDataDisplay(cellList, category); ShowMorePagerPanel pagerPanel = new ShowMorePagerPanel(category); pagerPanel.setDisplay(cellList); // make the pager panel droppable. DroppableWidget<ShowMorePagerPanel> droppabelPanel = new DroppableWidget<ShowMorePagerPanel>(pagerPanel); // setup the drop operation droppabelPanel.setDroppableHoverClass("orange-border"); droppabelPanel.setActiveClass("yellow-border"); droppabelPanel.addDropHandler(new DropHandler()); // use an AcceptFunction to accept only draggable coming from an other panel droppabelPanel.setAccept(new AcceptFunction() { public boolean acceptDrop(DragAndDropContext ctx) { //retrieve the dragging ContactInfo ContactInfo draggedContact = ctx.getDraggableData(); Category dragCategory = draggedContact.getCategory(); // accept only contact coming from an other panel. return dragCategory != category; } }); return droppabelPanel; } }