git.roojs.org Git - Pman.Builder/blob - 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                                     // nodedragover handles the allow/disallow..
  67
  68                                     /*
  69                                     tree - The TreePanel
  70                                     target - The node being targeted for the drop
  71                                     data - The drag data from the drag source
  72                                     point - The point of the drop - append, above or below
  73                                     source - The drag source
  74                                     rawEvent - Raw mouse event
  75                                     dropNode - Drop node(s) provided by the source OR you can supply node(s) to be inserted by setting them on this object.
  76                                     cancel - Set this to true to cancel the drop.
  77                                     */
  78                                     var np = e.point == 'append' ? e.target : e.target.parentNode ; // new parent
  79
  80                                     if (!e.tree || !e.dropNode) {
  81
  82                                         // form palete...
  83                                         var data  = e.source.dragData.selections[0].data;
  84                                         var nar = data.name.split(':')
  85                                         var xar = nar[0].split('.');
  86
  87                                         var cfg = {
  88                                             '|xns' : xar.pop(),
  89                                             'xtype' : xar.join('.')
  90                                         };
  91                                         if (nar.length > 1) {
  92                                             cfg['*prop'] = nar[1];
  93                                         }
  94                                         // at this point it should of a set of options...
  95                                         this.appendNode(np, cfg);
  96
  97                                         return; // fixme drop of elements from palete..
  98                                     }
  99
 100                                     // always drop onto own parent
 101                                     if (np == e.dropNode.parentNode) {
 102                                         if (e.rawEvent.ctrlKey) {
 103                                             e.dropNode = this.dupeNode(e.dropNode);
 104                                         }
 105                                         return true;
 106                                     }
 107                                     // can append has to use palete...
 108                                     // this code should be in nodedragover.
 109
 110                                     Roo.log("move checks need moving");
 111                                     return;
 112
 113                                     if (_this.canAppend(np, e.dropNode.elConfig)) {
 114                                         if (e.rawEvent.ctrlKey) {
 115                                             e.dropNode = _this.dupeNode(e.dropNode);
 116
 117                                             if (np.elConfig.xtype == 'GridEditor') {
 118                                                 e.dropNode.elConfig['*prop'] = 'field';
 119                                             }
 120
 121                                         }
 122                                         return true;
 123                                     }
 124                                     Roo.log('can not drop ' + e.dropNode.elConfig.xtype + ' ontop of ' + np.elConfig.xtype);
 125
 126
 127
 128                                     return false;
 129
 130
 131                                 },
 132                                 nodedrop : function (e)
 133                                 {
 134
 135                                     Roo.log("Node Drop");
 136                                     return;
 137                                     e.dropNode.setText(
 138                                         _this.configToText(e.dropNode.elConfig)
 139                                         );
 140                                         var bp = Pman.Tab.BuilderPanel;
 141                                         bp.redraw.defer(1000, bp, [true]);
 142
 143                                 },
 144                                 click : function (node, e)
 145                                 {
 146                                       e.preventDefault();
 147                                                        // console.log(e.button);
 148                                         this.setCurrentNode(node);
 149
 150                                 },
 151                                 contextmenu : function (node, e)
 152                                 {
 153                                     e.stopEvent();
 154
 155                                         this.getSelectionModel().select(node);
 156                                          _this.setCurrentNode(node);
 157                                         var xt = node.elConfig.xtype;
 158                                         var altx= false;
 159                                         if (typeof(node.elConfig['*prop']) != 'undefined') {
 160                                             altx = node.parentNode.elConfig.xtype +'.' + node.elConfig['*prop'];
 161                                         }
 162                                         var mn = Pman.Tab.BuilderPalete.getMenu(xt,altx);
 163
 164
 165                                         if (mn) {
 166                                             mn.show(e.getTarget());
 167                                         }
 168
 169
 170
 171                                 },
 172                                 nodedragover : function (e)
 173                                 {
 174                                     Roo.log('nodedragover');
 175                                      Roo.log(e);
 176                                      // e.cancel..
 177                                      // if we have within the same tree:
 178                                        // dropNode (the node being dragged !!important!!)
 179                                        // point: below, append
 180                                        // target - node
 181                                     // for palete
 182                                         // dropNode = false;
 183                                         // grid = the grid...
 184                                         // source.dragData.selections[..]
 185
 186
 187                                     // we can only check parents... (we in theory can check dupe properties.. but let's ignore that for the time being.)
 188
 189                                     // ok off we go.
 190
 191                                     if (!e.dropNode) {
 192                                         // drag from palete..
 193                                         if (!e.source.dragData.selections.length) {
 194                                             e.cancel = true;
 195                                             return;
 196                                         }
 197                                         var drop_rec = e.source.dragData.selections[0];
 198                                         var drop_xtype = drop_rec.data.name;
 199                                         var ok_parents = drop_rec.json.parents;
 200                                         Roo.log("TEST PARENTS: " + ok_parents.join(', '));
 201                                         var new_parent = this.nodeXtype((e.point == 'append') ? e.target :  e.target.parentNode);
 202                                         Roo.log("NEW PARENT: " + e.point + " = " + new_parent);
 203
 204                                         // see if the new_parent is actually in the list of ok_parents
 205                                         e.cancel = true;
 206                                         Roo.each(ok_parents,function(n) {
 207                                             if (n == new_parent || n.split(':').shift() == new_parent) {
 208                                                 e.cancel = false;
 209                                                 return true;
 210                                             }
 211                                         });
 212                                         // done all the checks...
 213                                         return;
 214
 215                                     }
 216
 217
 218                                 }
 219                             },
 220                             animate : false,
 221                             containerScroll : true,
 222                             ddGroup : 'component',
 223                             enableDD : true,
 224                             rootVisible : true,
 225                             appendNode : function(parent, inConfig, point) {
 226
 227
 228
 229                                 var items = [];
 230                                 if (inConfig.items) { // loading!
 231                                     items = inConfig.items;
 232                                     delete inConfig.items;
 233                                 }
 234                                 var config = this.cloneConfig(inConfig);
 235
 236                                 if (!parent) {
 237                                 parent = this.root;
 238                                 }
 239
 240                                 var newNode = new Roo.tree.TreeNode({
 241                                         text: this.configToText(config)
 242                                 });
 243
 244
 245                                 newNode.elConfig = config;
 246                                 //if (markUndo === true) {
 247                                 //Pman.Tab.Builder.markUndo("Add " + newNode.text);
 248                                 //
 249                                     // appends to our tree...
 250
 251                                 switch(point||'') {
 252                                     case 'before':
 253                                         parent.parentNode.insertBefore(newNode, parent);
 254                                         break;
 255                                     case 'after':
 256                                         // if it's the last node.. then we append..
 257                                         var ix = parent.parentNode.indexOf(parent);
 258                                         if (parent.parentNode.childNodes.length == (ix + 1)) {
 259                                              parent.appendChild(newNode);
 260                                              break;
 261                                         }
 262
 263                                         break;
 264
 265                                     case 'append':
 266                                     default:
 267                                         parent.appendChild(newNode);
 268                                         break;
 269                                 }
 270
 271                                 if (items.length) {
 272                                     Roo.each(items, function(i) {
 273                                         this.appendNode(newNode, i);
 274                                     },this);
 275
 276                                 }
 277
 278
 279                                     /*
 280                                     -- panels with panes...
 281                                         if (items && items.length) {
 282                                                 for (var i = 0; i < items.length; i++) {
 283                                                                 this.appendConfig(items[i], newNode, false);
 284                                                 }
 285                                         }
 286                                         if (opts.doUpdate !== false) {
 287                                                 this.updateForm(false, newNode);
 288                                         }
 289                                     */
 290                                 return newNode;
 291
 292
 293                             },
 294                             clearAll : function() {
 295                                 var rt = this.root;
 296                                  if (rt.childNodes.length) {
 297                                     rt.removeChild(rt.childNodes[0]);
 298                                 }
 299
 300                                 this.root.elConfig  = Roo.apply({ }, this.defaultElConfig());
 301                                 //var btop = Pman.Tab.BuilderTop;
 302                                 //if (btop.modsel && btop.modsel.lastData) {
 303                                 //    this.tree.root.elConfig.app = btop.modsel.lastData.app;
 304                                 //}
 305
 306                                 this.setCurrentNode(this.root,true);
 307
 308                             },
 309                             cloneConfig : function(config) {
 310                                 if (!config) { return null; }
 311                                 var newConfig = {};
 312
 313                                 for (var i in config) {
 314                                     if (typeof config[i] == 'object') {
 315                                          newConfig[i] = this.cloneConfig(config[i]);
 316                                     } else if (typeof config[i] != 'function') { // should this happen?
 317                                          newConfig[i] = config[i];
 318                                     }
 319                                 }
 320                                 return newConfig;
 321                             },
 322                             configToText : function(c) {
 323
 324                                 var txt = [];
 325                                 c = c || {};
 326                                       var sr = (typeof(c['+buildershow']) != 'undefined') &&  !c['+buildershow'] ? true : false;
 327                                     if (sr) txt.push('<s>');
 328                                     if (typeof(c['*prop']) != 'undefined')   { txt.push(c['*prop']+ ':'); }
 329                                 if (c.xtype)      { txt.push(c.xtype); }
 330                                 if (c.fieldLabel) { txt.push('[' + c.fieldLabel + ']'); }
 331                                 if (c.boxLabel)   { txt.push('[' + c.boxLabel + ']'); }
 332
 333
 334                                 if (c.layout)     { txt.push('<i>' + c.layout + '</i>'); }
 335                                 if (c.title)      { txt.push('<b>' + c.title + '</b>'); }
 336                                     if (c.header)    { txt.push('<b>' + c.header + '</b>'); }
 337                                     if (c.legend)      { txt.push('<b>' + c.legend + '</b>'); }
 338                                 if (c.text)       { txt.push('<b>' + c.text + '</b>'); }
 339                                     if (c.name)       { txt.push('<b>' + c.name+ '</b>'); }
 340                                 if (c.region)     { txt.push('<i>(' + c.region + ')</i>'); }
 341                                     if (c.dataIndex) { txt.push('[' + c.dataIndex+ ']'); }
 342                                     if (sr) txt.push('</s>');
 343                                 return (txt.length == 0 ? "Element" : txt.join(" "));
 344
 345
 346                             },
 347                             currentNodeType : function() {
 348                                 return this.nodeXtype(this.currentNode);
 349
 350                             },
 351                             defaultElConfig : function() {
 352                                 return {
 353                                    xtype : '*Module',
 354
 355                                     module : 'TestApp',
 356                                     part:   'Partname',
 357                                     modkey : 0,
 358                                     region : 'center',
 359                                     parent : 'Pman',
 360                                     name : 'Module Name',
 361                                     items: []
 362                                 };
 363                             },
 364                             dupeNode : function(node)
 365                                 {
 366                                     var cfg = this.cloneConfig(node.elConfig);
 367
 368                                     var newNode = new Roo.tree.TreeNode(
 369                                     {
 370                                             id: Roo.id(),
 371                                             text: this.configToText(cfg)
 372                                     });
 373
 374                                     newNode.elConfig = cfg;
 375                                     node.eachChild(function(n) {
 376                                         newNode.appendChild(this.dupeNode(n));
 377                                     },this);
 378
 379                                     return newNode;
 380
 381                                 },
 382                             loadBJS : function(module, part) {
 383                                 var _t = this;
 384                                 new Pman.Request({
 385                                     url : baseURL + '/Roo/Builder_part.php',
 386                                     method : 'GET',
 387                                     params : {
 388                                        _id : part
 389                                     },
 390                                     success : function(res)
 391                                     {
 392                                         // data is in..
 393                                         Roo.log(res);
 394                                         _t.loadTree(JSON.parse(res.data.json));
 395
 396
 397                                     },
 398
 399                                  })
 400
 401
 402
 403                             },
 404                             loadTree : function(o) {
 405                                 this.clearAll();
 406                                 this.root.elConfig = o;
 407                                 this.root.setText(this.configToText(this.root.elConfig));
 408                                 this.appendNode(this.root, o.items[0]);
 409                                 this.root.expand(true);
 410                                 Pman.Tab.BuilderView.panel.redraw();
 411                                 this.setCurrentNode(this.root,true);
 412                             },
 413                             nodeXtype : function(n) {
 414                                  if (!n) {return ''; }
 415                                 var xt = n.elConfig.xtype ||  '';
 416                                 var xns= n.elConfig['|xns'] ||   '';
 417                                 xns += xns.length ? '.' : '';
 418                                 return xns + xt;
 419                             },
 420                             renderer : function(n) { return n.text; },
 421                             setCurrentNode : function(node,select) {
 422                                     this.currentNode = node || this.root;
 423
 424                                     //Pman.Tab.BuilderView.highlightElement(this.currentNode);
 425
 426                                     var p = Pman.Tab.BuilderProps.grid;
 427                                     if (p) { //may not be ready yet..
 428                                         p.setCurrrentNode(this.currentNode);
 429                                     }
 430
 431
 432                                     this.currentNode.setText(this.configToText(this.currentNode.elConfig));
 433
 434                                     if (select) { //&& node !== this.tree.root) {
 435                                         if (this.currentNode !== this.root)  {
 436                                                  this.currentNode.ensureVisible();
 437                                           }
 438                                          this.currentNode.expand(false,false);
 439                                         this.currentNode.select();
 440                                 }
 441                                 // update palete..
 442                                 Pman.Tab.BuilderPalette.grid.getSelectionModel().clearSelections();
 443                                 Pman.Tab.BuilderPalette.grid.view.refresh();
 444
 445                             },
 446                             sm : {
 447                                 xtype: 'DefaultSelectionModel',
 448                                 xns: Roo.tree
 449                             },
 450                             root : {
 451                                 xtype: 'TreeNode',
 452                                 xns: Roo.tree,
 453                                 text : "Part",
 454                                 elConfig : function() {
 455                                     return  {
 456                                          xtype : '*Module',
 457
 458                                             app : 'TestApp',
 459                                             // perm
 460                                             // permtype
 461                                             modkey : 0,
 462                                             '|module' :  '',
 463                                             region : 'center',
 464                                             '|parent' : 'Pman',
 465                                             name : "Module Name",
 466                                             items: []
 467
 468
 469                                     }
 470                                 }
 471                             }
 472                         }
 473                     }
 474                 ],
 475                 center : {
 476                     xtype: 'LayoutRegion',
 477                     xns: Roo
 478                 },
 479                 south : {
 480                     xtype: 'LayoutRegion',
 481                     xns: Roo,
 482                     height : 300,
 483                     split : true
 484                 }
 485             }
 486         });
 487         this.layout = this.panel.layout;
 488
 489     }
 490 });