Pman.Dialog.BAdminImageManager.bjs
[Pman.BAdmin] / Pman.Dialog.BAdminImageManager.bjs
1 {
2  "name" : "Pman.Dialog.BAdminImageManager",
3  "parent" : "",
4  "title" : "Pman.Dialog.BAdminImageManager",
5  "path" : "/home/edward/gitlive/Pman.BAdmin/Pman.Dialog.BAdminImageManager.bjs",
6  "permname" : "",
7  "modOrder" : "001",
8  "strings" : {
9   "ef797d5638c2e1c6b6225b2247541ea5" : "Upload Image or File:",
10   "d9787032e54a7facd5c7b1db2ae61c7b" : "Image Manager",
11   "53ab4599d0106e32d015649175a70d7b" : "<i class=\"fa fa-filter\"></i> Filter",
12   "37c1097cf82226d511586ecd99ed97cf" : "search for image",
13   "cdb6b6bab1fd18b9dbfe3fb84a5d34ae" : "<i class=\"fa fa-search\"></i>",
14   "5350277f16d9998c57fa7e1d17be2a76" : "<i class=\"fa fa-upload\"></i> Upload Image",
15   "14834a16229091f47cf1810177d07916" : "Created Date:",
16   "1a0ce561842e3caef9098f46ecaa1dcf" : "Add Images with Settings",
17   "78d0f5aac952e2ce840a381976a3b01e" : "Image Details",
18   "708ea0e601087e73c4764d5086e3ea3c" : "File Name:",
19   "e0a53da57dd79cca5d3b6a7c42e463ef" : "File Type:",
20   "3f986fa4066f6bded1376eb69de18da2" : "File Size:",
21   "179d4ab94c43ccb7cd6d2b3d82c7fe1f" : "Show images for this email",
22   "d3d2e617335f08df83599665eef8a418" : "Close",
23   "84378f54966381befd040dafbdc221d6" : "<i class=\"fa fa-plus\"></i> Add into the email",
24   "361bacb1a72a350ee34e2f31a6a91dab" : "Alignment:",
25   "2cd3a1900dd0060540b418b2a60f6eec" : "Show all images",
26   "ed807858fcb68abdd180481f1fcba5c5" : "<i class=\"fa fa-trash\"></i> Delete",
27   "031fa343a28d221a25d2bcd942437174" : "Alternate Text:",
28   "48ccf48dcf2218a413ce473262f21a0c" : "Width: ",
29   "d0042a700e9bdf79689d63ee6846dc0e" : "Description:",
30   "d6d93f0d6b7c6018d8949e73ed6efb6c" : "<i class=\"fa fa-save\"></i> Save Changes",
31   "e933dc24fb245d863a43b4fefe9b45f5" : "Height:"
32  },
33  "named_strings" : {
34   "align_fieldLabel" : "361bacb1a72a350ee34e2f31a6a91dab",
35   "filename_fieldLabel" : "708ea0e601087e73c4764d5086e3ea3c",
36   "add_html" : "84378f54966381befd040dafbdc221d6",
37   "created_fieldLabel" : "14834a16229091f47cf1810177d07916",
38   "height_fieldLabel" : "e933dc24fb245d863a43b4fefe9b45f5",
39   "mimetype_fieldLabel" : "e0a53da57dd79cca5d3b6a7c42e463ef",
40   "close_html" : "d3d2e617335f08df83599665eef8a418",
41   "imageUpload_fieldLabel" : "ef797d5638c2e1c6b6225b2247541ea5",
42   "width_fieldLabel" : "48ccf48dcf2218a413ce473262f21a0c",
43   "filesize_fieldLabel" : "3f986fa4066f6bded1376eb69de18da2",
44   "descript_fieldLabel" : "d0042a700e9bdf79689d63ee6846dc0e"
45  },
46  "items" : [
47   {
48    "listeners" : {
49     "resize" : "function (_self)\n{\n    if (_this.dialog && _this.container && _this.toolbar) {\n        \n        _this.document_container.el.setHeight(\n            _this.dialog.bodyEl.getHeight() -\n            _this.dialog.headerEl.getHeight() -\n            _this.toolbar.el.dom.offsetHeight -\n            _this.dialog.footerEl.getHeight()\n        );\n        \n    }\n}"
50    },
51    "String cls" : "modal-body-enable-overflow-y pman-badmin-image-manager",
52    "Boolean fitwindow" : true,
53    "xtype" : "Modal",
54    "$ xns" : "Roo.bootstrap",
55    "String title" : "Image Manager",
56    "items" : [
57     {
58      "listeners" : {
59       "click" : "function (_self, e)\n{\n    _this.dialog.hide();\n}"
60      },
61      "xtype" : "Button",
62      "$ xns" : "Roo.bootstrap",
63      "String html" : "Close",
64      "string weight" : "default",
65      "* prop" : "buttons[]",
66      "string name" : "close"
67     },
68     {
69      "xtype" : "Row",
70      "$ xns" : "Roo.bootstrap",
71      "items" : [
72       {
73        "xtype" : "Column",
74        "$ xns" : "Roo.bootstrap",
75        "Number sm" : 8,
76        "items" : [
77         {
78          "listeners" : {
79           "actionfailed" : "function (_self, action)\n{\n    if (action.type == 'submit') {\n        Roo.log(\"Upload error\");\n        Roo.log(action);\n        \n        try {\n            \n            Roo.MessageBox.alert(\"Error\", action.result.errorMsg.split(/\\n/).join('<BR/>'));\n            \n        } catch(e) {\n            \n            Roo.MessageBox.alert(\"Error\", \"Saving failed = fix errors and try again\");\n        }\n        return;\n    }\n    \n    Roo.MessageBox.alert(\"Error\", \"Error loading details\"); \n}",
80           "actioncomplete" : "function(_self,action)\n{\n    if (action.type == 'setdata') { \n        \n        _this.showType = 'public';\n        \n        this.url = _this.data._url ? baseURL + _this.data._url : baseURL + '/Roo/Images.php';\n        \n        this.el.dom.action = this.url;\n        \n        if (typeof(_this.data.timeout) != 'undefined') {\n            this.timeout = _this.data.timeout;\n        }\n        \n        this.findField('UPLOAD_IDENTIFIER').setValue(\n            (new Date() * 1) + '' + Math.random());\n        \n        _this.masonry.load();\n        \n        return;\n    }\n     \n   \n    if (action.type == 'load') {\n        \n        _this.data = action.result.data;\n        \n        return;\n    }\n    \n    \n    if (action.type == 'submit') { // only submitted here if we are \n        \n        _this.masonry.load();\n        \n        return; \n    }\n \n\n    \n}\n",
81           "render" : "function (_self)\n{\n    _this.form = this;\n    \n}"
82          },
83          "style" : "display: none;",
84          "xtype" : "Form",
85          "Number timeout" : 300,
86          "$ xns" : "Roo.bootstrap",
87          "Boolean fileUpload" : true,
88          "String method" : "POST",
89          "$ String url" : "baseURL + '/Roo/Images.php'",
90          "items" : [
91           {
92            "listeners" : {
93             "render" : "function (_self)\n{\n    _this.uploadDL = this;\n    \n    _this.uploadDL.inputEl().on(\"change\",function(){\n        \n        _this.form.findField('onid').setValue((_this.showType == 'private') ? _this.data.onid : 0);\n        _this.form.doAction('submit');\n        \n        //_this.dialog.uploadProgress.defer(1000, _this.dialog);\n    });\n    \n    \n}"
94            },
95            "String name" : "imageUpload",
96            "xtype" : "Input",
97            "string fieldLabel" : "Upload Image or File:",
98            "String inputType" : "file",
99            "$ xns" : "Roo.bootstrap",
100            "Number labelWidth" : 4
101           },
102           {
103            "String name" : "UPLOAD_IDENTIFIER",
104            "xtype" : "Input",
105            "String inputType" : "hidden",
106            "$ xns" : "Roo.bootstrap"
107           },
108           {
109            "String name" : "post_max_size",
110            "xtype" : "Input",
111            "String inputType" : "hidden",
112            "$ xns" : "Roo.bootstrap"
113           },
114           {
115            "String name" : "upload_max_filesize",
116            "xtype" : "Input",
117            "String inputType" : "hidden",
118            "$ xns" : "Roo.bootstrap"
119           },
120           {
121            "String name" : "ontable",
122            "xtype" : "Input",
123            "String inputType" : "hidden",
124            "$ xns" : "Roo.bootstrap"
125           },
126           {
127            "String name" : "onid",
128            "xtype" : "Input",
129            "String inputType" : "hidden",
130            "$ xns" : "Roo.bootstrap"
131           },
132           {
133            "String name" : "id",
134            "xtype" : "Input",
135            "String inputType" : "hidden",
136            "$ xns" : "Roo.bootstrap"
137           }
138          ]
139         },
140         {
141          "listeners" : {
142           "render" : "function (_self)\n{\n    _this.container = this;\n    \n}"
143          },
144          "String cls" : "col-md-12",
145          "xtype" : "Container",
146          "$ xns" : "Roo.bootstrap",
147          "items" : [
148           {
149            "listeners" : {
150             "render" : "function (_self)\n{\n    _this.toolbar = this;\n}"
151            },
152            "xtype" : "Row",
153            "$ xns" : "Roo.bootstrap",
154            "items" : [
155             {
156              "Number md" : 6,
157              "xtype" : "Column",
158              "$ xns" : "Roo.bootstrap",
159              "items" : [
160               {
161                "xtype" : "Button",
162                "$ xns" : "Roo.bootstrap",
163                "String html" : "<i class=\"fa fa-filter\"></i> Filter",
164                "String style" : "float:left;",
165                "items" : [
166                 {
167                  "xtype" : "Menu",
168                  "$ xns" : "Roo.bootstrap",
169                  "* prop" : "menu",
170                  "items" : [
171                   {
172                    "listeners" : {
173                     "click" : "function (_self, e)\n{\n    _this.showType = 'private';\n    \n    _this.masonry.load();\n}"
174                    },
175                    "Boolean preventDefault" : true,
176                    "xtype" : "MenuItem",
177                    "$ xns" : "Roo.bootstrap",
178                    "Boolean isContainer" : false,
179                    "String html" : "Show images for this email"
180                   },
181                   {
182                    "listeners" : {
183                     "click" : "function (_self, e)\n{\n    _this.showType = 'public';\n    \n    _this.masonry.load();\n}"
184                    },
185                    "Boolean preventDefault" : true,
186                    "xtype" : "MenuItem",
187                    "$ xns" : "Roo.bootstrap",
188                    "Boolean isContainer" : false,
189                    "String html" : "Show all images"
190                   }
191                  ]
192                 }
193                ]
194               },
195               {
196                "listeners" : {
197                 "specialkey" : "function (_self, e)\n{    \n    \n    var image_name = \"\";\n    \n    if(e.keyCode == e.ENTER) {\n        _this.masonry.clearAll();\n        _this.masonry.load();\n    \n    }\n}",
198                 "render" : "function (_self)\n{\n    _this.searchBox = this;\n}"
199                },
200                "xtype" : "Input",
201                "string placeholder" : "search for image",
202                "$ xns" : "Roo.bootstrap",
203                "String style" : "float:left; width: 300px; margin-left: 15px;",
204                "items" : [
205                 {
206                  "listeners" : {
207                   "click" : "function (_self, e)\n{\n    _this.masonry.clearAll();\n    _this.masonry.load();\n}"
208                  },
209                  "xtype" : "Button",
210                  "$ xns" : "Roo.bootstrap",
211                  "String html" : "<i class=\"fa fa-search\"></i>",
212                  "* prop" : "after"
213                 }
214                ]
215               }
216              ]
217             },
218             {
219              "Number md" : 6,
220              "String cls" : "text-right",
221              "xtype" : "Column",
222              "$ xns" : "Roo.bootstrap",
223              "items" : [
224               {
225                "listeners" : {
226                 "click" : "function (_self, e)\n{\n    var id = _this.data.onid;\n    \n    if(id*1 < 1){\n        Roo.MessageBox.alert('Error', 'Please save the email template first');\n        return;\n    }\n    \n    _this.uploadDL.inputEl().dom.click();\n}"
227                },
228                "xtype" : "Button",
229                "$ xns" : "Roo.bootstrap",
230                "String html" : "<i class=\"fa fa-upload\"></i> Upload Image",
231                "string weight" : "primary"
232               },
233               {
234                "listeners" : {
235                 "render" : "function (_self)\n{\n    _this.deleteBtn = this;\n    \n    this.hide();\n}",
236                 "click" : "function (_self, e)\n{\n    if (_this.masonry.getSelected().length > 1) {\n        Roo.bootstrap.MessageBox.alert('Cannot delete the images !','Please select one image only');\n        return;\n    }\n    \n    if (_this.masonry.getSelected().length < 1) {\n        Roo.bootstrap.MessageBox.alert('Cannot delete any image!', 'Please select an image');\n        return;\n    }\n    \n    Roo.bootstrap.MessageBox.confirm(\"Confirm\", \"Are sure you want to delete this image?\", function (v){\n        if (v != 'yes') {\n            return;\n        }\n        \n        new Pman.Request({\n            url : baseURL + '/Roo/Images.php',\n            method: 'POST',\n            params : {\n                _delete : Roo.bootstrap.MasonryBrick.get(_this.masonry.getSelected()[0]).imageObj.id\n            },\n            success : function()\n            {\n//                _this.masonry.removeBrick(_this.masonry.getSelected()[0]);\n                _this.masonry.load();\n            }\n        });\n    });\n}"
237                },
238                "String weight" : "default",
239                "xtype" : "Button",
240                "$ xns" : "Roo.bootstrap",
241                "String html" : "<i class=\"fa fa-trash\"></i> Delete",
242                "String style" : "margin-left: 15px; float:right;"
243               }
244              ]
245             }
246            ]
247           },
248           {
249            "listeners" : {
250             "render" : "function (_self)\n{\n    _this.document_container = this;\n    \n    this.el.setStyle('overflow', 'auto');\n}"
251            },
252            "xtype" : "Row",
253            "$ xns" : "Roo.bootstrap",
254            "String style" : "margin-top: 15px;",
255            "items" : [
256             {
257              "Number md" : 12,
258              "xtype" : "Column",
259              "$ xns" : "Roo.bootstrap",
260              "items" : [
261               {
262                "listeners" : {
263                 "render" : "function (_self)\n{\n    _this.masonry = this;\n    \n}"
264                },
265                "Boolean isLayoutInstant" : false,
266                "| function load" : "function() \n{\n    _this.setting_form.reset();\n    _this.detail_form.reset();\n    \n    _this.setting_form.hide();\n    _this.detail_form.hide();\n    \n    _this.masonry.clearAll();\n    \n    new Pman.Request({\n        url: baseURL + '/Roo/Images',\n        method: 'GET',\n        params: {\n            ontable : 'core_email',\n            onid : (_this.showType == 'private') ? _this.data.onid : 0,\n            'search[filename]' : _this.searchBox.getValue()\n        },\n        success: function(ret) {\n            \n            if(!ret.data.length){\n                return;\n            }\n            \n            Roo.each(ret.data, function(r){\n                \n                _this.masonry.addBrick({\n                    size: 'md',\n                    boxWidth: 150,\n                    cls: 'coba-image-mgmt-masonry-brick',\n                    active: false,\n                    activeClass: 'active',\n                    preventDefault: true,\n                    bgimage : baseURL + '/Images/' + r.id + '/' + r.filename.replace('%', '-'),\n                    imageObj: r,\n                    listeners : {\n                        click : function (_self)\n                        {\n                            _this.setting_form.reset();\n                            _this.detail_form.reset();\n                            \n                            _this.setting_form.hide();\n                            _this.detail_form.hide();\n                            \n                            _this.deleteBtn.hide();\n                            \n                            if(!this.isSelected()){\n                                return;\n                            }\n                            \n                            if(_this.masonry.getSelected().length == 1){\n                                _this.deleteBtn.show();\n                            }\n                            \n                            new Pman.Request({\n                                url: baseURL + '/Roo/Images.php',\n                                method : 'GET',\n                                params : {\n                                    _id: _self.imageObj.id\n                                }, \n                                success : function(rr) {\n                                    \n                                    _this.setting_form.show();\n                                    _this.detail_form.show();\n                                    \n                                    _this.detail_form.setValues(rr.data);\n                                    _this.setting_form.setValues(rr.data);\n                                    \n                                    _this.setting_form.findField('align').setValue(\"left\");\n                                    \n                                    _self.imageObj = rr.data;\n                                }\n                            });\n                            \n                        }\n                     }\n                })\n                \n            });\n            \n            _this.masonry.initial();\n            \n         },\n         \n         failure: function(res) {\n             Roo.log('cannot read Coba/Roo/Images');\n         }\n     });\n}",
267                "Number boxWidth" : 250,
268                "xtype" : "LayoutMasonry",
269                "$ xns" : "Roo.bootstrap",
270                "string activeClass" : "active",
271                "Boolean isAutoInitial" : false
272               }
273              ]
274             }
275            ]
276           }
277          ]
278         }
279        ]
280       },
281       {
282        "xtype" : "Column",
283        "$ xns" : "Roo.bootstrap",
284        "Number sm" : 4,
285        "items" : [
286         {
287          "xtype" : "Row",
288          "$ xns" : "Roo.bootstrap",
289          "items" : [
290           {
291            "Number md" : 12,
292            "xtype" : "Column",
293            "$ xns" : "Roo.bootstrap",
294            "items" : [
295             {
296              "listeners" : {
297               "render" : "function (_self)\n{\n    _this.setting_form = this;\n}"
298              },
299              "$ string url" : "baseURL + '/Roo/Images'\n",
300              "xtype" : "Form",
301              "$ xns" : "Roo.bootstrap",
302              "Boolean loadMask" : true,
303              "items" : [
304               {
305                "String header" : "Add Images with Settings",
306                "$ String panel" : "'default'",
307                "xtype" : "Container",
308                "$ xns" : "Roo.bootstrap",
309                "String style" : "width: 100%;",
310                "items" : [
311                 {
312                  "xtype" : "Row",
313                  "$ xns" : "Roo.bootstrap",
314                  "items" : [
315                   {
316                    "Number md" : 12,
317                    "xtype" : "Column",
318                    "$ xns" : "Roo.bootstrap",
319                    "items" : [
320                     {
321                      "String name" : "descript",
322                      "xtype" : "Input",
323                      "string fieldLabel" : "Alternate Text:",
324                      "cls" : "row-style",
325                      "$ xns" : "Roo.bootstrap",
326                      "Number labelWidth" : 4
327                     }
328                    ]
329                   }
330                  ]
331                 },
332                 {
333                  "xtype" : "Row",
334                  "$ xns" : "Roo.bootstrap",
335                  "items" : [
336                   {
337                    "Number md" : 12,
338                    "xtype" : "Column",
339                    "$ xns" : "Roo.bootstrap",
340                    "String style" : "margin-top:15px;",
341                    "items" : [
342                     {
343                      "String name" : "height",
344                      "xtype" : "Input",
345                      "string fieldLabel" : "Height:",
346                      "cls" : "row-style",
347                      "$ xns" : "Roo.bootstrap",
348                      "Number labelWidth" : 4
349                     }
350                    ]
351                   }
352                  ]
353                 },
354                 {
355                  "xtype" : "Row",
356                  "$ xns" : "Roo.bootstrap",
357                  "items" : [
358                   {
359                    "Number md" : 12,
360                    "xtype" : "Column",
361                    "$ xns" : "Roo.bootstrap",
362                    "String style" : "margin-top:15px;",
363                    "items" : [
364                     {
365                      "String name" : "width",
366                      "xtype" : "Input",
367                      "string fieldLabel" : "Width: ",
368                      "cls" : "row-style",
369                      "$ xns" : "Roo.bootstrap",
370                      "Number labelWidth" : 4
371                     }
372                    ]
373                   }
374                  ]
375                 },
376                 {
377                  "xtype" : "Row",
378                  "$ xns" : "Roo.bootstrap",
379                  "items" : [
380                   {
381                    "Number md" : 12,
382                    "xtype" : "Column",
383                    "$ xns" : "Roo.bootstrap",
384                    "String style" : "margin-top:15px;",
385                    "items" : [
386                     {
387                      "Boolean allowBlank" : true,
388                      "Boolean selectOnFocus" : true,
389                      "String name" : "align",
390                      "String mode" : "local",
391                      "String valueField" : "code",
392                      "xtype" : "ComboBox",
393                      "Boolean editable" : false,
394                      "String triggerAction" : "all",
395                      "string fieldLabel" : "Alignment:",
396                      "Boolean alwaysQuery" : true,
397                      "cls" : "row-style",
398                      "$ xns" : "Roo.bootstrap",
399                      "Number labelWidth" : 4,
400                      "String displayField" : "value",
401                      "Boolean forceSelection" : true,
402                      "items" : [
403                       {
404                        "$ Array fields" : "['code', 'value']",
405                        "xtype" : "SimpleStore",
406                        "$ xns" : "Roo.data",
407                        "* prop" : "store",
408                        "| Array data" : "[\n    ['left', 'left'],\n    ['right', 'right'],\n    ['middle', 'middle'],\n    ['top', 'top'],\n    ['bottom', 'bottom']\n]"
409                       }
410                      ]
411                     }
412                    ]
413                   }
414                  ]
415                 },
416                 {
417                  "xtype" : "Row",
418                  "$ xns" : "Roo.bootstrap",
419                  "items" : [
420                   {
421                    "Number md" : 12,
422                    "String cls" : "text-center",
423                    "xtype" : "Column",
424                    "$ xns" : "Roo.bootstrap",
425                    "String style" : "margin-top:15px;",
426                    "items" : [
427                     {
428                      "listeners" : {
429                       "click" : "function (_self, e)\n{\n    var b = _this.masonry.getSelected();\n    \n    if (b.length < 1) {\n        \n        Roo.bootstrap.MessageBox.alert('Cannot add any image', 'Please select an image');\n        return;\n    }\n    \n    var brick = Roo.bootstrap.MasonryBrick.get(b[0]);\n    \n    _this.dialog.hide();\n\n    if(_this.callback){\n        \n        var data = {\n            id : brick.imageObj.id,\n            filename : brick.imageObj.filename,\n            width : _this.setting_form.findField('width').getValue(),\n            height : _this.setting_form.findField('height').getValue(),\n            descript : _this.setting_form.findField('descript').getValue(),\n            align : _this.setting_form.findField('align').getValue()\n        };\n        \n        _this.callback.call(_this, data);\n        \n    }\n}"
430                      },
431                      "String weight" : "default",
432                      "xtype" : "Button",
433                      "$ xns" : "Roo.bootstrap",
434                      "String html" : "<i class=\"fa fa-plus\"></i> Add into the email",
435                      "name" : "add"
436                     }
437                    ]
438                   }
439                  ]
440                 }
441                ]
442               }
443              ]
444             }
445            ]
446           }
447          ]
448         },
449         {
450          "xtype" : "Row",
451          "$ xns" : "Roo.bootstrap",
452          "items" : [
453           {
454            "Number md" : 12,
455            "xtype" : "Column",
456            "$ xns" : "Roo.bootstrap",
457            "items" : [
458             {
459              "listeners" : {
460               "render" : "function (_self)\n{\n    _this.detail_form = this;\n}"
461              },
462              "xtype" : "Form",
463              "$ xns" : "Roo.bootstrap",
464              "Boolean loadMask" : true,
465              "$ String url" : "baseURL + '/Roo/Images'",
466              "items" : [
467               {
468                "xtype" : "Container",
469                "string header" : "Image Details",
470                "$ xns" : "Roo.bootstrap",
471                "String style" : "width: 100%; padding: 0",
472                "$ string panel" : "'default'",
473                "items" : [
474                 {
475                  "xtype" : "Row",
476                  "$ xns" : "Roo.bootstrap",
477                  "items" : [
478                   {
479                    "Number md" : 12,
480                    "xtype" : "Column",
481                    "$ xns" : "Roo.bootstrap",
482                    "items" : [
483                     {
484                      "String name" : "filename",
485                      "style" : "padding: 0;",
486                      "xtype" : "Input",
487                      "string fieldLabel" : "File Name:",
488                      "cls" : "row-style",
489                      "Boolean disabled" : true,
490                      "$ xns" : "Roo.bootstrap",
491                      "Number labelWidth" : 4
492                     }
493                    ]
494                   }
495                  ]
496                 },
497                 {
498                  "xtype" : "Row",
499                  "$ xns" : "Roo.bootstrap",
500                  "items" : [
501                   {
502                    "Number md" : 12,
503                    "xtype" : "Column",
504                    "$ xns" : "Roo.bootstrap",
505                    "String style" : "margin-top:15px;",
506                    "items" : [
507                     {
508                      "String name" : "mimetype",
509                      "xtype" : "Input",
510                      "string fieldLabel" : "File Type:",
511                      "cls" : "row-style",
512                      "Boolean disabled" : true,
513                      "$ xns" : "Roo.bootstrap",
514                      "Number labelWidth" : 4
515                     }
516                    ]
517                   }
518                  ]
519                 },
520                 {
521                  "xtype" : "Row",
522                  "$ xns" : "Roo.bootstrap",
523                  "items" : [
524                   {
525                    "Number md" : 12,
526                    "xtype" : "Column",
527                    "$ xns" : "Roo.bootstrap",
528                    "String style" : "margin-top:15px;",
529                    "items" : [
530                     {
531                      "String name" : "filesize",
532                      "xtype" : "Input",
533                      "string fieldLabel" : "File Size:",
534                      "cls" : "row-style",
535                      "Boolean disabled" : true,
536                      "$ xns" : "Roo.bootstrap",
537                      "Number labelWidth" : 4
538                     }
539                    ]
540                   }
541                  ]
542                 },
543                 {
544                  "xtype" : "Row",
545                  "$ xns" : "Roo.bootstrap",
546                  "items" : [
547                   {
548                    "Number md" : 12,
549                    "xtype" : "Column",
550                    "$ xns" : "Roo.bootstrap",
551                    "String style" : "margin-top:15px;",
552                    "items" : [
553                     {
554                      "String name" : "created",
555                      "xtype" : "Input",
556                      "string fieldLabel" : "Created Date:",
557                      "cls" : "row-style",
558                      "Boolean disabled" : true,
559                      "$ xns" : "Roo.bootstrap",
560                      "Number labelWidth" : 4
561                     }
562                    ]
563                   }
564                  ]
565                 },
566                 {
567                  "xtype" : "Row",
568                  "$ xns" : "Roo.bootstrap",
569                  "items" : [
570                   {
571                    "Number md" : 12,
572                    "xtype" : "Column",
573                    "$ xns" : "Roo.bootstrap",
574                    "String style" : "margin-top:15px;",
575                    "items" : [
576                     {
577                      "String name" : "descript",
578                      "xtype" : "Input",
579                      "string fieldLabel" : "Description:",
580                      "cls" : "row-style",
581                      "$ xns" : "Roo.bootstrap",
582                      "Number labelWidth" : 4
583                     }
584                    ]
585                   }
586                  ]
587                 },
588                 {
589                  "String name" : "id",
590                  "xtype" : "Input",
591                  "String inputType" : "hidden",
592                  "$ xns" : "Roo.bootstrap"
593                 },
594                 {
595                  "xtype" : "Row",
596                  "$ xns" : "Roo.bootstrap",
597                  "items" : [
598                   {
599                    "Number md" : 12,
600                    "String cls" : "text-center",
601                    "xtype" : "Column",
602                    "$ xns" : "Roo.bootstrap",
603                    "String style" : "margin-top:15px;",
604                    "items" : [
605                     {
606                      "listeners" : {
607                       "click" : "function (_self, e)\n{\n    _this.detail_form.doAction('submit');\n}"
608                      },
609                      "String weight" : "default",
610                      "xtype" : "Button",
611                      "$ xns" : "Roo.bootstrap",
612                      "String html" : "<i class=\"fa fa-save\"></i> Save Changes"
613                     }
614                    ]
615                   }
616                  ]
617                 }
618                ]
619               }
620              ]
621             }
622            ]
623           }
624          ]
625         }
626        ]
627       }
628      ]
629     }
630    ]
631   }
632  ]
633 }