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                                         // see if the new_parent is actually in the list of ok_parents
188                                         n.cancel = true;
189                                         Roo.each(ok_parents,function(n) {
190                                             if (n == new_parent || n.split(':').shift() == new_parent) {
191                                                 n.cancel = false;
192                                                 return true;
193                                             }
194                                         });
195                                         return;
196                                         
197                                     }
198                                      
199                                    
200                                 }
201                             },
202                             animate : false,
203                             containerScroll : true,
204                             ddGroup : 'component',
205                             enableDD : true,
206                             rootVisible : true,
207                             nodeXtype : function(n) {
208                                  if (!n) {return ''; }
209                                 var xt = n.elConfig.xtype ||  '';
210                                 var xns= n.elConfig['|xns'] ||   '';
211                                 xns += xns.length ? '.' : '';
212                                 return xns + xt;
213                             },
214                             appendNode : function(parent, inConfig, markUndo) {
215                                 
216                                     
217                              
218                                 var items = [];
219                                 if (inConfig.items) { // loading!
220                                     items = inConfig.items;
221                                     delete inConfig.items;
222                                 }
223                                 var config = this.cloneConfig(inConfig);
224                                 
225                                 if (!parent) {
226                                 parent = this.root;
227                                 }
228                                     
229                                     
230                                 //var canAppend = this.canAppend(parent,config);
231                                 //if (canAppend !== true) {
232                                 //    console.log("Unable to add element " + canAppend);
233                                 //      Roo.Msg.alert("Unable to add element", canAppend);
234                                 //              return false;
235                                //               }
236                                      
237                                 var newNode = new Roo.tree.TreeNode({
238                                         text: this.configToText(config)
239                                 });
240                                         
241                                 
242                                 newNode.elConfig = config;
243                                 //if (markUndo === true) {
244                                 //Pman.Tab.Builder.markUndo("Add " + newNode.text);
245                                 //
246                                     // appends to our tree...
247                                 parent.appendChild(newNode);
248                                 
249                                     
250                                 if (items.length) {
251                                     Roo.each(items, function(i) {
252                                         this.appendNode(newNode, i);
253                                     },this);
254                                     
255                                 }
256                                     
257                                     
258                                     /*
259                                     -- panels with panes...
260                                         if (items && items.length) {
261                                                 for (var i = 0; i < items.length; i++) {
262                                                                 this.appendConfig(items[i], newNode, false);
263                                                 }
264                                         }
265                                         if (opts.doUpdate !== false) {
266                                                 this.updateForm(false, newNode);
267                                         }
268                                     */
269                                 return newNode;
270                             
271                                  
272                             },
273                             clearAll : function() {
274                                 var rt = this.root;
275                                  if (rt.childNodes.length) {
276                                     rt.removeChild(rt.childNodes[0]);
277                                 }
278                                
279                                 this.root.elConfig  = Roo.apply({ }, this.defaultElConfig());  
280                                 //var btop = Pman.Tab.BuilderTop;
281                                 //if (btop.modsel && btop.modsel.lastData) {
282                                 //    this.tree.root.elConfig.app = btop.modsel.lastData.app;
283                                 //}
284                                 
285                                 this.setCurrentNode(this.root,true);
286                             
287                             },
288                             cloneConfig : function(config) {
289                                 if (!config) { return null; }
290                                 var newConfig = {};
291                                 
292                                 for (var i in config) {
293                                     if (typeof config[i] == 'object') {
294                                          newConfig[i] = this.cloneConfig(config[i]);
295                                     } else if (typeof config[i] != 'function') { // should this happen?
296                                          newConfig[i] = config[i];
297                                     }
298                                 }
299                                 return newConfig;
300                             },
301                             configToText : function(c) {
302                                  
303                                 var txt = [];
304                                 c = c || {};
305                                       var sr = (typeof(c['+buildershow']) != 'undefined') &&  !c['+buildershow'] ? true : false;
306                                     if (sr) txt.push('<s>');
307                                     if (typeof(c['*prop']) != 'undefined')   { txt.push(c['*prop']+ ':'); }
308                                 if (c.xtype)      { txt.push(c.xtype); }
309                                 if (c.fieldLabel) { txt.push('[' + c.fieldLabel + ']'); }
310                                 if (c.boxLabel)   { txt.push('[' + c.boxLabel + ']'); }
311                                 
312                                 
313                                 if (c.layout)     { txt.push('<i>' + c.layout + '</i>'); }
314                                 if (c.title)      { txt.push('<b>' + c.title + '</b>'); }
315                                     if (c.header)    { txt.push('<b>' + c.header + '</b>'); }
316                                     if (c.legend)      { txt.push('<b>' + c.legend + '</b>'); }
317                                 if (c.text)       { txt.push('<b>' + c.text + '</b>'); }
318                                     if (c.name)       { txt.push('<b>' + c.name+ '</b>'); }
319                                 if (c.region)     { txt.push('<i>(' + c.region + ')</i>'); }
320                                     if (c.dataIndex) { txt.push('[' + c.dataIndex+ ']'); }
321                                     if (sr) txt.push('</s>');
322                                 return (txt.length == 0 ? "Element" : txt.join(" "));
323                              
324                               
325                             },
326                             currentNodeType : function() {
327                                 return this.nodeXtype(this.currentNode);
328                              
329                             },
330                             defaultElConfig : function() {
331                                 return {
332                                    xtype : '*Module',
333                                     
334                                     module : 'TestApp',
335                                     part:   'Partname',
336                                     modkey : 0,
337                                     region : 'center',
338                                     parent : 'Pman',
339                                     name : 'Module Name',
340                                     items: [] 
341                                 };
342                             },
343                             loadBJS : function(module, part) {
344                                 var _t = this;
345                                 new Pman.Request({
346                                     url : baseURL + '/Roo/Builder_part.php',
347                                     method : 'GET',
348                                     params : {
349                                        _id : part
350                                     },
351                                     success : function(res)         
352                                     {
353                                         // data is in.. 
354                                         Roo.log(res);
355                                         _t.loadTree(JSON.parse(res.data.json));
356                                         
357                                      
358                                     },
359                             
360                                  })  
361                                     
362                                 
363                                 
364                             },
365                             loadTree : function(o) {
366                                 this.clearAll();
367                                 this.root.elConfig = o;
368                                 this.root.setText(this.configToText(this.root.elConfig));
369                                 this.appendNode(this.root, o.items[0]);
370                                 this.root.expand(true);
371                                 Pman.Tab.BuilderView.panel.redraw();
372                                 this.setCurrentNode(this.root,true);
373                             },
374                             renderer : function(n) { return n.text; },
375                             setCurrentNode : function(node,select) {
376                                     this.currentNode = node || this.root;
377                                     
378                                     //Pman.Tab.BuilderView.highlightElement(this.currentNode);
379                             
380                                     var p = Pman.Tab.BuilderProps.grid;
381                                     if (p) { //may not be ready yet..
382                                         p.setCurrrentNode(this.currentNode);
383                                     }
384                                     
385                                   
386                                     this.currentNode.setText(this.configToText(this.currentNode.elConfig));
387                                     
388                                     if (select) { //&& node !== this.tree.root) {
389                                         if (this.currentNode !== this.root)  {
390                                                  this.currentNode.ensureVisible();
391                                           }   
392                                          this.currentNode.expand(false,false);
393                                         this.currentNode.select();
394                                 }
395                                 // update palete..
396                                 Pman.Tab.BuilderPalette.grid.getSelectionModel().clearSelections();
397                                 Pman.Tab.BuilderPalette.grid.view.refresh();
398                             
399                             },
400                             sm : {
401                                 xtype: 'DefaultSelectionModel',
402                                 xns: Roo.tree
403                             },
404                             root : {
405                                 xtype: 'TreeNode',
406                                 xns: Roo.tree,
407                                 text : "Part",
408                                 elConfig : function() {
409                                     return  {
410                                          xtype : '*Module',
411                                             
412                                             app : 'TestApp',
413                                             // perm
414                                             // permtype
415                                             modkey : 0,
416                                             '|module' :  '',
417                                             region : 'center',
418                                             '|parent' : 'Pman',
419                                             name : "Module Name",
420                                             items: [] 
421                                 
422                                     
423                                     }
424                                 }
425                             }
426                         }
427                     }
428                 ],
429                 center : {
430                     xtype: 'LayoutRegion',
431                     xns: Roo
432                 },
433                 south : {
434                     xtype: 'LayoutRegion',
435                     xns: Roo,
436                     height : 300,
437                     split : true
438                 }
439             }
440         });
441         this.layout = this.panel.layout;
442
443     }
444 });