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 (e)
120                                 {
121                                     
122                                     Roo.log("Node Drop");
123                                     return;
124                                     e.dropNode.setText(
125                                         _this.configToText(e.dropNode.elConfig)
126                                         );
127                                         var bp = Pman.Tab.BuilderPanel;
128                                         bp.redraw.defer(1000, bp, [true]);
129                                 
130                                 },
131                                 click : function (node, e)
132                                 {
133                                       e.preventDefault();
134                                                        // console.log(e.button);
135                                         this.setCurrentNode(node);
136                                 
137                                 },
138                                 contextmenu : function (node, e)
139                                 {
140                                     e.stopEvent();
141                                         
142                                         this.getSelectionModel().select(node);
143                                          _this.setCurrentNode(node);
144                                         var xt = node.elConfig.xtype;
145                                         var altx= false;
146                                         if (typeof(node.elConfig['*prop']) != 'undefined') {
147                                             altx = node.parentNode.elConfig.xtype +'.' + node.elConfig['*prop'];
148                                         }
149                                         var mn = Pman.Tab.BuilderPalete.getMenu(xt,altx);
150                                         
151                                         
152                                         if (mn) {
153                                             mn.show(e.getTarget());
154                                         }
155                                         
156                                 
157                                 
158                                 },
159                                 nodedragover : function (e)
160                                 {
161                                     Roo.log('nodedragover');
162                                      Roo.log(e);
163                                      // e.cancel..
164                                      // if we have within the same tree:
165                                        // dropNode (the node being dragged !!important!!) 
166                                        // point: below, append
167                                        // target - node 
168                                     // for palete
169                                         // dropNode = false;
170                                         // grid = the grid...
171                                         // source.dragData.selections[..] 
172                                    
173                                     
174                                     // we can only check parents... (we in theory can check dupe properties.. but let's ignore that for the time being.)
175                                     
176                                     // ok off we go.
177                                     
178                                     if (!e.dropNode) {
179                                         // drag from palete..
180                                         if (!e.source.dragData.selections.length) {
181                                             e.cancel = true;
182                                             return;
183                                         }
184                                         var drop_rec = e.source.dragData.selections[0];
185                                         var drop_xtype = drop_rec.data.name;
186                                         var ok_parents = drop_rec.json.parents;
187                                         Roo.log("TEST PARENTS: " + ok_parents.join(', '));
188                                         var new_parent = this.nodeXtype((e.point == 'append') ? e.target.parentNode :  e.target);
189                                         Roo.log("NEW PARENT: " + new_parent);
190                                         
191                                         // see if the new_parent is actually in the list of ok_parents
192                                         e.cancel = true;
193                                         Roo.each(ok_parents,function(n) {
194                                             if (n == new_parent || n.split(':').shift() == new_parent) {
195                                                 e.cancel = false;
196                                                 return true;
197                                             }
198                                         });
199                                         // done all the checks...
200                                         return;
201                                         
202                                     }
203                                      
204                                    
205                                 }
206                             },
207                             animate : false,
208                             containerScroll : true,
209                             ddGroup : 'component',
210                             enableDD : true,
211                             rootVisible : true,
212                             nodeXtype : function(n) {
213                                  if (!n) {return ''; }
214                                 var xt = n.elConfig.xtype ||  '';
215                                 var xns= n.elConfig['|xns'] ||   '';
216                                 xns += xns.length ? '.' : '';
217                                 return xns + xt;
218                             },
219                             appendNode : function(parent, inConfig, markUndo) {
220                                 
221                                     
222                              
223                                 var items = [];
224                                 if (inConfig.items) { // loading!
225                                     items = inConfig.items;
226                                     delete inConfig.items;
227                                 }
228                                 var config = this.cloneConfig(inConfig);
229                                 
230                                 if (!parent) {
231                                 parent = this.root;
232                                 }
233                                     
234                                     
235                                 //var canAppend = this.canAppend(parent,config);
236                                 //if (canAppend !== true) {
237                                 //    console.log("Unable to add element " + canAppend);
238                                 //      Roo.Msg.alert("Unable to add element", canAppend);
239                                 //              return false;
240                                //               }
241                                      
242                                 var newNode = new Roo.tree.TreeNode({
243                                         text: this.configToText(config)
244                                 });
245                                         
246                                 
247                                 newNode.elConfig = config;
248                                 //if (markUndo === true) {
249                                 //Pman.Tab.Builder.markUndo("Add " + newNode.text);
250                                 //
251                                     // appends to our tree...
252                                 parent.appendChild(newNode);
253                                 
254                                     
255                                 if (items.length) {
256                                     Roo.each(items, function(i) {
257                                         this.appendNode(newNode, i);
258                                     },this);
259                                     
260                                 }
261                                     
262                                     
263                                     /*
264                                     -- panels with panes...
265                                         if (items && items.length) {
266                                                 for (var i = 0; i < items.length; i++) {
267                                                                 this.appendConfig(items[i], newNode, false);
268                                                 }
269                                         }
270                                         if (opts.doUpdate !== false) {
271                                                 this.updateForm(false, newNode);
272                                         }
273                                     */
274                                 return newNode;
275                             
276                                  
277                             },
278                             clearAll : function() {
279                                 var rt = this.root;
280                                  if (rt.childNodes.length) {
281                                     rt.removeChild(rt.childNodes[0]);
282                                 }
283                                
284                                 this.root.elConfig  = Roo.apply({ }, this.defaultElConfig());  
285                                 //var btop = Pman.Tab.BuilderTop;
286                                 //if (btop.modsel && btop.modsel.lastData) {
287                                 //    this.tree.root.elConfig.app = btop.modsel.lastData.app;
288                                 //}
289                                 
290                                 this.setCurrentNode(this.root,true);
291                             
292                             },
293                             cloneConfig : function(config) {
294                                 if (!config) { return null; }
295                                 var newConfig = {};
296                                 
297                                 for (var i in config) {
298                                     if (typeof config[i] == 'object') {
299                                          newConfig[i] = this.cloneConfig(config[i]);
300                                     } else if (typeof config[i] != 'function') { // should this happen?
301                                          newConfig[i] = config[i];
302                                     }
303                                 }
304                                 return newConfig;
305                             },
306                             configToText : function(c) {
307                                  
308                                 var txt = [];
309                                 c = c || {};
310                                       var sr = (typeof(c['+buildershow']) != 'undefined') &&  !c['+buildershow'] ? true : false;
311                                     if (sr) txt.push('<s>');
312                                     if (typeof(c['*prop']) != 'undefined')   { txt.push(c['*prop']+ ':'); }
313                                 if (c.xtype)      { txt.push(c.xtype); }
314                                 if (c.fieldLabel) { txt.push('[' + c.fieldLabel + ']'); }
315                                 if (c.boxLabel)   { txt.push('[' + c.boxLabel + ']'); }
316                                 
317                                 
318                                 if (c.layout)     { txt.push('<i>' + c.layout + '</i>'); }
319                                 if (c.title)      { txt.push('<b>' + c.title + '</b>'); }
320                                     if (c.header)    { txt.push('<b>' + c.header + '</b>'); }
321                                     if (c.legend)      { txt.push('<b>' + c.legend + '</b>'); }
322                                 if (c.text)       { txt.push('<b>' + c.text + '</b>'); }
323                                     if (c.name)       { txt.push('<b>' + c.name+ '</b>'); }
324                                 if (c.region)     { txt.push('<i>(' + c.region + ')</i>'); }
325                                     if (c.dataIndex) { txt.push('[' + c.dataIndex+ ']'); }
326                                     if (sr) txt.push('</s>');
327                                 return (txt.length == 0 ? "Element" : txt.join(" "));
328                              
329                               
330                             },
331                             currentNodeType : function() {
332                                 return this.nodeXtype(this.currentNode);
333                              
334                             },
335                             defaultElConfig : function() {
336                                 return {
337                                    xtype : '*Module',
338                                     
339                                     module : 'TestApp',
340                                     part:   'Partname',
341                                     modkey : 0,
342                                     region : 'center',
343                                     parent : 'Pman',
344                                     name : 'Module Name',
345                                     items: [] 
346                                 };
347                             },
348                             loadBJS : function(module, part) {
349                                 var _t = this;
350                                 new Pman.Request({
351                                     url : baseURL + '/Roo/Builder_part.php',
352                                     method : 'GET',
353                                     params : {
354                                        _id : part
355                                     },
356                                     success : function(res)         
357                                     {
358                                         // data is in.. 
359                                         Roo.log(res);
360                                         _t.loadTree(JSON.parse(res.data.json));
361                                         
362                                      
363                                     },
364                             
365                                  })  
366                                     
367                                 
368                                 
369                             },
370                             loadTree : function(o) {
371                                 this.clearAll();
372                                 this.root.elConfig = o;
373                                 this.root.setText(this.configToText(this.root.elConfig));
374                                 this.appendNode(this.root, o.items[0]);
375                                 this.root.expand(true);
376                                 Pman.Tab.BuilderView.panel.redraw();
377                                 this.setCurrentNode(this.root,true);
378                             },
379                             renderer : function(n) { return n.text; },
380                             setCurrentNode : function(node,select) {
381                                     this.currentNode = node || this.root;
382                                     
383                                     //Pman.Tab.BuilderView.highlightElement(this.currentNode);
384                             
385                                     var p = Pman.Tab.BuilderProps.grid;
386                                     if (p) { //may not be ready yet..
387                                         p.setCurrrentNode(this.currentNode);
388                                     }
389                                     
390                                   
391                                     this.currentNode.setText(this.configToText(this.currentNode.elConfig));
392                                     
393                                     if (select) { //&& node !== this.tree.root) {
394                                         if (this.currentNode !== this.root)  {
395                                                  this.currentNode.ensureVisible();
396                                           }   
397                                          this.currentNode.expand(false,false);
398                                         this.currentNode.select();
399                                 }
400                                 // update palete..
401                                 Pman.Tab.BuilderPalette.grid.getSelectionModel().clearSelections();
402                                 Pman.Tab.BuilderPalette.grid.view.refresh();
403                             
404                             },
405                             sm : {
406                                 xtype: 'DefaultSelectionModel',
407                                 xns: Roo.tree
408                             },
409                             root : {
410                                 xtype: 'TreeNode',
411                                 xns: Roo.tree,
412                                 text : "Part",
413                                 elConfig : function() {
414                                     return  {
415                                          xtype : '*Module',
416                                             
417                                             app : 'TestApp',
418                                             // perm
419                                             // permtype
420                                             modkey : 0,
421                                             '|module' :  '',
422                                             region : 'center',
423                                             '|parent' : 'Pman',
424                                             name : "Module Name",
425                                             items: [] 
426                                 
427                                     
428                                     }
429                                 }
430                             }
431                         }
432                     }
433                 ],
434                 center : {
435                     xtype: 'LayoutRegion',
436                     xns: Roo
437                 },
438                 south : {
439                     xtype: 'LayoutRegion',
440                     xns: Roo,
441                     height : 300,
442                     split : true
443                 }
444             }
445         });
446         this.layout = this.panel.layout;
447
448     }
449 });