/*! * Ext JS Library 3.0.0 * Copyright(c) 2006-2009 Ext JS, LLC * licensing@extjs.com * http://www.extjs.com/license */ /** * @class Ext.grid.GridDragZone * @extends Ext.dd.DragZone *

A customized implementation of a {@link Ext.dd.DragZone DragZone} which provides default implementations of two of the * template methods of DragZone to enable dragging of the selected rows of a GridPanel.

*

A cooperating {@link Ext.dd.DropZone DropZone} must be created who's template method implementations of * {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver}, * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop}

are able * to process the {@link #getDragData data} which is provided. */ Ext.grid.GridDragZone = function(grid, config){ this.view = grid.getView(); Ext.grid.GridDragZone.superclass.constructor.call(this, this.view.mainBody.dom, config); this.scroll = false; this.grid = grid; this.ddel = document.createElement('div'); this.ddel.className = 'x-grid-dd-wrap'; }; Ext.extend(Ext.grid.GridDragZone, Ext.dd.DragZone, { ddGroup : "GridDD", /** *

The provided implementation of the getDragData method which collects the data to be dragged from the GridPanel on mousedown.

*

This data is available for processing in the {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver}, * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop} methods of a cooperating {@link Ext.dd.DropZone DropZone}.

*

The data object contains the following properties:

*/ getDragData : function(e){ var t = Ext.lib.Event.getTarget(e); var rowIndex = this.view.findRowIndex(t); if(rowIndex !== false){ var sm = this.grid.selModel; if(!sm.isSelected(rowIndex) || e.hasModifier()){ sm.handleMouseDown(this.grid, rowIndex, e); } return {grid: this.grid, ddel: this.ddel, rowIndex: rowIndex, selections:sm.getSelections()}; } return false; }, /** *

The provided implementation of the onInitDrag method. Sets the innerHTML of the drag proxy which provides the "picture" * of the data being dragged.

*

The innerHTML data is found by calling the owning GridPanel's {@link Ext.grid.GridPanel#getDragDropText getDragDropText}.

*/ onInitDrag : function(e){ var data = this.dragData; this.ddel.innerHTML = this.grid.getDragDropText(); this.proxy.update(this.ddel); // fire start drag? }, /** * An empty immplementation. Implement this to provide behaviour after a repair of an invalid drop. An implementation might highlight * the selected rows to show that they have not been dragged. */ afterRepair : function(){ this.dragging = false; }, /** *

An empty implementation. Implement this to provide coordinates for the drag proxy to slide back to after an invalid drop.

*

Called before a repair of an invalid drop to get the XY to animate to.

* @param {EventObject} e The mouse up event * @return {Array} The xy location (e.g. [100, 200]) */ getRepairXY : function(e, data){ return false; }, onEndDrag : function(data, e){ // fire end drag? }, onValidDrop : function(dd, e, id){ // fire drag drop? this.hideProxy(); }, beforeInvalidDrop : function(e, id){ } });