Browse Source

WIP: Automatically scroll drop target Grid

grid_dnd_autoscroller
Pekka Hyvönen 7 years ago
parent
commit
2564f40dee

+ 51
- 0
client/src/main/java/com/vaadin/client/connectors/grid/GridDropTargetConnector.java View File

@@ -29,6 +29,9 @@ import com.vaadin.client.WidgetUtil;
import com.vaadin.client.extensions.DropTargetExtensionConnector;
import com.vaadin.client.widget.escalator.RowContainer;
import com.vaadin.client.widget.escalator.RowContainer.BodyRowContainer;
import com.vaadin.client.widget.grid.AutoScroller;
import com.vaadin.client.widget.grid.AutoScroller.AutoScrollerCallback;
import com.vaadin.client.widget.grid.AutoScroller.ScrollAxis;
import com.vaadin.client.widgets.Escalator;
import com.vaadin.shared.MouseEventDetails;
import com.vaadin.shared.Range;
@@ -92,6 +95,11 @@ public class GridDropTargetConnector extends DropTargetExtensionConnector {
*/
private Element latestTargetElement;

private AutoScroller autoScroller;
private int pageY;

private double timeStamp;

@Override
protected void extend(ServerConnector target) {
gridConnector = (GridConnector) target;
@@ -145,6 +153,7 @@ public class GridDropTargetConnector extends DropTargetExtensionConnector {
* drop target element
* @param event
* drop event
* @return the drop location
*/
protected DropLocation getDropLocation(Element target, NativeEvent event) {
if (TableRowElement.is(target)) {
@@ -190,6 +199,19 @@ public class GridDropTargetConnector extends DropTargetExtensionConnector {
super.onDragEnter(event);
}

@Override
protected void onDragOver(Event event) {
super.onDragOver(event);

int pageY = WidgetUtil.getTouchOrMouseClientY((NativeEvent) event);
double timeStamp = event.getTimeStamp();
if (this.pageY != pageY && ((timeStamp - this.timeStamp > 150))) {
autoScroller.updatePointerCoordinates(0, pageY);
this.pageY = pageY;
this.timeStamp = timeStamp;
}
}

@Override
protected void addDragOverStyle(NativeEvent event) {
Element targetElement = getTargetElement(
@@ -215,6 +237,13 @@ public class GridDropTargetConnector extends DropTargetExtensionConnector {
targetElement.addClassName(className);
currentStyleName = className;
}

// initialize auto scroller
if (autoScroller == null) {
autoScroller = new AutoScroller(gridConnector.getWidget());
autoScroller.start(event, ScrollAxis.VERTICAL,
new NooplAutoScrollerCallback(), false);
}
}

private String getTargetClassName(Element target, NativeEvent event) {
@@ -245,6 +274,11 @@ public class GridDropTargetConnector extends DropTargetExtensionConnector {
Element targetElement = getTargetElement(
(Element) event.getEventTarget().cast());
removeStyles(targetElement);

if (autoScroller != null) {
autoScroller.stop();
autoScroller = null;
}
}

private void removeStyles(Element element) {
@@ -332,4 +366,21 @@ public class GridDropTargetConnector extends DropTargetExtensionConnector {
public GridDropTargetState getState() {
return (GridDropTargetState) super.getState();
}

private final class NooplAutoScrollerCallback
implements AutoScrollerCallback {

@Override
public void onAutoScroll(int scrollDiff) {
}

@Override
public void onAutoScrollReachedMin() {
}

@Override
public void onAutoScrollReachedMax() {
}

}
}

+ 49
- 3
client/src/main/java/com/vaadin/client/widget/grid/AutoScroller.java View File

@@ -15,6 +15,9 @@
*/
package com.vaadin.client.widget.grid;

import java.util.Date;
import java.util.logging.Logger;

import com.google.gwt.animation.client.AnimationScheduler;
import com.google.gwt.animation.client.AnimationScheduler.AnimationCallback;
import com.google.gwt.animation.client.AnimationScheduler.AnimationHandle;
@@ -123,7 +126,9 @@ public class AutoScroller {
}

case Event.ONTOUCHMOVE:
event.cancel();
if (cancelEvent) {
event.cancel();
}
break;

case Event.ONTOUCHEND:
@@ -331,6 +336,8 @@ public class AutoScroller {

public void updatePointerCoords(int pageX, int pageY) {
final int pageCordinate;
Logger.getLogger("UPDATE").warning("X:" + pageX + " Y:" + pageY
+ " time:" + new Date().getTime());
if (scrollDirection == ScrollAxis.VERTICAL) {
pageCordinate = pageY;
} else {
@@ -447,6 +454,8 @@ public class AutoScroller {

private AutoScrollerCallback callback;

private boolean cancelEvent;

/**
* Creates a new instance for scrolling the given grid.
*
@@ -469,12 +478,32 @@ public class AutoScroller {
*/
public void start(final NativeEvent startEvent, ScrollAxis scrollAxis,
AutoScrollerCallback callback) {
start(startEvent, scrollAxis, callback, true);
}

/**
* Starts the automatic scrolling detection.
*
* @param startEvent
* the event that starts the automatic scroll
* @param scrollAxis
* the axis along which the scrolling should happen
* @param callback
* the callback for getting info about the automatic scrolling
* @param cancelEvent
* should auto scroller cancel the native events or not
*/
public void start(final NativeEvent startEvent, ScrollAxis scrollAxis,
AutoScrollerCallback callback, boolean cancelEvent) {
scrollDirection = scrollAxis;
this.callback = callback;
this.cancelEvent = cancelEvent;
injectNativeHandler();
start();
startEvent.preventDefault();
startEvent.stopPropagation();
if (cancelEvent) {
startEvent.preventDefault();
startEvent.stopPropagation();
}
}

/**
@@ -645,4 +674,21 @@ public class AutoScroller {
return grid.getScrollHeight() - getTfootElement().getOffsetHeight()
- getTheadElement().getOffsetHeight();
}

/**
* Update the current page coordinates.
* <p>
* This method exists if there is no onmousemove or ontouchmove events
* happening, but the automatic scrolling should still be happening. This
* can be the case when e.g. HTML5 DnD is used (no onmousemove fired).
*
* @param pageX
* the page X coordinate
* @param pageY
* the page Y coordinate
* @since 8.1
*/
public void updatePointerCoordinates(int pageX, int pageY) {
autoScroller.updatePointerCoords(pageX, pageY);
}
}

Loading…
Cancel
Save