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