Proxy.js 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. /**
  2. * A custom drag proxy implementation specific to {@link Ext.panel.Panel}s. This class
  3. * is primarily used internally for the Panel's drag drop implementation, and
  4. * should never need to be created directly.
  5. * @private
  6. */
  7. Ext.define('Ext.panel.Proxy', {
  8. alternateClassName: 'Ext.dd.PanelProxy',
  9. /**
  10. * @cfg {Boolean} [moveOnDrag=true]
  11. * True to move the panel to the dragged position when dropped
  12. */
  13. moveOnDrag: true,
  14. /**
  15. * Creates new panel proxy.
  16. * @param {Ext.panel.Panel} panel The {@link Ext.panel.Panel} to proxy for
  17. * @param {Object} [config] Config object
  18. */
  19. constructor: function(panel, config){
  20. var me = this;
  21. /**
  22. * @property panel
  23. * @type Ext.panel.Panel
  24. */
  25. me.panel = panel;
  26. me.id = me.panel.id +'-ddproxy';
  27. Ext.apply(me, config);
  28. },
  29. /**
  30. * @cfg {Boolean} insertProxy
  31. * True to insert a placeholder proxy element while dragging the panel, false to drag with no proxy.
  32. * Most Panels are not absolute positioned and therefore we need to reserve this space.
  33. */
  34. insertProxy: true,
  35. // private overrides
  36. setStatus: Ext.emptyFn,
  37. reset: Ext.emptyFn,
  38. update: Ext.emptyFn,
  39. stop: Ext.emptyFn,
  40. sync: Ext.emptyFn,
  41. /**
  42. * Gets the proxy's element
  43. * @return {Ext.Element} The proxy's element
  44. */
  45. getEl: function(){
  46. return this.ghost.el;
  47. },
  48. /**
  49. * Gets the proxy's ghost Panel
  50. * @return {Ext.panel.Panel} The proxy's ghost Panel
  51. */
  52. getGhost: function(){
  53. return this.ghost;
  54. },
  55. /**
  56. * Gets the proxy element. This is the element that represents where the
  57. * Panel was before we started the drag operation.
  58. * @return {Ext.Element} The proxy's element
  59. */
  60. getProxy: function(){
  61. return this.proxy;
  62. },
  63. /**
  64. * Hides the proxy
  65. */
  66. hide : function(){
  67. var me = this;
  68. if (me.ghost) {
  69. if (me.proxy) {
  70. me.proxy.remove();
  71. delete me.proxy;
  72. }
  73. // Unghost the Panel, do not move the Panel to where the ghost was
  74. me.panel.unghost(null, me.moveOnDrag);
  75. delete me.ghost;
  76. }
  77. },
  78. /**
  79. * Shows the proxy
  80. */
  81. show: function(){
  82. var me = this,
  83. panelSize;
  84. if (!me.ghost) {
  85. panelSize = me.panel.getSize();
  86. me.panel.el.setVisibilityMode(Ext.Element.DISPLAY);
  87. me.ghost = me.panel.ghost();
  88. if (me.insertProxy) {
  89. // bc Panels aren't absolute positioned we need to take up the space
  90. // of where the panel previously was
  91. me.proxy = me.panel.el.insertSibling({cls: Ext.baseCSSPrefix + 'panel-dd-spacer'});
  92. me.proxy.setSize(panelSize);
  93. }
  94. }
  95. },
  96. // private
  97. repair: function(xy, callback, scope) {
  98. this.hide();
  99. Ext.callback(callback, scope || this);
  100. },
  101. /**
  102. * Moves the proxy to a different position in the DOM. This is typically
  103. * called while dragging the Panel to keep the proxy sync'd to the Panel's
  104. * location.
  105. * @param {HTMLElement} parentNode The proxy's parent DOM node
  106. * @param {HTMLElement} [before] The sibling node before which the
  107. * proxy should be inserted. Defaults to the parent's last child if not
  108. * specified.
  109. */
  110. moveProxy : function(parentNode, before){
  111. if (this.proxy) {
  112. parentNode.insertBefore(this.proxy.dom, before);
  113. }
  114. }
  115. });