/** * @private */Ext.define('Ext.grid.plugin.grouping.DragZone', { extend: 'Ext.dd.DragZone', groupColumnSelector: '.' + Ext.baseCSSPrefix + 'grid-group-column', groupColumnInnerSelector: '.' + Ext.baseCSSPrefix + 'grid-group-column-inner', maxProxyWidth: 120, dragging: false, constructor: function(panel) { var me = this; me.panel = panel; me.ddGroup = me.getDDGroup(); me.callParent([panel.el]); }, getDDGroup: function() { // return the column header dd group so we can allow column // dropping inside the grouping panel return 'header-dd-zone-' + this.panel.up('[scrollerOwner]').id; }, getDragData: function(e) { var header, headerCmp, headerCol, ddel; if (e.getTarget(this.groupColumnInnerSelector)) { header = e.getTarget(this.groupColumnSelector); if (header) { headerCmp = Ext.getCmp(header.id); headerCol = Ext.getCmp(headerCmp.idColumn); if (!this.panel.dragging) { ddel = document.createElement('div'); ddel.innerHTML = headerCmp.getHeader(); return { ddel: ddel, header: headerCol, groupcol: headerCmp }; } } } return false; }, onBeforeDrag: function() { return !(this.panel.dragging || this.disabled); }, onInitDrag: function() { this.panel.dragging = true; this.callParent(arguments); }, onDragDrop: function() { var me = this, dropCol, groupCol; if (!me.dragData.dropLocation) { me.panel.dragging = false; me.callParent(arguments); return; } /* when a column is dragged out from the grouping panel we have to do the following: 1. remove the column from grouping panel 2. adjust the grid groupers */ dropCol = me.dragData.dropLocation.header; groupCol = me.dragData.groupcol; if (dropCol.isColumn) { me.panel.removeColumn(groupCol); } me.panel.dragging = false; me.callParent(arguments); }, afterRepair: function() { this.callParent(); this.panel.dragging = false; }, getRepairXY: function() { return this.dragData.header.el.getXY(); }, disable: function() { this.disabled = true; }, enable: function() { this.disabled = false; } });