1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>The source code</title>
<link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="../resources/prettify/prettify.js"></script>
</head>
<body onload="prettyPrint();">
<pre class="prettyprint lang-js">/*!
* Ext JS Library 3.4.0
* Copyright(c) 2006-2011 Sencha Inc.
* licensing@sencha.com
* http://www.sencha.com/license
*/
<div id="cls-Ext.grid.GridDragZone"></div>/**
* @class Ext.grid.GridDragZone
* @extends Ext.dd.DragZone
* <p>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.</p>
* <p>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}</p> 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",
<div id="method-Ext.grid.GridDragZone-getDragData"></div>/**
* <p>The provided implementation of the getDragData method which collects the data to be dragged from the GridPanel on mousedown.</p>
* <p>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}.</p>
* <p>The data object contains the following properties:<ul>
* <li><b>grid</b> : Ext.Grid.GridPanel<div class="sub-desc">The GridPanel from which the data is being dragged.</div></li>
* <li><b>ddel</b> : htmlElement<div class="sub-desc">An htmlElement which provides the "picture" of the data being dragged.</div></li>
* <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>
* <li><b>selections</b> : Array<div class="sub-desc">An Array of the selected Records which are being dragged from the GridPanel.</div></li>
* </ul></p>
*/
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;
},
<div id="method-Ext.grid.GridDragZone-onInitDrag"></div>/**
* <p>The provided implementation of the onInitDrag method. Sets the <tt>innerHTML</tt> of the drag proxy which provides the "picture"
* of the data being dragged.</p>
* <p>The <tt>innerHTML</tt> data is found by calling the owning GridPanel's {@link Ext.grid.GridPanel#getDragDropText getDragDropText}.</p>
*/
onInitDrag : function(e){
var data = this.dragData;
this.ddel.innerHTML = this.grid.getDragDropText();
this.proxy.update(this.ddel);
// fire start drag?
},
<div id="method-Ext.grid.GridDragZone-afterRepair"></div>/**
* 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;
},
<div id="method-Ext.grid.GridDragZone-getRepairXY"></div>/**
* <p>An empty implementation. Implement this to provide coordinates for the drag proxy to slide back to after an invalid drop.</p>
* <p>Called before a repair of an invalid drop to get the XY to animate to.</p>
* @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){
}
});
</pre>
</body>
</html>
|
