examples/bootstrap/Editor.js
[roojs1] / examples / bootstrap / Editor.js
1
2
3 Roo.example = Roo.example || {};
4
5 Roo.example.Editor = new Roo.XComponent({
6     part     :  ["layout","viewpanel"],
7     order    : '001-viewpanel',
8     region   : '',
9     parent   : '#bootstrap',
10     name     : "unnamed module",
11     disabled : false, 
12     permname : '', 
13     _tree : function()
14     {
15         
16         this.parent = {
17             el : new Roo.bootstrap.Body()
18         }
19         this.parent.el.layout = false;
20         this.parent.el.render(document.body);
21         
22         var _this = this;
23         var MODULE = this;
24         var baseURL = '/web.campaign/index.local.php';
25         
26         return {
27             xtype: 'Body',
28             xns: Roo.bootstrap,
29             items : [
30                  {
31                     xtype : 'Container',
32                     cls : 'content',
33                     xns : Roo.bootstrap,
34                     style : 'margin-top:100px',
35                     items : [
36                         {
37                             xtype : 'Container',
38                             cls : 'pad-wrapper',
39                             xns : Roo.bootstrap,
40                             items : [
41                                 {
42                                     xtype : 'Container',
43                                     cls : 'container alpha',
44                                     xns : Roo.bootstrap,
45                                     items : [
46                                         {
47                                             level : 4,
48                                             xtype : 'Header',
49                                             html : 'Inline Editor',
50                                             xns : Roo.bootstrap
51                                         },
52                                         {
53                                             xtype : 'Panel',
54                                             xns : Roo.bootstrap.editor,
55                                             width : 1000,
56                                             height : 1000,
57                                             name : 'email-inline-editor',
58                                             stylesheets : (function(){
59                                                 var css = [];
60                                                 
61                                                 css.push(rootURL + '/roojs1/css-bootstrap/bootstrap.css');
62                                                 css.push(rootURL + '/roojs1/css-bootstrap/font-awesome.css');
63                                                 css.push(rootURL + '/Campaign/editor/editor.css');
64                                                 
65                                                 return css;
66                                             })(),
67                                             items : [
68                                                 {
69                                                     xtype : 'TextBlock',
70                                                     xns : Roo.bootstrap.editor,
71                                                     height : 300,
72                                                     listeners : {
73                                                         render : function (_self)
74                                                         {
75                                                             this.setValue('<b>test</b>');
76                                                         }
77                                                     }
78                                                 },
79                                                 {
80                                                     xtype : 'ImageBlock',
81                                                     xns : Roo.bootstrap.editor,
82                                                     height : 300,
83                                                     style : 'margin-top:20px;',
84                                                     listeners : {
85                                                         render : function (_self)
86                                                         {
87                                                             this.setValue('<b>test 2</b>');
88                                                         }
89                                                     }
90                                                 }
91                                             ]
92                                         }
93                                         
94                                     ]
95
96                                 }
97                             ]
98
99                         }
100                     ]
101
102                 }
103             ]
104         };
105     }
106 });