PortalPanel.js 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. /**
  2. * @class Ext.app.PortalPanel
  3. * @extends Ext.panel.Panel
  4. * A {@link Ext.panel.Panel Panel} class used for providing drag-drop-enabled portal layouts.
  5. */
  6. Ext.define('Ext.app.PortalPanel', {
  7. extend: 'Ext.panel.Panel',
  8. alias: 'widget.portalpanel',
  9. requires: [
  10. 'Ext.layout.container.Column',
  11. 'Ext.app.PortalDropZone',
  12. 'Ext.app.PortalColumn'
  13. ],
  14. cls: 'x-portal',
  15. bodyCls: 'x-portal-body',
  16. defaultType: 'portalcolumn',
  17. autoScroll: true,
  18. manageHeight: false,
  19. initComponent : function() {
  20. var me = this;
  21. // Implement a Container beforeLayout call from the layout to this Container
  22. this.layout = {
  23. type : 'column'
  24. };
  25. this.callParent();
  26. this.addEvents({
  27. validatedrop: true,
  28. beforedragover: true,
  29. dragover: true,
  30. beforedrop: true,
  31. drop: true
  32. });
  33. },
  34. // Set columnWidth, and set first and last column classes to allow exact CSS targeting.
  35. beforeLayout: function() {
  36. var items = this.layout.getLayoutItems(),
  37. len = items.length,
  38. firstAndLast = ['x-portal-column-first', 'x-portal-column-last'],
  39. i, item, last;
  40. for (i = 0; i < len; i++) {
  41. item = items[i];
  42. item.columnWidth = 1 / len;
  43. last = (i == len-1);
  44. if (!i) { // if (first)
  45. if (last) {
  46. item.addCls(firstAndLast);
  47. } else {
  48. item.addCls('x-portal-column-first');
  49. item.removeCls('x-portal-column-last');
  50. }
  51. } else if (last) {
  52. item.addCls('x-portal-column-last');
  53. item.removeCls('x-portal-column-first');
  54. } else {
  55. item.removeCls(firstAndLast);
  56. }
  57. }
  58. return this.callParent(arguments);
  59. },
  60. // private
  61. initEvents : function(){
  62. this.callParent();
  63. this.dd = Ext.create('Ext.app.PortalDropZone', this, this.dropConfig);
  64. },
  65. // private
  66. beforeDestroy : function() {
  67. if (this.dd) {
  68. this.dd.unreg();
  69. }
  70. this.callParent();
  71. }
  72. });