modx.panel.chunk.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358
  1. /**
  2. * @class MODx.panel.Chunk
  3. * @extends MODx.FormPanel
  4. * @param {Object} config An object of configuration properties
  5. * @xtype modx-panel-chunk
  6. */
  7. MODx.panel.Chunk = function(config) {
  8. config = config || {};
  9. config.record = config.record || {};
  10. config = MODx.setStaticElementsConfig(config, 'chunk');
  11. Ext.applyIf(config,{
  12. url: MODx.config.connector_url
  13. ,baseParams: {
  14. action: 'element/chunk/get'
  15. }
  16. ,id: 'modx-panel-chunk'
  17. ,cls: 'container form-with-labels'
  18. ,class_key: 'modChunk'
  19. ,chunk: ''
  20. ,bodyStyle: ''
  21. ,items: [{
  22. html: _('chunk_new')
  23. ,id: 'modx-chunk-header'
  24. ,xtype: 'modx-header'
  25. },MODx.getPageStructure([{
  26. title: _('chunk_title')
  27. ,defaults: { border: false ,msgTarget: 'side' }
  28. ,layout: 'form'
  29. ,id: 'modx-chunk-form'
  30. ,labelWidth: 150
  31. ,items: [{
  32. html: '<p>'+_('chunk_msg')+'</p>'
  33. ,id: 'modx-chunk-msg'
  34. ,xtype: 'modx-description'
  35. },{
  36. layout: 'column'
  37. ,border: false
  38. ,defaults: {
  39. layout: 'form'
  40. ,labelAlign: 'top'
  41. ,anchor: '100%'
  42. ,border: false
  43. ,cls:'main-wrapper'
  44. ,labelSeparator: ''
  45. }
  46. ,items: [{
  47. columnWidth: .6
  48. ,items: [{
  49. xtype: 'hidden'
  50. ,name: 'id'
  51. ,id: 'modx-chunk-id'
  52. ,value: config.record.id || MODx.request.id
  53. },{
  54. xtype: 'hidden'
  55. ,name: 'props'
  56. ,id: 'modx-chunk-props'
  57. ,value: config.record.props || null
  58. },{
  59. xtype: 'textfield'
  60. ,fieldLabel: _('name')+'<span class="required">*</span>'
  61. ,description: MODx.expandHelp ? '' : _('chunk_desc_name')
  62. ,name: 'name'
  63. ,id: 'modx-chunk-name'
  64. ,anchor: '100%'
  65. ,maxLength: 255
  66. ,enableKeyEvents: true
  67. ,allowBlank: false
  68. ,value: config.record.name
  69. ,listeners: {
  70. 'keyup': {scope:this,fn:function(f,e) {
  71. var title = Ext.util.Format.stripTags(f.getValue());
  72. title = _('chunk')+': '+Ext.util.Format.htmlEncode(title);
  73. if (MODx.request.a !== 'element/chunk/create' && MODx.perm.tree_show_element_ids === 1) {
  74. title += ' <small>('+this.config.record.id+')</small>';
  75. }
  76. Ext.getCmp('modx-chunk-header').getEl().update(title);
  77. MODx.setStaticElementPath('chunk');
  78. }}
  79. }
  80. },{
  81. xtype: MODx.expandHelp ? 'label' : 'hidden'
  82. ,forId: 'modx-chunk-name'
  83. ,html: _('chunk_desc_name')
  84. ,cls: 'desc-under'
  85. },{
  86. xtype: 'textarea'
  87. ,fieldLabel: _('description')
  88. ,description: MODx.expandHelp ? '' : _('chunk_desc_description')
  89. ,name: 'description'
  90. ,id: 'modx-chunk-description'
  91. ,anchor: '100%'
  92. ,maxLength: 255
  93. ,value: config.record.description
  94. },{
  95. xtype: MODx.expandHelp ? 'label' : 'hidden'
  96. ,forId: 'modx-chunk-description'
  97. ,html: _('chunk_desc_description')
  98. ,cls: 'desc-under'
  99. },{
  100. xtype: 'modx-combo-browser'
  101. ,browserEl: 'modx-browser'
  102. ,fieldLabel: _('static_file')
  103. ,description: MODx.expandHelp ? '' : _('static_file_msg')
  104. ,name: 'static_file'
  105. // ,hideFiles: true
  106. ,source: config.record.source != null ? config.record.source : MODx.config.default_media_source
  107. ,openTo: config.record.openTo || ''
  108. ,id: 'modx-chunk-static-file'
  109. ,triggerClass: 'x-form-code-trigger'
  110. ,anchor: '100%'
  111. ,maxLength: 255
  112. ,value: config.record.static_file || ''
  113. ,hidden: !config.record['static']
  114. ,hideMode: 'offsets'
  115. ,validator: function(value){
  116. if (Ext.getCmp('modx-chunk-static').getValue() === true) {
  117. if (Ext.util.Format.trim(value) != '') {
  118. return true;
  119. } else {
  120. return _('static_file_ns');
  121. }
  122. }
  123. return true;
  124. }
  125. },{
  126. xtype: MODx.expandHelp ? 'label' : 'hidden'
  127. ,forId: 'modx-chunk-static-file'
  128. ,id: 'modx-chunk-static-file-help'
  129. ,html: _('static_file_msg')
  130. ,cls: 'desc-under'
  131. ,hidden: !config.record['static']
  132. ,hideMode: 'offsets'
  133. },{
  134. html: MODx.onChunkFormRender
  135. ,border: false
  136. }]
  137. },{
  138. columnWidth: .4
  139. ,items: [{
  140. xtype: 'modx-combo-category'
  141. ,fieldLabel: _('category')
  142. ,description: MODx.expandHelp ? '' : _('chunk_desc_category')
  143. ,name: 'category'
  144. ,id: 'modx-chunk-category'
  145. ,anchor: '100%'
  146. ,value: config.record.category || 0
  147. ,listeners: {
  148. 'afterrender': {scope:this,fn:function(f,e) {
  149. setTimeout(function(){
  150. MODx.setStaticElementPath('chunk');
  151. }, 200);
  152. }}
  153. ,'change': {scope:this,fn:function(f,e) {
  154. MODx.setStaticElementPath('chunk');
  155. }}
  156. }
  157. },{
  158. xtype: MODx.expandHelp ? 'label' : 'hidden'
  159. ,forId: 'modx-chunk-category'
  160. ,html: _('chunk_desc_category')
  161. ,cls: 'desc-under'
  162. },{
  163. xtype: 'xcheckbox'
  164. ,boxLabel: _('chunk_lock')
  165. ,description: MODx.expandHelp ? '' : _('chunk_lock_msg')
  166. ,name: 'locked'
  167. ,id: 'modx-chunk-locked'
  168. ,inputValue: true
  169. ,checked: config.record.locked || 0
  170. },{
  171. xtype: 'xcheckbox'
  172. ,boxLabel: _('clear_cache_on_save')
  173. ,description: MODx.expandHelp ? '' : _('clear_cache_on_save_msg')
  174. ,hideLabel: true
  175. ,name: 'clearCache'
  176. ,id: 'modx-chunk-clear-cache'
  177. ,inputValue: 1
  178. ,checked: Ext.isDefined(config.record.clearCache) || true
  179. },{
  180. xtype: 'xcheckbox'
  181. ,hideLabel: true
  182. ,boxLabel: _('is_static')
  183. ,description: MODx.expandHelp ? '' : _('is_static_msg')
  184. ,name: 'static'
  185. ,id: 'modx-chunk-static'
  186. ,inputValue: 1
  187. ,checked: config.record['static'] || false
  188. },{
  189. xtype: MODx.expandHelp ? 'label' : 'hidden'
  190. ,forId: 'modx-chunk-static'
  191. ,id: 'modx-chunk-static-help'
  192. ,html: _('is_static_msg')
  193. ,cls: 'desc-under'
  194. },{
  195. xtype: 'modx-combo-source'
  196. ,fieldLabel: _('static_source')
  197. ,description: MODx.expandHelp ? '' : _('static_source_msg')
  198. ,name: 'source'
  199. ,id: 'modx-chunk-static-source'
  200. ,anchor: '100%'
  201. ,maxLength: 255
  202. ,value: config.record.source != null ? config.record.source : MODx.config.default_media_source
  203. ,hidden: !config.record['static']
  204. ,hideMode: 'offsets'
  205. ,baseParams: {
  206. action: 'source/getList'
  207. ,showNone: true
  208. ,streamsOnly: true
  209. }
  210. ,listeners: {
  211. select: {
  212. fn: this.changeSource
  213. ,scope: this
  214. }
  215. }
  216. },{
  217. xtype: MODx.expandHelp ? 'label' : 'hidden'
  218. ,forId: 'modx-chunk-static-source'
  219. ,id: 'modx-chunk-static-source-help'
  220. ,html: _('static_source_msg')
  221. ,cls: 'desc-under'
  222. ,hidden: !config.record['static']
  223. ,hideMode: 'offsets'
  224. }]
  225. }]
  226. },{
  227. xtype: 'panel'
  228. ,border: false
  229. ,layout: 'form'
  230. ,cls:'main-wrapper'
  231. ,labelAlign: 'top'
  232. ,items: [{
  233. xtype: 'textarea'
  234. ,fieldLabel: _('chunk_code')
  235. ,name: 'snippet'
  236. ,id: 'modx-chunk-snippet'
  237. ,anchor: '100%'
  238. ,height: 400
  239. ,value: config.record.snippet || ''
  240. }]
  241. }]
  242. },{
  243. xtype: 'modx-panel-element-properties'
  244. ,elementPanel: 'modx-panel-chunk'
  245. ,elementId: config.chunk
  246. ,elementType: 'modChunk'
  247. ,record: config.record
  248. }],{
  249. id: 'modx-chunk-tabs'
  250. })]
  251. ,useLoadingMask: true
  252. ,listeners: {
  253. 'setup': {fn:this.setup,scope:this}
  254. ,'success': {fn:this.success,scope:this}
  255. ,'beforeSubmit': {fn:this.beforeSubmit,scope:this}
  256. ,'failureSubmit': {
  257. fn: function () {
  258. this.showErroredTab(['modx-chunk-form'], 'modx-chunk-tabs')
  259. },
  260. scope: this
  261. }
  262. }
  263. });
  264. MODx.panel.Chunk.superclass.constructor.call(this,config);
  265. var isStatic = Ext.getCmp('modx-chunk-static');
  266. if (isStatic) { isStatic.on('check',this.toggleStaticFile); }
  267. };
  268. Ext.extend(MODx.panel.Chunk,MODx.FormPanel,{
  269. initialized: false
  270. ,setup: function() {
  271. if (this.initialized) { this.clearDirty(); return true; }
  272. this.getForm().setValues(this.config.record);
  273. if (!Ext.isEmpty(this.config.record.name)) {
  274. var title = _('chunk')+': '+this.config.record.name;
  275. if (MODx.perm.tree_show_element_ids === 1) {
  276. title = title+ ' <small>('+this.config.record.id+')</small>';
  277. }
  278. Ext.getCmp('modx-chunk-header').getEl().update(title);
  279. }
  280. if (!Ext.isEmpty(this.config.record.properties)) {
  281. var d = this.config.record.properties;
  282. var g = Ext.getCmp('modx-grid-element-properties');
  283. if (g) {
  284. g.defaultProperties = d;
  285. g.getStore().loadData(d);
  286. }
  287. }
  288. this.fireEvent('ready',this.config.record);
  289. if (MODx.onLoadEditor) { MODx.onLoadEditor(this); }
  290. this.clearDirty();
  291. this.initialized = true;
  292. MODx.fireEvent('ready');
  293. return true;
  294. }
  295. /**
  296. * Set the browser window "media source" source
  297. */
  298. ,changeSource: function() {
  299. var browser = Ext.getCmp('modx-chunk-static-file')
  300. ,source = Ext.getCmp('modx-chunk-static-source').getValue();
  301. browser.config.source = source;
  302. }
  303. ,beforeSubmit: function(o) {
  304. this.cleanupEditor();
  305. Ext.apply(o.form.baseParams,{
  306. propdata: Ext.getCmp('modx-grid-element-properties').encode()
  307. });
  308. return this.fireEvent('save',{
  309. values: this.getForm().getValues()
  310. ,stay: MODx.config.stay
  311. });
  312. }
  313. ,success: function(r) {
  314. if (MODx.request.id) Ext.getCmp('modx-grid-element-properties').save();
  315. this.getForm().setValues(r.result.object);
  316. var c = Ext.getCmp('modx-chunk-category').getValue();
  317. var n = c !== '' && c !== null && c != 0 ? 'n_chunk_category_'+c : 'n_type_chunk';
  318. var t = Ext.getCmp('modx-tree-element');
  319. if (t) {
  320. var node = t.getNodeById('n_chunk_element_' + Ext.getCmp('modx-chunk-id').getValue() + '_' + r.result.object.previous_category);
  321. if (node) node.destroy();
  322. t.refreshNode(n,true);
  323. }
  324. }
  325. ,cleanupEditor: function() {
  326. if (MODx.onSaveEditor) {
  327. var fld = Ext.getCmp('modx-chunk-snippet');
  328. MODx.onSaveEditor(fld);
  329. }
  330. }
  331. ,toggleStaticFile: function(cb) {
  332. var flds = ['modx-chunk-static-file','modx-chunk-static-file-help','modx-chunk-static-source','modx-chunk-static-source-help'];
  333. var fld,i;
  334. if (cb.checked) {
  335. for (i in flds) {
  336. fld = Ext.getCmp(flds[i]);
  337. if (fld) { fld.show(); }
  338. }
  339. } else {
  340. for (i in flds) {
  341. fld = Ext.getCmp(flds[i]);
  342. if (fld) { fld.hide(); }
  343. }
  344. }
  345. }
  346. });
  347. Ext.reg('modx-panel-chunk',MODx.panel.Chunk);