Pman.Tab.BuilderTree.js
[Pman.Builder] / Pman.Tab.BuilderTree.js
1 //<script type="text/javascript">
2
3 // Auto generated file - created by app.Builder.js- do not edit directly (at present!)
4
5
6
7 // register the module first
8 Pman.on('beforeload', function()
9 {
10     Pman.register({
11         modKey : '001-Pman.Tab.BuilderTree',
12         module : Pman.Tab.BuilderTree,
13         region : 'center',
14         parent : Pman.Tab.BuilderTab,
15         name : "Pman.Tab.BuilderTree",
16         disabled : false, 
17         permname: '' 
18     });
19 });
20
21 Pman.Tab.BuilderTree = new Roo.util.Observable({
22
23     panel : false,
24     disabled : false,
25     parentLayout:  false,
26
27     add : function(parentLayout, region)
28     {
29
30         var _this = this;
31         this.parentLayout = parentLayout;
32
33         this.panel = parentLayout.addxtype({
34             xtype: 'NestedLayoutPanel',
35             xns: Roo,
36             region : 'west',
37             layout : {
38                 xtype: 'BorderLayout',
39                 xns: Roo,
40                 items : [
41                     {
42                         xtype: 'TreePanel',
43                         xns: Roo,
44                         listeners : {
45                             activate : function (_self)
46                             {
47                                 
48                                 _this.tree = _self.tree;
49                                 if (_this.hasMouseEvent) {
50                                     return;
51                                 }
52                                 
53                                 _this.hasMouseEvent = true;
54                                  this.el.on('mouseover', function() { _this.isMouseOver= true; });
55                                 this.el.on('mouseout', function() { _this.isMouseOver = false; });
56                             
57                             }
58                         },
59                         region : 'center',
60                         tree : {
61                             xtype: 'TreePanel',
62                             xns: Roo.tree,
63                             listeners : {
64                                 beforenodedrop : function (e)
65                                 {
66                                     /*
67                                     tree - The TreePanel
68                                     target - The node being targeted for the drop
69                                     data - The drag data from the drag source
70                                     point - The point of the drop - append, above or below
71                                     source - The drag source
72                                     rawEvent - Raw mouse event
73                                     dropNode - Drop node(s) provided by the source OR you can supply node(s) to be inserted by setting them on this object.
74                                     cancel - Set this to true to cancel the drop.
75                                     */
76                                     Roo.log(e);
77                                     if (!e.tree || !e.dropNode) {
78                                         console.log('no tree or dropNode');
79                                         return; // fixme drop of elements from palete..
80                                     }
81                                     var np = false; // new parent
82                                     
83                                     switch (e.point) {
84                                         case 'above':
85                                         case 'below':
86                                             np = e.target.parentNode;
87                                             break;
88                                         case 'append':
89                                             np = e.target;
90                                             break;
91                                     }
92                                     
93                                     // always drop onto own parent
94                                     if (np == e.dropNode.parentNode) {
95                                         if (e.rawEvent.ctrlKey) {
96                                             e.dropNode = _this.dupeNode(e.dropNode);
97                                         }
98                                         return true;
99                                     }
100                                    if (_this.canAppend(np, e.dropNode.elConfig)) {
101                                         if (e.rawEvent.ctrlKey) {
102                                             e.dropNode = _this.dupeNode(e.dropNode);
103                                               
104                                             if (np.elConfig.xtype == 'GridEditor') {
105                                                 e.dropNode.elConfig['*prop'] = 'field';
106                                             }
107                                             
108                                         }
109                                         return true;
110                                     }  
111                                     console.log('can not drop ' + e.dropNode.elConfig.xtype + ' ontop of ' + np.elConfig.xtype);
112                                     
113                                     
114                                     
115                                     return false;
116                                                         
117                                 
118                                 },
119                                 nodedrop : function (dropEvent)
120                                 {
121                                     e.dropNode.setText(
122                                                 _this.configToText(e.dropNode.elConfig)
123                                                 );
124                                                 var bp = Pman.Tab.BuilderPanel;
125                                                 bp.redraw.defer(1000, bp, [true]);
126                                 
127                                 },
128                                 click : function (node, e)
129                                 {
130                                       e.preventDefault();
131                                                        // console.log(e.button);
132                                         this.setCurrentNode(node);
133                                 
134                                 },
135                                 contextmenu : function (node, e)
136                                 {
137                                     e.stopEvent();
138                                         
139                                         this.getSelectionModel().select(node);
140                                          _this.setCurrentNode(node);
141                                         var xt = node.elConfig.xtype;
142                                         var altx= false;
143                                         if (typeof(node.elConfig['*prop']) != 'undefined') {
144                                             altx = node.parentNode.elConfig.xtype +'.' + node.elConfig['*prop'];
145                                         }
146                                         var mn = Pman.Tab.BuilderPalete.getMenu(xt,altx);
147                                         
148                                         
149                                         if (mn) {
150                                             mn.show(e.getTarget());
151                                         }
152                                         
153                                 
154                                 
155                                 },
156                                 nodedragover : function (e)
157                                 {
158                                     Roo.log('nodedragover');
159                                      Roo.log(e);
160                                      // e.cancel..
161                                      // if we have within the same tree:
162                                        // dropNode (the node being dragged !!important!!) 
163                                        // point: below, append
164                                        // target - node 
165                                     // for palete
166                                         // dropNode = false;
167                                         // grid = the grid...
168                                         // source.dragData.selection[..] 
169                                    
170                                     
171                                     // we can only check parents... (we in theory can check dupe properties.. but let's ignore that for the time being.)
172                                     
173                                     // ok off we go.
174                                     
175                                     if (!e.dropNode) {
176                                         // drag from palete..
177                                         if (!e.target.source.dragData.selection.length) {
178                                             e.cancel = true;
179                                             return;
180                                         }
181                                         var drop_rec = e.target.source.dragData.selection[0];
182                                         var drop_xtype = drop_rec.data.name;
183                                         var ok_parents = drop_rec.json.parents;
184                                         
185                                         var new_parent = this.nodeXtype((e.point == 'append') ? e.target.parentNode :  e.target);
186                                         
187                                         
188                                     }
189                                      
190                                    
191                                 }
192                             },
193                             animate : false,
194                             containerScroll : true,
195                             ddGroup : 'component',
196                             enableDD : true,
197                             rootVisible : true,
198                              : function() {
199                                 
200                             },
201                             appendNode : function(parent, inConfig, markUndo) {
202                                 
203                                     
204                              
205                                 var items = [];
206                                 if (inConfig.items) { // loading!
207                                     items = inConfig.items;
208                                     delete inConfig.items;
209                                 }
210                                 var config = this.cloneConfig(inConfig);
211                                 
212                                 if (!parent) {
213                                 parent = this.root;
214                                 }
215                                     
216                                     
217                                 //var canAppend = this.canAppend(parent,config);
218                                 //if (canAppend !== true) {
219                                 //    console.log("Unable to add element " + canAppend);
220                                 //      Roo.Msg.alert("Unable to add element", canAppend);
221                                 //              return false;
222                                //               }
223                                      
224                                 var newNode = new Roo.tree.TreeNode({
225                                         text: this.configToText(config)
226                                 });
227                                         
228                                 
229                                 newNode.elConfig = config;
230                                 //if (markUndo === true) {
231                                 //Pman.Tab.Builder.markUndo("Add " + newNode.text);
232                                 //
233                                     // appends to our tree...
234                                 parent.appendChild(newNode);
235                                 
236                                     
237                                 if (items.length) {
238                                     Roo.each(items, function(i) {
239                                         this.appendNode(newNode, i);
240                                     },this);
241                                     
242                                 }
243                                     
244                                     
245                                     /*
246                                     -- panels with panes...
247                                         if (items && items.length) {
248                                                 for (var i = 0; i < items.length; i++) {
249                                                                 this.appendConfig(items[i], newNode, false);
250                                                 }
251                                         }
252                                         if (opts.doUpdate !== false) {
253                                                 this.updateForm(false, newNode);
254                                         }
255                                     */
256                                 return newNode;
257                             
258                                  
259                             },
260                             clearAll : function() {
261                                 var rt = this.root;
262                                  if (rt.childNodes.length) {
263                                     rt.removeChild(rt.childNodes[0]);
264                                 }
265                                
266                                 this.root.elConfig  = Roo.apply({ }, this.defaultElConfig());  
267                                 //var btop = Pman.Tab.BuilderTop;
268                                 //if (btop.modsel && btop.modsel.lastData) {
269                                 //    this.tree.root.elConfig.app = btop.modsel.lastData.app;
270                                 //}
271                                 
272                                 this.setCurrentNode(this.root,true);
273                             
274                             },
275                             cloneConfig : function(config) {
276                                 if (!config) { return null; }
277                                 var newConfig = {};
278                                 
279                                 for (var i in config) {
280                                     if (typeof config[i] == 'object') {
281                                          newConfig[i] = this.cloneConfig(config[i]);
282                                     } else if (typeof config[i] != 'function') { // should this happen?
283                                          newConfig[i] = config[i];
284                                     }
285                                 }
286                                 return newConfig;
287                             },
288                             configToText : function(c) {
289                                  
290                                 var txt = [];
291                                 c = c || {};
292                                       var sr = (typeof(c['+buildershow']) != 'undefined') &&  !c['+buildershow'] ? true : false;
293                                     if (sr) txt.push('<s>');
294                                     if (typeof(c['*prop']) != 'undefined')   { txt.push(c['*prop']+ ':'); }
295                                 if (c.xtype)      { txt.push(c.xtype); }
296                                 if (c.fieldLabel) { txt.push('[' + c.fieldLabel + ']'); }
297                                 if (c.boxLabel)   { txt.push('[' + c.boxLabel + ']'); }
298                                 
299                                 
300                                 if (c.layout)     { txt.push('<i>' + c.layout + '</i>'); }
301                                 if (c.title)      { txt.push('<b>' + c.title + '</b>'); }
302                                     if (c.header)    { txt.push('<b>' + c.header + '</b>'); }
303                                     if (c.legend)      { txt.push('<b>' + c.legend + '</b>'); }
304                                 if (c.text)       { txt.push('<b>' + c.text + '</b>'); }
305                                     if (c.name)       { txt.push('<b>' + c.name+ '</b>'); }
306                                 if (c.region)     { txt.push('<i>(' + c.region + ')</i>'); }
307                                     if (c.dataIndex) { txt.push('[' + c.dataIndex+ ']'); }
308                                     if (sr) txt.push('</s>');
309                                 return (txt.length == 0 ? "Element" : txt.join(" "));
310                              
311                               
312                             },
313                             currentNodeType : function() {
314                                 if (!this.currentNode) {return ''; }
315                                 var xt = this.currentNode.elConfig.xtype ||  '';
316                                 var xns= this.currentNode.elConfig['|xns'] ||   '';
317                                 xns += xns.length ? '.' : '';
318                                 return xns + xt;
319                              
320                             },
321                             defaultElConfig : function() {
322                                 return {
323                                    xtype : '*Module',
324                                     
325                                     module : 'TestApp',
326                                     part:   'Partname',
327                                     modkey : 0,
328                                     region : 'center',
329                                     parent : 'Pman',
330                                     name : 'Module Name',
331                                     items: [] 
332                                 };
333                             },
334                             loadBJS : function(module, part) {
335                                 var _t = this;
336                                 new Pman.Request({
337                                     url : baseURL + '/Roo/Builder_part.php',
338                                     method : 'GET',
339                                     params : {
340                                        _id : part
341                                     },
342                                     success : function(res)         
343                                     {
344                                         // data is in.. 
345                                         Roo.log(res);
346                                         _t.loadTree(JSON.parse(res.data.json));
347                                         
348                                      
349                                     },
350                             
351                                  })  
352                                     
353                                 
354                                 
355                             },
356                             loadTree : function(o) {
357                                 this.clearAll();
358                                 this.root.elConfig = o;
359                                 this.root.setText(this.configToText(this.root.elConfig));
360                                 this.appendNode(this.root, o.items[0]);
361                                 this.root.expand(true);
362                                 Pman.Tab.BuilderView.panel.redraw();
363                                 this.setCurrentNode(this.root,true);
364                             },
365                             renderer : function(n) { return n.text; },
366                             setCurrentNode : function(node,select) {
367                                     this.currentNode = node || this.root;
368                                     
369                                     //Pman.Tab.BuilderView.highlightElement(this.currentNode);
370                             
371                                     var p = Pman.Tab.BuilderProps.grid;
372                                     if (p) { //may not be ready yet..
373                                         p.setCurrrentNode(this.currentNode);
374                                     }
375                                     
376                                   
377                                     this.currentNode.setText(this.configToText(this.currentNode.elConfig));
378                                     
379                                     if (select) { //&& node !== this.tree.root) {
380                                         if (this.currentNode !== this.root)  {
381                                                  this.currentNode.ensureVisible();
382                                           }   
383                                          this.currentNode.expand(false,false);
384                                         this.currentNode.select();
385                                 }
386                                 // update palete..
387                                 Pman.Tab.BuilderPalette.grid.getSelectionModel().clearSelections();
388                                 Pman.Tab.BuilderPalette.grid.view.refresh();
389                             
390                             },
391                             sm : {
392                                 xtype: 'DefaultSelectionModel',
393                                 xns: Roo.tree
394                             },
395                             root : {
396                                 xtype: 'TreeNode',
397                                 xns: Roo.tree,
398                                 text : "Part",
399                                 elConfig : function() {
400                                     return  {
401                                          xtype : '*Module',
402                                             
403                                             app : 'TestApp',
404                                             // perm
405                                             // permtype
406                                             modkey : 0,
407                                             '|module' :  '',
408                                             region : 'center',
409                                             '|parent' : 'Pman',
410                                             name : "Module Name",
411                                             items: [] 
412                                 
413                                     
414                                     }
415                                 }
416                             }
417                         }
418                     }
419                 ],
420                 center : {
421                     xtype: 'LayoutRegion',
422                     xns: Roo
423                 },
424                 south : {
425                     xtype: 'LayoutRegion',
426                     xns: Roo,
427                     height : 300,
428                     split : true
429                 }
430             }
431         });
432         this.layout = this.panel.layout;
433
434     }
435 });