curzonj / ext-extensions

Personal extensions for the Ext 2.0.2 framework

This URL has Read+Write access

ext-extensions / dd.js
100644 111 lines (98 sloc) 2.879 kb
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
107
108
109
110
111
/*globals Ext, SWorks */
/*jslint glovar: true, undef: true, nomen: true */
 
Ext.namespace('Ext.ux.grid');
 
Ext.override(Ext.dd.DragDrop, {
  // This allows multiple things lock/unlock with a
  // little overlap, and they won't break each other
  lock: function(key) {
    this.lockKey = key;
    this.locked = true;
  },
  unlock: function(key) {
    if(!key || key == this.lockKey) {
      this.locked = false;
    }
  }
});
 
Ext.ux.grid.RowReorderDD = function(grid, config) {
  config = config || {};
  Ext.applyIf(config, {
    ddGroup: grid.ddGroup
  });
 
  Ext.apply(this, config);
  this.grid = grid;
 
  var gridEl = grid.getGridEl();
  if(gridEl) {
    this.lazyInit();
  } else {
    grid.on('render', this.lazyInit, this);
  }
};
Ext.extend(Ext.ux.grid.RowReorderDD, Ext.dd.DropZone, {
  lazyInit: function() {
    var dom = this.grid.getGridEl().dom;
    Ext.ux.grid.RowReorderDD.superclass.constructor.call(this, dom);
 
    this.view = this.grid.getView();
 
    // By registering on the grid's el, we get it's id
    // by default which conflicts with the header reorder DD id
    this.id = Ext.id();
    // Now reregister with our new id
    Ext.dd.DDM.regDragDrop(this, this.ddGroup);
  },
 
  getTargetFromEvent: function(e) {
    var t = Ext.lib.Event.getTarget(e);
    return this.view.findRow(t);
  },
  setHighlight: function(n, side) {
    if(side == 'top') {
      Ext.fly(n).
        addClass('sw-row-insert-top').
        removeClass('sw-row-insert-bottom');
    } else if(side == 'bottom') {
      Ext.fly(n).
        addClass('sw-row-insert-bottom').
        removeClass('sw-row-insert-top');
    } else {
      Ext.fly(n).
        removeClass('sw-row-insert-top').
        removeClass('sw-row-insert-bottom');
    }
  },
  onNodeOver: function(n, dd, e, data) {
    if(n.rowIndex == data.rowIndex) {
      return this.dropNotAllowed;
    }
 
    var y = Ext.lib.Event.getPageY(e);
    var r = Ext.lib.Dom.getRegion(n);
    if((r.bottom - y) <= (r.bottom-r.top)/2){
      if(n.rowIndex == data.rowIndex-1) {
        this.setHighlight(n, false);
        return this.dropNotAllowed;
      } else {
        this.setHighlight(n, 'bottom');
      }
    }else{
      if(n.rowIndex == data.rowIndex+1) {
        this.setHighlight(n, false);
        return this.dropNotAllowed;
      } else {
        this.setHighlight(n, 'top');
      }
    }
 
    return this.dropAllowed;
  },
  onNodeOut: function(n, dd, e, data) {
    this.setHighlight(n, false);
  },
  onRowChange: function(oldIndex, newIndex) {},
  onNodeDrop: function(n, dd, e, data) {
    if(n.rowIndex != data.rowIndex) {
      var y = Ext.lib.Event.getPageY(e);
      var r = Ext.lib.Dom.getRegion(n);
      var oldIndex = data.rowIndex;
      var newIndex = n.rowIndex + (((r.bottom - y) <= (r.bottom-r.top)/2) ? 1 : 0);
 
      this.onRowChange(oldIndex, newIndex);
    }
 
    return false;
  }
});