PreviewPlugin.js 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. /**
  2. * @class Ext.ux.PreviewPlugin
  3. * @extends Ext.AbstractPlugin
  4. *
  5. * The Preview enables you to show a configurable preview of a record.
  6. *
  7. * This plugin assumes that it has control over the features used for this
  8. * particular grid section and may conflict with other plugins.
  9. *
  10. * @alias plugin.preview
  11. * @ptype preview
  12. */
  13. Ext.define('Ext.ux.PreviewPlugin', {
  14. extend: 'Ext.AbstractPlugin',
  15. alias: 'plugin.preview',
  16. requires: ['Ext.grid.feature.RowBody', 'Ext.grid.feature.RowWrap'],
  17. // private, css class to use to hide the body
  18. hideBodyCls: 'x-grid-row-body-hidden',
  19. /**
  20. * @cfg {String} bodyField
  21. * Field to display in the preview. Must me a field within the Model definition
  22. * that the store is using.
  23. */
  24. bodyField: '',
  25. /**
  26. * @cfg {Boolean} previewExpanded
  27. */
  28. previewExpanded: true,
  29. constructor: function(config) {
  30. this.callParent(arguments);
  31. var bodyField = this.bodyField,
  32. hideBodyCls = this.hideBodyCls,
  33. section = this.getCmp();
  34. section.previewExpanded = this.previewExpanded;
  35. section.features = [{
  36. ftype: 'rowbody',
  37. getAdditionalData: function(data, idx, record, orig, view) {
  38. var o = Ext.grid.feature.RowBody.prototype.getAdditionalData.apply(this, arguments);
  39. Ext.apply(o, {
  40. rowBody: data[bodyField],
  41. rowBodyCls: section.previewExpanded ? '' : hideBodyCls
  42. });
  43. return o;
  44. }
  45. },{
  46. ftype: 'rowwrap'
  47. }];
  48. },
  49. /**
  50. * Toggle between the preview being expanded/hidden
  51. * @param {Boolean} expanded Pass true to expand the record and false to not show the preview.
  52. */
  53. toggleExpanded: function(expanded) {
  54. var view = this.getCmp();
  55. this.previewExpanded = view.previewExpanded = expanded;
  56. view.refresh();
  57. }
  58. });