2 * Ext JS Library 2.2.1
\r
3 * Copyright(c) 2006-2009, Ext JS, LLC.
\r
4 * licensing@extjs.com
\r
6 * http://extjs.com/license
\r
10 * @class Ext.grid.GridDragZone
\r
11 * @extends Ext.dd.DragZone
\r
12 * <p>A customized implementation of a {@link Ext.dd.DragZone DragZone} which provides default implementations of two of the
\r
13 * template methods of DragZone to enable dragging of the selected rows of a GridPanel.</p>
\r
14 * <p>A cooperating {@link Ext.dd.DropZone DropZone} must be created who's template method implementations of
\r
15 * {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
\r
16 * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop}</p> are able
\r
17 * to process the {@link #getDragData data} which is provided.
\r
19 Ext.grid.GridDragZone = function(grid, config){
\r
20 this.view = grid.getView();
\r
21 Ext.grid.GridDragZone.superclass.constructor.call(this, this.view.mainBody.dom, config);
\r
22 if(this.view.lockedBody){
\r
23 this.setHandleElId(Ext.id(this.view.mainBody.dom));
\r
24 this.setOuterHandleElId(Ext.id(this.view.lockedBody.dom));
\r
26 this.scroll = false;
\r
28 this.ddel = document.createElement('div');
\r
29 this.ddel.className = 'x-grid-dd-wrap';
\r
32 Ext.extend(Ext.grid.GridDragZone, Ext.dd.DragZone, {
\r
36 * <p>The provided implementation of the getDragData method which collects the data to be dragged from the GridPanel on mousedown.</p>
\r
37 * <p>This data is available for processing in the {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
\r
38 * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop} methods of a cooperating {@link Ext.dd.DropZone DropZone}.</p>
\r
39 * <p>The data object contains the following properties:<ul>
\r
40 * <li><b>grid</b> : Ext.Grid.GridPanel<div class="sub-desc">The GridPanel from which the data is being dragged.</div></li>
\r
41 * <li><b>ddel</b> : htmlElement<div class="sub-desc">An htmlElement which provides the "picture" of the data being dragged.</div></li>
\r
42 * <li><b>rowIndex</b> : Number<div class="sub-desc">The index of the row which receieved the mousedown gesture which triggered the drag.</div></li>
\r
43 * <li><b>selections</b> : Array<div class="sub-desc">An Array of the selected Records which are being dragged from the GridPanel.</div></li>
\r
46 getDragData : function(e){
\r
47 var t = Ext.lib.Event.getTarget(e);
\r
48 var rowIndex = this.view.findRowIndex(t);
\r
49 if(rowIndex !== false){
\r
50 var sm = this.grid.selModel;
\r
51 if(!sm.isSelected(rowIndex) || e.hasModifier()){
\r
52 sm.handleMouseDown(this.grid, rowIndex, e);
\r
54 return {grid: this.grid, ddel: this.ddel, rowIndex: rowIndex, selections:sm.getSelections()};
\r
60 * <p>The provided implementation of the onInitDrag method. Sets the <tt>innerHTML</tt> of the drag proxy which provides the "picture"
\r
61 * of the data being dragged.</p>
\r
62 * <p>The <tt>innerHTML</tt> data is found by calling the owning GridPanel's {@link Ext.grid.GridPanel#getDragDropText getDragDropText}.</p>
\r
64 onInitDrag : function(e){
\r
65 var data = this.dragData;
\r
66 this.ddel.innerHTML = this.grid.getDragDropText();
\r
67 this.proxy.update(this.ddel);
\r
72 * An empty immplementation. Implement this to provide behaviour after a repair of an invalid drop. An implementation might highlight
\r
73 * the selected rows to show that they have not been dragged.
\r
75 afterRepair : function(){
\r
76 this.dragging = false;
\r
80 * <p>An empty implementation. Implement this to provide coordinates for the drag proxy to slide back to after an invalid drop.</p>
\r
81 * <p>Called before a repair of an invalid drop to get the XY to animate to.</p>
\r
82 * @param {EventObject} e The mouse up event
\r
83 * @return {Array} The xy location (e.g. [100, 200])
\r
85 getRepairXY : function(e, data){
\r
89 onEndDrag : function(data, e){
\r
93 onValidDrop : function(dd, e, id){
\r
98 beforeInvalidDrop : function(e, id){
\r