docs/source/GridDD.html

   1 <html>
   2 <head>
   3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   4   <title>The source code</title>
   5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
   6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
   7 </head>
   8 <body  onload="prettyPrint();">
   9     <pre class="prettyprint lang-js">/*!
  10  * Ext JS Library 3.3.1
  11  * Copyright(c) 2006-2010 Sencha Inc.
  12  * licensing@sencha.com
  13  * http://www.sencha.com/license
  14  */
  15 <div id="cls-Ext.grid.GridDragZone"></div>/**
  16  * @class Ext.grid.GridDragZone
  17  * @extends Ext.dd.DragZone
  18  * <p>A customized implementation of a {@link Ext.dd.DragZone DragZone} which provides default implementations of two of the
  19  * template methods of DragZone to enable dragging of the selected rows of a GridPanel.</p>
  20  * <p>A cooperating {@link Ext.dd.DropZone DropZone} must be created who's template method implementations of
  21  * {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
  22  * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop}</p> are able
  23  * to process the {@link #getDragData data} which is provided.
  24  */
  25 Ext.grid.GridDragZone = function(grid, config){
  26     this.view = grid.getView();
  27     Ext.grid.GridDragZone.superclass.constructor.call(this, this.view.mainBody.dom, config);
  28     this.scroll = false;
  29     this.grid = grid;
  30     this.ddel = document.createElement('div');
  31     this.ddel.className = 'x-grid-dd-wrap';
  32 };
  33
  34 Ext.extend(Ext.grid.GridDragZone, Ext.dd.DragZone, {
  35     ddGroup : "GridDD",
  36
  37     <div id="method-Ext.grid.GridDragZone-getDragData"></div>/**
  38      * <p>The provided implementation of the getDragData method which collects the data to be dragged from the GridPanel on mousedown.</p>
  39      * <p>This data is available for processing in the {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},
  40      * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop} methods of a cooperating {@link Ext.dd.DropZone DropZone}.</p>
  41      * <p>The data object contains the following properties:<ul>
  42      * <li><b>grid</b> : Ext.Grid.GridPanel<div class="sub-desc">The GridPanel from which the data is being dragged.</div></li>
  43      * <li><b>ddel</b> : htmlElement<div class="sub-desc">An htmlElement which provides the "picture" of the data being dragged.</div></li>
  44      * <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>
  45      * <li><b>selections</b> : Array<div class="sub-desc">An Array of the selected Records which are being dragged from the GridPanel.</div></li>
  46      * </ul></p>
  47      */
  48     getDragData : function(e){
  49         var t = Ext.lib.Event.getTarget(e);
  50         var rowIndex = this.view.findRowIndex(t);
  51         if(rowIndex !== false){
  52             var sm = this.grid.selModel;
  53             if(!sm.isSelected(rowIndex) || e.hasModifier()){
  54                 sm.handleMouseDown(this.grid, rowIndex, e);
  55             }
  56             return {grid: this.grid, ddel: this.ddel, rowIndex: rowIndex, selections:sm.getSelections()};
  57         }
  58         return false;
  59     },
  60
  61     <div id="method-Ext.grid.GridDragZone-onInitDrag"></div>/**
  62      * <p>The provided implementation of the onInitDrag method. Sets the <tt>innerHTML</tt> of the drag proxy which provides the "picture"
  63      * of the data being dragged.</p>
  64      * <p>The <tt>innerHTML</tt> data is found by calling the owning GridPanel's {@link Ext.grid.GridPanel#getDragDropText getDragDropText}.</p>
  65      */
  66     onInitDrag : function(e){
  67         var data = this.dragData;
  68         this.ddel.innerHTML = this.grid.getDragDropText();
  69         this.proxy.update(this.ddel);
  70         // fire start drag?
  71     },
  72
  73     <div id="method-Ext.grid.GridDragZone-afterRepair"></div>/**
  74      * An empty immplementation. Implement this to provide behaviour after a repair of an invalid drop. An implementation might highlight
  75      * the selected rows to show that they have not been dragged.
  76      */
  77     afterRepair : function(){
  78         this.dragging = false;
  79     },
  80
  81     <div id="method-Ext.grid.GridDragZone-getRepairXY"></div>/**
  82      * <p>An empty implementation. Implement this to provide coordinates for the drag proxy to slide back to after an invalid drop.</p>
  83      * <p>Called before a repair of an invalid drop to get the XY to animate to.</p>
  84      * @param {EventObject} e The mouse up event
  85      * @return {Array} The xy location (e.g. [100, 200])
  86      */
  87     getRepairXY : function(e, data){
  88         return false;
  89     },
  90
  91     onEndDrag : function(data, e){
  92         // fire end drag?
  93     },
  94
  95     onValidDrop : function(dd, e, id){
  96         // fire drag drop?
  97         this.hideProxy();
  98     },
  99
 100     beforeInvalidDrop : function(e, id){
 101
 102     }
 103 });
 104 </pre>
 105 </body>
 106 </html>